Source/UBCS-WEB/src/views/docking/info.vue

@@ -2,28 +2,45 @@
  <el-container>
    <el-main>
      <basic-container>
        <avue-crud ref="crud" v-model="form" :data="data" :option="option" :page.sync="page" @on-load="onLoad"
        <avue-crud ref="crud" v-model="form" :cell-style="cellStyle" :data="data" :option="option" :page.sync="page"
                   :permission="permissionList"
                   @on-load="onLoad"
                   @search-change="searchChange"
                   @search-reset="searchReset"
                   @selection-change="selectionChange"
                   @current-change="currentChange"
                   @size-change="sizeChange"
                   @refresh-change="refreshChange" @row-click="rowClick" :cell-style="cellStyle">
                   @size-change="sizeChange" @refresh-change="refreshChange" @row-click="rowClick">
          <template slot="menu" slot-scope="{row,index}">
            <el-button icon="el-icon-edit" size="small" type="text" @click="updateSave(row,index)" :disabled="row.usedFlag === 'true' ? false :true">编辑</el-button>
            <el-button icon="el-icon-delete" size="small" type="text" @click="deleteSave(row,index)">删除</el-button>
            <el-button v-if="row.usedflag=='false'" icon="el-icon-position" size="small" type="text"
                       @click="ENABLE(row,index)">启用
            <el-button v-if="permissionList.edit" :disabled="row.usedFlag === 'true' ? false :true"
                       icon="el-icon-edit" size="small"
                       type="text"
                       @click="updateSave(row,index)">编辑
            </el-button>
            <el-button v-else icon="el-icon-finished" size="small" type="text" @click="DISABLE(row,index)">停用
            <el-button v-if="permissionList.delete" icon="el-icon-delete" size="small" type="text"
                       @click="deleteSave(row,index)">删除
            </el-button>
            <span v-if="permissionList.enable">

                       <el-button v-if="row.usedFlag=='false' || row.usedFlag==''" icon="el-icon-position" size="small"
                                  type="text" @click="ENABLE(row,index)">启用
                       </el-button>
            </span>
            <span v-if="permissionList.stop">
                      <el-button v-if="row.usedFlag !== 'false' && row.usedFlag !== ''" icon="el-icon-finished"
                                 size="small"
                                 type="text" @click="DISABLE(row, index)">停用
                      </el-button>
            </span>
          </template>
          <template slot="menuLeft">
            <el-button icon="el-icon-plus" size="small" type="primary" @click="addSave">新&nbsp;&nbsp;增
            <el-button v-if="permissionList.add" icon="el-icon-plus" size="small" type="primary"
                       @click="addSave">
              新&nbsp;&nbsp;增
            </el-button>
            <el-button icon="el-icon-share" size="small" @click="PUSH">同 步
            <el-button v-if="permissionList.sync" icon="el-icon-share" size="small" @click="PUSH">同 步
            </el-button>
            <el-button icon="el-icon-search" size="small" @click="openAdvancedQuery">查 询
            <el-button v-if="permissionList.query" icon="el-icon-search" size="small"
                       @click="openAdvancedQuery">查 询
            </el-button>
          </template>
        </avue-crud>
@@ -42,16 +59,20 @@

<script>
import {
  getList, add, edit, del, push, updateStatus
  getList, add, edit, del, push, updateStatus, HeaderRequest, ParmRequest
} from "@/api/docking/info";
import {getDictionary} from "@/api/omd/enum";
import infoForm from "./infoForm.vue";
import {mapGetters} from "vuex";

export default {
  name: "info",
  components: {infoForm},

  data() {
    return {
      //下拉总类型
      DropDownTheTotalType: [],
      //接口类型下拉
      interfaceTypeList: [{
        label: 'webService', value: 'webService'
@@ -72,6 +93,14 @@
      }, {
        label: 'Json', value: 'json'
      }],
      //内容类型
      contentTypeList: [{
        label:'application/json',value:'application/json'
      },{
        label:'application/x-www-form-urlencoded',value:'application/x-www-form-urlencoded'
      },{
        label:'multipart/form-data',value:'multipart/form-data'
      }],
      //推送类型
      pushTypeList: [{value: '1', label: '数据推送'},
        {value: '2', label: '分类推送'},
@@ -81,7 +110,7 @@
        {value: '6', label: '含规则信息的分类查询'},
        {value: '7', label: '数据查询'}],
      page: {
        pageSize: 10,
        pageSize: 20,
        currentPage: 1,
        total: 100
      },
@@ -93,57 +122,59 @@
      option: {
        height: "auto",
        calcHeight: 20,
        columnBtn: false,
        tip: false,
        headerAlign: "center",
        border: true,
        index: true,
        selection: true,
        indexFixed: false,
        selectionFixed: false,
        searchShow: false,
        refreshBtn: false,
        searchMenuSpan: 6,
        rowKey: "id",
        tabs: true,
        stripe: true,
        indexFixed: false,
        menuWidth: 180,
        highlightCurrentRow: true,
        addBtn: false,
        editBtn: false,
        delBtn: false,
        columnBtn: false,
        column: [ {
        column: [{
          label: '是否启用',
          prop: 'usedFlag',
          width: 150,
          formatter: res => res.usedFlag === "true" ? "启用" : "停用"
        },{
        }, {
          label: '集成系统',
          prop: 'sysBaseName',
          sortable: true,
          width: 150
        },{
        }, {
          label: '分类选择',
          prop: 'classifyName',
          align:'center',
          align: 'center',
          // sortable: true,
          width: 150
        },{
        }, {
          label: '编码类型',
          prop: 'isGroupCodeFlag',
          sortable: true,
          width: 150,
          formatter: res => res.isGroupCodeFlag ? '集团码' : '企业编码'
        },{
          formatter: res => res.isGroupCodeFlag === 'true' ? '集团码' : '企业编码'
        }, {
          label: '接口类型',
          prop:'dataFlowTypeText',
          align:'center',
          prop: 'dataFlowTypeText',
          align: 'center',
          sortable: true,
          width:150,
        },{
          width: 150,
        }, {
          label: '推送类型',
          prop: 'pushTypeText',
          sortable: true,
          overHidden:true,
          align:'center',
          overHidden: true,
          align: 'center',
          width: 150,
          //pushTypeList作用域
          // formatter: (d) => {
@@ -153,57 +184,59 @@
          label: '系统编号',
          prop: 'id',
          sortable: true,
          hide:true,
          hide: true,
          width: 150
        }, {
          label: '系统名称',
          prop: 'name',
          hide:true,
          hide: true,
          sortable: true,
          width: 150
        },{
        }, {
          label: '接口方式',
          prop: 'interfaceType',
          // sortable: true,
          width: 150
        },{
        }, {
          label: '类路径',
          prop: 'classPath',
          // sortable: true,
          width: 150
        },{
        }, {
          label: 'soapAction',
          prop: 'soapAction',
          overHidden: true,
          sortable: true,
          width: 150
        },  {
          width: 200
        }, {
          label: '调用方式',
          prop: 'cxfaxis',
          sortable: true,
          width: 150
        }, {
            label: '请求方式',
            prop: 'requestMethod',
            align:'center',
            // sortable: true,
            width: 150
          }, {
          label: '请求方式',
          prop: 'requestMethod',
          align: 'center',
          // sortable: true,
          width: 150
        }, {
          label: '请求地址',
          prop: 'requestUrl',
          sortable: true,
          width: 150
        },  {
          overHidden: true,
          width: 200
        }, {
          label: '接口函数',
          prop: 'interfaceFunction',
          sortable: true,
          align:'center',
          align: 'center',
          width: 150
        }, {
            label: '参数名称',
            prop: 'targetName',
            sortable: true,
            width: 150
          },{
          label: '参数名称',
          prop: 'targetName',
          sortable: true,
          width: 150
        }, {
          label: '参数类型',
          prop: 'paramType',
          sortable: true,
@@ -224,6 +257,14 @@
          prop: 'nameSpace',
          sortable: true,
          width: 150
        }, {
          label: '内容类型',
          prop: 'contentType',
          sortable: true,
          width: 150,
          formatter: (d) => {
            return this.contentTypeList[d.contentType]
          }
        },{
          label: '系统描述',
          prop: 'description',
@@ -243,6 +284,18 @@
  created() {
  },
  computed: {
    ...mapGetters(["permission"]),
    permissionList() {
      return {
        sync: this.vaildData(this.permission.info.info_sync, false),
        add: this.vaildData(this.permission.info.info_add, false),
        query: this.vaildData(this.permission.info.info_query, false),
        edit: this.vaildData(this.permission.info.info_edit, false),
        delete: this.vaildData(this.permission.info.info_delete, false),
        enable: this.vaildData(this.permission.info.info_enable, false),
        stop: this.vaildData(this.permission.info.info_stop, false),
      }
    },
    oids() {
      let oids = [];
      this.selectionList.forEach(ele => {
@@ -251,7 +304,7 @@
      return oids.join(",");
    }
  },
  watch:{
  watch: {
    // editAttribute:{
    //   immediate: true,
    //   handler(newData) {
@@ -261,9 +314,9 @@
  },
  methods: {
    //单元格样式
    cellStyle(row,column,rowIndex,columnIndex){
      if(row.columnIndex==2) {
        if(row.row.usedFlag == 'false'){
    cellStyle(row, column, rowIndex, columnIndex) {
      if (row.columnIndex == 2) {
        if (row.row.usedFlag == '' || row.row.usedFlag == 'false') {
          return {
            color: 'red',
            fontWeight: 'bold',
@@ -324,10 +377,18 @@
      this.editAttribute = row;
      this.editAttribute.sysIntParamVOs = row.sysIntParamVOs || [];
      this.editAttribute.sysIntHeaderVOs = row.sysIntHeaderVOs || [];
      this.$refs.infoForm.formData = this.editAttribute;
      this.editAttribute.type = 'edit';
      this.$refs.infoForm.formData = row;
      this.$refs.infoForm.groupCode = row.isGroupCodeFlag === 'true' ? true : false;
      this.$refs.infoForm.showSubmitDialog = true;
      console.log('row',row.dataFlowTypeText)
      console.log('editAttribute',this.editAttribute.dataFlowTypeText)
      //header对象
      HeaderRequest(1, -1, {'conditionMap[infoOid]': row.oid}).then(res => {
        this.$refs.infoForm.formData.sysIntHeaderVOs = res.data.data.records;
      })
      //参数对象
      ParmRequest(1, -1, {'conditionMap[infoOid]': row.oid}).then(res => {
        this.$refs.infoForm.formData.sysIntParamVOs = res.data.data.records;
      })
    },
    deleteSave(row, index) {
      this.$confirm("删除数据将无法被恢复, 是否继续?", "提示", {
@@ -337,7 +398,7 @@
        showClose: true,
        type: "warning"
      }).then(() => {
        del({oids:row.oid}).then(res => {
        del({oids: row.oid}).then(res => {
          this.$message.success("删除成功");
          this.refreshChange();
        });
@@ -399,30 +460,10 @@
    onLoad(page, params = {}) {
      this.loading = true;
      getList(this.page.currentPage, this.page.pageSize, Object.assign(params, this.query)).then(res => {
        console.log(res)
        // console.log(res)
        const data = res.data.data;
        this.page.total = data.total;
        this.data = data.records;
        // const Props = {
        //   paramType: '',
        //   returnType: '',
        //   dataFlowType: '',
        //   pushType: '',
        //   classifyName: '',
        //   sourceSystemName: '',
        //   targetSystemName: '',
        //   classPath:'',
        //   requestMethod:'',
        //   requestUrl:'',
        //   interfaceFunction:'',
        //   nameSpace:'',
        //   soapAction:'',
        //   targetName:'',
        //   cxfaxis:''
        // };
        // this.pushTypeList.forEach(item => {
        //   Object.assign(item, Props);
        // });
        this.loading = false;
      });
    },
@@ -436,6 +477,9 @@
      if (JSON.stringify(conditionMaps) != '{}') {
        this.query = conditionMaps;
        this.onLoad(this.page);
      } else {
        this.query = {};
        this.onLoad(this.page, this.query);
      }
    },
    openAdvancedQuery() {
@@ -498,8 +542,25 @@
}
</script>

<style lang="scss">
<style lang="scss" scoped>
.applyRangeTable > .el-card:nth-of-type(2) > .el-card__body > .avue-crud__menu {
  display: none !important;
}

// 滚动条样式修改
// 滚动条的宽度
/deep/ .el-table__body-wrapper::-webkit-scrollbar {
  height: 15px; // 纵向滚动条 必写
  background: white;
  border: white;
  width: 10px;

}

// 滚动条的滑块
/deep/ .el-table__body-wrapper::-webkit-scrollbar-thumb {
  background-color: #ececec;
  border-radius: 20px;
  border: #ececec;
}
</style>