初始化动态配置

src/api/system/sysCustomConfig.js

@@ -0,0 +1,41 @@
+import axios from "@/utils/request";
+
+export function list(query) {
+  return axios({
+    url: "/system/custom/config/list",
+    method: "get",
+    params: query
+  });
+}
+
+
+// 保存
+export function saveCustomConfig(data, formName, method = "post") {
+  let url =
+    formName !== "edit"
+      ? "/system/custom/config/save"
+      : "/system/custom/config/edit";
+  return axios({
+    url: url,
+    method: method,
+    data: data
+  });
+}
+
+// 删除
+export function devCustomConfig(data) {
+  return axios({
+    url: "/system/custom/config/delete",
+    method: "post",
+    data: data
+  });
+}
+
+
+export function getConfigs(query) {
+  return axios({
+    url: "/system/custom/config/getConfigs",
+    method: "post",
+    data: query
+  });
+}

src/api/system/sysCustomConfigDetail.js

@@ -0,0 +1,32 @@
+import axios from "@/utils/request";
+
+export function list(query) {
+  return axios({
+    url: "/system/custom/configDetail/list",
+    method: "get",
+    params: query
+  });
+}
+
+
+// 保存
+export function saveCustomConfig(data, formName, method = "post") {
+  let url =
+    formName !== "edit"
+      ? "/system/custom/configDetail/save"
+      : "/system/custom/configDetail/edit";
+  return axios({
+    url: url,
+    method: method,
+    data: data
+  });
+}
+
+// 删除
+export function devCustomConfig(data) {
+  return axios({
+    url: "/system/custom/configDetail/delete",
+    method: "post",
+    data: data
+  });
+}

src/utils/customConfig.js

@@ -0,0 +1,120 @@
+import {getConfigs} from "@/api/system/sysCustomConfig";
+import {Message} from "element-ui";
+function getColer(item,value){
+  const colorRule = item.colorRule;
+  if(colorRule && colorRule.indexOf(",") != -1){
+    var arr = colorRule.split("|");
+    var reColor = "";
+    arr.some(s => {
+      var arrTemp = s.split(",");
+      const type = arrTemp[0]
+      const valueT = arrTemp[1]
+      const color = arrTemp[2]
+      if(type == "=" && value == valueT){
+        reColor = color;
+      }else if(type == ">=" && value >= valueT){
+        reColor = color;
+      }else if(type == ">" && value > valueT){
+        reColor = color;
+      }else if(type == "<" && value < valueT){
+        reColor = color;
+      }else if(type == "<=" && value <= valueT){
+        reColor = color;
+      } else if(type == "0"){
+        reColor = color;
+      }
+    })
+    return reColor;
+  }else{
+    return colorRule;
+  }
+}
+
+
+export async function getHead(businessType,type){
+  try {
+    var subData = {};
+    subData.businessType = businessType;
+    subData.type = type;
+    const re = await getConfigs(subData);
+    if(re.code != 20000){
+      Message.error("获取配置失败");
+    }
+    return re;
+  } catch (error) {
+    console.error(error);
+  }
+}
+
+
+export function executeFuc(_this,row,number,type,clickFuc,value){
+  if("1" == type){
+    //按钮事件
+   return callModelFun(_this,clickFuc,row);
+  }else if("3" == type){
+    //按钮是否禁用事件
+    if(clickFuc){
+      return callModelFun(_this,clickFuc,row);
+    }else{
+      return false;
+    }
+  }else if("4" == type){
+    //颜色方法
+    return getColer(clickFuc,value);
+  }else if("5" == type){
+    //查询input方法
+    if(clickFuc){
+      return callModelFun(_this,clickFuc,row);
+    }else{
+      return false;
+    }
+  }else if("6" == type){
+    //查询input方法
+    if(clickFuc){
+      return callModelFun(_this,clickFuc,row);
+    }else{
+      return false;
+    }
+  }else if("2" == type){
+    if(number.clickFuc){
+      //表单事件
+      return callModelFun(_this,number.clickFuc,row);
+    }else{
+      return true;
+    }
+  }else if(number != null && number >= 0){
+    //复选框事件
+    var checkSelectableFuc = ""
+    _this.tableObj.tableList.forEach(obj => {
+        if(obj.columnType == "selection"){
+          checkSelectableFuc = obj.clickFuc;
+        }
+    })
+    //
+    if(checkSelectableFuc){
+      return callModelFun(_this,checkSelectableFuc,row);
+    }else{
+      return true;
+    }
+  }else{
+    console.log(row);
+    //表单点击事件
+    if(_this.tableObj.handleChangeFuc){
+      return callModelFun(_this,_this.tableObj.handleChangeFuc,row);
+    }
+
+     return true;
+  }
+}
+
+
+/**
+ * 根据方法名称调用方法
+ */
+function callModelFun(_this,funcName,row) {
+  let methods = _this.$options.methods;
+  // 解释说明一下, this需要传入目标方法, 否则,在目标方法中修改data中的值, 将不会重新渲染dom, 跟v-if结合使用的过程中需要注意
+  return methods[funcName](_this,row);
+}
+
+

src/views/basic/product/UdiInfoSelectLocalUdi.vue

@@ -2,82 +2,142 @@
   <div>
     <el-card class="el-card">
       <div>
-        <el-form :model="unionQuery" size="mini" label-width="125px" v-show="showSearch">
-          <el-row>
-            <el-col :span="18">
-              <el-form-item class="query-form-item" label="UDI码:">
-                <el-input v-model="unionQuery.udiCode"
-                          placeholder="请扫描或输入UDI码"
-                          clearable="true"
-                          @keyup.enter.native="keyup_submit($event)"></el-input>
-              </el-form-item>
-            </el-col>
-          </el-row>
-          <el-row>
-            <el-col :span="6">
-              <el-form-item label="销售单元产品标识:" class="query-form-item">
+        <el-form v-if="queryList && queryList.length > 0" :model="unionQuery" size="mini" label-width="125px" v-show="showSearch">
+          <el-row style=" display:flex;  flex-wrap: wrap; ">
+            <template v-for="(item, index) in queryList" >
+              <el-form-item v-if="item.columnType == 'input'" :label="item.columnDesc+`:`" :key="item.id">
                 <el-input
-                  v-model="unionQuery.nameCode" clearable="true"
-                  placeholder="请输入完整DI"
-                  @keyup.enter.native="keyup_submit($event)"
+                  v-model="filterQuery[item.columnName]"
+                  :placeholder="item.columnDesc"
+                  @keyup.enter.native="executeFuc($event,null,'5',item.clickFuc)"
+                  :disabled="executeFuc(item,null,'3',item.disabledFuc)"
+                  clearable
                 ></el-input>
               </el-form-item>
-            </el-col>
-            <el-col :span="6">
-              <el-form-item label="医疗器械注册人:" class="query-form-item">
+              <el-form-item v-if="item.columnType == 'select'" :label="item.columnDesc+`:`">
+                <el-select v-model="filterQuery[item.columnName]" :placeholder="item.columnDesc" clearable>
+                  <el-option
+                    v-for="dict in item.lableRuleObj"
+                    :key="dict.value"
+                    :label="dict.label"
+                    :value="dict.value"
+                  />
+                </el-select>
+              </el-form-item>
+              <el-form-item v-if="item.columnType == 'selectServer'" :label="item.columnDesc+`:`">
                 <el-select
-                  v-model="unionQuery.ylqxzcrbarmc"
+                  v-model="filterQuery[item.columnName]"
+                  :placeholder="item.columnDesc"
                   filterable
                   remote
-                  clearable="true"
-                  style="width: 100%"
-                  reserve-keyword
-                  placeholder="请输入医疗器械注册人"
-                  :remote-method="findMethod"
-                  :loading="loading"
-                  @clear="clear"
-                >
+                  :remote-method="(query) => executeFuc(query, null,'6',item.clickFuc)"
+                  clearable>
                   <el-option
-                    v-for="item in fromOptions"
+                    v-for="item in options[item.clickFuc]"
                     :key="item.ylqxzcrbarmc"
                     :label="item.ylqxzcrbarmc"
                     :value="item.ylqxzcrbarmc"
-                  >
-                    <span style="float: left">{{ item.ylqxzcrbarmc }}</span>
-                  </el-option>
+                  />
                 </el-select>
               </el-form-item>
-            </el-col>
-            <el-col :span="6">
-              <el-form-item label="器械通用名称:" class="query-form-item">
-                <el-input
-                  :disabled="unionQuery.ylqxzcrbarmc==null || unionQuery.ylqxzcrbarmc==''"
-                  v-model="unionQuery.cpmctymc" clearable="true"
-                  placeholder="请输入器械通用名称"
-                ></el-input>
+              <el-form-item v-if="item.columnType == 'datePicker'" :label="item.columnDesc+`:`">
+                <el-date-picker
+                  v-model="dateRange"
+                  :style="`width:${item.width+'px'}`"
+                  value-format="yyyy-MM-dd HH:mm:ss"
+                  type="daterange"
+                  range-separator="-"
+                  start-placeholder="开始日期"
+                  end-placeholder="结束日期"
+                  :default-time="['00:00:00', '23:59:59']"
+                ></el-date-picker>
               </el-form-item>
-            </el-col>
-          </el-row>
-          <el-row>
-            <el-col :span="6">
-              <el-form-item label="规格型号:" class="query-form-item">
-                <el-input
-                  v-model="unionQuery.ggxh" clearable="true"
-                  :disabled="(unionQuery.cpmctymc=='' && unionQuery.nameCode=='' && (unionQuery.ylqxzcrbarmc==null || unionQuery.ylqxzcrbarmc==''))"
-                  placeholder="请输入规格型号"
-                ></el-input>
-              </el-form-item>
-            </el-col>
-            <el-col :span="6">
-              <el-form-item label="注册证/备案号:" class="query-form-item">
-                <el-input
-                  v-model="unionQuery.zczbhhzbapzbh" clearable="true"
-                  :disabled="(unionQuery.cpmctymc=='' && unionQuery.nameCode=='' && (unionQuery.ylqxzcrbarmc==null || unionQuery.ylqxzcrbarmc==''))"
-                  placeholder="请输入注册证/备案号"
-                ></el-input>
+              <el-form-item v-if="item.columnType == 'date'" :label="item.columnDesc+`:`">
+                <el-date-picker
+                  v-model="filterQuery[item.columnName]"
+                  :style="`width:${item.width+'px'}`"
+                  value-format="yyyy-MM-dd"
+                  type="date"
+                  :placeholder="item.columnDesc"
+                ></el-date-picker>
               </el-form-item>
-            </el-col>
+            </template>
           </el-row>
+<!--          <el-row>-->
+<!--            <el-col :span="18">-->
+<!--              <el-form-item class="query-form-item" label="UDI码:">-->
+<!--                <el-input v-model="unionQuery.udiCode"-->
+<!--                          placeholder="请扫描或输入UDI码"-->
+<!--                          clearable="true"-->
+<!--                          @keyup.enter.native="keyup_submit($event)"></el-input>-->
+<!--              </el-form-item>-->
+<!--            </el-col>-->
+<!--          </el-row>-->
+<!--          <el-row>-->
+<!--            <el-col :span="6">-->
+<!--              <el-form-item label="销售单元产品标识:" class="query-form-item">-->
+<!--                <el-input-->
+<!--                  v-model="unionQuery.nameCode" clearable="true"-->
+<!--                  placeholder="请输入完整DI"-->
+<!--                  @keyup.enter.native="keyup_submit($event)"-->
+<!--                ></el-input>-->
+<!--              </el-form-item>-->
+<!--            </el-col>-->
+<!--            <el-col :span="6">-->
+<!--              <el-form-item label="医疗器械注册人:" class="query-form-item">-->
+<!--                <el-select-->
+<!--                  v-model="unionQuery.ylqxzcrbarmc"-->
+<!--                  filterable-->
+<!--                  remote-->
+<!--                  clearable="true"-->
+<!--                  style="width: 100%"-->
+<!--                  reserve-keyword-->
+<!--                  placeholder="请输入医疗器械注册人"-->
+<!--                  :remote-method="findMethod"-->
+<!--                  :loading="loading"-->
+<!--                  @clear="clear"-->
+<!--                >-->
+<!--                  <el-option-->
+<!--                    v-for="item in fromOptions"-->
+<!--                    :key="item.ylqxzcrbarmc"-->
+<!--                    :label="item.ylqxzcrbarmc"-->
+<!--                    :value="item.ylqxzcrbarmc"-->
+<!--                  >-->
+<!--                    <span style="float: left">{{ item.ylqxzcrbarmc }}</span>-->
+<!--                  </el-option>-->
+<!--                </el-select>-->
+<!--              </el-form-item>-->
+<!--            </el-col>-->
+<!--            <el-col :span="6">-->
+<!--              <el-form-item label="器械通用名称:" class="query-form-item">-->
+<!--                <el-input-->
+<!--                  :disabled="unionQuery.ylqxzcrbarmc==null || unionQuery.ylqxzcrbarmc==''"-->
+<!--                  v-model="unionQuery.cpmctymc" clearable="true"-->
+<!--                  placeholder="请输入器械通用名称"-->
+<!--                ></el-input>-->
+<!--              </el-form-item>-->
+<!--            </el-col>-->
+<!--          </el-row>-->
+<!--          <el-row>-->
+<!--            <el-col :span="6">-->
+<!--              <el-form-item label="规格型号:" class="query-form-item">-->
+<!--                <el-input-->
+<!--                  v-model="unionQuery.ggxh" clearable="true"-->
+<!--                  :disabled="(unionQuery.cpmctymc=='' && unionQuery.nameCode=='' && (unionQuery.ylqxzcrbarmc==null || unionQuery.ylqxzcrbarmc==''))"-->
+<!--                  placeholder="请输入规格型号"-->
+<!--                ></el-input>-->
+<!--              </el-form-item>-->
+<!--            </el-col>-->
+<!--            <el-col :span="6">-->
+<!--              <el-form-item label="注册证/备案号:" class="query-form-item">-->
+<!--                <el-input-->
+<!--                  v-model="unionQuery.zczbhhzbapzbh" clearable="true"-->
+<!--                  :disabled="(unionQuery.cpmctymc=='' && unionQuery.nameCode=='' && (unionQuery.ylqxzcrbarmc==null || unionQuery.ylqxzcrbarmc==''))"-->
+<!--                  placeholder="请输入注册证/备案号"-->
+<!--                ></el-input>-->
+<!--              </el-form-item>-->
+<!--            </el-col>-->
+<!--          </el-row>-->
         </el-form>
         <div class="top-right-btn">
           <el-button-group>
@@ -105,55 +165,140 @@
           v-loading="loading"
           highlight-current-row="true"
           :row-class-name="tableRowClassName"
-          @current-change="handleErpChange"
+          @current-change="executeFuc"
           @selection-change="handleSelectionUdiChange"
         >
-
+          <template v-for="(item, index) in tableHeader">
             <el-table-column
-            v-if="relId==null"
-            type="selection"
-            :selectable="checkSelectable"
-            width="55"
-          ></el-table-column>
-          <el-table-column label="序号" type="index"></el-table-column>
+              v-if="item.columnType == 'id'"
+              type="index" :label="item.columnDesc"></el-table-column>
             <el-table-column
-            label="产品标识"
-            prop="nameCode"
-            show-overflow-tooltip
-          ></el-table-column>
+              v-else-if="item.columnType == 'selection'"
+              type="selection"
+              :width="item.width"
+              :selectable="executeFuc"></el-table-column>
+
             <el-table-column
-            label="物资名称"
-            prop="cpmctymc"
-            show-overflow-tooltip
-          ></el-table-column>
+              v-else-if="item.columnType == 'radio'"
+              :prop="item.columnName"
+              :label="item.columnDesc"
+              :sortable="item.sort"
+              :width="item.width"
+              :show-overflow-tooltip="item.tooltip"
+              :key="item.columnName"
+            >
+              <template  slot-scope="scope">
+                <el-radio :label="scope.row.id" v-model="radioCheck"><span></span></el-radio>
+              </template>
+            </el-table-column>
             <el-table-column
-            label="规格型号"
-            prop="ggxh"
-            show-overflow-tooltip
-          ></el-table-column>
+              v-else-if="item.columnType == 'laber'"
+              :prop="item.columnName"
+              :label="item.columnDesc"
+              :sortable="item.sort"
+              :width="item.width"
+              :show-overflow-tooltip="item.tooltip"
+              :key="item.columnName"
+            >
+              <template   slot-scope="scope">
+                <span :style="{color: executeFuc(scope.row,null,'4',item.lableRuleObj[scope.row[item.columnName]])}">{{ item.lableRuleObj[scope.row[item.columnName]] }}</span>
+              </template>
+            </el-table-column>
             <el-table-column
-            label="医疗器械注册人"
-            prop="ylqxzcrbarmc"
-            show-overflow-tooltip
-          ></el-table-column>
+              v-else-if="item.columnType == 'eltag'"
+              :prop="item.columnName"
+              :label="item.columnDesc"
+              :sortable="item.sort"
+              :width="item.width"
+              :show-overflow-tooltip="item.tooltip"
+              :key="item.columnName"
+            >
+              <template   slot-scope="scope">
+                <el-tag :type="executeFuc(scope.row,null,'4',item,item.lableRuleObj?item.lableRuleObj[scope.row[item.columnName]]:scope.row[item.columnName])">
+                  <span>{{ item.lableRuleObj?item.lableRuleObj[scope.row[item.columnName]]:scope.row[item.columnName] }}</span>
+                </el-tag>
+              </template>
+            </el-table-column>
             <el-table-column
-            label="注册证编号"
-            prop="zczbhhzbapzbh"
-            show-overflow-tooltip
-          ></el-table-column>
-
-          <el-table-column label="操作">
+              v-else-if="item.columnType == 'button'"
+              :prop="item.columnName"
+              :label="item.columnDesc"
+              :width="item.width"
+              :key="item.columnName"
+              fixed="right"
+            >
               <template slot-scope="scope">
-              <el-button
-                type="text"
-                size="small"
-                @click="diDetail(scope.row)"
-              >详情
-              </el-button
+                <el-button v-for="(buttonItem, buttonIndex) in item.buttonRulObj"
+                           :type="buttonItem.type"
+                           :size="buttonItem.size"
+                           :style="buttonItem.style"
+                           :key="buttonItem"
+                           :disabled="executeFuc(scope.row,null,'3',buttonItem.disabledFuc)"
+                           @click.native.stop="executeFuc(scope.row,null,'1',buttonItem.clickFuc)"
+                >{{ buttonItem.name }}
+                </el-button>
+              </template>
+            </el-table-column>
+            <el-table-column
+              v-else
+              :prop="item.columnName"
+              :label="item.columnDesc"
+              :sortable="item.sort"
+              :width="item.width"
+              :show-overflow-tooltip="item.tooltip"
+              :key="item.columnName"
             >
+              <template slot-scope="scope">
+                <span :style="{color: executeFuc(scope.row,null,'4',item,scope.row[item.columnName])}">{{ scope.row[item.columnName] }}</span>
               </template>
             </el-table-column>
 
+          </template>
+<!--          <el-table-column-->
+<!--            v-if="relId==null"-->
+<!--            type="selection"-->
+<!--            :selectable="checkSelectable"-->
+<!--            width="55"-->
+<!--          ></el-table-column>-->
+<!--          <el-table-column label="序号" type="index"></el-table-column>-->
+<!--          <el-table-column-->
+<!--            label="产品标识"-->
+<!--            prop="nameCode"-->
+<!--            show-overflow-tooltip-->
+<!--          ></el-table-column>-->
+<!--          <el-table-column-->
+<!--            label="物资名称"-->
+<!--            prop="cpmctymc"-->
+<!--            show-overflow-tooltip-->
+<!--          ></el-table-column>-->
+<!--          <el-table-column-->
+<!--            label="规格型号"-->
+<!--            prop="ggxh"-->
+<!--            show-overflow-tooltip-->
+<!--          ></el-table-column>-->
+<!--          <el-table-column-->
+<!--            label="医疗器械注册人"-->
+<!--            prop="ylqxzcrbarmc"-->
+<!--            show-overflow-tooltip-->
+<!--          ></el-table-column>-->
+<!--          <el-table-column-->
+<!--            label="注册证编号"-->
+<!--            prop="zczbhhzbapzbh"-->
+<!--            show-overflow-tooltip-->
+<!--          ></el-table-column>-->
+
+<!--          <el-table-column label="操作">-->
+<!--            <template slot-scope="scope">-->
+<!--              <el-button-->
+<!--                type="text"-->
+<!--                size="small"-->
+<!--                @click="diDetail(scope.row)"-->
+<!--              >详情-->
+<!--              </el-button-->
+<!--              >-->
+<!--            </template>-->
+<!--          </el-table-column>-->
+
         </el-table>
         <pagination
           v-show="total>0"
@@ -342,6 +487,9 @@ import {superSearch} from "@/api/basic/udiInfo";
 import {combineUdi, combineAllUdi, checkExitUdi} from "@/api/basic/product/udiRelevance";
 import selectDiDetail from "./SelectDIDetailDialog"
 import {isBlank} from "@/utils/strUtil";
+import {
+  getHead,executeFuc
+} from "@/utils/customConfig";
 
 export default {
   name: "closeDialog",
@@ -400,6 +548,10 @@ export default {
       udidlList: [],
       erpList: [],
       pageTotal: 0,
+      tableHeader:[],
+      queryList:[],
+      fromList:[],
+      options:[],
       total: 0,
       currentRow: null,
       fromOptions: [],
@@ -509,19 +661,19 @@ export default {
       this.showSearch = !this.showSearch;
     },
 
-    keyup_submit(event) {
-      this.unionQuery.page = 1;
-      this.getList();
+    keyup_submit(_this,event) {
+      _this.unionQuery.page = 1;
+      _this.getList();
       event.target.select();
     },
 
-    checkSelectable(row) {
+    checkSelectable(_this,row) {
       return !row.check;
     },
 
-    diDetail(row) {
-      this.diDetails = row;
-      this.selectDialog = true;
+    diDetail(_this,row) {
+      _this.diDetails = row;
+      _this.selectDialog = true;
     },
 
     handleCurrentChange(val) {
@@ -532,9 +684,9 @@ export default {
       if (row.check) return "warning-row";
       return "";
     },
-    handleErpChange(val) {
-      this.cpmctymc1 = val.cpmctymc;
-      this.currentRow = val;
+    handleErpChange(_this,val) {
+      _this.cpmctymc1 = val.cpmctymc;
+      _this.currentRow = val;
     },
     intentBack() {
       this.closeDialog();
@@ -654,11 +806,16 @@ export default {
           this.$emit("closeUdi", false);
         });
     },
-
+    showQxty(_this){
+      return _this.filterQuery.ylqxzcrbarmc==null || _this.filterQuery.ylqxzcrbarmc=='';
+    },
+    showGgxh(_this){
+      return (_this.filterQuery.cpmctymc=='' && _this.filterQuery.nameCode=='' && (_this.filterQuery.ylqxzcrbarmc==null || _this.filterQuery.ylqxzcrbarmc==''));
+    },
     handleSelectionUdiChange(val) {
       this.multipleUdiSelection = val;
     },
-    findMethod(query) {
+    findMethod(_this,query) {
       let cQuery = {
         ylqxzcrbarmc: query,
         page: 1,
@@ -666,19 +823,33 @@ export default {
       };
       filterCompany(cQuery)
         .then((response) => {
-          this.loading = false;
-          this.fromOptions = response.data || [];
+          _this.options.loading = false;
+          _this.options = {
+            findMethod: response.data || []
+          };
         })
         .catch(() => {
-          this.loading = false;
-          this.fromOptions = [];
+          _this.options.loading = false;
+          _this.options = {
+            findMethod:  []
+          };
         });
     },
+    executeFuc(row,number,type,clickFuc,value){
+      return executeFuc(this,row,number,type,clickFuc,value);
+    }
   },
   components: {
     selectDiDetail,
   },
   created() {
+    getHead("UdiInfoSelectLocalUdi","1").then((re) => {
+      // 处理返回的数据
+      this.tableObj = re.data;
+      this.tableHeader = re.data.tableList;
+      this.queryList = re.data.queryList;
+      this.fromList = re.data.fromList;
+    });
   }
 };
 </script>

src/views/basic/product/product.vue

@@ -38,147 +38,207 @@
 
         <el-col style="border-left: 3px solid #dddddd; overflow-y: hidden">
           <el-form
+            v-if="queryList && queryList.length > 0"
             :model="filterQuery"
             size="mini"
             label-width="100px"
             v-show="showSearch"
           >
-            <el-row>
-              <el-col :span="18">
-                <el-form-item class="query-form-item" label="UDI码:">
+            <el-row style=" display:flex;  flex-wrap: wrap; ">
+              <template v-for="(item, index) in queryList" >
+                <el-form-item v-if="item.columnType == 'input'" :label="item.columnDesc+`:`" :key="item.id">
                   <el-input
-                    v-model="filterQuery.udiCode"
-                    style="width: 97%"
-                    placeholder="请扫描或输入UDI码"
-                    clearable="true"
-                    @keyup.enter.native="keyup_submit($event)"
-                  ></el-input>
-                </el-form-item>
-              </el-col>
-            </el-row>
-            <el-row>
-              <el-col :span="6">
-                <el-form-item class="query-form-item" label="最小销售标识:">
-                  <el-input
-                    v-model="filterQuery.unionCode"
-                    placeholder="请输入最小销售标识"
-                    style="width: 90%"
-                    clearable="true"
-                  ></el-input>
-                </el-form-item>
-              </el-col>
-              <el-col :span="6">
-                <el-form-item class="query-form-item" label="物资名称:">
-                  <el-input
-                    v-model="filterQuery.cpmctymc"
-                    placeholder="请输入物资名称"
-                    clearable="true"
-                    style="width: 90%"
+                    v-model="filterQuery[item.columnName]"
+                    :placeholder="item.columnDesc"
+                    @keyup.enter.native="executeFuc($event,null,'5',item.clickFuc)"
+                    clearable
                   ></el-input>
                 </el-form-item>
-              </el-col>
-              <el-col :span="6">
-                <el-form-item class="query-form-item" label="规格型号:">
-                  <el-input
-                    v-model="filterQuery.ggxh"
-                    placeholder="请输入规格型号"
-                    clearable="true"
-                    style="width: 90%"
-                  ></el-input>
+                <el-form-item v-if="item.columnType == 'select'" :label="item.columnDesc+`:`">
+                  <el-select v-model="filterQuery[item.columnName]" :placeholder="item.columnDesc" clearable>
+                    <el-option
+                      v-for="dict in item.lableRuleObj"
+                      :key="dict.value"
+                      :label="dict.label"
+                      :value="dict.value"
+                    />
+                  </el-select>
                 </el-form-item>
-              </el-col>
-              <el-col :span="6">
-                <el-form-item class="query-form-item" label="对照条件:">
+                <el-form-item v-if="item.columnType == 'selectServer'" :label="item.columnDesc+`:`">
                   <el-select
-                    v-model="filterQuery.filterType"
-                    placeholder="请选择过滤对照条件"
-                    style="width: 90%"
-                  >
+                    v-model="filterQuery[item.columnName]"
+                    :placeholder="item.columnDesc"
+                    filterable
+                    remote
+                    :remote-method="(query) => executeFuc(query, null,'6',item.clickFuc)"
+                    clearable>
                     <el-option
-                      v-for="item in filterList"
+                      v-for="item in options[item.clickFuc]"
                       :key="item.filterType"
                       :label="item.sysName"
                       :value="item.filterType"
-                    >
-                      <span style="float: left">{{ item.sysName }}</span>
-                    </el-option>
-                  </el-select>
-                </el-form-item>
-              </el-col>
-            </el-row>
-            <el-row>
-              <el-col :span="6">
-                <el-form-item class="query-form-item" label="注册备案人:">
-                  <el-input
-                    v-model="filterQuery.ylqxzcrbarmc"
-                    placeholder="请输入注册备案人"
-                    style="width: 90%"
-                    clearable="true"
-                  ></el-input>
-                </el-form-item>
-              </el-col>
-              <el-col :span="6">
-                <el-form-item class="query-form-item" label="第三方编码:">
-                  <el-input
-                    v-model="filterQuery.thrPiId"
-                    placeholder="请输入第三方主系统编码"
-                    style="width: 90%"
-                    clearable="true"
-                  ></el-input>
-                </el-form-item>
-              </el-col>
-              <el-col :span="6">
-                <el-form-item class="query-form-item" label="集采状态:">
-                  <el-select
-                    v-model="filterQuery.groupBuy"
-                    placeholder="请选择集采状态"
-                    clearable
-                    style="width: 90%"
-                  >
-                    <el-option label="全部" value=""></el-option>
-                    <el-option label="集采" value="true"></el-option>
-                    <el-option label="非集采" value="false"></el-option>
-                  </el-select>
-                </el-form-item>
-              </el-col>
-              <el-col :span="6">
-                <el-form-item class="query-form-item" label="可配送状态:">
-                  <el-select
-                    v-model="filterQuery.dispatch"
-                    placeholder="请选择可配送状态"
-                    clearable
-                    style="width: 90%"
-                  >
-                    <el-option label="全部" value=""></el-option>
-                    <el-option label="可配送" value="true"></el-option>
-                    <el-option label="不可配送" value="false"></el-option>
+                    />
                   </el-select>
                 </el-form-item>
-              </el-col>
-            </el-row>
-
-            <el-row>
-              <el-col :span="6">
-                <el-form-item class="query-form-item" label="注册/备案号:">
-                  <el-input
-                    v-model="filterQuery.zczbhhzbapzbh"
-                    placeholder="请输入注册/备案号"
-                    style="width: 90%"
-                    clearable="true"
-                  ></el-input>
+                <el-form-item v-if="item.columnType == 'datePicker'" :label="item.columnDesc+`:`">
+                  <el-date-picker
+                    v-model="dateRange"
+                    :style="`width:${item.width+'px'}`"
+                    value-format="yyyy-MM-dd HH:mm:ss"
+                    type="daterange"
+                    range-separator="-"
+                    start-placeholder="开始日期"
+                    end-placeholder="结束日期"
+                    :default-time="['00:00:00', '23:59:59']"
+                  ></el-date-picker>
                 </el-form-item>
-              </el-col>
-              <el-col :span="6">
-                <el-form-item class="query-form-item" label="生产企业:">
-                  <el-input
-                    v-model="filterQuery.manufactory"
-                    placeholder="请输入生产企业"
-                    style="width: 90%"
-                    clearable="true"
-                  ></el-input>
+                <el-form-item v-if="item.columnType == 'date'" :label="item.columnDesc+`:`">
+                  <el-date-picker
+                    v-model="filterQuery[item.columnName]"
+                    :style="`width:${item.width+'px'}`"
+                    value-format="yyyy-MM-dd"
+                    type="date"
+                    :placeholder="item.columnDesc"
+                  ></el-date-picker>
                 </el-form-item>
-              </el-col>
+              </template>
             </el-row>
+<!--            <el-row>-->
+<!--              <el-col :span="18">-->
+<!--                <el-form-item class="query-form-item" label="UDI码:">-->
+<!--                  <el-input-->
+<!--                    v-model="filterQuery.udiCode"-->
+<!--                    style="width: 97%"-->
+<!--                    placeholder="请扫描或输入UDI码"-->
+<!--                    clearable="true"-->
+<!--                    @keyup.enter.native="keyup_submit($event)"-->
+<!--                  ></el-input>-->
+<!--                </el-form-item>-->
+<!--              </el-col>-->
+<!--            </el-row>-->
+<!--            <el-row>-->
+<!--              <el-col :span="6">-->
+<!--                <el-form-item class="query-form-item" label="最小销售标识:">-->
+<!--                  <el-input-->
+<!--                    v-model="filterQuery.unionCode"-->
+<!--                    placeholder="请输入最小销售标识"-->
+<!--                    style="width: 90%"-->
+<!--                    clearable="true"-->
+<!--                  ></el-input>-->
+<!--                </el-form-item>-->
+<!--              </el-col>-->
+<!--              <el-col :span="6">-->
+<!--                <el-form-item class="query-form-item" label="物资名称:">-->
+<!--                  <el-input-->
+<!--                    v-model="filterQuery.cpmctymc"-->
+<!--                    placeholder="请输入物资名称"-->
+<!--                    clearable="true"-->
+<!--                    style="width: 90%"-->
+<!--                  ></el-input>-->
+<!--                </el-form-item>-->
+<!--              </el-col>-->
+<!--              <el-col :span="6">-->
+<!--                <el-form-item class="query-form-item" label="规格型号:">-->
+<!--                  <el-input-->
+<!--                    v-model="filterQuery.ggxh"-->
+<!--                    placeholder="请输入规格型号"-->
+<!--                    clearable="true"-->
+<!--                    style="width: 90%"-->
+<!--                  ></el-input>-->
+<!--                </el-form-item>-->
+<!--              </el-col>-->
+<!--              <el-col :span="6">-->
+<!--                <el-form-item class="query-form-item" label="对照条件:">-->
+<!--                  <el-select-->
+<!--                    v-model="filterQuery.filterType"-->
+<!--                    placeholder="请选择过滤对照条件"-->
+<!--                    style="width: 90%"-->
+<!--                  >-->
+<!--                    <el-option-->
+<!--                      v-for="item in filterList"-->
+<!--                      :key="item.filterType"-->
+<!--                      :label="item.sysName"-->
+<!--                      :value="item.filterType"-->
+<!--                    >-->
+<!--                      <span style="float: left">{{ item.sysName }}</span>-->
+<!--                    </el-option>-->
+<!--                  </el-select>-->
+<!--                </el-form-item>-->
+<!--              </el-col>-->
+<!--            </el-row>-->
+<!--            <el-row>-->
+<!--              <el-col :span="6">-->
+<!--                <el-form-item class="query-form-item" label="注册备案人:">-->
+<!--                  <el-input-->
+<!--                    v-model="filterQuery.ylqxzcrbarmc"-->
+<!--                    placeholder="请输入注册备案人"-->
+<!--                    style="width: 90%"-->
+<!--                    clearable="true"-->
+<!--                  ></el-input>-->
+<!--                </el-form-item>-->
+<!--              </el-col>-->
+<!--              <el-col :span="6">-->
+<!--                <el-form-item class="query-form-item" label="第三方编码:">-->
+<!--                  <el-input-->
+<!--                    v-model="filterQuery.thrPiId"-->
+<!--                    placeholder="请输入第三方主系统编码"-->
+<!--                    style="width: 90%"-->
+<!--                    clearable="true"-->
+<!--                  ></el-input>-->
+<!--                </el-form-item>-->
+<!--              </el-col>-->
+<!--              <el-col :span="6">-->
+<!--                <el-form-item class="query-form-item" label="集采状态:">-->
+<!--                  <el-select-->
+<!--                    v-model="filterQuery.groupBuy"-->
+<!--                    placeholder="请选择集采状态"-->
+<!--                    clearable-->
+<!--                    style="width: 90%"-->
+<!--                  >-->
+<!--                    <el-option label="全部" value=""></el-option>-->
+<!--                    <el-option label="集采" value="true"></el-option>-->
+<!--                    <el-option label="非集采" value="false"></el-option>-->
+<!--                  </el-select>-->
+<!--                </el-form-item>-->
+<!--              </el-col>-->
+<!--              <el-col :span="6">-->
+<!--                <el-form-item class="query-form-item" label="可配送状态:">-->
+<!--                  <el-select-->
+<!--                    v-model="filterQuery.dispatch"-->
+<!--                    placeholder="请选择可配送状态"-->
+<!--                    clearable-->
+<!--                    style="width: 90%"-->
+<!--                  >-->
+<!--                    <el-option label="全部" value=""></el-option>-->
+<!--                    <el-option label="可配送" value="true"></el-option>-->
+<!--                    <el-option label="不可配送" value="false"></el-option>-->
+<!--                  </el-select>-->
+<!--                </el-form-item>-->
+<!--              </el-col>-->
+<!--            </el-row>-->
+
+<!--            <el-row>-->
+<!--              <el-col :span="6">-->
+<!--                <el-form-item class="query-form-item" label="注册/备案号:">-->
+<!--                  <el-input-->
+<!--                    v-model="filterQuery.zczbhhzbapzbh"-->
+<!--                    placeholder="请输入注册/备案号"-->
+<!--                    style="width: 90%"-->
+<!--                    clearable="true"-->
+<!--                  ></el-input>-->
+<!--                </el-form-item>-->
+<!--              </el-col>-->
+<!--              <el-col :span="6">-->
+<!--                <el-form-item class="query-form-item" label="生产企业:">-->
+<!--                  <el-input-->
+<!--                    v-model="filterQuery.manufactory"-->
+<!--                    placeholder="请输入生产企业"-->
+<!--                    style="width: 90%"-->
+<!--                    clearable="true"-->
+<!--                  ></el-input>-->
+<!--                </el-form-item>-->
+<!--              </el-col>-->
+<!--            </el-row>-->
           </el-form>
           <div class="top-right-btn">
             <el-button-group>
@@ -219,189 +279,275 @@
             style="width: 100%"
             border
             key="1"
-            @selection-change="handleSelectionChange"
+            @current-change="executeFuc"
           >
-            <el-table-column label="序号" type="index"></el-table-column>
-            <el-table-column
-              label="最小销售产品标识"
-              prop="nameCode"
-              width="140"
-              show-overflow-tooltip
-            ></el-table-column>
-            <el-table-column
-              label="主系统编码"
-              prop="mainId"
-              width="120"
-              show-overflow-tooltip
-            ></el-table-column>
-            <el-table-column
-              label="物资名称"
-              prop="cpmctymc"
-              width="160"
-              show-overflow-tooltip
-            ></el-table-column>
-            <el-table-column
-              label="规格型号"
-              prop="ggxh"
-              width="160"
-              show-overflow-tooltip
-            ></el-table-column>
-            <el-table-column
-              label="商品名称"
-              prop="spmc"
-              width="160"
-              show-overflow-tooltip
-              v-if="$auth.hasPermi('basic:spmc')"
-            ></el-table-column>
-
-            <el-table-column
-              label="商品条码"
-              prop="sptm"
-              width="160"
-              show-overflow-tooltip
-              v-if="$auth.hasPermi('basic:sptm')"
-            ></el-table-column>
+            <template v-for="(item, index) in tableHeader">
               <el-table-column
-              label="医保编码"
-              prop="ybbm"
-              width="160"
-              show-overflow-tooltip
-              v-if="$auth.hasPermi('basic:ybbm')"
-            ></el-table-column>
+                v-if="item.columnType == 'id'"
+                type="index" :label="item.columnDesc"></el-table-column>
               <el-table-column
-              label="计量单位"
-              prop="measname"
-              width="160"
-              show-overflow-tooltip
-              v-if="$auth.hasPermi('basic:measname')"
-            ></el-table-column>
+                v-else-if="item.columnType == 'selection'"
+                type="selection"
+                :width="item.width"
+                :selectable="executeFuc"></el-table-column>
 
               <el-table-column
-              label="注册/备案号"
-              prop="zczbhhzbapzbh"
-              width="160"
-              show-overflow-tooltip
-            ></el-table-column>
-            <el-table-column
-              label="注册/备案人"
-              prop="ylqxzcrbarmc"
-              width="180"
-              show-overflow-tooltip
-            ></el-table-column>
-            <el-table-column
-              :label="productRemarkSet.remarkTitle1"
-              prop="basicPrductRemak1"
-              width="180"
-              show-overflow-tooltip
-              v-if="$auth.hasPermi('basic:basicPrductRemak1')"
-            ></el-table-column>
-            <el-table-column
-              :label="productRemarkSet.remarkTitle2"
-              prop="basicPrductRemak2"
-              width="180"
-              show-overflow-tooltip
-              v-if="$auth.hasPermi('basic:basicPrductRemak2')"
-            ></el-table-column>
-            <el-table-column
-              :label="productRemarkSet.remarkTitle3"
-              prop="basicPrductRemak3"
-              width="180"
-              show-overflow-tooltip
-              v-if="$auth.hasPermi('basic:basicPrductRemak3')"
-            ></el-table-column>
-            <el-table-column
-              :label="productRemarkSet.remarkTitle4"
-              prop="basicPrductRemak4"
-              width="180"
-              show-overflow-tooltip
-              v-if="$auth.hasPermi('basic:basicPrductRemak4')"
-            ></el-table-column>
-            <el-table-column
-              :label="productRemarkSet.remarkTitle5"
-              prop="basicPrductRemak5"
-              width="180"
-              show-overflow-tooltip
-              v-if="$auth.hasPermi('basic:basicPrductRemak5')"
-            ></el-table-column>
-            <el-table-column
-              :label="productRemarkSet.remarkTitle6"
-              prop="basicPrductRemak6"
-              width="180"
-              show-overflow-tooltip
-              v-if="$auth.hasPermi('basic:basicPrductRemak6')"
-            ></el-table-column>
-            <el-table-column
-              :label="productRemarkSet.remarkTitle7"
-              prop="basicPrductRemak7"
-              width="180"
-              show-overflow-tooltip
-              v-if="$auth.hasPermi('basic:basicPrductRemak7')"
-            ></el-table-column>
-            <el-table-column
-              :label="productRemarkSet.remarkTitle8"
-              prop="basicPrductRemak8"
-              width="180"
-              show-overflow-tooltip
-              v-if="$auth.hasPermi('basic:basicPrductRemak8')"
-            ></el-table-column>
-
+                v-else-if="item.columnType == 'radio'"
+                :prop="item.columnName"
+                :label="item.columnDesc"
+                :sortable="item.sort"
+                :width="item.width"
+                :show-overflow-tooltip="item.tooltip"
+                :key="item.columnName"
+              >
+                <template  slot-scope="scope">
+                  <el-radio :label="scope.row.id" v-model="radioCheck"><span></span></el-radio>
+                </template>
+              </el-table-column>
               <el-table-column
-              label="集采状态"
-              prop="groupBuy"
-              width="120"
-              show-overflow-tooltip
-              v-if="$auth.hasPermi('basic:groupBuy')"
+                v-else-if="item.columnType == 'laber'"
+                :prop="item.columnName"
+                :label="item.columnDesc"
+                :sortable="item.sort"
+                :width="item.width"
+                :show-overflow-tooltip="item.tooltip"
+                :key="item.columnName"
               >
                 <template   slot-scope="scope">
-                <el-tag :type="scope.row.groupBuy | statusFilterType">
-                  {{ groupBuyMap[scope.row.groupBuy] }}
-                </el-tag>
+                  <span :style="{color: executeFuc(scope.row,null,'4',item.lableRuleObj[scope.row[item.columnName]])}">{{ item.lableRuleObj[scope.row[item.columnName]] }}</span>
                 </template>
               </el-table-column>
               <el-table-column
-              label="可配送状态"
-              prop="dispatch"
-              width="120"
-              show-overflow-tooltip
-              v-if="$auth.hasPermi('basic:dispatch')"
+                v-else-if="item.columnType == 'eltag'"
+                :prop="item.columnName"
+                :label="item.columnDesc"
+                :sortable="item.sort"
+                :width="item.width"
+                :show-overflow-tooltip="item.tooltip"
+                :key="item.columnName"
               >
                 <template   slot-scope="scope">
-                <el-tag :type="scope.row.dispatch | statusFilterType">
-                  {{ dispatchMap[scope.row.dispatch] }}
+                  <el-tag :type="executeFuc(scope.row,null,'4',item,item.lableRuleObj?item.lableRuleObj[scope.row[item.columnName]]:scope.row[item.columnName])">
+                    <span>{{ item.lableRuleObj?item.lableRuleObj[scope.row[item.columnName]]:scope.row[item.columnName] }}</span>
                   </el-tag>
                 </template>
               </el-table-column>
-            <el-table-column width="180" label="操作" fixed="right">
+              <el-table-column
+                v-else-if="item.columnType == 'button'"
+                :prop="item.columnName"
+                :label="item.columnDesc"
+                :width="item.width"
+                :key="item.columnName"
+                fixed="right"
+              >
                 <template slot-scope="scope">
-                <el-button
-                  type="text"
-                  size="small"
-                  :disabled="scope.row.originUuid != null"
-                  @click.native.stop="intentSelectUdi(scope.row)"
-                >关联DI
-                </el-button>
-                <el-button
-                  type="text"
-                  size="small"
-                  @click.native.stop="handleModifyClick(scope.row)"
-                >详情
-                </el-button>
-
-                <el-button
-                  type="text"
-                  size="small"
-                  @click.native.stop="diEdit(scope.row)"
-                >编辑
-                </el-button>
-
-                <el-button
-                  type="text"
-                  size="small"
-                  @click.native.stop="deleteDialog(scope.row)"
-                >删除
+                  <el-button v-for="(buttonItem, buttonIndex) in item.buttonRulObj"
+                             :type="buttonItem.type"
+                             :size="buttonItem.size"
+                             :style="buttonItem.style"
+                             :key="buttonItem"
+                             :disabled="executeFuc(scope.row,null,'3',buttonItem.disabledFuc)"
+                             @click.native.stop="executeFuc(scope.row,null,'1',buttonItem.clickFuc)"
+                  >{{ buttonItem.name }}
                   </el-button>
                 </template>
               </el-table-column>
+              <el-table-column
+                v-else
+                :prop="item.columnName"
+                :label="item.columnDesc"
+                :sortable="item.sort"
+                :width="item.width"
+                :show-overflow-tooltip="item.tooltip"
+                :key="item.columnName"
+              >
+                <template slot-scope="scope">
+                  <span :style="{color: executeFuc(scope.row,null,'4',item,scope.row[item.columnName])}">{{ scope.row[item.columnName] }}</span>
+                </template>
+              </el-table-column>
+
+            </template>
+<!--            <el-table-column label="序号" type="index"></el-table-column>-->
+<!--            <el-table-column-->
+<!--              label="最小销售产品标识"-->
+<!--              prop="nameCode"-->
+<!--              width="140"-->
+<!--              show-overflow-tooltip-->
+<!--            ></el-table-column>-->
+<!--            <el-table-column-->
+<!--              label="主系统编码"-->
+<!--              prop="mainId"-->
+<!--              width="120"-->
+<!--              show-overflow-tooltip-->
+<!--            ></el-table-column>-->
+<!--            <el-table-column-->
+<!--              label="物资名称"-->
+<!--              prop="cpmctymc"-->
+<!--              width="160"-->
+<!--              show-overflow-tooltip-->
+<!--            ></el-table-column>-->
+<!--            <el-table-column-->
+<!--              label="规格型号"-->
+<!--              prop="ggxh"-->
+<!--              width="160"-->
+<!--              show-overflow-tooltip-->
+<!--            ></el-table-column>-->
+<!--            <el-table-column-->
+<!--              label="商品名称"-->
+<!--              prop="spmc"-->
+<!--              width="160"-->
+<!--              show-overflow-tooltip-->
+<!--              v-if="$auth.hasPermi('basic:spmc')"-->
+<!--            ></el-table-column>-->
+
+<!--            <el-table-column-->
+<!--              label="商品条码"-->
+<!--              prop="sptm"-->
+<!--              width="160"-->
+<!--              show-overflow-tooltip-->
+<!--              v-if="$auth.hasPermi('basic:sptm')"-->
+<!--            ></el-table-column>-->
+<!--            <el-table-column-->
+<!--              label="医保编码"-->
+<!--              prop="ybbm"-->
+<!--              width="160"-->
+<!--              show-overflow-tooltip-->
+<!--              v-if="$auth.hasPermi('basic:ybbm')"-->
+<!--            ></el-table-column>-->
+<!--            <el-table-column-->
+<!--              label="计量单位"-->
+<!--              prop="measname"-->
+<!--              width="160"-->
+<!--              show-overflow-tooltip-->
+<!--              v-if="$auth.hasPermi('basic:measname')"-->
+<!--            ></el-table-column>-->
+
+<!--            <el-table-column-->
+<!--              label="注册/备案号"-->
+<!--              prop="zczbhhzbapzbh"-->
+<!--              width="160"-->
+<!--              show-overflow-tooltip-->
+<!--            ></el-table-column>-->
+<!--            <el-table-column-->
+<!--              label="注册/备案人"-->
+<!--              prop="ylqxzcrbarmc"-->
+<!--              width="180"-->
+<!--              show-overflow-tooltip-->
+<!--            ></el-table-column>-->
+<!--            <el-table-column-->
+<!--              :label="productRemarkSet.remarkTitle1"-->
+<!--              prop="basicPrductRemak1"-->
+<!--              width="180"-->
+<!--              show-overflow-tooltip-->
+<!--              v-if="$auth.hasPermi('basic:basicPrductRemak1')"-->
+<!--            ></el-table-column>-->
+<!--            <el-table-column-->
+<!--              :label="productRemarkSet.remarkTitle2"-->
+<!--              prop="basicPrductRemak2"-->
+<!--              width="180"-->
+<!--              show-overflow-tooltip-->
+<!--              v-if="$auth.hasPermi('basic:basicPrductRemak2')"-->
+<!--            ></el-table-column>-->
+<!--            <el-table-column-->
+<!--              :label="productRemarkSet.remarkTitle3"-->
+<!--              prop="basicPrductRemak3"-->
+<!--              width="180"-->
+<!--              show-overflow-tooltip-->
+<!--              v-if="$auth.hasPermi('basic:basicPrductRemak3')"-->
+<!--            ></el-table-column>-->
+<!--            <el-table-column-->
+<!--              :label="productRemarkSet.remarkTitle4"-->
+<!--              prop="basicPrductRemak4"-->
+<!--              width="180"-->
+<!--              show-overflow-tooltip-->
+<!--              v-if="$auth.hasPermi('basic:basicPrductRemak4')"-->
+<!--            ></el-table-column>-->
+<!--            <el-table-column-->
+<!--              :label="productRemarkSet.remarkTitle5"-->
+<!--              prop="basicPrductRemak5"-->
+<!--              width="180"-->
+<!--              show-overflow-tooltip-->
+<!--              v-if="$auth.hasPermi('basic:basicPrductRemak5')"-->
+<!--            ></el-table-column>-->
+<!--            <el-table-column-->
+<!--              :label="productRemarkSet.remarkTitle6"-->
+<!--              prop="basicPrductRemak6"-->
+<!--              width="180"-->
+<!--              show-overflow-tooltip-->
+<!--              v-if="$auth.hasPermi('basic:basicPrductRemak6')"-->
+<!--            ></el-table-column>-->
+<!--            <el-table-column-->
+<!--              :label="productRemarkSet.remarkTitle7"-->
+<!--              prop="basicPrductRemak7"-->
+<!--              width="180"-->
+<!--              show-overflow-tooltip-->
+<!--              v-if="$auth.hasPermi('basic:basicPrductRemak7')"-->
+<!--            ></el-table-column>-->
+<!--            <el-table-column-->
+<!--              :label="productRemarkSet.remarkTitle8"-->
+<!--              prop="basicPrductRemak8"-->
+<!--              width="180"-->
+<!--              show-overflow-tooltip-->
+<!--              v-if="$auth.hasPermi('basic:basicPrductRemak8')"-->
+<!--            ></el-table-column>-->
+
+<!--            <el-table-column-->
+<!--              label="集采状态"-->
+<!--              prop="groupBuy"-->
+<!--              width="120"-->
+<!--              show-overflow-tooltip-->
+<!--              v-if="$auth.hasPermi('basic:groupBuy')"-->
+<!--            >-->
+<!--              <template slot-scope="scope">-->
+<!--                <el-tag :type="scope.row.groupBuy | statusFilterType">-->
+<!--                  {{ groupBuyMap[scope.row.groupBuy] }}-->
+<!--                </el-tag>-->
+<!--              </template>-->
+<!--            </el-table-column>-->
+<!--            <el-table-column-->
+<!--              label="可配送状态"-->
+<!--              prop="dispatch"-->
+<!--              width="120"-->
+<!--              show-overflow-tooltip-->
+<!--              v-if="$auth.hasPermi('basic:dispatch')"-->
+<!--            >-->
+<!--              <template slot-scope="scope">-->
+<!--                <el-tag :type="scope.row.dispatch | statusFilterType">-->
+<!--                  {{ dispatchMap[scope.row.dispatch] }}-->
+<!--                </el-tag>-->
+<!--              </template>-->
+<!--            </el-table-column>-->
+<!--            <el-table-column width="180" label="操作" fixed="right">-->
+<!--              <template slot-scope="scope">-->
+<!--                <el-button-->
+<!--                  type="text"-->
+<!--                  size="small"-->
+<!--                  :disabled="scope.row.originUuid != null"-->
+<!--                  @click.native.stop="intentSelectUdi(scope.row)"-->
+<!--                >关联DI-->
+<!--                </el-button>-->
+<!--                <el-button-->
+<!--                  type="text"-->
+<!--                  size="small"-->
+<!--                  @click.native.stop="handleModifyClick(scope.row)"-->
+<!--                >详情-->
+<!--                </el-button>-->
+
+<!--                <el-button-->
+<!--                  type="text"-->
+<!--                  size="small"-->
+<!--                  @click.native.stop="diEdit(scope.row)"-->
+<!--                >编辑-->
+<!--                </el-button>-->
+
+<!--                <el-button-->
+<!--                  type="text"-->
+<!--                  size="small"-->
+<!--                  @click.native.stop="deleteDialog(scope.row)"-->
+<!--                >删除-->
+<!--                </el-button>-->
+<!--              </template>-->
+<!--            </el-table-column>-->
           </el-table>
           <el-dialog
             title="物资字典-详情"
@@ -1575,6 +1721,9 @@ import selectHospProduct from "@/views/basic/product/bindHospProduct";
 import selectUnBindHospProduct from "@/views/basic/product/unbindHospProduct";
 import {getBasicHospType, getListTree} from "@/api/basic/basicHospType";
 import {dlLastVersionByDi} from "@/api/basic/udiInfo";
+import {
+  getHead,executeFuc
+} from "@/utils/customConfig";
 
 export default {
   data() {
@@ -1658,6 +1807,10 @@ export default {
       detailList: [],
       sysList: [],
       filterList: [],
+      options: {},
+      queryList:[],
+      tableHeader:[],
+      fromList:[],
       total: 0,
       thirdNo: "",
       treeList: [],
@@ -1736,9 +1889,9 @@ export default {
     hideSearch() {
       this.showSearch = !this.showSearch;
     },
-    keyup_submit(event) {
-      this.filterQuery.page = 1;
-      this.getList();
+    keyup_submit(_this,event) {
+      _this.filterQuery.page = 1;
+      _this.getList();
       event.target.select();
     },
     getDetailList(detailQuery) {
@@ -1817,14 +1970,14 @@ export default {
         });
     },
 
-    deleteDialog(rowId) {
-      this.$confirm("此操作将永久删除该产品信息, 是否继续?", "提示", {
+    deleteDialog(_this,rowId) {
+      _this.$confirm("此操作将永久删除该产品信息, 是否继续?", "提示", {
         confirmButtonText: "确定",
         cancelButtonText: "取消",
         type: "warning",
       })
         .then(() => {
-          this.deleteOrders(rowId);
+          _this.deleteOrders(rowId);
         })
         .catch(() => {
         });
@@ -1949,12 +2102,12 @@ export default {
           });
         });
     },
-    intentSelectUdi(val) {
-      this.relId = val.id;
-      this.isImportUdi = true;
-      this.isImport = true;
-      this.thisData = val;
-      this.selectLocalVisible = true;
+    intentSelectUdi(_this,val) {
+      _this.relId = val.id;
+      _this.isImportUdi = true;
+      _this.isImport = true;
+      _this.thisData = val;
+      _this.selectLocalVisible = true;
     },
 
     intentImportUdi() {
@@ -1969,8 +2122,8 @@ export default {
       this.selectLocalVisible = true;
     },
 
-    handleSelectionChange(val) {
-      this.multipleSelection = val;
+    handleSelectionChange(_this,val) {
+      _this.multipleSelection = val;
     },
 
     cancelDialog() {
@@ -1982,31 +2135,34 @@ export default {
       this.filterQuery.page = val.page;
       this.getList();
     },
-    handleModifyClick(row) {
-      this.uuid = row.uuid;
-      this.relId = row.id;
-      this.isImport = false;
-      this.thisData = row;
-      this.editDialogVisible = true;
-
-      this.pId = row.id;
-      this.relevanceEdit = {
+    disabledUdi(_this,row) {
+      return row.originUuid != null
+    },
+    handleModifyClick(_this,row) {
+      _this.uuid = row.uuid;
+      _this.relId = row.id;
+      _this.isImport = false;
+      _this.thisData = row;
+      _this.editDialogVisible = true;
+
+      _this.pId = row.id;
+      _this.relevanceEdit = {
         id: row.id,
         isUseDy: row.isUseDy,
         isDisable: row.isDisable,
         isLock: row.isLock,
         isAdavence: row.isAdavence,
       };
-      this.checked = row.isUseDy == 1;
+      _this.checked = row.isUseDy == 1;
 
-      this.editQuery = row;
+      _this.editQuery = row;
       //获取产品标识列表
       let ttquery = {
         id: row.id,
       };
-      this.getDetailList(ttquery);
+      _this.getDetailList(ttquery);
       //获取关联第三方系统产品信息列表
-      this.getThirdSysDetail();
+      _this.getThirdSysDetail();
     },
 
     lockProducts(status) {
@@ -2049,15 +2205,19 @@ export default {
       }
     },
 
-    getSysFilter() {
+    getSysFilter(_this,query) {
       sysFilter()
         .then((response) => {
-          this.loading = false;
-          this.filterList = response.data.list || [];
+          _this.loading = false;
+          _this.options = {
+            getSysFilter: response.data.list || []
+          };
         })
         .catch(() => {
-          this.loading = false;
-          this.filterList = [];
+          _this.loading = false;
+          _this.options = {
+            getSysFilter: []
+          };
         });
     },
     singleDiEdit() {
@@ -2070,27 +2230,27 @@ export default {
       this.editSingleFormat.nameCode = temp.nameCode;
       this.editSingleDiDialogVisible = true;
     },
-    diEdit(row) {
-      this.uuid = row.uuid;
-      this.relId = row.id;
-      this.isImport = false;
-      this.thisData = row;
-      this.pId = row.id;
-      this.relevanceEdit = {
+    diEdit(_this,row) {
+      _this.uuid = row.uuid;
+      _this.relId = row.id;
+      _this.isImport = false;
+      _this.thisData = row;
+      _this.pId = row.id;
+      _this.relevanceEdit = {
         id: row.id,
         isUseDy: row.isUseDy,
         isDisable: row.isDisable,
         isLock: row.isLock,
         isAdavence: row.isAdavence,
       };
-      this.editFormat = JSON.parse(JSON.stringify(row));
-      if (this.editFormat.overStockNum == null) {
-        this.editFormat.overStockNum = 0;
+      _this.editFormat = JSON.parse(JSON.stringify(row));
+      if (_this.editFormat.overStockNum == null) {
+        _this.editFormat.overStockNum = 0;
       }
-      if (this.editFormat.lowStockNum == null) {
-        this.editFormat.lowStockNum = 0;
+      if (_this.editFormat.lowStockNum == null) {
+        _this.editFormat.lowStockNum = 0;
       }
-      this.editDiDialogVisible = true;
+      _this.editDiDialogVisible = true;
     },
     closeDialog() {
       this.selectErpDialogVisible = false;
@@ -2259,6 +2419,9 @@ export default {
         .catch(() => {
         });
     },
+    executeFuc(row,number,type,clickFuc,value){
+      return executeFuc(this,row,number,type,clickFuc,value);
+    }
   },
   mounted() {
   },
@@ -2275,10 +2438,17 @@ export default {
   },
   created() {
     this.findBasicProductSet();
-    this.getList();
+    getHead("maintain","1").then((re) => {
+      // 处理返回的数据
+      this.tableObj = re.data;
+      this.tableHeader = re.data.tableList;
+      this.queryList = re.data.queryList;
+      this.fromList = re.data.fromList;
+      this.getList()
+    });
     this.getTerrList();
     // this.selectSysParam();
-    this.getSysFilter();
+    this.getSysFilter(this,"");
 
   },
 };

src/views/system/customConfig/configDetail.vue

@@ -0,0 +1,599 @@
+<template>
+  <!-- 系统管理 组织架构 仓库信息页面 -->
+  <div>
+    <el-card>
+      <el-form :inline="true" :model="query" class="query-form" size="mini">
+        <el-form-item class="query-form-item" label="列名:">
+          <el-input v-model="query.columnName" clearable placeholder="列名"></el-input>
+        </el-form-item>
+        <el-form-item>
+          <el-button-group style="margin-left: 10px; display: flex">
+            <el-button type="primary" icon="el-icon-refresh" @click="onReset">重置</el-button>
+            <el-button type="primary" icon="el-icon-search" @click="onSubmit">查询</el-button>
+            <el-button type="primary" icon="el-icon-plus" @click="handleSubForm({}, 'add')">新增</el-button>
+          </el-button-group>
+        </el-form-item>
+      </el-form>
+      <el-table :data="list" border highlight-current-row  row-key="id"
+        style="width: 100%">
+        <el-table-column label="序号" type="index" ref="dataForm"></el-table-column>
+        <el-table-column prop="columnName" label="列名"> </el-table-column>
+         <el-table-column prop="isShow" label="是否展示">
+           <template slot-scope="scope">
+             <span>{{ isShowMap[scope.row.isShow] }}</span>
+           </template>
+         </el-table-column>
+        <el-table-column prop="columnDesc" label="列描述"></el-table-column>
+        <el-table-column prop="columnType" label="列类型">
+          <template slot-scope="scope">
+            <span>{{ columnTypeMap[scope.row.columnType] }}</span>
+          </template>
+        </el-table-column>
+        <el-table-column prop="number" label="排序"></el-table-column>
+        <el-table-column prop="width" label="宽度"></el-table-column>
+        <el-table-column label="字段是否可以排序" prop="sort">
+          <template slot-scope="scope">
+            <span>{{ upUerMap[scope.row.sort] }}</span>
+          </template>
+        </el-table-column>
+        <el-table-column label="是否缩略" prop="tooltip">
+          <template slot-scope="scope">
+            <span>{{ upUerMap[scope.row.tooltip] }}</span>
+          </template>
+        </el-table-column>
+        <el-table-column prop="lableRule" show-overflow-tooltip="true" label="字典替换规则"></el-table-column>
+        <el-table-column prop="colorRule" show-overflow-tooltip="true" label="颜色规则"></el-table-column>
+        <el-table-column prop="buttonRule" show-overflow-tooltip="true" label="按钮规则"></el-table-column>
+        <el-table-column prop="clickFuc" label="点击事件"></el-table-column>
+        <el-table-column label="操作">
+          <template slot-scope="scope">
+           <el-button
+             type="text"
+              @click.native="handleSubForm(scope.row, 'edit')"
+              >编辑
+              </el-button>
+              <el-button type="text" @click.native="handleDel(scope.row)">删除
+              </el-button>
+          </template>
+        </el-table-column>
+      </el-table>
+    </el-card>
+
+    <!--仓库编辑对话框-->
+    <el-dialog :title="formMap[formName]" :close-on-click-modal="false"
+      :close-on-press-escape="false" :visible.sync="formVisible" :before-close="hideForm" width="70%" top="5vh">
+      <el-form :model="subData" ref="dataForm" :rules="formRules" label-width="130px">
+        <el-row :gutter="20" class="el-row" type="flex">
+          <el-col :span="12" class="el-col">
+            <el-form-item label="列名" prop="columnName" class="query-form-item">
+              <el-input v-model="subData.columnName" style="width: 80%" placeholder="请输入业列名"
+                auto-complete="off"></el-input>
+            </el-form-item>
+          </el-col>
+        </el-row>
+        <el-row :gutter="20" class="el-row" type="flex">
+          <el-col :span="12" class="el-col">
+            <el-form-item label="是否展示" prop="columnType">
+              <el-select v-model="subData.isShow" placeholder="请选择是否展示" style="width: 80%">
+                <el-option label="显示" value="1" />
+                <el-option label="隐藏" value="2" />
+              </el-select>
+            </el-form-item>
+          </el-col>
+        </el-row>
+       <el-row :gutter="20" class="el-row" type="flex">
+         <el-col :span="12" class="el-col">
+           <el-form-item label="列描述" prop="columnDesc" class="query-form-item">
+             <el-input v-model="subData.columnDesc" style="width: 80%" placeholder="请输入列描述"
+               auto-complete="off"></el-input>
+           </el-form-item>
+         </el-col>
+       </el-row>
+        <el-row :gutter="20" class="el-row" type="flex">
+          <el-col :span="12" class="el-col">
+            <el-form-item label="列类型" prop="columnType">
+              <el-select v-model="subData.columnType" placeholder="请选择列类型" style="width: 80%">
+                <el-option label="序号" value="id" />
+                <el-option label="复选框" value="selection" />
+                <el-option label="单选框" value="radio" />
+                <el-option label="字典" value="laber" />
+                <el-option label="el-tag" value="eltag" />
+                <el-option label="按钮" value="button" />
+                <el-option label="默认" value="text" />
+
+              </el-select>
+            </el-form-item>
+          </el-col>
+        </el-row>
+        <el-row :gutter="20" class="el-row" type="flex">
+          <el-col :span="12" class="el-col">
+            <el-form-item label="排序" prop="number" class="query-form-item">
+              <el-input v-model="subData.number" style="width: 80%" placeholder="请输入排序"
+                        auto-complete="off"></el-input>
+              <div style="color: red">数字越大字段排在越前面</div>
+            </el-form-item>
+          </el-col>
+
+        </el-row>
+        <el-row :gutter="20" class="el-row" type="flex">
+          <el-col :span="12" class="el-col">
+            <el-form-item label="宽度" prop="width" class="query-form-item">
+              <el-input v-model="subData.width" style="width: 80%" placeholder="请输入宽度"
+                        auto-complete="off"></el-input>
+            </el-form-item>
+          </el-col>
+
+        </el-row>
+        <el-row :gutter="20" class="el-row" type="flex">
+          <el-col :span="12" class="el-col">
+            <el-form-item
+              label="字段是否可以排序"
+              prop="sort"
+              class="query-form-item"
+            >
+              <el-radio-group v-model="subData.sort">
+                <el-radio :label="true">是</el-radio>
+                <el-radio :label="false">否</el-radio>
+              </el-radio-group>
+            </el-form-item>
+          </el-col>
+
+        </el-row>
+        <el-row :gutter="20" class="el-row" type="flex">
+          <el-col :span="12" class="el-col">
+            <el-form-item
+              label="是否缩略"
+              prop="tooltip"
+              class="query-form-item"
+            >
+              <el-radio-group v-model="subData.tooltip">
+                <el-radio :label="true">是</el-radio>
+                <el-radio :label="false">否</el-radio>
+              </el-radio-group>
+            </el-form-item>
+          </el-col>
+
+        </el-row>
+        <el-row :gutter="20" class="el-row" type="flex">
+          <el-col :span="20" class="el-col">
+            <el-form-item label="字典替换规则" class="query-form-item">
+              <div style="display:flex" :key="i" v-for="(item, i) in conditionForm.lableList">
+                <el-form-item label="值" :prop="'lableList.' + i + '.value'" >
+                  <el-input  type="input" v-model="item.value" placeholder="请输入值"></el-input>
+                </el-form-item>
+                <el-form-item label="中文名" :prop="'lableList.' + i + '.name'">
+                  <el-input  type="input" v-model="item.name" placeholder="请输入中文名"></el-input>
+                </el-form-item>
+                <i v-if="i === 0" @click="addLableList" style="font-size:20px;color:#25c4fe;margin:8px 0 0 10px;" class="el-icon-circle-plus"></i>
+                <i  @click="deleteLableList(i)" style="font-size:20px;color:#25c4fe;margin:8px 0 0 10px;" class="el-icon-remove"></i>
+              </div>
+            </el-form-item>
+          </el-col>
+
+        </el-row>
+        <el-row :gutter="20" class="el-row" type="flex">
+          <el-col :span="20" class="el-col">
+            <el-form-item label="颜色规则"  class="query-form-item">
+              <div style="display:flex" :key="i" v-for="(item, i) in conditionForm.colorList">
+                <el-form-item label="判断条件" :prop="'colorList.' + i + '.type'">
+                  <el-select clearable v-model="item.type" placeholder="请选择判断条件">
+                    <el-option label="默认" value="0" />
+                    <el-option label="大于" value=">" />
+                    <el-option label="大于等于" value=">=" />
+                    <el-option label="小于" value="<" />
+                    <el-option label="小于等于" value="<=" />
+                    <el-option label="等于" value="=" />
+                  </el-select>
+                </el-form-item>
+                <el-form-item label="值" :prop="'colorList.' + i + '.value'" >
+                  <el-input  type="input" v-model="item.value" placeholder="请输入值"></el-input>
+                </el-form-item>
+                <el-form-item label="颜色" :prop="'colorList.' + i + '.color'">
+                  <el-input  type="input" v-model="item.color" placeholder="请输入颜色"></el-input>
+                </el-form-item>
+                <i v-if="i === 0" @click="addColorList" style="font-size:20px;color:#25c4fe;margin:8px 0 0 10px;" class="el-icon-circle-plus"></i>
+                <i @click="deleteColorList(i)" style="font-size:20px;color:#25c4fe;margin:8px 0 0 10px;" class="el-icon-remove"></i>
+              </div>
+            </el-form-item>
+          </el-col>
+
+        </el-row>
+        <el-row :gutter="20" class="el-row" type="flex">
+          <el-col :span="20" class="el-col">
+            <el-form-item label="按钮规则"  class="query-form-item">
+              <div style="display:flex" :key="i" v-for="(item, i) in conditionForm.buttonList">
+                <el-form-item label-width="50px" label="类型" :prop="'buttonList.' + i + '.type'">
+                  <el-select clearable  style="width: 120px;" v-model="item.type" placeholder="请选择类型">
+                    <el-option label="文本" value="text" />
+                  </el-select>
+                </el-form-item>
+                <el-form-item label-width="50px" label="大小" :prop="'buttonList.' + i + '.size'" >
+                  <el-select clearable style="width: 120px;" v-model="item.size" placeholder="请选择大小">
+                    <el-option label="medium" value="medium" />
+                    <el-option label="mini" value="mini" />
+                    <el-option label="small" value="small" />
+                  </el-select>
+                </el-form-item>
+                <el-form-item label-width="50px" label="名称" :prop="'buttonList.' + i + '.name'">
+                  <el-input  type="input" style="width: 120px;" v-model="item.name" placeholder="请输入名称"></el-input>
+                </el-form-item>
+                <el-form-item label-width="50px" label="样式" :prop="'buttonList.' + i + '.style'">
+                  <el-input  type="input" style="width: 120px;" v-model="item.style" placeholder="请输入样式"></el-input>
+                </el-form-item>
+                <el-form-item label-width="70px" label="禁用判断方法" :prop="'buttonList.' + i + '.disabledFuc'">
+                  <el-input  type="input" style="width: 120px;" v-model="item.disabledFuc" placeholder="请输入禁用判断方法"></el-input>
+                </el-form-item>
+                <el-form-item label-width="70px" label="点击方法" :prop="'buttonList.' + i + '.clickFuc'">
+                  <el-input  type="input" style="width: 120px;" v-model="item.clickFuc" placeholder="请输入点击方法"></el-input>
+                </el-form-item>
+                <i v-if="i === 0" @click="addButtonList" style="font-size:20px;color:#25c4fe;margin:8px 0 0 10px;" class="el-icon-circle-plus"></i>
+                <i @click="deleteButtonList(i)" style="font-size:20px;color:#25c4fe;margin:8px 0 0 10px;" class="el-icon-remove"></i>
+              </div>
+            </el-form-item>
+          </el-col>
+        </el-row>
+        <el-row :gutter="20" class="el-row" type="flex">
+          <el-col :span="12" class="el-col">
+            <el-form-item label="点击事件" prop="clickFuc" class="query-form-item">
+              <el-input v-model="subData.clickFuc" style="width: 80%" placeholder="请输入点击事件"
+                        auto-complete="off"></el-input>
+              <div style="color: red">目前只支持复选框配置</div>
+            </el-form-item>
+          </el-col>
+
+        </el-row>
+      </el-form>
+      <div slot="footer" class="dialog-footer">
+        <el-button @click.native="hideForm">取消</el-button>
+        <el-button type="primary" @click.native="forSubmit()">提交
+        </el-button>
+      </div>
+    </el-dialog>
+  </div>
+</template>
+
+<script>
+  import {
+    list,
+    saveCustomConfig,
+    devCustomConfig
+  } from "@/api/system/sysCustomConfigDetail";
+  import "@riophae/vue-treeselect/dist/vue-treeselect.css";
+  import Treeselect from "@riophae/vue-treeselect";
+  import {
+    isBlank
+  } from "@/utils/strUtil";
+
+  export default {
+    name: "info",
+    props: {
+      info: {
+        type: Object,
+        required: true
+      },
+      type: {
+        type: String,
+        required: true
+      }
+    },
+    data() {
+      return {
+        //---------------仓库相关-------------------
+        query: {
+          columnName: null,
+          configId: this.info.configId,
+          type: this.type,
+        },
+        loading: true,
+        list: [],
+        formName: null,
+        formMap: {
+          add: "配置界面详细-新增",
+          edit: "配置界面详细--编辑",
+        },
+        conditionForm: {
+          lableList: [{
+            name: '',
+            value: ''
+          }],
+          colorList: [{
+            type: '',
+            value: '',
+            color: ''
+          }],
+          buttonList: [{
+            type: '',
+            size: '',
+            style: '',
+            name: '',
+            clickFuc: ''
+          }]
+        },
+        formVisible: false,
+        subData: {},
+        formRules: {
+          columnName: [{ required: true, message: "请输入列名", trigger: "blur" }],
+          columnDesc: [
+            { required: true, message: "请输入列名", trigger: "blur" },
+          ],
+          columnType: [
+            { required: true, message: "请选择类型", trigger: "blur" },
+          ],
+        },
+        isExpandAll: true,
+        total: 0,
+        typeMap: {
+          1: "列表",
+          2: "表单",
+        },
+        upUerMap:{
+          true: "是",
+          false: "否",
+        },
+        columnTypeMap: {
+          "id": "序号",
+          "selection": "复选框",
+          "radio": "单选框",
+          "laber": "字典",
+          "eltag":"el-tag",
+          "button":"按钮",
+          "text":"默认",
+        },
+        isShowMap: {
+          "1": "显示",
+          "2": "隐藏",
+        },
+      };
+    },
+    watch: {
+      info: function () {
+        this.getList();
+      },
+    },
+    methods: {
+      //----------------仓库相关-----------------
+      /* 重置按钮  点击事件 */
+      onReset() {
+        this.$router.push({
+          path: "",
+        });
+        this.query = {
+           configId: this.info.configId,
+          type: this.type,
+          columnName: "",
+        };
+        this.getList();
+      },
+      /* 查询按钮点击事件 */
+      onSubmit() {
+        this.getList();
+      },
+      getList() {
+        if (isBlank(this.info.configId)) {
+          return;
+        }
+        this.query.configId=this.info.configId;
+        this.query.type=this.type;
+        this.loading = true;
+        this.list = [];
+        list(this.query)
+          .then((response) => {
+            this.loading = false;
+            this.list = response.data.list || [];
+            this.total = response.data.total || 0;
+          })
+          .catch(() => {
+            this.loading = false;
+            this.total = 0;
+            this.list = [];
+          });
+      },
+      /* 新增 编辑点击事件 */
+      handleSubForm(data, formName) {
+        if (isBlank(this.info.configId)) {
+          this.$message.warning("请先选择配置！");
+          return;
+        }
+        this.formName = formName;
+        this.subData = JSON.parse(JSON.stringify(data));
+        this.subData.configId = this.info.configId,
+          this.subData.type = this.type;
+        this.formVisible = true;
+        if("edit" == formName){
+           const colorRule =  this.subData.colorRule;
+           var colorList = [{type: '', value: '', color: ''}]
+           if(colorRule){
+              var arr = colorRule.split("|");
+              var colorList = []
+              arr.forEach(obj =>{
+                var arrTemp = obj.split(",");
+                colorList.push({
+                  type: arrTemp[0],
+                  value: arrTemp[1],
+                  color: arrTemp[2],
+                })
+             })
+           }
+          this.conditionForm.colorList = colorList;
+
+          const lableRule =  this.subData.lableRule;
+
+          var lableList = [{name: '', value: ''}]
+          if(lableRule){
+            var jsonObj = JSON.parse(lableRule);
+            var lableList = []
+            for(var index in jsonObj){
+              lableList.push({
+                name: jsonObj[index],
+                value: index,
+              })
+            }
+          }
+          this.conditionForm.lableList = lableList;
+
+          const buttonRule =  this.subData.buttonRule;
+          var buttonList = [{type: '', size: '', style: '', name: '', clickFuc: '', disabledFuc: ''}]
+          if(buttonRule){
+            var jsonArr = JSON.parse(buttonRule);
+            var buttonList = []
+            jsonArr.forEach(obj =>{
+              buttonList.push({
+                type: obj.type,
+                size: obj.size,
+                style: obj.style,
+                name: obj.name,
+                clickFuc: obj.clickFuc,
+                  disabledFuc: obj.disabledFuc
+              })
+            })
+          }
+          this.conditionForm.buttonList = buttonList;
+        }
+      },
+
+      /* 删除按钮点击事件 */
+      handleDel(row) {
+        if (row.id) {
+          this.$confirm("确认删除该配置吗?", "提示", {
+              type: "warning",
+            })
+            .then(() => {
+              this.deleteLoading = true;
+              let para = {
+                id: row.id
+              };
+              devCustomConfig(para)
+                .then((response) => {
+                  this.deleteLoading = false;
+                  if (response.code !== 20000) {
+                    this.$message.error(response.message);
+                    return false;
+                  }
+                  this.getList();
+                  this.$message.success("删除成功");
+                })
+                .catch(() => {
+                  this.deleteLoading = false;
+                });
+            })
+            .catch(() => {
+              this.$message.info("取消删除");
+            });
+        }
+      },
+
+      hideForm() {
+        // 新增，编辑---取消
+        this.formVisible = false;
+        this.resetForm();
+        return true;
+      },
+      // 刷新表单
+      resetForm() {
+        if (this.$refs["dataForm"]) {
+          // 清空验证信息表单
+          this.$refs["dataForm"].clearValidate();
+          // 刷新表单
+          this.$refs["dataForm"].resetFields();
+          this.getList();
+        }
+      },
+      forSubmit() {
+        var colorRule = "";
+        this.conditionForm.colorList.forEach(obj => {
+            if(obj.type != "" && obj.value != ""  && obj.color != "" ){
+              colorRule += obj.type+","+obj.value+","+obj.color+"|"
+            }
+        })
+        this.subData.colorRule = "";
+        if(colorRule != ""){
+          this.subData.colorRule = colorRule.substring(0, colorRule.length-1);
+        }
+
+        var lableRule = {};
+        this.conditionForm.lableList.forEach(obj => {
+          if(obj.name != "" && obj.value != ""){
+            lableRule[`${obj.value}`] = obj.name;
+          }
+        })
+        this.subData.lableRule = "";
+        if(JSON.stringify(lableRule) != "{}"){
+          this.subData.lableRule = JSON.stringify(lableRule);
+        }
+
+        var buttonRule = [];
+        this.conditionForm.buttonList.forEach(obj => {
+          if(obj.type != "" && obj.name != "" && obj.clickFuc != ""){
+            buttonRule.push({
+              type: obj.type,
+              size: obj.size,
+              style: obj.style,
+              name: obj.name,
+              clickFuc: obj.clickFuc,
+                disabledFuc: obj.disabledFuc
+            })
+          }
+        })
+        this.subData.buttonRule = "";
+        if(buttonRule.length > 0){
+          this.subData.buttonRule = JSON.stringify(buttonRule);
+        }
+
+        // 新增，编辑---提交
+        this.$refs["dataForm"].validate((valid) => {
+          if (valid) {
+            saveCustomConfig(this.subData, this.formName)
+              .then((response) => {
+                this.formVisible = false;
+                if (response.code == 20000) {
+                  this.getList();
+                } else {
+                  this.$message.error(response.message);
+                }
+              })
+              .catch(() => {
+                this.formVisible = false;
+              });
+          }
+        });
+      },
+      // 新增
+      addLableList () {
+        this.conditionForm.lableList.push({
+          name: '',
+          value: ''
+        })
+      },
+      // 删除
+      deleteLableList (index) {
+        this.conditionForm.lableList.splice(index, 1)
+      },
+      // 新增
+      addColorList () {
+        this.conditionForm.colorList.push({
+          type: '',
+          value: '',
+          color: ''
+        })
+      },
+      // 删除
+      deleteColorList (index) {
+        this.conditionForm.colorList.splice(index, 1)
+      },
+      // 新增
+      addButtonList () {
+        this.conditionForm.buttonList.push({
+          type: '',
+          size: '',
+          style: '',
+          name: '',
+          clickFuc: ''
+        })
+      },
+      // 删除
+      deleteButtonList (index) {
+        this.conditionForm.buttonList.splice(index, 1)
+      },
+    },
+  };
+</script>

src/views/system/customConfig/configFromDetail.vue

@@ -0,0 +1,478 @@
+<template>
+  <!-- 系统管理 组织架构 仓库信息页面 -->
+  <div>
+    <el-card>
+      <el-form :inline="true" :model="query" class="query-form" size="mini">
+        <el-form-item class="query-form-item" label="列名:">
+          <el-input v-model="query.columnName" clearable placeholder="列名"></el-input>
+        </el-form-item>
+        <el-form-item>
+          <el-button-group style="margin-left: 10px; display: flex">
+            <el-button type="primary" icon="el-icon-refresh" @click="onReset">重置</el-button>
+            <el-button type="primary" icon="el-icon-search" @click="onSubmit">查询</el-button>
+            <el-button type="primary" icon="el-icon-plus" @click="handleSubForm({}, 'add')">新增</el-button>
+          </el-button-group>
+        </el-form-item>
+      </el-form>
+      <el-table :data="list" border highlight-current-row  row-key="id"
+        style="width: 100%">
+        <el-table-column label="序号" type="index" ref="dataForm"></el-table-column>
+        <el-table-column prop="columnName" label="列名"> </el-table-column>
+        <el-table-column prop="isShow" label="是否展示">
+          <template slot-scope="scope">
+            <span>{{ isShowMap[scope.row.isShow] }}</span>
+          </template>
+        </el-table-column>
+        <el-table-column prop="columnDesc" label="列描述"></el-table-column>
+        <el-table-column prop="columnType" label="列类型">
+          <template slot-scope="scope">
+            <span>{{ columnTypeMap[scope.row.columnType] }}</span>
+          </template>
+        </el-table-column>
+        <el-table-column prop="lineNumber" label="行号"></el-table-column>
+        <el-table-column prop="number" label="排序"></el-table-column>
+        <el-table-column prop="width" label="col-span"></el-table-column>
+        <el-table-column prop="size" label="组件尺寸"></el-table-column>
+        <el-table-column prop="style" label="样式"></el-table-column>
+        <el-table-column label="是否禁用" prop="disabled">
+          <template slot-scope="scope">
+            <span>{{ upUerMap[scope.row.disabled] }}</span>
+          </template>
+        </el-table-column>
+        <el-table-column prop="lableRule" show-overflow-tooltip="true" label="字典替换规则"></el-table-column>
+        <el-table-column prop="checkRules" show-overflow-tooltip="true" label="验证规则"></el-table-column>
+        <el-table-column prop="inputType" label="input类型"></el-table-column>
+        <el-table-column prop="clickFuc" label="内容改变事件"></el-table-column>
+        <el-table-column label="操作">
+          <template slot-scope="scope">
+           <el-button
+             type="text"
+              @click.native="handleSubForm(scope.row, 'edit')"
+              >编辑
+              </el-button>
+              <el-button type="text" @click.native="handleDel(scope.row)">删除
+              </el-button>
+          </template>
+        </el-table-column>
+      </el-table>
+    </el-card>
+
+    <!--仓库编辑对话框-->
+    <el-dialog :title="formMap[formName]" :close-on-click-modal="false"
+      :close-on-press-escape="false" :visible.sync="formVisible" :before-close="hideForm" width="60%" top="5vh">
+      <el-form :model="subData" ref="dataForm" :rules="formRules" label-width="130px">
+        <el-row :gutter="20" class="el-row" type="flex">
+          <el-col :span="12" class="el-col">
+            <el-form-item label="列名" prop="columnName" class="query-form-item">
+              <el-input v-model="subData.columnName" style="width: 80%" placeholder="请输入业列名"
+                auto-complete="off"></el-input>
+            </el-form-item>
+          </el-col>
+        </el-row>
+        <el-row :gutter="20" class="el-row" type="flex">
+          <el-col :span="12" class="el-col">
+            <el-form-item label="是否展示" prop="columnType">
+              <el-select v-model="subData.isShow" placeholder="请选择是否展示" style="width: 80%">
+                <el-option label="显示" value="1" />
+                <el-option label="隐藏" value="2" />
+              </el-select>
+            </el-form-item>
+          </el-col>
+        </el-row>
+       <el-row :gutter="20" class="el-row" type="flex">
+         <el-col :span="12" class="el-col">
+           <el-form-item label="列描述" prop="columnDesc" class="query-form-item">
+             <el-input v-model="subData.columnDesc" style="width: 80%" placeholder="请输入列描述"
+               auto-complete="off"></el-input>
+           </el-form-item>
+         </el-col>
+       </el-row>
+        <el-row :gutter="20" class="el-row" type="flex">
+          <el-col :span="12" class="el-col">
+            <el-form-item label="列类型" prop="columnType">
+              <el-select v-model="subData.columnType" placeholder="请选择列类型" style="width: 80%">
+                <el-option label="表单" value="input" />
+                <el-option label="下拉框" value="select" />
+                <el-option label="单选框" value="radio" />
+                <el-option label="下拉框自定义" value="selectCustom" />
+                <el-option label="树状自定以" value="treeCustom" />
+                <el-option label="时间选择" value="date" />
+              </el-select>
+            </el-form-item>
+          </el-col>
+        </el-row>
+        <el-row :gutter="20" class="el-row" type="flex">
+          <el-col :span="12" class="el-col">
+            <el-form-item label="行号" prop="lineNumber" class="query-form-item">
+              <el-input v-model="subData.lineNumber" style="width: 80%" placeholder="请输入行号"
+                        auto-complete="off"></el-input>
+            </el-form-item>
+          </el-col>
+        </el-row>
+        <el-row :gutter="20" class="el-row" type="flex">
+          <el-col :span="12" class="el-col">
+            <el-form-item label="排序" prop="number" class="query-form-item">
+              <el-input v-model="subData.number" style="width: 80%" placeholder="请输入排序"
+                        auto-complete="off"></el-input>
+              <div style="color: red">数字越大字段排在越前面</div>
+            </el-form-item>
+          </el-col>
+
+        </el-row>
+        <el-row :gutter="20" class="el-row" type="flex">
+          <el-col :span="12" class="el-col">
+            <el-form-item label="col-span" prop="width" class="query-form-item">
+              <el-input v-model="subData.width" style="width: 80%" placeholder="请输入col-span"
+                        auto-complete="off"></el-input>
+            </el-form-item>
+          </el-col>
+
+        </el-row>
+        <el-row :gutter="20" class="el-row" type="flex">
+          <el-col :span="12" class="el-col">
+            <el-form-item label="组件尺寸" prop="size">
+              <el-select v-model="subData.size" placeholder="请选择组件尺寸" style="width: 80%">
+                <el-option label="medium" value="medium" />
+                <el-option label="small" value="small" />
+                <el-option label="mini" value="mini" />
+              </el-select>
+            </el-form-item>
+          </el-col>
+        </el-row>
+        <el-row :gutter="20" class="el-row" type="flex">
+          <el-col :span="12" class="el-col">
+            <el-form-item label="样式" prop="style" class="query-form-item">
+              <el-input v-model="subData.style" style="width: 80%" placeholder="请输入样式"
+                        auto-complete="off"></el-input>
+            </el-form-item>
+          </el-col>
+
+        </el-row>
+        <el-row :gutter="20" class="el-row" type="flex">
+          <el-col :span="12" class="el-col">
+            <el-form-item label="input类型" prop="size">
+              <el-select v-model="subData.size" placeholder="请选择input类型" style="width: 80%">
+                <el-option label="text" value="text" />
+                <el-option label="number" value="number" />
+                <el-option label="textarea" value="textarea" />
+              </el-select>
+            </el-form-item>
+          </el-col>
+        </el-row>
+        <el-row :gutter="20" class="el-row" type="flex">
+          <el-col :span="12" class="el-col">
+            <el-form-item label="验证规则" prop="checkRules">
+              <el-input v-model="subData.checkRules" type="textarea" style="width: 80%" placeholder="请输入验证规则"
+                        auto-complete="off"></el-input>
+            </el-form-item>
+          </el-col>
+        </el-row>
+        <el-row :gutter="20" class="el-row" type="flex">
+          <el-col :span="12" class="el-col">
+            <el-form-item
+              label="是否禁用"
+              prop="disabled"
+              class="query-form-item"
+            >
+              <el-radio-group v-model="subData.disabled">
+                <el-radio :label="true">是</el-radio>
+                <el-radio :label="false">否</el-radio>
+              </el-radio-group>
+            </el-form-item>
+          </el-col>
+
+        </el-row>
+        <el-row :gutter="20" class="el-row" type="flex">
+          <el-col :span="12" class="el-col">
+            <el-form-item label="内容改变事件" prop="clickFuc" class="query-form-item">
+              <el-input v-model="subData.clickFuc" style="width: 80%" placeholder="请输入内容改变事件"
+                        auto-complete="off"></el-input>
+            </el-form-item>
+          </el-col>
+
+        </el-row>
+        <el-row :gutter="20" class="el-row" type="flex">
+          <el-col :span="20" class="el-col">
+            <el-form-item label="字典替换规则" class="query-form-item">
+              <div style="display:flex" :key="i" v-for="(item, i) in conditionForm.lableList">
+                <el-form-item label="值" :prop="'lableList.' + i + '.value'" >
+                  <el-input  type="input" v-model="item.value" placeholder="请输入值"></el-input>
+                </el-form-item>
+                <el-form-item label="中文名" :prop="'lableList.' + i + '.name'">
+                  <el-input  type="input" v-model="item.name" placeholder="请输入中文名"></el-input>
+                </el-form-item>
+                <i v-if="i === 0" @click="addLableList" style="font-size:20px;color:#25c4fe;margin:8px 0 0 10px;" class="el-icon-circle-plus"></i>
+                <i  @click="deleteLableList(i)" style="font-size:20px;color:#25c4fe;margin:8px 0 0 10px;" class="el-icon-remove"></i>
+              </div>
+            </el-form-item>
+          </el-col>
+
+        </el-row>
+
+      </el-form>
+      <div slot="footer" class="dialog-footer">
+        <el-button @click.native="hideForm">取消</el-button>
+        <el-button type="primary" @click.native="forSubmit()">提交
+        </el-button>
+      </div>
+    </el-dialog>
+  </div>
+</template>
+
+<script>
+  import {
+    list,
+    saveCustomConfig,
+    devCustomConfig
+  } from "@/api/system/sysCustomConfigDetail";
+  import "@riophae/vue-treeselect/dist/vue-treeselect.css";
+  import Treeselect from "@riophae/vue-treeselect";
+  import {
+    isBlank
+  } from "@/utils/strUtil";
+
+  export default {
+    name: "info",
+    props: {
+      info: {
+        type: Object,
+        required: true
+      },
+      type: {
+        type: String,
+        required: true
+      }
+    },
+    data() {
+      return {
+        //---------------仓库相关-------------------
+        query: {
+          columnName: null,
+          configId: this.info.configId,
+          type: this.type,
+        },
+        loading: true,
+        list: [],
+        formName: null,
+        formMap: {
+          add: "配置界面详细-新增",
+          edit: "配置界面详细--编辑",
+        },
+        conditionForm: {
+          lableList: [{
+            name: '',
+            value: ''
+          }],
+          colorList: [{
+            type: '',
+            value: '',
+            color: ''
+          }],
+          buttonList: [{
+            type: '',
+            size: '',
+            style: '',
+            name: '',
+            clickFuc: ''
+          }]
+        },
+        formVisible: false,
+        subData: {},
+        formRules: {
+          columnName: [{ required: true, message: "请输入列名", trigger: "blur" }],
+          columnDesc: [
+            { required: true, message: "请输入列名", trigger: "blur" },
+          ],
+          columnType: [
+            { required: true, message: "请选择类型", trigger: "blur" },
+          ],
+        },
+        isExpandAll: true,
+        total: 0,
+        typeMap: {
+          1: "列表",
+          2: "表单",
+        },
+        upUerMap:{
+          true: "是",
+          false: "否",
+        },
+        isShowMap: {
+          "1": "显示",
+          "2": "隐藏",
+        },
+        columnTypeMap: {
+          "input": "输入框",
+          "radio": "单选框",
+          "select": "下拉框",
+          "selectCustom": "下拉框自定义",
+          "date":"时间选择",
+          "treeCustom":"树状自定义",
+        },
+      };
+    },
+    watch: {
+      info: function () {
+        this.getList();
+      },
+    },
+    methods: {
+      //----------------仓库相关-----------------
+      /* 重置按钮  点击事件 */
+      onReset() {
+        this.$router.push({
+          path: "",
+        });
+        this.query = {
+           configId: this.info.configId,
+          type: this.type,
+          columnName: "",
+        };
+        this.getList();
+      },
+      /* 查询按钮点击事件 */
+      onSubmit() {
+        this.getList();
+      },
+      getList() {
+        if (isBlank(this.info.configId)) {
+          return;
+        }
+        this.query.configId=this.info.configId;
+        this.query.type=this.type;
+        this.loading = true;
+        this.list = [];
+        list(this.query)
+          .then((response) => {
+            this.loading = false;
+            this.list = response.data.list || [];
+            this.total = response.data.total || 0;
+          })
+          .catch(() => {
+            this.loading = false;
+            this.total = 0;
+            this.list = [];
+          });
+      },
+      /* 新增 编辑点击事件 */
+      handleSubForm(data, formName) {
+        if (isBlank(this.info.configId)) {
+          this.$message.warning("请先选择配置！");
+          return;
+        }
+        this.formName = formName;
+        this.subData = JSON.parse(JSON.stringify(data));
+        this.subData.configId = this.info.configId;
+        this.subData.type = this.type;
+        this.formVisible = true;
+        if("edit" == formName){
+
+        }
+      },
+
+      /* 删除按钮点击事件 */
+      handleDel(row) {
+        if (row.id) {
+          this.$confirm("确认删除该配置吗?", "提示", {
+              type: "warning",
+            })
+            .then(() => {
+              this.deleteLoading = true;
+              let para = {
+                id: row.id
+              };
+              devCustomConfig(para)
+                .then((response) => {
+                  this.deleteLoading = false;
+                  if (response.code !== 20000) {
+                    this.$message.error(response.message);
+                    return false;
+                  }
+                  this.getList();
+                  this.$message.success("删除成功");
+                })
+                .catch(() => {
+                  this.deleteLoading = false;
+                });
+            })
+            .catch(() => {
+              this.$message.info("取消删除");
+            });
+        }
+      },
+
+      hideForm() {
+        // 新增，编辑---取消
+        this.formVisible = false;
+        this.resetForm();
+        return true;
+      },
+      // 刷新表单
+      resetForm() {
+        if (this.$refs["dataForm"]) {
+          // 清空验证信息表单
+          this.$refs["dataForm"].clearValidate();
+          // 刷新表单
+          this.$refs["dataForm"].resetFields();
+          this.getList();
+        }
+      },
+      forSubmit() {
+        // 新增，编辑---提交
+        this.$refs["dataForm"].validate((valid) => {
+          if (valid) {
+            saveCustomConfig(this.subData, this.formName)
+              .then((response) => {
+                this.formVisible = false;
+                if (response.code == 20000) {
+                  this.getList();
+                } else {
+                  this.$message.error(response.message);
+                }
+              })
+              .catch(() => {
+                this.formVisible = false;
+              });
+          }
+        });
+      },
+      // 新增
+      addLableList () {
+        this.conditionForm.lableList.push({
+          name: '',
+          value: ''
+        })
+      },
+      // 删除
+      deleteLableList (index) {
+        this.conditionForm.lableList.splice(index, 1)
+      },
+      // 新增
+      addColorList () {
+        this.conditionForm.colorList.push({
+          type: '',
+          value: '',
+          color: ''
+        })
+      },
+      // 删除
+      deleteColorList (index) {
+        this.conditionForm.colorList.splice(index, 1)
+      },
+      // 新增
+      addButtonList () {
+        this.conditionForm.buttonList.push({
+          type: '',
+          size: '',
+          style: '',
+          name: '',
+          clickFuc: ''
+        })
+      },
+      // 删除
+      deleteButtonList (index) {
+        this.conditionForm.buttonList.splice(index, 1)
+      },
+    },
+  };
+</script>

src/views/system/customConfig/configQueryDetail.vue

@@ -0,0 +1,436 @@
+<template>
+  <!-- 系统管理 组织架构 仓库信息页面 -->
+  <div>
+    <el-card>
+      <el-form :inline="true" :model="query" class="query-form" size="mini">
+        <el-form-item class="query-form-item" label="列名:">
+          <el-input v-model="query.columnName" clearable placeholder="列名"></el-input>
+        </el-form-item>
+        <el-form-item>
+          <el-button-group style="margin-left: 10px; display: flex">
+            <el-button type="primary" icon="el-icon-refresh" @click="onReset">重置</el-button>
+            <el-button type="primary" icon="el-icon-search" @click="onSubmit">查询</el-button>
+            <el-button type="primary" icon="el-icon-plus" @click="handleSubForm({}, 'add')">新增</el-button>
+          </el-button-group>
+        </el-form-item>
+      </el-form>
+      <el-table :data="list" border highlight-current-row  row-key="id"
+        style="width: 100%">
+        <el-table-column label="序号" type="index" ref="dataForm"></el-table-column>
+        <el-table-column prop="columnName" label="列名"> </el-table-column>
+        <el-table-column prop="isShow" label="是否展示">
+          <template slot-scope="scope">
+            <span>{{ isShowMap[scope.row.isShow] }}</span>
+          </template>
+        </el-table-column>
+        <el-table-column prop="columnDesc" label="列描述"></el-table-column>
+        <el-table-column prop="columnType" label="列类型">
+          <template slot-scope="scope">
+            <span>{{ columnTypeMap[scope.row.columnType] }}</span>
+          </template>
+        </el-table-column>
+        <el-table-column prop="number" label="排序"></el-table-column>
+         <el-table-column prop="width" label="宽度"></el-table-column>
+           <el-table-column prop="lableRule" show-overflow-tooltip="true" label="字典替换规则"></el-table-column>
+        <el-table-column prop="clickFuc" label="事件"></el-table-column>
+          <el-table-column prop="disabledFuc" label="禁用方法"></el-table-column>
+        <el-table-column label="操作">
+          <template slot-scope="scope">
+           <el-button
+             type="text"
+              @click.native="handleSubForm(scope.row, 'edit')"
+              >编辑
+              </el-button>
+              <el-button type="text" @click.native="handleDel(scope.row)">删除
+              </el-button>
+          </template>
+        </el-table-column>
+      </el-table>
+    </el-card>
+
+    <!--仓库编辑对话框-->
+    <el-dialog :title="formMap[formName]" :close-on-click-modal="false"
+      :close-on-press-escape="false" :visible.sync="formVisible" :before-close="hideForm" width="60%" top="5vh">
+      <el-form :model="subData" ref="dataForm" :rules="formRules" label-width="130px">
+        <el-row :gutter="20" class="el-row" type="flex">
+          <el-col :span="12" class="el-col">
+            <el-form-item label="列名" prop="columnName" class="query-form-item">
+              <el-input v-model="subData.columnName" style="width: 80%" placeholder="请输入业列名"
+                auto-complete="off"></el-input>
+            </el-form-item>
+          </el-col>
+        </el-row>
+        <el-row :gutter="20" class="el-row" type="flex">
+          <el-col :span="12" class="el-col">
+            <el-form-item label="是否展示" prop="columnType">
+              <el-select v-model="subData.isShow" placeholder="请选择是否展示" style="width: 80%">
+                <el-option label="显示" value="1" />
+                <el-option label="隐藏" value="2" />
+              </el-select>
+            </el-form-item>
+          </el-col>
+        </el-row>
+       <el-row :gutter="20" class="el-row" type="flex">
+         <el-col :span="12" class="el-col">
+           <el-form-item label="列描述" prop="columnDesc" class="query-form-item">
+             <el-input v-model="subData.columnDesc" style="width: 80%" placeholder="请输入列描述"
+               auto-complete="off"></el-input>
+           </el-form-item>
+         </el-col>
+       </el-row>
+        <el-row :gutter="20" class="el-row" type="flex">
+          <el-col :span="12" class="el-col">
+            <el-form-item label="列类型" prop="columnType">
+              <el-select v-model="subData.columnType" placeholder="请选择列类型" style="width: 80%">
+                <el-option label="输入框" value="input" />
+                 <el-option label="下拉框" value="select" />
+                 <el-option label="远程搜索" value="selectServer" />
+                  <el-option label="区间时间选择框" value="datePicker" />
+                   <el-option label="单时间选择框" value="data" />
+              </el-select>
+            </el-form-item>
+          </el-col>
+        </el-row>
+        <el-row :gutter="20" class="el-row" type="flex">
+          <el-col :span="12" class="el-col">
+            <el-form-item label="排序" prop="number" class="query-form-item">
+              <el-input v-model="subData.number" style="width: 80%" placeholder="请输入排序"
+                        auto-complete="off"></el-input>
+              <div style="color: red">数字越大字段排在越前面</div>
+            </el-form-item>
+          </el-col>
+        </el-row>
+        <el-row :gutter="20" class="el-row" type="flex">
+          <el-col :span="12" class="el-col">
+            <el-form-item label="宽度" prop="width" class="query-form-item">
+              <el-input v-model="subData.width" style="width: 80%" placeholder="请输入宽度"
+                        auto-complete="off"></el-input>
+            </el-form-item>
+          </el-col>
+
+        </el-row>
+        <el-row :gutter="20" class="el-row" type="flex">
+          <el-col :span="20" class="el-col">
+            <el-form-item label="字典替换规则"  class="query-form-item">
+              <div style="display:flex" :key="i" v-for="(item, i) in conditionForm.lableList">
+                <el-form-item label="值" :prop="'lableList.' + i + '.value'" >
+                  <el-input  type="input" v-model="item.value" placeholder="请输入值"></el-input>
+                </el-form-item>
+                <el-form-item label="中文名" :prop="'lableList.' + i + '.name'">
+                  <el-input  type="input" v-model="item.name" placeholder="请输入中文名"></el-input>
+                </el-form-item>
+                <i v-if="i === 0" @click="addLableList" style="font-size:20px;color:#25c4fe;margin:8px 0 0 10px;" class="el-icon-circle-plus"></i>
+                <i  @click="deleteLableList(i)" style="font-size:20px;color:#25c4fe;margin:8px 0 0 10px;" class="el-icon-remove"></i>
+              </div>
+            </el-form-item>
+          </el-col>
+
+        </el-row>
+        <el-row :gutter="20" class="el-row" type="flex">
+          <el-col :span="12" class="el-col">
+            <el-form-item label="事件" prop="clickFuc" class="query-form-item">
+              <el-input v-model="subData.clickFuc" style="width: 80%" placeholder="请输入事件"
+                        auto-complete="off"></el-input>
+            </el-form-item>
+          </el-col>
+
+        </el-row>
+        <el-row :gutter="20" class="el-row" type="flex">
+          <el-col :span="12" class="el-col">
+            <el-form-item label="禁用方法" prop="clickFuc" class="query-form-item">
+              <el-input v-model="subData.disabledFuc" style="width: 80%" placeholder="请输入禁用方法"
+                        auto-complete="off"></el-input>
+            </el-form-item>
+          </el-col>
+        
+        </el-row>
+      </el-form>
+      <div slot="footer" class="dialog-footer">
+        <el-button @click.native="hideForm">取消</el-button>
+        <el-button type="primary" @click.native="forSubmit()">提交
+        </el-button>
+      </div>
+    </el-dialog>
+  </div>
+</template>
+
+<script>
+  import {
+    list,
+    saveCustomConfig,
+    devCustomConfig
+  } from "@/api/system/sysCustomConfigDetail";
+  import "@riophae/vue-treeselect/dist/vue-treeselect.css";
+  import Treeselect from "@riophae/vue-treeselect";
+  import {
+    isBlank
+  } from "@/utils/strUtil";
+
+  export default {
+    name: "info",
+    props: {
+      info: {
+        type: Object,
+        required: true
+      },
+      type: {
+        type: String,
+        required: true
+      }
+    },
+    data() {
+      return {
+        //---------------仓库相关-------------------
+        query: {
+          columnName: null,
+          configId: this.info.configId,
+          type: this.type,
+        },
+        loading: true,
+        list: [],
+        formName: null,
+        formMap: {
+          add: "配置界面详细-新增",
+          edit: "配置界面详细--编辑",
+        },
+        conditionForm: {
+          lableList: [{
+            name: '',
+            value: ''
+          }],
+          colorList: [{
+            type: '',
+            value: '',
+            color: ''
+          }],
+          buttonList: [{
+            type: '',
+            size: '',
+            style: '',
+            name: '',
+            clickFuc: ''
+          }]
+        },
+        formVisible: false,
+        subData: {},
+        formRules: {
+          columnName: [{ required: true, message: "请输入列名", trigger: "blur" }],
+          columnDesc: [
+            { required: true, message: "请输入列名", trigger: "blur" },
+          ],
+          columnType: [
+            { required: true, message: "请选择类型", trigger: "blur" },
+          ],
+        },
+        isExpandAll: true,
+        total: 0,
+        typeMap: {
+          1: "列表",
+          2: "表单",
+        },
+        upUerMap:{
+          true: "是",
+          false: "否",
+        },
+        isShowMap: {
+          "1": "显示",
+          "2": "隐藏",
+        },
+        columnTypeMap: {
+          "input": "输入框",
+          "select": "下拉框",
+          "data": "单时间选择框",
+          "datePicker": "区间时间选择框",
+          "selectServer":"远程搜索",
+        },
+      };
+    },
+    watch: {
+      info: function () {
+        this.getList();
+      },
+    },
+    methods: {
+      //----------------仓库相关-----------------
+      /* 重置按钮  点击事件 */
+      onReset() {
+        this.$router.push({
+          path: "",
+        });
+        this.query = {
+           configId: this.info.configId,
+          type: this.type,
+          columnName: "",
+        };
+        this.getList();
+      },
+      /* 查询按钮点击事件 */
+      onSubmit() {
+        this.getList();
+      },
+      getList() {
+        if (isBlank(this.info.configId)) {
+          return;
+        }
+        this.query.configId=this.info.configId;
+        this.query.type=this.type;
+        this.loading = true;
+        this.list = [];
+        list(this.query)
+          .then((response) => {
+            this.loading = false;
+            this.list = response.data.list || [];
+            this.total = response.data.total || 0;
+          })
+          .catch(() => {
+            this.loading = false;
+            this.total = 0;
+            this.list = [];
+          });
+      },
+      /* 新增 编辑点击事件 */
+      handleSubForm(data, formName) {
+        if (isBlank(this.info.configId)) {
+          this.$message.warning("请先选择配置！");
+          return;
+        }
+        this.formName = formName;
+        this.subData = JSON.parse(JSON.stringify(data));
+        this.subData.configId = this.info.configId,
+          this.subData.type = this.type;
+        this.formVisible = true;
+        if("edit" == formName){
+          const lableRule =  this.subData.lableRule;
+          var lableList = [{name: '', value: ''}]
+          if(lableRule){
+            var jsonObj = JSON.parse(lableRule);
+            var lableList = []
+            for(var index in jsonObj){
+              lableList.push({
+                name: jsonObj[index],
+                value: index,
+              })
+            }
+          }
+          this.conditionForm.lableList = lableList;
+        }
+      },
+
+      /* 删除按钮点击事件 */
+      handleDel(row) {
+        if (row.id) {
+          this.$confirm("确认删除该配置吗?", "提示", {
+              type: "warning",
+            })
+            .then(() => {
+              this.deleteLoading = true;
+              let para = {
+                id: row.id
+              };
+              devCustomConfig(para)
+                .then((response) => {
+                  this.deleteLoading = false;
+                  if (response.code !== 20000) {
+                    this.$message.error(response.message);
+                    return false;
+                  }
+                  this.getList();
+                  this.$message.success("删除成功");
+                })
+                .catch(() => {
+                  this.deleteLoading = false;
+                });
+            })
+            .catch(() => {
+              this.$message.info("取消删除");
+            });
+        }
+      },
+
+      hideForm() {
+        // 新增，编辑---取消
+        this.formVisible = false;
+        this.resetForm();
+        return true;
+      },
+      // 刷新表单
+      resetForm() {
+        if (this.$refs["dataForm"]) {
+          // 清空验证信息表单
+          this.$refs["dataForm"].clearValidate();
+          // 刷新表单
+          this.$refs["dataForm"].resetFields();
+          this.getList();
+        }
+      },
+      forSubmit() {
+        var lableRule = {};
+        this.conditionForm.lableList.forEach(obj => {
+          if(obj.name != ""){
+            lableRule[`${obj.value}`] = obj.name;
+          }
+        })
+        this.subData.lableRule = "";
+        if(JSON.stringify(lableRule) != "{}"){
+          this.subData.lableRule = JSON.stringify(lableRule);
+        }
+
+
+        // 新增，编辑---提交
+        this.$refs["dataForm"].validate((valid) => {
+          if (valid) {
+            saveCustomConfig(this.subData, this.formName)
+              .then((response) => {
+                this.formVisible = false;
+                if (response.code == 20000) {
+                  this.getList();
+                } else {
+                  this.$message.error(response.message);
+                }
+              })
+              .catch(() => {
+                this.formVisible = false;
+              });
+          }
+        });
+      },
+      // 新增
+      addLableList () {
+        this.conditionForm.lableList.push({
+          name: '',
+          value: ''
+        })
+      },
+      // 删除
+      deleteLableList (index) {
+        this.conditionForm.lableList.splice(index, 1)
+      },
+      // 新增
+      addColorList () {
+        this.conditionForm.colorList.push({
+          type: '',
+          value: '',
+          color: ''
+        })
+      },
+      // 删除
+      deleteColorList (index) {
+        this.conditionForm.colorList.splice(index, 1)
+      },
+      // 新增
+      addButtonList () {
+        this.conditionForm.buttonList.push({
+          type: '',
+          size: '',
+          style: '',
+          name: '',
+          clickFuc: ''
+        })
+      },
+      // 删除
+      deleteButtonList (index) {
+        this.conditionForm.buttonList.splice(index, 1)
+      },
+    },
+  };
+</script>

src/views/system/customConfig/index.vue

@@ -0,0 +1,307 @@
+<template>
+  <!-- 系统管理 组织架构 仓库信息页面 -->
+  <div>
+    <el-card>
+      <el-form :inline="true" :model="query" class="query-form" size="mini">
+        <el-form-item class="query-form-item" label="业务标识:">
+          <el-input v-model="query.businessType" clearable placeholder="业务标识"></el-input>
+        </el-form-item>
+        <el-form-item label="表单类型:" prop="type">
+          <el-select v-model="query.type" placeholder="请选择类型" style="width: 90%">
+            <el-option label="列表" :value="1" />
+            <el-option label="表单" :value="2" />
+          </el-select>
+        </el-form-item>
+        <el-form-item>
+          <el-button-group style="margin-left: 10px; display: flex">
+            <el-button type="primary" icon="el-icon-refresh" @click="onReset">重置</el-button>
+            <el-button type="primary" icon="el-icon-search" @click="onSubmit">查询</el-button>
+            <el-button type="primary" icon="el-icon-plus" @click="handleSubForm({}, 'add')">新增</el-button>
+          </el-button-group>
+        </el-form-item>
+      </el-form>
+      <el-table :data="list" border highlight-current-row
+          @current-change="handSubCurrentChange"
+       row-key="id"
+        style="width: 100%">
+        <el-table-column label="序号" type="index" ref="dataForm"></el-table-column>
+        <el-table-column prop="businessType" label="业务标识"> </el-table-column>
+        <el-table-column prop="remark" label="备注"> </el-table-column>
+        <el-table-column prop="type" label="类型">
+          <template slot-scope="scope">
+            <span>{{ typeMap[scope.row.type] }}</span>
+          </template>
+        </el-table-column>
+        <el-table-column prop="handleChangeFuc" label="列表点击方法"> </el-table-column>
+        <el-table-column label="操作" width="220">
+          <template slot-scope="scope">
+           <el-button
+             type="text"
+              @click.native="handleSubForm(scope.row, 'edit')"
+              >编辑
+              </el-button>
+              <el-button type="text" @click.native="handleDel(scope.row)">删除
+              </el-button>
+          </template>
+        </el-table-column>
+      </el-table>
+    </el-card>
+
+    <!--仓库编辑对话框-->
+    <el-dialog :title="formMap[formName]" :close-on-click-modal="false"
+      :close-on-press-escape="false" :visible.sync="formVisible" :before-close="hideForm" width="60%" top="5vh">
+      <el-form :model="subData" ref="dataForm" :rules="formRules" label-width="130px">
+        <el-row :gutter="20" class="el-row" type="flex">
+          <el-col :span="12" class="el-col">
+            <el-form-item label="业务标识" prop="businessType" class="query-form-item">
+              <el-input v-model="subData.businessType" style="width: 80%" placeholder="请输入业务标识"
+                auto-complete="off"></el-input>
+            </el-form-item>
+          </el-col>
+        </el-row>
+        <el-row :gutter="20" class="el-row" type="flex">
+          <el-col :span="12" class="el-col">
+            <el-form-item label="描述" prop="remark" class="query-form-item">
+              <el-input v-model="subData.remark" style="width: 80%" placeholder="请输入描述"
+                        auto-complete="off"></el-input>
+            </el-form-item>
+          </el-col>
+        </el-row>
+        <el-row :gutter="20" class="el-row" type="flex">
+          <el-col :span="12" class="el-col">
+            <el-form-item label="类型" prop="type">
+              <el-select v-model="subData.type" placeholder="请选择类型" style="width: 80%">
+                <el-option label="列表" value="1" />
+                <el-option label="表单" value="2" />
+              </el-select>
+            </el-form-item>
+          </el-col>
+        </el-row>
+        <el-row :gutter="20" class="el-row" type="flex">
+          <el-col :span="12" class="el-col">
+            <el-form-item label="列表点击方法" prop="handleChangeFuc" class="query-form-item">
+              <el-input v-model="subData.handleChangeFuc" style="width: 80%" placeholder="请输入列表点击方法"
+                        auto-complete="off"></el-input>
+            </el-form-item>
+          </el-col>
+        </el-row>
+
+      </el-form>
+      <div slot="footer" class="dialog-footer">
+        <el-button @click.native="hideForm">取消</el-button>
+        <el-button type="primary" @click.native="forSubmit()">提交
+        </el-button>
+      </div>
+    </el-dialog>
+
+    <el-tabs type="border-card" style="margin: 15px">
+      <el-tab-pane>
+        <span slot="label">自定义列-详细配置</span>
+
+        <config-detail
+          :info="configParms"
+          :type ="1"
+        ></config-detail>
+      </el-tab-pane>
+      <el-tab-pane>
+        <span slot="label">自定义查询框-详细配置</span>
+        <config-query-detail
+          :info="configParms"
+          :type ="2"
+        ></config-query-detail>
+      </el-tab-pane>
+
+      <el-tab-pane>
+        <span slot="label">自定义表单-详细配置</span>
+        <config-from-detail
+          :info="configParms"
+          :type ="3">
+        </config-from-detail>
+      </el-tab-pane>
+    </el-tabs>
+  </div>
+</template>
+
+<script>
+  import {
+    list,
+    saveCustomConfig,
+    devCustomConfig
+  } from "@/api/system/sysCustomConfig";
+  import "@riophae/vue-treeselect/dist/vue-treeselect.css";
+  import configDetail from "@/views/system/customConfig/configDetail";
+  import configFromDetail from "@/views/system/customConfig/configFromDetail";
+  import configQueryDetail from "@/views/system/customConfig/configQueryDetail";
+  import {
+    isBlank
+  } from "@/utils/strUtil";
+
+  export default {
+    data() {
+      return {
+        //---------------仓库相关-------------------
+        query: {
+          name: null,
+          type: null,
+        },
+        loading: true,
+        list: [],
+        formName: null,
+        formMap: {
+          add: "配置界面信息-新增",
+          edit: "配置界面信息-编辑",
+        },
+        configParms: {
+          configId:null,
+        },
+        formVisible: false,
+        subData: {},
+        formRules: {
+          businessType: [{ required: true, message: "请输入业务标识", trigger: "blur" }],
+          type: [
+            { required: true, message: "请选择类型", trigger: "blur" },
+          ],
+        },
+        isExpandAll: true,
+        total: 0,
+        typeMap: {
+          1: "列表",
+          2: "表单",
+        },
+      };
+    },
+    methods: {
+      //----------------仓库相关-----------------
+      /* 重置按钮  点击事件 */
+      onReset() {
+        this.$router.push({
+          path: "",
+        });
+        this.query = {
+          name: "",
+          type: "",
+        };
+        this.getList();
+
+        this.configParms = {
+          configId:null
+        };
+      },
+      /* 查询按钮点击事件 */
+      onSubmit() {
+        this.getList();
+      },
+
+      handSubCurrentChange(row) {
+        //加载货位信息
+        this.configDetail(row);
+
+      },
+      configDetail(row) {
+        this.configParms = {
+          configId: row.id,
+          page:1
+        };
+      },
+      getList() {
+        //获取仓库信息
+        this.loading = true;
+        this.list = [];
+        list(this.query)
+          .then((response) => {
+            this.loading = false;
+            this.list = response.data.list || [];
+            this.total = response.data.total || 0;
+          })
+          .catch(() => {
+            this.loading = false;
+            this.total = 0;
+            this.list = [];
+          });
+      },
+      /* 新增 编辑点击事件 */
+      handleSubForm(data, formName) {
+        this.formName = formName;
+        this.subData = JSON.parse(JSON.stringify(data));
+        this.formVisible = true;
+
+      },
+
+      /* 删除按钮点击事件 */
+      handleDel(row) {
+        if (row.id) {
+          this.$confirm("确认删除该配置吗?", "提示", {
+              type: "warning",
+            })
+            .then(() => {
+              this.deleteLoading = true;
+              let para = {
+                id: row.id
+              };
+              devCustomConfig(para)
+                .then((response) => {
+                  this.deleteLoading = false;
+                  if (response.code !== 20000) {
+                    this.$message.error(response.message);
+                    return false;
+                  }
+                  this.getList();
+                  this.$message.success("删除成功");
+                })
+                .catch(() => {
+                  this.deleteLoading = false;
+                });
+            })
+            .catch(() => {
+              this.$message.info("取消删除");
+            });
+        }
+      },
+
+      hideForm() {
+        // 新增，编辑---取消
+        this.formVisible = false;
+        this.resetForm();
+        return true;
+      },
+      // 刷新表单
+      resetForm() {
+        if (this.$refs["dataForm"]) {
+          // 清空验证信息表单
+          this.$refs["dataForm"].clearValidate();
+          // 刷新表单
+          this.$refs["dataForm"].resetFields();
+          this.getList();
+        }
+      },
+      forSubmit() {
+        // 新增，编辑---提交
+        this.$refs["dataForm"].validate((valid) => {
+          if (valid) {
+            saveCustomConfig(this.subData, this.formName)
+              .then((response) => {
+                this.formVisible = false;
+                if (response.code == 20000) {
+                  this.getList();
+                } else {
+                  this.$message.error(response.message);
+                }
+              })
+              .catch(() => {
+                this.formVisible = false;
+              });
+          }
+        });
+      },
+    },
+    mounted() {},
+    components: {
+      configDetail,
+      configFromDetail,
+      configQueryDetail,
+    },
+    created() {
+      this.getList();
+    },
+  };
+</script>