物料变更单重构

src/components/popover-select/components/MANUFACTURER_PARAM.js

@@ -0,0 +1,15 @@
+// 生产厂家
+export default [
+  {
+    key: "code",
+    title: "编码",
+    type: "Input",
+    search: true,
+  },
+  {
+    key: "name",
+    title: "名称",
+    type: "Input",
+    search: true,
+  },
+];

src/components/popover-select/components/MATERIAL_PARAM.js

@@ -45,4 +45,52 @@ export default [
       return prop.materialMedcine.isDrug == "0" ? "Y" : "N";
     },
   },
+  {
+    key: "isDrugNumber",
+    title: "药品",
+    type: "ComputedInput",
+    formatter: (prop) => {
+      return prop.materialMedcine.isDrug;
+    },
+  },
+  {
+    key: "oriRegistrationNo",
+    title: "注册证号/备案凭证编号",
+    type: "ComputedInput",
+    formatter: (prop) => {
+      return prop.materialMedcine.oriRegistrationNo;
+    },
+  },
+  {
+    key: "dosageFrom",
+    title: "剂型",
+    type: "ComputedInput",
+    formatter: (prop) => {
+      return prop.materialMedcine.dosageFrom;
+    },
+  },
+  {
+    key: "dosageFromName",
+    title: "剂型名称",
+    type: "ComputedInput",
+    formatter: (prop) => {
+      return prop.materialMedcine.dosageFromName;
+    },
+  },
+  {
+    key: "curingType",
+    title: "养护类型",
+    type: "ComputedInput",
+    formatter: (prop) => {
+      return prop.materialMedcine.curingType;
+    },
+  },
+  {
+    key: "medicalInstruments",
+    title: "医疗器械",
+    type: "ComputedInput",
+    formatter: (prop) => {
+      return prop.materialMedcine.medicalInstruments;
+    },
+  },
 ];

src/components/popover-tree-select/index.vue

@@ -154,9 +154,9 @@ export default {
         $props: { source, valueKey, dataMapping },
       } = this;
       for (let key in dataMapping) {
-        source[key] = prop[dataMapping[key]];
+        source[key] = prop[0][dataMapping[key]];
       }
-      this.innerValue = prop[valueKey];
+      this.innerValue = prop[0][valueKey];
       this.$emit("update:source", source);
       this.$emit("change", prop, this.$props);
     },

src/components/super-table/index.vue

@@ -30,6 +30,8 @@ export default {
     ElComputedInput: () => import("@/components/computed-input/index.vue"),
     ElPopoverSelectV2: () => import("@/components/popover-select-v2/index.vue"),
     ElComputedInputV2: () => import("@/components/computed-input-v2/index.vue"),
+    ElPopoverTreeSelect: () =>
+      import("@/components/popover-tree-select/index.vue"),
   },
   data() {
     const { columns, stroage } = this.$props;
@@ -177,6 +179,14 @@ export default {
               >
               </component>
               <component
+                v-else-if="attr.is === 'el-popover-tree-select'"
+                v-bind="attr"
+                v-model="scope.row[item.key]"
+                :size="$attrs.size"
+                :source.sync="scope.row"
+              >
+              </component>
+              <component
                 v-else-if="attr.is === 'el-select'"
                 v-bind="attr"
                 v-model="scope.row[item.key]"

src/views/material/changeApply/batch/column.js

@@ -0,0 +1,399 @@
+export default function useColumns(){
+
+  const TableColumns = [
+    {
+      item:{
+        key:'code',
+        title:'单据编码',
+      },
+      attr:{
+        is: "el-input",
+        disabled:true,
+      },
+    },
+    {
+      item:{
+        key:'orgIdName',
+        title:'所属组织',
+      },
+      attr:{
+        is: "el-popover-select-v2",
+        valueKey: "name",
+        referName: "ORG_PARAM",
+        dataMapping: {
+          orgId:'id'
+        },
+        disabled:true,
+      },
+    },
+    {
+      item:{
+        key:'status',
+        title:'单据状态',
+      },
+      attr:{
+        is: "el-select",
+        dictName: "documents_status", // 字典名
+        disabled:true,
+      },
+    },
+    {
+      item:{
+        key:'createByName',
+        title:'申请人',
+      },
+      attr:{
+        is: "el-input",
+        disabled:true,
+      },
+      
+    },
+    {
+      item:{
+        key:'createTime',
+        title:'申请时间',
+      },
+      attr:{
+        is: "el-date-picker",
+        valueFormat: "yyyy-MM-dd",
+        disabled:true,
+      },
+  
+    },
+    {
+      item:{
+        key:'createByName',
+        title:'创建人',
+      },
+      attr:{
+        is: "el-input",
+        disabled:true,
+      },
+  
+    },
+    {
+      item:{
+        key:'createTime',
+        title:'创建时间',
+      },
+      attr:{
+        is: "el-date-picker",
+        valueFormat: "yyyy-MM-dd",
+        disabled:true,
+      },
+  
+    },
+    {
+      item:{
+        key:'updateByName',
+        title:'最后修改人',
+      },
+      attr:{
+        is: "el-input",
+        disabled:true,
+      },
+  
+    },
+    {
+      item:{
+        key:'updateTime',
+        title:'最后修改时间',
+      },
+      attr:{
+        is: "el-date-picker",
+        valueFormat: "yyyy-MM-dd",
+        disabled:true,
+      },
+  
+    },
+    
+  ].map(({ item, attr }) => ({
+    attr,
+    item: { ...item, hidden: true, span: item.span || 6 },
+  }));
+  
+  const TabColumns = [
+    {
+      item:{
+        key:'materialBasic',
+        title:'物料信息',
+      },
+      attr:{
+        value:[]
+      },
+      TableColumns:[
+        {
+          item:{
+            key:'materialCode',
+            title:'物料编码',
+            require: true,
+          },
+          attr:{
+            is: "el-input",
+            disabled:true,
+          },
+         
+        },
+        {
+          item:{
+            key:'materialName',
+            title:'物料名称',
+            require: true,
+          },
+          attr:{
+            is: "el-popover-select-v2",
+            valueKey: "name",
+            referName: "MATERIAL_PARAM",
+            dataMapping: {
+              materialId: "id",
+              materialCode: "code",
+              materialName: "name",
+              diCode:'diCode',
+              remark:'remark',
+              model: "model",
+              classifyId:'classifyId',
+              productionPermit:'productionPermit',
+              specification: "specification",
+              storageConditions:'storageCondition',
+              transportCondition:'transportationCondition',
+              medicineMaterial:'isMedicine',
+              factory:'manufacturerId',
+              factoryName:'manufacturerIdName',
+              registrant:'registrant',
+              oneClass:'oneClass',
+              twoClass:'twoClass',
+              threeClass:'threeClass',
+              fourClass:'fourClass',
+              drug:'isDrugNumber',
+              registrationNo:'oriRegistrationNo',
+              dosageFrom:'dosageFrom',
+              dosageFromName:'dosageFromName',
+              maintenanceType:'curingType',
+              medicalDevices:'medicalInstruments',
+            },
+
+          },
+         
+        },
+        {
+          item:{
+            key:'medicineMaterial',
+            title:'医药物料',
+          },
+          attr:{
+            is: "el-select",
+            dictName: "sys_number_yes_no", // 字典名
+          },
+         
+        },
+        {
+          item:{
+            key:'productionPermit',
+            title:'生产许可证',
+          },
+          attr:{
+            is: "el-input",
+          },
+          
+        },
+        {
+          item:{
+            key:'specification',
+            title:'规格',
+            require: true,
+          },
+          attr:{
+            is: "el-input",
+          },
+         
+        },
+        {
+          item:{
+            key:'model',
+            title:'型号',
+          },
+          attr:{
+            is: "el-input",
+          },
+         
+        },
+        {
+          item:{
+            key:'factoryName',
+            title:'生产厂家/代理人',
+            require: true,
+          },
+          attr:{
+            is: "el-popover-select-v2",
+            valueKey: "name",
+            referName: "MANUFACTURER_PARAM",
+            dataMapping: {
+              factory:'id'
+            }
+          },
+          
+        },
+        {
+          item:{
+            key:'registrant',
+            title:'注册人/上市许可持有人',
+            require: true,
+          },
+          attr:{
+            is: "el-input",
+          },
+         
+        },
+        {
+          item:{
+            key:'storageConditions',
+            title:'存储条件',
+            require: true,
+          },
+          attr:{
+            is: "el-select",
+            dictName: "sys_storage_condition", // 字典名
+          },
+          
+        },
+        {
+          item:{
+            key:'transportCondition',
+            title:'运输条件',
+          },
+          attr:{
+            is: "el-select",
+            dictName: "sys_conditions_carriage", // 字典名
+          },
+         
+        },
+        {
+          item:{
+            key:'diCode',
+            title:'DI码',
+          },
+          attr:{
+            is: "el-input",
+          },
+         
+        },
+        {
+          item:{
+            key:'remark',
+            title:'备注',
+          },
+          attr:{
+            is: "el-input",
+          },
+         
+        },
+        {
+          item:{
+            key:'oneClass',
+            title:'一级分类',
+          },
+          attr:{
+            is: "el-input",
+            disabled:true,
+          },
+          
+        },
+        {
+          item:{
+            key:'twoClass',
+            title:'二级分类',
+          },
+          attr:{
+            is: "el-input",
+            disabled:true,
+          },
+         
+        },
+        {
+          item:{
+            key:'threeClass',
+            title:'三级分类',
+          },
+          attr:{
+            is: "el-input",
+            disabled:true,
+          },
+          
+        },
+        {
+          item:{
+            key:'fourClass',
+            title:'四级分类',
+          },
+          attr:{
+            is: "el-input",
+            disabled:true,
+          },
+         
+        },
+        {
+          item:{
+            key:'drug',
+            title:'药品',
+          },
+          attr:{
+            is: "el-select",
+            dictName: "sys_medicine", // 字典名
+          },
+         
+        },
+        {
+          item:{
+            key:'registrationNo',
+            title:'注册证号/备案凭证编号',
+          },
+          attr:{
+            is: "el-input",
+          },
+         
+        },
+        {
+          item:{
+            key:'medicalDevices',
+            title:'医疗器械',
+          },
+          attr:{
+            is: "el-select",
+            dictName: "medical_instruments", // 字典名
+          },
+          
+        },
+        {
+          item:{
+            key:'maintenanceType',
+            title:'养护类型',
+          },
+          attr:{
+            is: "el-select",
+            dictName: "curing_type", // 字典名
+          },
+         
+        },
+        {
+          item:{
+            key:'dosageFromName',
+            title:'剂型',
+          },
+          attr:{
+            is: "el-popover-tree-select",
+            referName: "DOSAGEFORM_PARAM",
+            valueKey: "name",
+            dataMapping: {
+              dosageFrom:'id'
+            }
+          },
+          
+        },
+  
+      ]
+    }, 
+  ]
+
+  return {TableColumns,TabColumns}
+}
+

src/views/material/changeApply/batch/index.vue

@@ -0,0 +1,406 @@
+<!-- 批量新增 -->
+<script>
+import useColumns from "./column";
+import {addChangeList, getMaterialDetails, getChangeDetails, editChangeList} from '@/api/changeApply/basic';
+
+
+export default {
+  name: "AddChangeOrders",
+  props: {
+    dict: {
+      type: Object,
+    },
+    addType: {
+      type: String,
+      default: "add",
+    },
+  },
+  components: {
+    ElSuperForm: () => import("@/components/super-form/index.vue"),
+    ElSuperTable: () => import("@/components/super-table/index.vue"),
+    ElPopoverSelectV2: () => import("@/components/popover-select-v2/index.vue"),
+    ElPopoverTreeSelect: () =>
+      import("@/components/popover-tree-select/index.vue"),
+  },
+
+  data() {
+
+    const {
+      TabColumns,
+      TableColumns,
+      TabColumns: [
+        {
+          item: { key: tabName },
+        },
+      ],
+    } = useColumns();
+
+    const rules = this.$init.rules([...TabColumns, ...TableColumns]);
+    const params = this.$init.params([...TabColumns, ...TableColumns]);
+    return {
+      width: "100%",
+      visible: false,
+      loading:false,
+      rules,
+      params,
+      tabName: tabName,
+      TabColumns: TabColumns,
+      TableColumns: TableColumns,
+    };
+  },
+  computed: {
+    title: {
+      get() {
+        const { addType } = this;
+        if (addType === "add") {
+          return "新 增";
+        }
+        if (addType === "edit") {
+          return "编 辑";
+        }
+      },
+      set() {},
+    },
+    materialInfo:{
+      get(){
+        const { materialBasic } = this.params;
+        this.params.materialBasic = materialBasic.map((item, index) => ({
+          ...item,
+          $index: index,
+        }));
+
+        return {
+          materialBasic: this.params.materialBasic.filter(
+            ({ delFlag }) => delFlag !== "2"
+          ),
+        }
+      },
+      set(){},
+    }
+  
+  },
+  watch: {
+    
+  },
+  methods: {
+    setVisible(prop){
+      this.visible = prop;
+    },
+    beforeOpen(){
+      if(this.addType === 'add'){
+        this.params.orgIdName = '德荣集团';
+        this.useRowAdd(this.tabName);
+      }
+    },
+    //
+    changePuOrgName(prop) {
+      
+    },
+    //
+    changeMaterialName(prop) {
+     
+    },
+
+    //
+    async fetchItem(prop) {
+      try {
+        // try
+        this.loading = true;
+        
+      } catch (err) {
+        // catch
+        console.error(err);
+      } finally {
+        // finally
+        this.loading = false;
+      }
+    },
+    
+    //
+    async hide() {
+      const {
+        TabColumns,
+        TableColumns,
+        TabColumns: [
+          {
+            item: { key: tabName },
+          },
+        ],
+      } = useColumns();
+      this.visible = false;
+      this.tabName = tabName;
+      this.params = this.$init.params([...TabColumns, ...TableColumns]);
+    },
+    //
+    async useRowAdd(prop) {
+      
+      const { TableColumns } = this.TabColumns.find(
+        ({ item: { key } }) => key === prop
+      );
+      this.params[prop].push({
+        delFlag: "0",
+        classifyId:null,
+        ...this.$init.params(TableColumns),
+      });
+    },
+    //
+    async useRowRemove(prop, scope) {
+      const { addType } = this.$props;
+      const {
+        row: { $index },
+      } = scope;
+      if (addType === "add") {
+        this.params[prop].splice($index, 1);
+      }
+      if (addType === "edit") {
+        this.params[prop] = this.params[prop].map((item, index) => ({
+          ...item,
+          delFlag: index === $index ? "2" : item.delFlag,
+        }));
+      }
+    },
+    async amendantRecord(prop, scope){
+
+    },
+    handleSubmitValidate(prop,cb){
+
+      this.$refs[prop].$refs[prop].validate(async (valid) => {
+        if (valid) {
+          try {
+            this.loading = true;
+
+            await cb();
+            
+          } catch (err) {
+            // catch
+            console.error(err);
+          } finally {
+            // finally
+            this.loading = false;
+          }
+        } else {
+          return false;
+        }
+      });
+    },
+    //
+    async useSubmit(prop) {
+      console.log(this.params,'this.params');
+      this.handleSubmitValidate(prop,async()=>{
+
+        const {code} = await addChangeList(this.params);
+
+        if(code == 200){
+
+        }
+        // await;
+      })
+    },
+  },
+  created() {
+  },
+  mounted() {},
+  destroyed() {},
+};
+</script>
+
+<template>
+    <el-drawer
+      v-bind="$attrs"
+      v-on="$listeners"
+      :size="width"
+      :visible.sync="visible"
+      destroy-on-close
+      :show-close="false"
+      @close="hide"
+      @open="beforeOpen"
+      v-loading="loading"
+    >
+      <div 
+        slot="title" 
+        style="display: flex;
+            justify-content: space-between;
+            align-items: center;"
+      >
+        <h3>{{title}}</h3>
+        <div>
+          <el-button
+          type="primary"
+          :size="$attrs.size"
+          :loading="loading"
+          @click="useSubmit('superForm')"
+          >确 认</el-button
+        >
+        <el-button :size="$attrs.size" :loading="loading" @click="hide"
+          >取 消</el-button
+        >
+        </div>
+      </div>
+      <el-super-form
+        v-model="params"
+        :dict="dict"
+        :rules="rules"
+        :size="$attrs.size"
+        :columns="TableColumns"
+        ref="superForm"
+        label-width="auto"
+        label-position="right"
+        style="padding: 20px"
+      >
+        <template slot="puOrgName" slot-scope="scope">
+          <component
+            v-bind="scope.attr"
+            v-model="scope.row[scope.item.key]"
+            :size="$attrs.size"
+            :source.sync="scope.row"
+            @change="changePuOrgName({ ...scope, select: $event })"
+          >
+          </component
+        ></template>
+      </el-super-form>
+      
+    
+        <el-tabs v-model="tabName" style="padding: 0 20px 20px">
+          <el-tab-pane
+            v-for="({ item, TableColumns: columns }, index) in TabColumns"
+            :key="index"
+            :label="item.title"
+            :name="item.key"
+            lazy
+          >
+            <el-super-table
+              v-model="materialInfo[item.key]"
+              :dict="dict"
+              :ref="tabName"
+              :columns="columns"
+              :size="$attrs.size"
+            >
+              <template slot="materialName" slot-scope="scope">
+                <component
+                  v-bind="scope.attr"
+                  v-model="scope.row[scope.item.key]"
+                  :size="$attrs.size"
+                  :source.sync="scope.row"
+                  @change="changeMaterialName(scope)"
+                >
+                </component>
+              </template>
+              <!-- 判断是否禁用 -->
+              <template slot="drug" slot-scope="scope">
+                <component
+                  v-bind="scope.attr"
+                  v-model="scope.row[scope.item.key]"
+                  :size="$attrs.size"
+                  :source.sync="scope.row"
+                  :disabled="!(scope.row.medicineMaterial ==='0') "
+                >
+                <el-option
+                    v-for="item in dict.type[scope.attr.dictName]"
+                    :key="item.value"
+                    :label="item.label"
+                    :value="item.value"
+                  >
+                  </el-option>
+                </component>
+              </template>
+
+              <template slot="registrationNo" slot-scope="scope">
+                <component
+                  v-bind="scope.attr"
+                  v-model="scope.row[scope.item.key]"
+                  :size="$attrs.size"
+                  :source.sync="scope.row"
+                  :disabled="!(scope.row.medicineMaterial ==='0') "
+                  @change="changeMaterialName(scope)"
+                >
+                </component>
+              </template>
+
+              <template slot="medicalDevices" slot-scope="scope">
+                <component
+                  v-bind="scope.attr"
+                  v-model="scope.row[scope.item.key]"
+                  :size="$attrs.size"
+                  :source.sync="scope.row"
+                  :disabled="!(scope.row.medicineMaterial ==='0') "
+                >
+                <el-option
+                    v-for="item in dict.type[scope.attr.dictName]"
+                    :key="item.value"
+                    :label="item.label"
+                    :value="item.value"
+                  >
+                  </el-option>
+                </component>
+              </template>
+              <template slot="maintenanceType" slot-scope="scope">
+                <component
+                  v-bind="scope.attr"
+                  v-model="scope.row[scope.item.key]"
+                  :size="$attrs.size"
+                  :source.sync="scope.row"
+                  :disabled="!(scope.row.medicineMaterial ==='0') "
+                >
+                <el-option
+                    v-for="item in dict.type[scope.attr.dictName]"
+                    :key="item.value"
+                    :label="item.label"
+                    :value="item.value"
+                  >
+                  </el-option>
+                </component>
+              </template>
+              <template slot="dosageFromName" slot-scope="scope">
+                <component
+                  v-bind="scope.attr"
+                  v-model="scope.row[scope.item.key]"
+                  :size="$attrs.size"
+                  :source.sync="scope.row"
+                  :disabled="!(scope.row.medicineMaterial ==='0') "
+                >
+                </component>
+              </template>
+             
+  
+              <el-table-column fixed="right" label="操作" width="120" align="center">
+                <template slot="header" slot-scope="scope">
+                  <el-button
+                    type="text"
+                    :size="$attrs.size"
+                    @click="useRowAdd(tabName)"
+                  >
+                    增行
+                  </el-button>
+                </template>
+                <template slot-scope="scope">
+                  <el-button
+                    type="text"
+                    :size="$attrs.size"
+                    @click.native.prevent="useRowRemove(tabName, scope)"
+                  >
+                  删除
+                  </el-button>
+                  <el-button
+                    v-if=" tabName ==='materialBasic' "
+                    type="text"
+                    :size="$attrs.size"
+                    @click.native.prevent="amendantRecord(tabName, scope)"
+                  >
+                  修改记录
+                  </el-button>
+                </template>
+              </el-table-column>
+            </el-super-table>
+          </el-tab-pane>
+        </el-tabs>
+     
+    </el-drawer>
+</template>
+
+<style scoped>
+::v-deep .el-table__row.is-hidden {
+  display: none;
+}
+</style>
+
+

src/views/material/changeApply/columns.js

@@ -0,0 +1,67 @@
+export default function useColumns() {
+
+  const TableColumns = [
+    { item: { key: "orgId", title: "所属组织" }, attr: {} },
+    { item: { key: "code", title: "单据编码" }, attr: {} },
+    {
+      item: { key: "createTime", title: "申请时间" },
+      attr: { },
+    },
+    { item: { key: "status", title: "单据状态" }, 
+      attr: {
+        is: "el-select",
+        dictName: "documents_status", // 字典名
+      } 
+    },
+    { item: { key: "materialCode", title: "物料编码" }, attr: {} },
+    {
+      item: { key: "materialName", title: "物料名称" },
+      attr: {},
+    },
+    { item: { key: "approver", title: "最后审批人" }, attr: {} },
+    { item: { key: "approvalTime", title: "最后审核时间" }, attr: {} },
+    { item: { key: "createByName", title: "创建人" }, attr: {} },
+    { item: { key: "createTime", title: "创建时间" }, attr: {} },
+    {
+      item: { key: "updateByName", title: "最后修改人" },
+      attr: { is: "el-file-preview" },
+    },
+    { item: { key: "updateTime", title: "最后修改时间" }, attr: {} },
+   
+  ].map(({ item, attr }) => ({
+    attr,
+    item: { ...item, hidden: true, fixed: false },
+  }));
+
+  const SearchColumns = [
+    {
+      item: { key: "materialCode", title: "物料编码" },
+      attr: {
+        is: "el-input",
+        // referName: "SUPPLIER_PARAM",
+        // valueKey: "name",
+        // dataMapping: { supplier: "id", supplierName: "name" },
+      },
+    },
+    {
+      item: { key: "materialName", title: "物料名称" },
+      attr: {
+        is: "el-input",
+      },
+    },
+    {
+      item: { key: "status", title: "单据状态" },
+      attr: {
+        is: "el-select",
+        dictName: "documents_status",
+        clearable: true,
+      },
+    },
+  
+  ].map(({ item, attr }) => ({
+    attr,
+    item: { ...item, hidden: true, span: item.span || 6 },
+  }));
+
+  return { TableColumns, SearchColumns };
+}

src/views/material/changeApply/dicts.js

@@ -0,0 +1,14 @@
+import { initDicts } from "@/utils/init.js";
+const modules = require.context("./", true, /column.js$/);
+const columns = [];
+modules.keys().forEach((fileName) => {
+  const data = modules(fileName).default();
+  for (const key in data) {
+    if (key === "TabColumns") {
+      columns.push(...data[key].map((item) => item.TableColumns).flat());
+    } else {
+      columns.push(...data[key]);
+    }
+  }
+});
+export const dicts = initDicts(columns);

src/views/material/changeApply/index.vue

@@ -1,24 +1,17 @@
 <template>
   <div class="changeApply">
+
+    <AddChangeOrders
+      ref="addChangeOrders"
+      :size="size"
+      :dict="dict"
+      add-type="add"
+      @success="reset"
+    >
+    </AddChangeOrders>
     <div class="applyList" v-if="isList">
       <el-row :gutter="10" class="mb10">
-          <!-- <el-select size="small" v-model="textValue" placeholder="请选择">
-          <el-option
-            v-for="item in text"
-            :key="item.value"
-            :label="item.label"
-            :value="item.value">
-          </el-option>
-        </el-select>
-
-        <el-select size="small" v-model="ruleValue" placeholder="请选择">
-          <el-option
-            v-for="item in rule"
-            :key="item.value"
-            :label="item.label"
-            :value="item.value">
-          </el-option>
-        </el-select> -->
+          
         <el-col :span="1.5">
           <span style="font-size: 14px;margin-right: 5px;">物料编码</span>
           <el-input
@@ -69,88 +62,109 @@
         </el-col>
 
       </el-row>
+    
+      <el-row 
+        :gutter="10" 
+        class="mb10" 
+        type="flex" 
+        justify="end"
+      >
+        <el-col :span="1.5">
+          <el-button type="primary" size="small" @click="newAdd">新增</el-button>
+          
+        </el-col>
+      </el-row>
 
-    <el-row :gutter="10" class="mb10">
-      <el-col :span="1.5">
-        <el-button type="primary" size="small" plain @click="newAdd">新增</el-button>
-      </el-col>
-      <!-- <el-col :span="1.5">
-        <el-button type="primary" size="small" plain>导入</el-button>
-      </el-col>
-      <el-col :span="1.5">
-        <el-button type="primary" size="small" plain>导出</el-button>
-      </el-col> -->
-      <!-- <el-col :span="1.5">
-        <el-button type="primary" size="small" plain>批量提交</el-button>
-      </el-col>
-      <el-col :span="1.5">
-        <el-button type="primary" size="small" plain>批量删除</el-button>
-      </el-col> -->
-    </el-row>
+      <el-card>
 
-    <el-card>
-      <el-table 
-        :data="tableList" 
-        class="request-table"
-        fit
-        max-height="680"
-        @selection-change="handleSelectionChange"
-      >
-        <!-- <el-table-column type="selection" width="55" /> -->
-        <el-table-column label="序号" align="center" type="index" width="50" />
-        <el-table-column label="所属组织" align="center" width="200" prop="orgId" />
-        <el-table-column label="单据编码" align="center" width="200" prop="code" />
-        <el-table-column label="申请时间" align="center" width="150" prop="createTime" />
-        <el-table-column label="单据状态" align="center" prop="status" :formatter="statusJug" />
-        <el-table-column label="物料编码" align="center" width="150" prop="materialCode" />
-        <el-table-column label="物料名称" align="center" width="150" prop="materialName" />
-        <!-- <el-table-column label="最后审批人" align="center" width="120" prop="approver" />
-        <el-table-column label="最后审核时间" align="center" width="150" prop="approvalTime" /> -->
-        <el-table-column label="创建人" align="center" prop="createByName" />
-        <el-table-column label="创建时间" align="center" width="150" prop="createTime" />
-        <el-table-column label="最后修改人" align="center" width="120" prop="updateByName" />
-        <el-table-column label="最后修改时间" align="center" width="150" prop="updateTime" />
-        <el-table-column
-          fixed="right"
-          label="操作"
-          align="center"
-          width="150"
-          >
-          <template slot-scope="scope">
-            <el-button type="text" size="small" @click="check(scope.row)">查看</el-button>
-            <el-button @click="edit(scope.row)" v-if="scope.row.status == 0 || scope.row.status == 3" type="text" size="small">编辑</el-button>
-            <el-button type="text" size="small" @click="deleteRow(scope.row)" v-if="scope.row.status == 0 || scope.row.status == 3">删除</el-button>
-          </template>
-        </el-table-column>
-      </el-table>
+        <el-super-table
+          v-model="tableList"
+          :dict="dict"
+          :columns="TableColumns"
+          :size="'mini'"
+          stroage
+          hideOperationColumns
+          @selection-change="handleSelectionChange"
+        >
+          <el-table-column label="序号" align="center" type="index" width="50" />
+          <el-table-column fixed="right" label="操作" width="150" align="center">
+            <template slot-scope="scope">
+              <el-button type="text" size="small" @click="check(scope.row)">查看</el-button>
+              <el-button @click="edit(scope.row)" v-if="scope.row.status == 0 || scope.row.status == 3" type="text" size="small">编辑</el-button>
+              <el-button type="text" size="small" @click="deleteRow(scope.row)" v-if="scope.row.status == 0 || scope.row.status == 3">删除</el-button>
+            </template>
+          </el-table-column>
+        </el-super-table>
 
-      <el-pagination
-        @size-change="handleSizeChange"
-        @current-change="handleCurrentChange"
-        :page-sizes="[5, 10, 15, 20]"
-        :page-size=queryParams.pageSize
-        layout="total, sizes, prev, pager, next, jumper"
-        :total="total"
-        style="text-align: center;">
-      </el-pagination>
-    </el-card>
+        <!-- <el-table 
+          :data="tableList" 
+          class="request-table"
+          fit
+          height="480"
+          @selection-change="handleSelectionChange"
+        >
+          <el-table-column label="序号" align="center" type="index" width="50" />
+          <el-table-column label="所属组织" align="center" width="200" prop="orgId" />
+          <el-table-column label="单据编码" align="center" width="200" prop="code" />
+          <el-table-column label="申请时间" align="center" width="150" prop="createTime" />
+          <el-table-column label="单据状态" align="center" prop="status" :formatter="statusJug" />
+          <el-table-column label="物料编码" align="center" width="150" prop="materialCode" />
+          <el-table-column label="物料名称" align="center" width="150" prop="materialName" />
+          <el-table-column label="创建人" align="center" prop="createByName" />
+          <el-table-column label="创建时间" align="center" width="150" prop="createTime" />
+          <el-table-column label="最后修改人" align="center" width="120" prop="updateByName" />
+          <el-table-column label="最后修改时间" align="center" width="150" prop="updateTime" />
+          <el-table-column
+            fixed="right"
+            label="操作"
+            align="center"
+            width="150"
+            >
+            <template slot-scope="scope">
+              <el-button type="text" size="small" @click="check(scope.row)">查看</el-button>
+              <el-button @click="edit(scope.row)" v-if="scope.row.status == 0 || scope.row.status == 3" type="text" size="small">编辑</el-button>
+              <el-button type="text" size="small" @click="deleteRow(scope.row)" v-if="scope.row.status == 0 || scope.row.status == 3">删除</el-button>
+            </template>
+          </el-table-column>
+        </el-table>
+
+        <el-pagination
+          @size-change="handleSizeChange"
+          @current-change="handleCurrentChange"
+          :page-sizes="[10,20,50,100,500,1000]"
+          :page-size=queryParams.pageSize
+          layout="total, sizes, prev, pager, next, jumper"
+          :total="total"
+          style="text-align: right;margin-top: 10px;">
+        </el-pagination> -->
+      </el-card>
     </div>
 
+   
+
     <component :is="isComponent" v-model="isList" :pageStu="page" :disable="disable" :row="rowDetail" @refresh="getList" v-if="!isList"/>
   </div>
 </template>
 
 <script>
 import addApply from './add.vue';
-import { getChangeList , deleteChangeList} from '@/api/changeApply/basic'
+import { dicts } from "./dicts";
+import { getChangeList , deleteChangeList} from '@/api/changeApply/basic';
+import useColumns from './columns';
 export default {
   name: 'changeApply',
+  dicts:dicts,
   components: {
-    addApply
+    addApply,
+    AddChangeOrders:() => import('./batch/index.vue'),
+    ElSuperTable: () => import("@/components/super-table/index.vue"),
   },
   data() {
+    const {TableColumns} = useColumns();
     return{
       tableList: [],
+      size:'mini',
+      TableColumns:TableColumns,
       queryParams: {
         materialCode: '',
         materialName: '',
@@ -192,14 +206,19 @@ export default {
       this.getList(this.queryParams)
     },
     newAdd() {
-      this.isList = false
-      this.isComponent = 'addApply'
-      this.page = 'add'
-      this.disable = false
+    
+      const {setVisible} = this.$refs.addChangeOrders;
+
+      setVisible(true);
+      // this.isList = false
+      // this.isComponent = 'addApply'
+      // this.page = 'add'
+      // this.disable = false
     },
     getList(val) {
       console.log('val',val)
       getChangeList(val).then(res => {
+        console.log(res,'res----------------');
         if (res.code === 200) {
           this.tableList = res.rows
           this.total = res.total

vue.config.js

@@ -37,13 +37,13 @@ module.exports = {
       // detail: https://cli.vuejs.org/config/#devserver-proxy
       [process.env.VUE_APP_BASE_API]: {
         // target: `http://172.16.100.107:8080/drp-admin`, //测试
-       target: `http://test-sy.derom.com/drp-admin`, //测试
+      //  target: `http://test-sy.derom.com/drp-admin`, //测试
         // target: `http://release-sy.derom.com/drp-admin`, //预发
         // target: `http://sy.derom.com/drp-admin`, //生产
         // target: `http://172.16.63.202:8000/drp-admin`, // D本地
         // target: `http://172.16.62.241:8000/drp-admin`, //笑寒本地
         // target: `http://172.16.13.152:8000/drp-admin`, //豪哥本地
-        // target: `http://172.16.13.47:8000/drp-admin`, //这是一个美女的本地
+        target: `http://172.16.13.47:8000/drp-admin`, //这是一个美女的本地
         // target: `http://172.16.13.113:8000/drp-admin`, //DWT本地
 
         //  target: `http://127.0.0.1:8000/drp-admin`,