更新采购订单修订参照页面

src/views/purchase/purchase-order/add/column.js

@@ -1,4 +1,4 @@
-const columns = [
+export const Columns = [
   // { key: "id", title: "主键",type: "Input", },
   {
     key: "puOrg",
@@ -212,9 +212,9 @@ const columns = [
 
 ];
 
-export const initColumns = () => columns;
+// export const initColumns = () => columns;
 
-const tabColumns = [
+export const TabColumns = [
   {
     title: '物料信息',
     key: 'puOrderItemList',
@@ -328,4 +328,4 @@ const tabColumns = [
   },
 ];
 
-export const initTabColumns = () => tabColumns;
+// export const initTabColumns = () => tabColumns;

src/views/purchase/purchase-order/add/index.vue

@@ -1,195 +1,269 @@
 <script>
 import orderApi from "@/api/business/purchase/purchase-order";
 import { arr2obj } from "@/utils/data-transform";
-import {
-  initDicts,
-  initRules,
-  initParams,
-  initComponents,
-} from "@/utils/init";
-import { initColumns, initTabColumns } from "./column";
+import { initColumns, initDicts, initRules, initParams } from "@/utils/init";
+import { Columns, TabColumns } from "./column";
+// import {
+//   initDicts,
+//   initRules,
+//   initParams,
+//   initComponents,
+// } from "@/utils/init";
+// import { initColumns, initTabColumns } from "./column";
+
+const NewColumns = initColumns(Columns);
+const NewTabColumns = TabColumns.map((element) => ({
+  ...element,
+  tableColumns: initColumns(element.tableColumns),
+}));
 
 export default {
   name: "AddPurchaseContractDrawer",
-  components: initComponents(initColumns()),
-  dicts: initDicts(initColumns()),
+  dicts: initDicts(NewColumns),
+  components: {
+    DrInputDialog: () => import("@/views/input-dialog/index.vue"),
+  },
+
   data() {
     return {
       visible: false,
-      columns: initColumns(),
-      rules: initRules(initColumns()),
-      params: initParams(initColumns()),
-      tabColumns: initTabColumns(),
-      tabName: "puOrderItemList",
-      tabTableParams: {
+      columns: NewColumns,
+      rules: initRules(NewColumns),
+
+      params: {
+        ...initParams(NewColumns),
         puOrderItemList: [],
         puOrderExecuteList: [],
       },
-      currentComponent: { name: "", title: "", value: "", row: {}, source: {} },
+
+      tabColumns: NewTabColumns,
+
+      tabName: "puOrderItemList",
+      // tabTableParams: {
+      //   puOrderItemList: [],
+      //   puOrderExecuteList: [],
+      // },
+      // currentComponent: { name: "", title: "", value: "", row: {}, source: {} },
     };
   },
   computed: {},
   watch: {},
   methods: {
-    handleClick() { },
     beforeOpen() {
-      const { deptName, nickName, orgName } = this.$store.state.user;
-      this.params.puOrg = orgName;
-      this.params.buyer = nickName;
-      this.params.puDept = deptName;
+      const { deptName, deptId, name, id, orgName, orgId } =
+        this.$store.state.user;
+      this.params.puOrg = orgId;
+      this.params.puOrgName = orgName;
+      this.params.buyer = id;
+      this.params.buyerName = name;
+      this.params.puDept = deptId;
+      this.params.puDeptName = deptName;
     },
     setVisible(prop) {
       this.visible = prop;
     },
     addTableRow(prop) {
-      this.$notify.info({ message: prop });
-      this.tabTableParams[prop].push(
-        arr2obj(
-          initTabColumns().find((element) => element.key === prop).tableColumns,
-          "key",
-          ""
-        )
-      );
-      console.log(this.tabTableParams);
+      const arr = this.tabColumns.find(
+        (element) => element.key === this.tabName
+      ).tableColumns;
+      prop.push(initParams(arr, "key", "value"));
     },
-    cancel() {
-      this.setVisible(false);
-      this.params = arr2obj(this.columns, "key", "value");
+    delTableRow(prop, index) {
+      prop.splice(index, 1);
     },
-    sava() {
-      let data = {
-        ...this.params,
-        ...this.tabTableParams
-      }
-      console.log(data, 'data');
-      // this.setVisible(false);
+    // 取消
+    handleCancel() {
+      this.setVisible(false);
+      this.params = initParams(this.columns, "key", "value");
     },
-    async submitSava() {
-      console.log(this.params);
-      return;
+    // 保存
+    handleSava() {
+      this.setVisible(false);
     },
-    //
-    openAsyncInputDialog(prop, source, type) {
+    // 保存并新增
+    async handleSubmit() {
       try {
-        const {
-          key,
-          title,
-          config: { componentName },
-        } = prop;
-        this.currentComponent.row = prop;
-        this.currentComponent.title = title;
-        this.currentComponent.name = componentName;
-        this.currentComponent.source = source;
-        if (type === "change") {
-          this.currentComponent.value = this.params[key];
-        }
-        if (type === "click") {
-          this.currentComponent.value = "";
-        }
-        this.$nextTick(() => {
-          const { setVisible } = this.$refs[componentName];
-          setVisible(true);
+        const createById = this.params.buyer;
+        const createByName = this.params.buyerName;
+        const updateById = this.$store.state.user.id;
+        const updateByName = this.$store.state.user.name;
+        const { code, msg } = await add({
+          createById,
+          createByName,
+          updateById,
+          updateByName,
+          ...this.params,
         });
+        if (code === 200) {
+          this.$notify.success({ title: msg });
+          this.setVisible(false);
+        } else {
+          this.$notify.warning({ title: msg });
+        }
       } catch (err) {
         this.$notify.error({ title: "error", message: err });
       } finally {
-        console.log(this.currentComponent, source, this.tabTableParams);
-      }
-    },
-
-    updateParams(prop) {
-      const {
-        config: { dataMapping },
-      } = this.currentComponent.row;
-      for (let key in dataMapping) {
-        this.currentComponent.source[key] = prop[dataMapping[key]];
+        // this.setVisible(false);
       }
     },
   },
   created() {
-    // console.log("this,", initComponents(initColumns()));
+    console.log("ADD CREATED");
   },
-  mounted() { },
-  destroyed() { },
+  mounted() {},
+  destroyed() {},
 };
 </script>
 <template>
-  <el-drawer direction="btt" size="100%" :with-header="false" :visible.sync="visible" @open="beforeOpen">
-    <el-form size="mini" label-position="right" label-width="135px" :model="params" :rules="rules">
-      <el-card :body-style="{
-        padding: '20px',
-        display: 'flex',
-        'flex-wrap': 'wrap',
-      }" style="margin: 10px">
-        <div slot="header" style="
+  <el-drawer
+    direction="btt"
+    size="100%"
+    :with-header="false"
+    :visible.sync="visible"
+    @open="beforeOpen"
+    @close="$emit('close')"
+  >
+    <el-form
+      size="mini"
+      label-position="right"
+      label-width="135px"
+      :model="params"
+      :rules="rules"
+    >
+      <el-card
+        :body-style="{
+          padding: '20px',
+          display: 'flex',
+          'flex-wrap': 'wrap',
+        }"
+        style="margin: 10px"
+      >
+        <div
+          slot="header"
+          style="
             display: flex;
             justify-content: space-between;
             align-items: center;
-          ">
+          "
+        >
           <h3>新增</h3>
           <div style="text-align: right">
-            <el-button size="mini" @click="cancel">取消</el-button>
-            <el-button size="mini" type="danger" @click="sava">保存</el-button>
-            <el-button size="mini" type="info" @click="submitSava">
+            <el-button size="mini" @click="handleCancel">取消</el-button>
+            <el-button size="mini" type="danger" @click="handleSava"
+              >保存</el-button
+            >
+            <el-button size="mini" type="info" @click="handleSubmit">
               保存并新增
             </el-button>
           </div>
         </div>
-        <component v-if="currentComponent.name" :is="currentComponent.name" :ref="currentComponent.name"
-          :title="currentComponent.title" :value="currentComponent.value" @confirm="updateParams"></component>
         <el-row>
-          <el-col v-for="(column, index) in columns" :key="index" :span="column.span || 6">
+          <el-col
+            v-for="(column, index) in columns"
+            :key="index"
+            :span="column.span || 6"
+          >
             <el-form-item :prop="column.key" :label="column.title">
-
-              <el-input v-if="column.type === 'Input'" v-model="params[column.key]" :placeholder="column.placeholder"
-                :clearable="column.clearable" :disabled="column.disabled" style="width: 100%"></el-input>
-
-              <el-input v-if="column.type === 'InputDialog'" v-model="params[column.key]"
-                :placeholder="column.placeholder" :clearable="column.clearable" :disabled="column.disabled"
-                style="width: 100%" @blur="openAsyncInputDialog(column, params, 'change')"
-                @change="openAsyncInputDialog(column, params, 'change')">
-                <template #suffix>
-                  <el-icon class="el-icon-s-operation" style="cursor: pointer" @click.native.stop="
-                    openAsyncInputDialog(column, params, 'change')
-                    "></el-icon>
-                </template>
-              </el-input>
-
-              <el-input v-if="column.type === 'Textarea'" v-model="params[column.key]" type="textarea"
-                :placeholder="column.placeholder" :clearable="column.clearable" :disabled="column.disabled"
-                style="width: 100%"></el-input>
-
-              <el-checkbox v-if="column.type === 'Checkbox'" v-model="params[column.key]" true-label="Y"
-                false-label="N"></el-checkbox>
-
-              <el-input-number v-if="column.type === 'InputNumber'" v-model="params[column.key]"
-                :controls-position="column.config.controlsPosition" :placeholder="column.placeholder"
-                :clearable="column.clearable" :disabled="column.disabled" style="width: 100%"></el-input-number>
-
-              <el-select v-if="column.type === 'Select'" v-model="params[column.key]" :placeholder="column.placeholder"
-                :clearable="column.clearable" :disabled="column.disabled" style="width: 100%">
-                <el-option v-for="item in dict.type[column.config.optionsName]" :key="item.value" :label="item.label"
-                  :value="item.value">
+              <el-input
+                v-if="column.type === 'Input'"
+                v-model="params[column.key]"
+                :placeholder="column.placeholder"
+                :clearable="column.clearable"
+                :disabled="column.disabled"
+                style="width: 100%"
+              ></el-input>
+              <dr-input-dialog
+                v-if="column.type === 'InputDialog'"
+                v-model="params[column.key]"
+                :placeholder="column.placeholder"
+                :clearable="column.clearable"
+                :disabled="column.disabled"
+                :readonly="column.readonly"
+                :title="column.title"
+                :type="column.config.componentName"
+                :data-mapping="column.config.dataMapping"
+                :source.sync="params"
+              >
+              </dr-input-dialog>
+              <el-input
+                v-if="column.type === 'Textarea'"
+                v-model="params[column.key]"
+                type="textarea"
+                :placeholder="column.placeholder"
+                :clearable="column.clearable"
+                :disabled="column.disabled"
+                style="width: 100%"
+              ></el-input>
+              <el-input-number
+                v-if="column.type === 'InputNumber'"
+                v-model="params[column.key]"
+                :controls-position="column.config.controlsPosition"
+                :placeholder="column.placeholder"
+                :clearable="column.clearable"
+                :disabled="column.disabled"
+                style="width: 100%"
+              ></el-input-number>
+              <el-select
+                v-if="column.type === 'Select'"
+                v-model="params[column.key]"
+                :placeholder="column.placeholder"
+                :clearable="column.clearable"
+                :disabled="column.disabled"
+                style="width: 100%"
+              >
+                <el-option
+                  v-for="item in dict.type[column.config.optionsName]"
+                  :key="item.value"
+                  :label="item.label"
+                  :value="item.value"
+                >
                 </el-option>
               </el-select>
-
-              <el-select v-if="column.type === 'TagSelect'" v-model="params[column.key]" multiple clearable collapse-tags
-                :placeholder="column.placeholder" :clearable="column.clearable" :disabled="column.disabled"
-                style="width: 100%">
+              <el-select
+                v-if="column.type === 'TagSelect'"
+                v-model="params[column.key]"
+                multiple
+                clearable
+                collapse-tags
+                :placeholder="column.placeholder"
+                :clearable="column.clearable"
+                :disabled="column.disabled"
+                style="width: 100%"
+              >
                 <template #prefix>
-                  <el-icon class="el-icon-s-operation" style="cursor: pointer" @click.stop="$message.info(234)"></el-icon>
+                  <el-icon
+                    class="el-icon-view"
+                    style="cursor: pointer"
+                    @click.stop="$message.info(234)"
+                  ></el-icon>
                 </template>
-                <el-option v-for="item in options" :key="item.value" :label="item.label" :value="item.value">
+                <el-option
+                  v-for="item in options"
+                  :key="item.value"
+                  :label="item.label"
+                  :value="item.value"
+                >
                 </el-option>
               </el-select>
-
-              <el-date-picker v-if="column.type === 'DatePicker'" v-model="params[column.key]" :type="column.config.type"
-                :placeholder="column.placeholder" :clearable="column.clearable" :disabled="column.disabled"
-                :picker-options="column.pickerOptions" style="width: 100%">
+              <el-date-picker
+                v-if="column.type === 'DatePicker'"
+                v-model="params[column.key]"
+                :type="column.config.type"
+                :placeholder="column.placeholder"
+                :clearable="column.clearable"
+                :disabled="column.disabled"
+                :picker-options="column.pickerOptions"
+                style="width: 100%"
+              >
               </el-date-picker>
-
-              <el-upload v-if="column.type === 'Upload'" :file-list="params[column.key]" :disabled="column.disabled" drag
-                action="https://jsonplaceholder.typicode.com/posts/" multiple>
+              <el-upload
+                v-if="column.type === 'Upload'"
+                :file-list="params[column.key]"
+                :disabled="column.disabled"
+                drag
+                action="https://jsonplaceholder.typicode.com/posts/"
+                multiple
+              >
                 <i class="el-icon-upload"></i>
                 <div class="el-upload__text">
                   将文件拖到此处，或<em>点击上传</em>
@@ -202,50 +276,102 @@ export default {
           </el-col>
         </el-row>
       </el-card>
-      <el-card :body-style="{
-        padding: '20px',
-        display: 'flex',
-        'flex-wrap': 'wrap',
-        position: 'relative',
-      }" style="margin: 10px">
-        <el-tabs v-model="tabName" @tab-click="handleClick" style="width: 100%">
-          <el-tab-pane v-for="(column, index) in tabColumns" :key="index" :label="column.title" :name="column.key">
-            <el-table :data="tabTableParams[column.key]" style="width: 100%">
-              <el-table-column v-for="(cColumn, cIndex) in column.tableColumns" :key="cIndex" :prop="cColumn.key"
-                :label="cColumn.title" :width="cColumn.width">
+      <el-card
+        :body-style="{
+          padding: '20px',
+          display: 'flex',
+          'flex-wrap': 'wrap',
+          position: 'relative',
+        }"
+        style="margin: 10px"
+      >
+        <el-tabs v-model="tabName" style="width: 100%">
+          <el-tab-pane
+            v-for="(column, index) in tabColumns"
+            :key="index"
+            :label="column.title"
+            :name="column.key"
+          >
+            <el-table :data="params[column.key]" style="width: 100%">
+              <el-table-column
+                v-for="(cColumn, cIndex) in column.tableColumns"
+                :key="cIndex"
+                :prop="cColumn.key"
+                :label="cColumn.title"
+                :width="cColumn.width"
+              >
                 <template slot-scope="scope">
                   <el-tag v-if="cColumn.key === 'index'">
                     {{ scope.$index + 1 }}
                   </el-tag>
-                  <el-input v-if="cColumn.type === 'Input'" v-model="scope.row[cColumn.key]"
-                    :placeholder="cColumn.placeholder" :clearable="cColumn.clearable" :disabled="cColumn.disabled"
-                    size="mini" style="width: 100%"></el-input>
-
-                  <el-input-number v-if="cColumn.type === 'InputNumber'" v-model="scope.row[cColumn.key]"
-                    :controls-position="cColumn.config.controlsPosition" :placeholder="cColumn.placeholder"
-                    :clearable="cColumn.clearable" :disabled="cColumn.disabled" size="mini"
-                    style="width: 100%"></el-input-number>
-
-                  <el-input v-if="cColumn.type === 'InputDialog'" v-model="scope.row[cColumn.key]"
-                    :placeholder="cColumn.placeholder" :clearable="cColumn.clearable" :disabled="cColumn.disabled"
-                    size="mini" style="width: 100%" @blur="openAsyncInputDialog(cColumn, scope.row, 'change')"
-                    @change="openAsyncInputDialog(cColumn, scope.row, 'change')">
+                  <el-input
+                    v-if="cColumn.type === 'Input'"
+                    v-model="scope.row[cColumn.key]"
+                    :placeholder="cColumn.placeholder"
+                    :clearable="cColumn.clearable"
+                    :disabled="cColumn.disabled"
+                    size="mini"
+                    style="width: 100%"
+                  ></el-input>
+                  <dr-input-dialog
+                    v-if="cColumn.type === 'InputDialog'"
+                    v-model="scope.row[cColumn.key]"
+                    :placeholder="cColumn.placeholder"
+                    :clearable="cColumn.clearable"
+                    :disabled="cColumn.disabled"
+                    :readonly="cColumn.readonly"
+                    :title="cColumn.title"
+                    :type="cColumn.config.componentName"
+                    :data-mapping="cColumn.config.dataMapping"
+                    :source.sync="scope.row"
+                    size="mini"
+                  >
+                  </dr-input-dialog>
+                  <el-input-number
+                    v-if="cColumn.type === 'InputNumber'"
+                    v-model="scope.row[cColumn.key]"
+                    :controls-position="cColumn.config.controlsPosition"
+                    :placeholder="cColumn.placeholder"
+                    :clearable="cColumn.clearable"
+                    :disabled="cColumn.disabled"
+                    size="mini"
+                    style="width: 100%"
+                  ></el-input-number>
+                  <el-input
+                    v-if="column.type === 'InputDialog'"
+                    v-model="params[column.key]"
+                    :placeholder="column.placeholder"
+                    :clearable="column.clearable"
+                    :disabled="column.disabled"
+                    :readonly="column.readonly"
+                    style="width: 100%; cursor: pointer"
+                  >
                     <template #suffix>
-                      <el-icon class="el-icon-s-operation" style="cursor: pointer" @click.native.stop="
-                        openAsyncInputDialog(cColumn, scope.row, 'click')
-                        "></el-icon>
+                      <el-icon class="el-icon-thumb"></el-icon>
                     </template>
                   </el-input>
-
-                  <el-checkbox v-if="cColumn.type === 'Checkbox'" v-model="scope.row[cColumn.key]" true-label="Y"
-                    false-label="N"></el-checkbox>
+                </template>
+              </el-table-column>
+              <el-table-column fixed="right" label="操作" width="120">
+                <template slot-scope="scope">
+                  <el-button
+                    @click.native.prevent="
+                      delTableRow(params[tabName], scope.$index)
+                    "
+                    type="text"
+                    size="small"
+                  >
+                    删行
+                  </el-button>
                 </template>
               </el-table-column>
             </el-table>
           </el-tab-pane>
         </el-tabs>
         <el-row style="position: absolute; top: 20px; right: 20px">
-          <el-button size="mini" @click="addTableRow(tabName)">增行</el-button>
+          <el-button size="mini" @click="addTableRow(params[tabName])"
+            >增行</el-button
+          >
         </el-row>
       </el-card>
     </el-form>

src/views/purchase/purchase-order/column.js

@@ -0,0 +1,78 @@
+export const TableColumns = [
+   // { key: "id", title: "主键" },
+      // { key: "puOrg", title: "采购组织" },
+      { key: "puOrgName", title: "采购组织名称" },
+      { key: "billType", title: "订单类型" },
+      { key: "code", title: "订单编号" },
+      { key: "billDate", title: "订单日期" },
+      // { key: "supplier", title: "供应商" },
+      { key: "supplierName", title: "供应商名称" },
+      { key: "paymentAgreement", title: "付款协议" },
+      // { key: "currency", title: "币种" },
+      { key: "currencyName", title: "币种名称" },
+      // { key: "buyer", title: "采购员" },
+      { key: "buyerName", title: "采购员" },
+      // { key: "puDept", title: "采购部门" },
+      { key: "puDeptName", title: "采购部门名称" },
+      // { key: "customer", title: "收货客户" },
+      { key: "customerName", title: "收货客户名称" },
+      { key: "isDeliver", title: "是否发货" },
+      { key: "isArrival", title: "到货超期" },
+      { key: "isBack", title: "退货" },
+      // { key: "freezeCause", title: "冻结原因" },
+      { key: "qty", title: "总数量" },
+      { key: "money", title: "总数量" },
+      { key: "isMarketing", title: "已协同生成销售订单" },
+      { key: "isMarketingSource", title: "由销售订单协同生成" },
+      // { key: "personal", title: "人员" },
+      { key: "personalName", title: "人员名称" },
+      // { key: "isSendSrm", title: "是否同步SRM" },
+      { key: "isInvoice", title: "发票标识" },
+      { key: "rebateMoney", title: "订单使用返利金额" },
+      { key: "deductionMoney", title: "订单抵扣余款金额" },
+      // { key: "warehouse", title: "WMS入库仓库" },
+      { key: "warehouseName", title: "收货仓库" }, //WMS入库仓库名称
+      // { key: "goodsAllocation", title: "货位" },
+      { key: "goodsAllocationName", title: "货位名称" },
+      // { key: "customerDept", title: "客户部门" },
+      { key: "customerDeptName", title: "客户部门名称" },
+      // { key: "supplierContacts", title: "供应商业务联系人" },
+      { key: "supplierContactsName", title: "供应商业务联系人名称" },
+      { key: "isUrgency", title: "紧急程度" },
+      // { key: "agent", title: "代理人" }, // 建议删除
+      { key: "agentName", title: "代理人名称" },
+      { key: "isClose", title: "最终关闭" },
+      { key: "applyPaymentMoney", title: "累计付款申请金额" },
+      { key: "paymentMoney", title: "累计付款金额" },
+      { key: "invoiceMoney", title: "发票金额" },
+      // { key: "supplierPersonal", title: "供应商业务员" },
+      { key: "supplierPersonalName", title: "供应商业务员名称" },
+      { key: "marketingCode", title: "销售订单号" },
+      // { key: "tenantId", title: "租户号" },
+      // { key: "revision", title: "乐观锁" },
+      { key: "createByName", title: "创建人名称" },
+      { key: "updateByName", title: "更新人名称" },
+      // { key: "delFlag", title: "删除标记" },
+      { key: "flowId", title: "OA流程ID" },
+      { key: "approver", title: "审批人" },
+      { key: "approverFinishTime", title: "审批时间" },
+      { key: "approveTime", title: "提交时间" },
+      { key: "createTime", title: "制单日期/创建时间" },
+      { key: "remark", title: "备注" },
+      { key: "updateTime", title: "最后修改时间" },
+      { key: "status", title: "单据状态" },
+      { key: "oaDemandNo", title: "OA需求单号" },
+      { key: "address", title: "收货地址" },
+      { key: "contacts", title: "收获联系人" },
+      { key: "isSendWms", title: "已同步WMS" },
+      { key: "retReason", title: "退换原因" },
+      { key: "closeTime", title: "最终关闭日期" },
+      { key: "processType", title: "处理方式" },
+      { key: "isEnd", title: "整单关闭标识" },
+      { key: "projectNow", title: "在建工程项目" },
+      { key: "operatingItems", title: "经营性项目" },
+      { key: "isArrivalReson", title: "到货超期原因" },
+      { key: "midOrderNo", title: "中台采购订单号" }
+];
+
+export const SearchColumns = TableColumns.filter((element) => element.search);

src/views/purchase/purchase-order/direct-sourcing.vue

@@ -1,386 +0,0 @@
-<script>
-export default {
-  name: "DirectSourcing",
-  components: {},
-  data() {
-    const tableColumns = [
-      { title: "价格来源", key: "a" },
-      { title: "供应商", key: "b" },
-      { title: "采购组织", key: "c" },
-      { title: "客户", key: "d" },
-      { title: "价格类型", key: "e" },
-      { title: "配送价", key: "f" },
-      { title: "币种", key: "g" },
-      { title: "价格有效期", key: "h" },
-      { title: "税率", key: "i" },
-      { title: "协议单价", key: "j" },
-      {
-        title: "未执行量",
-        key: "k",
-        edit: true,
-        editConfig: { type: "InputNumber", controlsPosition: "right" },
-      },
-      {
-        title: "采购量",
-        key: "l",
-        edit: true,
-        editConfig: { type: "InputNumber", controlsPosition: "right" },
-      },
-      {
-        title: "计划到货",
-        key: "m",
-        edit: true,
-        editConfig: { type: "DatePicker", showType: "date" },
-      },
-      {
-        title: "期望到货",
-        key: "n",
-        edit: true,
-        editConfig: { type: "DatePicker", showType: "date" },
-      },
-      {
-        title: "备注",
-        key: "o",
-        edit: true,
-        editConfig: { type: "Textarea" },
-      },
-    ];
-    const initTableColumns = () => tableColumns;
-    return {
-      tableColumns: initTableColumns(),
-      data: [
-        {
-          a: 1,
-          b: 1,
-          c: 1,
-          d: 1,
-          e: 1,
-          f: 1,
-          g: 1,
-          h: 1,
-          i: 1,
-          j: 1,
-          k: 1,
-          l: 1,
-          m: 1,
-          n: 1,
-          o: 1,
-        },
-        {
-          a: 1,
-          b: 1,
-          c: 1,
-          d: 1,
-          e: 1,
-          f: 1,
-          g: 1,
-          h: 1,
-          i: 1,
-          j: 1,
-          k: 1,
-          l: 1,
-          m: 1,
-          n: 1,
-          o: 1,
-        },
-        {
-          a: 1,
-          b: 1,
-          c: 1,
-          d: 1,
-          e: 1,
-          f: 1,
-          g: 1,
-          h: 1,
-          i: 1,
-          j: 1,
-          k: 1,
-          l: 1,
-          m: 1,
-          n: 1,
-          o: 1,
-        },
-        {
-          a: 1,
-          b: 1,
-          c: 1,
-          d: 1,
-          e: 1,
-          f: 1,
-          g: 1,
-          h: 1,
-          i: 1,
-          j: 1,
-          k: 1,
-          l: 1,
-          m: 1,
-          n: 1,
-          o: 1,
-        },
-        {
-          a: 1,
-          b: 1,
-          c: 1,
-          d: 1,
-          e: 1,
-          f: 1,
-          g: 1,
-          h: 1,
-          i: 1,
-          j: 1,
-          k: 1,
-          l: 1,
-          m: 1,
-          n: 1,
-          o: 1,
-        },
-        {
-          a: 1,
-          b: 1,
-          c: 1,
-          d: 1,
-          e: 1,
-          f: 1,
-          g: 1,
-          h: 1,
-          i: 1,
-          j: 1,
-          k: 1,
-          l: 1,
-          m: 1,
-          n: 1,
-          o: 1,
-        },
-        {
-          a: 1,
-          b: 1,
-          c: 1,
-          d: 1,
-          e: 1,
-          f: 1,
-          g: 1,
-          h: 1,
-          i: 1,
-          j: 1,
-          k: 1,
-          l: 1,
-          m: 1,
-          n: 1,
-          o: 1,
-        },
-        {
-          a: 1,
-          b: 1,
-          c: 1,
-          d: 1,
-          e: 1,
-          f: 1,
-          g: 1,
-          h: 1,
-          i: 1,
-          j: 1,
-          k: 1,
-          l: 1,
-          m: 1,
-          n: 1,
-          o: 1,
-        },
-        {
-          a: 1,
-          b: 1,
-          c: 1,
-          d: 1,
-          e: 1,
-          f: 1,
-          g: 1,
-          h: 1,
-          i: 1,
-          j: 1,
-          k: 1,
-          l: 1,
-          m: 1,
-          n: 1,
-          o: 1,
-        },
-        {
-          a: 1,
-          b: 1,
-          c: 1,
-          d: 1,
-          e: 1,
-          f: 1,
-          g: 1,
-          h: 1,
-          i: 1,
-          j: 1,
-          k: 1,
-          l: 1,
-          m: 1,
-          n: 1,
-          o: 1,
-        },
-        {
-          a: 1,
-          b: 1,
-          c: 1,
-          d: 1,
-          e: 1,
-          f: 1,
-          g: 1,
-          h: 1,
-          i: 1,
-          j: 1,
-          k: 1,
-          l: 1,
-          m: 1,
-          n: 1,
-          o: 1,
-        },
-        {
-          a: 1,
-          b: 1,
-          c: 1,
-          d: 1,
-          e: 1,
-          f: 1,
-          g: 1,
-          h: 1,
-          i: 1,
-          j: 1,
-          k: 1,
-          l: 1,
-          m: 1,
-          n: 1,
-          o: 1,
-        },
-        {
-          a: 1,
-          b: 1,
-          c: 1,
-          d: 1,
-          e: 1,
-          f: 1,
-          g: 1,
-          h: 1,
-          i: 1,
-          j: 1,
-          k: 1,
-          l: 1,
-          m: 1,
-          n: 1,
-          o: 1,
-        },
-        {
-          a: 1,
-          b: 1,
-          c: 1,
-          d: 1,
-          e: 1,
-          f: 1,
-          g: 1,
-          h: 1,
-          i: 1,
-          j: 1,
-          k: 1,
-          l: 1,
-          m: 1,
-          n: 1,
-          o: 1,
-        },
-        {
-          a: 1,
-          b: 1,
-          c: 1,
-          d: 1,
-          e: 1,
-          f: 1,
-          g: 1,
-          h: 1,
-          i: 1,
-          j: 1,
-          k: 1,
-          l: 1,
-          m: 1,
-          n: 1,
-          o: 1,
-        },
-      ],
-      page: { pageNum: 1, pageSize: 25 },
-      total: 0,
-      pageSizes: [25, 50, 100],
-    };
-  },
-  computed: {},
-  watch: {
-    data: {
-      handler: function (n) {
-        console.log(n);
-      },
-      deep: true,
-    },
-  },
-  methods: {},
-  created() {},
-  mounted() {},
-  destroyed() {},
-};
-</script>
-
-<template>
-  <div class="directSourcing" style="height: 50vh">
-    <el-table :data="data" height="calc(50vh)" style="width: 100%">
-      <el-table-column
-        v-for="(column, index) in tableColumns"
-        :key="index"
-        :prop="column.key"
-        :label="column.title"
-        :width="column.width || 180"
-        :show-overflow-tooltip="column.showOverflowTooltip || true"
-      >
-        <template slot-scope="scope">
-          <el-input-number
-            v-if="column.edit && column.editConfig.type === 'InputNumber'"
-            v-model="scope.row[column.key]"
-            :controls-position="column.editConfig.controlsPosition"
-            :min="column.editConfig.min"
-            :max="column.editConfig.max"
-            :size="column.editConfig.size || 'mini'"
-            :placeholder="column.editConfig.placeholder"
-            style="width: 90%"
-          ></el-input-number>
-          <el-date-picker
-            v-else-if="column.edit && column.editConfig.type === 'DatePicker'"
-            v-model="scope.row[column.key]"
-            :type="column.editConfig.showType"
-            :picker-options="column.editConfig.pickerOptions"
-            :size="column.editConfig.size || 'mini'"
-            :placeholder="column.editConfig.placeholder"
-            style="width: 90%"
-          ></el-date-picker>
-          <el-input
-            v-else-if="column.edit && column.editConfig.type === 'Textarea'"
-            v-model="scope.row[column.key]"
-            type="textarea"
-            :autosize="column.editConfig.autosize || true"
-            :size="column.editConfig.size || 'mini'"
-            style="width: 90%"
-          ></el-input>
-          <span v-else>{{ scope.row[column.key] }}</span>
-        </template>
-      </el-table-column>
-    </el-table>
-    <el-pagination
-      @size-change="handleSizeChange"
-      @current-change="handleCurrentChange"
-      :total="total"
-      :page-sizes="pageSizes"
-      :page-size="page.pageSize"
-      :current-page="page.pageNum"
-      hide-on-single-page
-      layout="total, prev, pager, next, sizes, jumper"
-    >
-    </el-pagination>
-  </div>
-</template>
-
-<style scoped></style>

src/views/purchase/purchase-order/index.vue

@@ -1,8 +1,10 @@
 <!-- 采购订单修订—— 列表 -->
 <script>
+import { TableColumns, SearchColumns } from "./column";
 import orderApi from "@/api/business/purchase/purchase-order";
+import { initPage, initLayout, initPageSizes, initParams } from "@/utils/init";
 import AddPurchaseOrderDrawer from "./add/index.vue";
-import SeePurchaseOrderDrawer from "./see-purchase-order.vue";
+import SeePurchaseOrderDrawer from "./see/index.vue";
 // import DirectSourcingTable from "./direct-sourcing.vue";
 export default {
   name: "PuchaseTask",
@@ -17,94 +19,94 @@ export default {
         data.map((item) => [item[keyName], item[valueName]])
       );
     };
-    const searchColumns = [
-      { key: "puOrg", title: "采购组织", type: "Input" },
-      { key: "billDate", title: "订单日期", type: "DatePicker" },
-      { key: "code", title: "订单编号", type: "Input" },
-      { key: "status", title: "单据状态", type: "Input" },
-      { key: "buyerName", title: "采购员", type: "Input" },
-      { key: "supplierName", title: "供应商名称", type: "Input" },
+    // const searchColumns = [
+    //   { key: "puOrg", title: "采购组织", type: "Input" },
+    //   { key: "billDate", title: "订单日期", type: "DatePicker" },
+    //   { key: "code", title: "订单编号", type: "Input" },
+    //   { key: "status", title: "单据状态", type: "Input" },
+    //   { key: "buyerName", title: "采购员", type: "Input" },
+    //   { key: "supplierName", title: "供应商名称", type: "Input" },
 
-    ];
-    const initSearchColumns = () => searchColumns;
-    const initSearchParams = () => arr2Obj(initSearchColumns(), "key", "value");
-    const tableColumns = [
-      // { key: "id", title: "主键" },
-      // { key: "puOrg", title: "采购组织" },
-      { key: "puOrgName", title: "采购组织名称" },
-      { key: "billType", title: "订单类型" },
-      { key: "code", title: "订单编号" },
-      { key: "billDate", title: "订单日期" },
-      // { key: "supplier", title: "供应商" },
-      { key: "supplierName", title: "供应商名称" },
-      { key: "paymentAgreement", title: "付款协议" },
-      // { key: "currency", title: "币种" },
-      { key: "currencyName", title: "币种名称" },
-      // { key: "buyer", title: "采购员" },
-      { key: "buyerName", title: "采购员" },
-      // { key: "puDept", title: "采购部门" },
-      { key: "puDeptName", title: "采购部门名称" },
-      // { key: "customer", title: "收货客户" },
-      { key: "customerName", title: "收货客户名称" },
-      { key: "isDeliver", title: "是否发货" },
-      { key: "isArrival", title: "到货超期" },
-      { key: "isBack", title: "退货" },
-      // { key: "freezeCause", title: "冻结原因" },
-      { key: "qty", title: "总数量" },
-      { key: "money", title: "总数量" },
-      { key: "isMarketing", title: "已协同生成销售订单" },
-      { key: "isMarketingSource", title: "由销售订单协同生成" },
-      // { key: "personal", title: "人员" },
-      { key: "personalName", title: "人员名称" },
-      // { key: "isSendSrm", title: "是否同步SRM" },
-      { key: "isInvoice", title: "发票标识" },
-      { key: "rebateMoney", title: "订单使用返利金额" },
-      { key: "deductionMoney", title: "订单抵扣余款金额" },
-      // { key: "warehouse", title: "WMS入库仓库" },
-      { key: "warehouseName", title: "收货仓库" }, //WMS入库仓库名称
-      // { key: "goodsAllocation", title: "货位" },
-      { key: "goodsAllocationName", title: "货位名称" },
-      // { key: "customerDept", title: "客户部门" },
-      { key: "customerDeptName", title: "客户部门名称" },
-      // { key: "supplierContacts", title: "供应商业务联系人" },
-      { key: "supplierContactsName", title: "供应商业务联系人名称" },
-      { key: "isUrgency", title: "紧急程度" },
-      // { key: "agent", title: "代理人" }, // 建议删除
-      { key: "agentName", title: "代理人名称" },
-      { key: "isClose", title: "最终关闭" },
-      { key: "applyPaymentMoney", title: "累计付款申请金额" },
-      { key: "paymentMoney", title: "累计付款金额" },
-      { key: "invoiceMoney", title: "发票金额" },
-      // { key: "supplierPersonal", title: "供应商业务员" },
-      { key: "supplierPersonalName", title: "供应商业务员名称" },
-      { key: "marketingCode", title: "销售订单号" },
-      // { key: "tenantId", title: "租户号" },
-      // { key: "revision", title: "乐观锁" },
-      { key: "createByName", title: "创建人名称" },
-      { key: "updateByName", title: "更新人名称" },
-      // { key: "delFlag", title: "删除标记" },
-      { key: "flowId", title: "OA流程ID" },
-      { key: "approver", title: "审批人" },
-      { key: "approverFinishTime", title: "审批时间" },
-      { key: "approveTime", title: "提交时间" },
-      { key: "createTime", title: "制单日期/创建时间" },
-      { key: "remark", title: "备注" },
-      { key: "updateTime", title: "最后修改时间" },
-      { key: "status", title: "单据状态" },
-      { key: "oaDemandNo", title: "OA需求单号" },
-      { key: "address", title: "收货地址" },
-      { key: "contacts", title: "收获联系人" },
-      { key: "isSendWms", title: "已同步WMS" },
-      { key: "retReason", title: "退换原因" },
-      { key: "closeTime", title: "最终关闭日期" },
-      { key: "processType", title: "处理方式" },
-      { key: "isEnd", title: "整单关闭标识" },
-      { key: "projectNow", title: "在建工程项目" },
-      { key: "operatingItems", title: "经营性项目" },
-      { key: "isArrivalReson", title: "到货超期原因" },
-      { key: "midOrderNo", title: "中台采购订单号" }
-    ];
-    const initTableColumns = () => tableColumns;
+    // ];
+    // const initSearchColumns = () => searchColumns;
+    // const initSearchParams = () => arr2Obj(initSearchColumns(), "key", "value");
+    // const tableColumns = [
+    //   // { key: "id", title: "主键" },
+    //   // { key: "puOrg", title: "采购组织" },
+    //   { key: "puOrgName", title: "采购组织名称" },
+    //   { key: "billType", title: "订单类型" },
+    //   { key: "code", title: "订单编号" },
+    //   { key: "billDate", title: "订单日期" },
+    //   // { key: "supplier", title: "供应商" },
+    //   { key: "supplierName", title: "供应商名称" },
+    //   { key: "paymentAgreement", title: "付款协议" },
+    //   // { key: "currency", title: "币种" },
+    //   { key: "currencyName", title: "币种名称" },
+    //   // { key: "buyer", title: "采购员" },
+    //   { key: "buyerName", title: "采购员" },
+    //   // { key: "puDept", title: "采购部门" },
+    //   { key: "puDeptName", title: "采购部门名称" },
+    //   // { key: "customer", title: "收货客户" },
+    //   { key: "customerName", title: "收货客户名称" },
+    //   { key: "isDeliver", title: "是否发货" },
+    //   { key: "isArrival", title: "到货超期" },
+    //   { key: "isBack", title: "退货" },
+    //   // { key: "freezeCause", title: "冻结原因" },
+    //   { key: "qty", title: "总数量" },
+    //   { key: "money", title: "总数量" },
+    //   { key: "isMarketing", title: "已协同生成销售订单" },
+    //   { key: "isMarketingSource", title: "由销售订单协同生成" },
+    //   // { key: "personal", title: "人员" },
+    //   { key: "personalName", title: "人员名称" },
+    //   // { key: "isSendSrm", title: "是否同步SRM" },
+    //   { key: "isInvoice", title: "发票标识" },
+    //   { key: "rebateMoney", title: "订单使用返利金额" },
+    //   { key: "deductionMoney", title: "订单抵扣余款金额" },
+    //   // { key: "warehouse", title: "WMS入库仓库" },
+    //   { key: "warehouseName", title: "收货仓库" }, //WMS入库仓库名称
+    //   // { key: "goodsAllocation", title: "货位" },
+    //   { key: "goodsAllocationName", title: "货位名称" },
+    //   // { key: "customerDept", title: "客户部门" },
+    //   { key: "customerDeptName", title: "客户部门名称" },
+    //   // { key: "supplierContacts", title: "供应商业务联系人" },
+    //   { key: "supplierContactsName", title: "供应商业务联系人名称" },
+    //   { key: "isUrgency", title: "紧急程度" },
+    //   // { key: "agent", title: "代理人" }, // 建议删除
+    //   { key: "agentName", title: "代理人名称" },
+    //   { key: "isClose", title: "最终关闭" },
+    //   { key: "applyPaymentMoney", title: "累计付款申请金额" },
+    //   { key: "paymentMoney", title: "累计付款金额" },
+    //   { key: "invoiceMoney", title: "发票金额" },
+    //   // { key: "supplierPersonal", title: "供应商业务员" },
+    //   { key: "supplierPersonalName", title: "供应商业务员名称" },
+    //   { key: "marketingCode", title: "销售订单号" },
+    //   // { key: "tenantId", title: "租户号" },
+    //   // { key: "revision", title: "乐观锁" },
+    //   { key: "createByName", title: "创建人名称" },
+    //   { key: "updateByName", title: "更新人名称" },
+    //   // { key: "delFlag", title: "删除标记" },
+    //   { key: "flowId", title: "OA流程ID" },
+    //   { key: "approver", title: "审批人" },
+    //   { key: "approverFinishTime", title: "审批时间" },
+    //   { key: "approveTime", title: "提交时间" },
+    //   { key: "createTime", title: "制单日期/创建时间" },
+    //   { key: "remark", title: "备注" },
+    //   { key: "updateTime", title: "最后修改时间" },
+    //   { key: "status", title: "单据状态" },
+    //   { key: "oaDemandNo", title: "OA需求单号" },
+    //   { key: "address", title: "收货地址" },
+    //   { key: "contacts", title: "收获联系人" },
+    //   { key: "isSendWms", title: "已同步WMS" },
+    //   { key: "retReason", title: "退换原因" },
+    //   { key: "closeTime", title: "最终关闭日期" },
+    //   { key: "processType", title: "处理方式" },
+    //   { key: "isEnd", title: "整单关闭标识" },
+    //   { key: "projectNow", title: "在建工程项目" },
+    //   { key: "operatingItems", title: "经营性项目" },
+    //   { key: "isArrivalReson", title: "到货超期原因" },
+    //   { key: "midOrderNo", title: "中台采购订单号" }
+    // ];
+    // const initTableColumns = () => tableColumns;
     const tabColumns = [
       {
         title: '物料信息',
@@ -210,14 +212,21 @@ export default {
     return {
       loading: false,
       isSimpleSearch: true,
-      searchColumns: initSearchColumns(),
-      searchParams: {
-        isAsc: "desc",
-        reasonable: "",
-        orderByColumn: "",
-        ...initSearchParams(),
-      },
-      tableColumns: initTableColumns(),
+      pageSizes: initPageSizes(),
+      layout: initLayout(),
+      page: initPage(),
+      searchColumns: SearchColumns,
+      params: initParams(SearchColumns),
+
+      tableColumns: TableColumns,
+      // searchColumns: initSearchColumns(),
+      // searchParams: {
+      //   isAsc: "desc",
+      //   reasonable: "",
+      //   orderByColumn: "",
+      //   ...initSearchParams(),
+      // },
+      // tableColumns: initTableColumns(),
       tableData: [{ puOrgName: 1 }],
       tabColumns: initTabColumns(),
       tabName: "first",
@@ -225,9 +234,10 @@ export default {
         first: [],
         second: [],
       },
-      page: { pageNum: 1, pageSize: 25 },
-      total: 0,
-      pageSizes: [25, 50, 100],
+      // page: { pageNum: 1, pageSize: 25 },
+      // total: 0,
+      // pageSizes: [25, 50, 100],
+      detailsData: {}
     };
   },
   computed: {
@@ -299,7 +309,7 @@ export default {
       try {
         const { code, msg, data } = await orderApi.orderDetails(row.id);
         if (code === 200) {
-
+          this.detailsData = data;
           // 物料信息:puOrderItemList   执行结果:puOrderExecuteList
           this.tabTableDatas.first = data.puOrderItemList;
           this.tabTableDatas.second = data.puOrderExecuteList;
@@ -322,7 +332,7 @@ export default {
     <AddPurchaseOrderDrawer ref="addDrawerFef"></AddPurchaseOrderDrawer>
     <SeePurchaseOrderDrawer ref="seeDrawerFef"></SeePurchaseOrderDrawer>
 
-    <el-form size="mini" label-position="right" label-width="85px" :model="searchParams" style="padding: 20px 0 0 0">
+    <el-form size="mini" label-position="right" label-width="85px" :model="params" style="padding: 20px 0 0 0">
       <el-row :gutter="24">
         <el-col :span="20">
           <el-row :gutter="20">
@@ -386,7 +396,7 @@ export default {
     </el-table>
     <el-pagination @size-change="handleSizeChange" @current-change="handleCurrentChange" :total="total"
       :page-sizes="pageSizes" :page-size="page.pageSize" :current-page="page.pageNum" hide-on-single-page
-      layout="total, prev, pager, next, sizes, jumper">
+      :layout="layout">
     </el-pagination>
 
     <!-- <el-card :body-style="{

src/views/purchase/purchase-order/see-purchase-order.vue

@@ -1,352 +0,0 @@
-<!-- 采购订单修订—— 查看 -->
-<script>
-export default {
-  name: "SeePurchaseContractDrawer",
-  data() {
-    const arr2Obj = function (data, keyName, valueName) {
-      return Object.fromEntries(
-        data.map((item) => [item[keyName], item[valueName]])
-      );
-    };
-    const columns = [
-      // { key: "id", title: "主键" },
-      { key: "puOrg", title: "采购组织" },
-      { key: "puOrgName", title: "采购组织名称" },
-      { key: "billType", title: "订单类型" },
-      { key: "billTypeName", title: "订单类型名称" },
-      { key: "oaDemandNo", title: "OA需求单号" },
-      { key: "code", title: "订单编号" },
-      { key: "billDate", title: "订单日期" },
-      { key: "supplier", title: "供应商" },
-      { key: "supplierName", title: "供应商名称" },
-      { key: "paymentAgreement", title: "付款协议" },
-      { key: "finalType", title: "结算方式" },
-      { key: "currency", title: "币种" },
-      { key: "currencyName", title: "币种名称" },
-      { key: "buyer", title: "采购员" },
-      { key: "buyerName", title: "采购员名称" },
-      { key: "puDept", title: "采购部门" },
-      { key: "puDeptName", title: "采购部门名称" },
-      { key: "customer", title: "收货客户" },
-      { key: "customerName", title: "收货客户名称" },
-      { key: "qty", title: "总数量" },
-      { key: "originalQty", title: "原始总数量" },
-      { key: "money", title: "价税合计" },
-      { key: "originalMoney", title: "原始总金额" },
-      { key: "notaxMoney", title: "无税金额" },
-      { key: "status", title: "单据状态" },
-      { key: "freezeCause", title: "冻结原因" },
-      { key: "isBack", title: "退货" },
-      { key: "isMarketing", title: "已协同生成销售订单" },
-      { key: "isMarketingSource", title: "由销售订单协同生成" },
-      { key: "warehouse", title: "WMS入库仓库" },
-      { key: "warehouseName", title: "WMS入库仓库名称" },
-      { key: "goodsAllocation", title: "货位" },
-      { key: "goodsAllocationName", title: "货位名称" },
-      { key: "isSendSrm", title: "是否同步SRM" },
-      { key: "isInvoice", title: "发票标识" },
-      { key: "supplierOrderNo", title: "供应商订单号" },
-      { key: "rebateMoney", title: "订单使用返利金额" },
-      { key: "deductionMoney", title: "订单抵扣余款金额" },
-      { key: "address", title: "收货地址" },
-      { key: "contacts", title: "收货联系人" },
-      { key: "customerDept", title: "客户部门" },
-      { key: "customerDeptName", title: "客户部门名称" },
-      { key: "supplierContacts", title: "供应商业务联系人" },
-      { key: "supplierContactsName", title: "供应商业务联系人名称" },
-      { key: "isUrgency", title: "紧急程度" },
-      { key: "isSendWms", title: "已同步WMS" },
-      { key: "agent", title: "代理人" },
-      { key: "agentName", title: "代理人名称" },
-      { key: "isClose", title: "最终关闭" },
-      { key: "closeTime", title: "最终关闭日期" },
-      { key: "applyPaymentMoney", title: "累计付款申请金额" },
-      { key: "paymentMoney", title: "累计付款金额" },
-      { key: "invoiceMoney", title: "发票金额" },
-      { key: "supplierPersonal", title: "供应商业务员" },
-      { key: "supplierPersonalName", title: "供应商业务员名称" },
-      { key: "isDeliver", title: "是否发货" },
-      { key: "retReason", title: "退换原因" },
-      { key: "processType", title: "处理方式" },
-      { key: "isEnd", title: "整单关闭标识" },
-      { key: "projectNow", title: "在建工程项目" },
-      { key: "operatingItems", title: "经营性项目" },
-      { key: "isArrivalReson", title: "到货超期原因" },
-      { key: "midOrderNo", title: "中台采购订单号" },
-      { key: "marketingCode", title: "销售订单号" },
-      { key: "isArrival", title: "到货超期" },
-      // { key: "tenantId", title: "租户号" },
-      // { key: "revision", title: "乐观锁" },
-      { key: "createByName", title: "创建人名称" },
-      { key: "updateByName", title: "更新人名称" },
-      // { key: "delFlag", title: "删除标记" },
-      { key: "flowId", title: "OA流程ID" },
-      { key: "approver", title: "审批人" },
-      { key: "approverFinishTime", title: "审批时间" },
-      { key: "approveTime", title: "提交时间" },
-
-    ];
-    const initColumns = () =>
-      columns.map((column) => {
-        const clearable = column.clearable || true;
-        if (column.type === "InputNumber") {
-          return {
-            ...column,
-            clearable,
-            config: { controlsPosition: "right" },
-          };
-        }
-        if (column.type === "DatePicker") {
-          return {
-            ...column,
-            clearable,
-            config: { type: "date" },
-          };
-        }
-        return {
-          ...column,
-          clearable,
-        };
-      });
-    const initParams = () => arr2Obj(initColumns(), "key", "value");
-    const tabColumns = [
-      {
-        title: '物料信息',
-        key: 'first',
-        tableColumns: [
-          // { key: "id", title: "主键" },
-          { key: "rowNo", title: "行号" },
-          { key: "orderId", title: "采购订单ID" },
-          { key: "material", title: "物料" },
-          { key: "materialName", title: "物料名称" },
-          { key: "materialCode", title: "物料编码" },
-          { key: "materialClassify", title: "物料分类" },
-          { key: "materialManufacturersCode", title: "厂家物料编码" },
-          { key: "specification", title: "规格" },
-          { key: "model", title: "型号" },
-          { key: "isMedcine", title: "医药物料" },
-          { key: "manufacturer", title: "生产厂家代理人" },
-          { key: "isDrug", title: "物料药品属性" },
-          { key: "unit", title: "单位" },
-          { key: "qty", title: "数量" },
-          { key: "taxPrice", title: "含税单价" },
-          { key: "money", title: "价税合计" },
-          { key: "tax", title: "税率" },
-          { key: "taxDeductMoneya", title: "折扣金额" },
-          { key: "arrivalQty", title: "已到货数量" },
-          { key: "unarrivedQty", title: "未到货数量" },
-          { key: "notaxMoney", title: "无税金额" },
-          { key: "priceSource", title: "价格目录ID" },
-          { key: "isStorage", title: "入库关闭" },
-          { key: "isInvoice", title: "开票关闭" },
-          { key: "isArrival", title: "到货关闭" },
-          { key: "isPayment", title: "付款关闭" },
-          { key: "isGift", title: "赠品" },
-          { key: "warehouse", title: "收货仓库" },
-          { key: "place", title: "收货地点" },
-          { key: "address", title: "收货地址" },
-          { key: "productBatch", title: "产品批号" },
-          { key: "manufactureDate", title: "生产日期" },
-          { key: "efficacyLoseDate", title: "有效期至/失效日期" },
-          { key: "approvalNumber", title: "批准文号" },
-          { key: "registration", title: "注册证号" },
-          { key: "storageCondition", title: "存储条件" },
-          { key: "carriageCondition", title: "运输条件" },
-          { key: "isBatchLock", title: "批号锁定标识" },
-          { key: "isReplenishment", title: "补单标识" },
-          { key: "isUrgency", title: "紧急标识" },
-          { key: "originalQty", title: "原始数量" },
-          { key: "originalMoney", title: "原始金额" },
-          { key: "directProductBatch", title: "直运产品批号" },
-          { key: "discountRule", title: "折扣规则编码" },
-          { key: "reservedQty", title: "预留数量" },
-          { key: "reservedPeriod", title: "预留周期" },
-          { key: "taxDeductClassify", title: "扣税类别" },
-          { key: "exchangeRate", title: "折本汇率" },
-          { key: "source", title: "上游单据号" },
-          { key: "sourceId", title: "上游单据ID" },
-          { key: "demandCode", title: "采购需求单号" },
-          { key: "arrivalDatePlan", title: "计划到货日期" },
-          { key: "priceType", title: "价格类型" },
-          { key: "isDistributionPrice", title: "配送价" },
-          // { key: "tenantId", title: "租户号" },
-          // { key: "revision", title: "乐观锁" },
-          { key: "createByName", title: "创建人名称" },
-          { key: "updateByName", title: "更新人名称" },
-          // { key: "delFlag", title: "删除标记" },
-          // { key: "materialClassifyOne", title: "物料一级分类" },
-          { key: "materialClassifyOneName", title: "物料一级分类名称" },
-          // { key: "materialClassifyTwo", title: "物料二级分类" },
-          { key: "materialClassifyTwoName", title: "物料二级分类名称" },
-          // { key: "materialClassifyThree", title: "物料三级分类" },
-          { key: "materialClassifyThreeName", title: "物料三级分类名称" },
-          // { key: "materialClassifyFour", title: "物料四级分类" },
-          { key: "materialClassifyFourName", title: "物料四级分类名称" },
-          { key: "price", title: "无税单价" }
-        ]
-      },
-      {
-        title: '执行结果',
-        key: 'second',
-        tableColumns: [
-          // { key: "id", title: "主键" },
-          { key: "orderId", title: "采购订单ID" },
-          { key: "rowno", title: "行号" },
-          { key: "material", title: "物料" },
-          { key: "materialName", title: "物料名称" },
-          { key: "specification", title: "规格" },
-          { key: "qty", title: "数量" },
-          { key: "stroageQty", title: "累计到货主数量" },
-          { key: "stockQty", title: "累计入库主数量" },
-          { key: "invoiceQty", title: "累计开票主数量" },
-          { key: "rollbackQty", title: "累计退货主数量" },
-          { key: "backStockQty", title: "累计退库主数量" },
-          { key: "floatQty", title: "未到货数量" },
-          // { key: "tenantId", title: "租户号" },
-          // { key: "revision", title: "乐观锁" },
-          { key: "createByName", title: "创建人名称" },
-          { key: "updateByName", title: "更新人名称" },
-          // { key: "delFlag", title: "删除标记" }
-        ]
-      },
-    ];
-    const initTabColumns = () => tabColumns;
-    return {
-      visible: false,
-      columns: initColumns(),
-      params: initParams(),
-      options: [
-        {
-          value: "选项1",
-          label: "黄金糕",
-        },
-        {
-          value: "选项2",
-          label: "双皮奶",
-        },
-        {
-          value: "选项3",
-          label: "蚵仔煎",
-        },
-        {
-          value: "选项4",
-          label: "龙须面",
-        },
-        {
-          value: "选项5",
-          label: "北京烤鸭",
-        },
-      ],
-      tabColumns: initTabColumns(),
-      tabName: "first",
-      tabTableDatas: {
-        first: [],
-        second: [],
-        // third: [],
-        // fourth: [],
-        // fifth: [],
-      },
-    };
-  },
-  computed: {},
-  watch: {},
-  methods: {
-    setVisible(prop) {
-      this.visible = prop;
-    },
-    handleClick() { },
-    handleClose() { },
-  },
-  created() {
-    console.log(this.params, this.columns);
-  },
-  mounted() { },
-  destroyed() { },
-};
-</script>
-<template>
-  <el-drawer title="我是标题" direction="btt" size="100%" :with-header="false" :visible.sync="visible"
-    :before-close="handleClose">
-    <el-card :body-style="{
-      padding: '20px',
-      display: 'flex',
-      'flex-wrap': 'wrap',
-    }" style="margin: 10px">
-      <div slot="header" style="
-          display: flex;
-          justify-content: space-between;
-          align-items: center;
-        ">
-        <h3>查看</h3>
-        <div style="text-align: right">
-          <el-button size="mini" @click="setVisible(false)">取消</el-button>
-          <!-- <el-button size="mini" type="info" @click="setVisible(false)">保存并新增</el-button>
-          <el-button size="mini" type="danger" @click="setVisible(false)">保存</el-button> -->
-        </div>
-      </div>
-      <el-row>
-        <el-form size="mini" label-position="right" label-width="150px" :model="params">
-          <el-col v-for="(column, index) in columns" :key="index" :span="column.span || 8">
-            <el-form-item :prop="column.key" :label="column.title" :required="column.required">
-
-              <el-input v-if="column.type === 'Input'" v-model="params[column.key]" readonly
-                :placeholder="column.placeholder" :clearable="column.clearable" style="width: 90%"></el-input>
-
-              <el-input-number v-if="column.type === 'InputNumber'" v-model="params[column.key]" readonly
-                :controls-position="column.config.controlsPosition" :placeholder="column.placeholder"
-                :clearable="column.clearable" style="width: 90%"></el-input-number>
-
-              <el-select v-if="column.type === 'Select'" v-model="params[column.key]" disabled
-                :placeholder="column.placeholder" :clearable="column.clearable" style="width: 90%">
-                <el-option v-for="item in options" :key="item.value" :label="item.label" :value="item.value">
-                </el-option>
-              </el-select>
-
-              <el-select v-if="column.type === 'TagSelect'" v-model="params[column.key]" disabled multiple clearable
-                collapse-tags :placeholder="column.placeholder" :clearable="column.clearable" style="width: 90%">
-                <template #prefix>
-                  <el-icon class="el-icon-s-operation" style="cursor: pointer" @click.stop="$message.info(234)"></el-icon>
-                </template>
-                <el-option v-for="item in options" :key="item.value" :label="item.label" :value="item.value">
-                </el-option>
-              </el-select>
-
-              <el-date-picker v-if="column.type === 'DatePicker'" readonly v-model="params[column.key]"
-                :type="column.config.type" :placeholder="column.placeholder" :clearable="column.clearable"
-                :picker-options="column.pickerOptions" style="width: 90%">
-              </el-date-picker>
-
-              <el-upload v-if="column.type === 'Upload'" :file-list="params[column.key]" drag
-                action="https://jsonplaceholder.typicode.com/posts/" multiple>
-                <i class="el-icon-upload"></i>
-                <div class="el-upload__text">
-                  将文件拖到此处，或<em>点击上传</em>
-                </div>
-                <div class="el-upload__tip" slot="tip">
-                  只能上传jpg/png文件，且不超过500kb
-                </div>
-              </el-upload>
-
-            </el-form-item>
-          </el-col>
-        </el-form>
-      </el-row>
-    </el-card>
-
-    <el-card :body-style="{
-      padding: '20px',
-      display: 'flex',
-      'flex-wrap': 'wrap',
-    }" style="margin: 10px">
-      <el-tabs v-model="tabName" @tab-click="handleClick" style="width: 100%">
-        <el-tab-pane v-for="(column, index) in tabColumns" :key="index" :label="column.title" :name="column.key">
-          <el-table :data="tabTableDatas[column.key]" style="width: 100%">
-            <el-table-column v-for="(cColumn, cIndex) in column.tableColumns" :key="cIndex" :prop="cColumn.key"
-              :label="cColumn.title">
-            </el-table-column>
-          </el-table>
-        </el-tab-pane>
-      </el-tabs>
-    </el-card>
-  </el-drawer>
-</template>

src/views/purchase/purchase-order/see/index.vue

@@ -0,0 +1,393 @@
+<!-- 采购订单修订—— 查看 -->
+<script>
+import {
+  initColumns,
+  initDicts,
+  initRules,
+  initParams,
+} from "@/utils/init";
+import { Columns, TabColumns } from "../add/column";
+
+const NewColumns = initColumns(Columns, { disabled: true, readonly: true });
+const NewTabColumns = TabColumns.map((element) => ({
+  ...element,
+  tableColumns: initColumns(element.tableColumns),
+}));
+
+
+export default {
+  name: "SeePurchaseContractDrawer",
+  dicts: initDicts(NewColumns),
+  data() {
+    // const arr2Obj = function (data, keyName, valueName) {
+    //   return Object.fromEntries(
+    //     data.map((item) => [item[keyName], item[valueName]])
+    //   );
+    // };
+    // const columns = [
+    //   // { key: "id", title: "主键" },
+    //   { key: "puOrg", title: "采购组织" },
+    //   { key: "puOrgName", title: "采购组织名称" },
+    //   { key: "billType", title: "订单类型" },
+    //   { key: "billTypeName", title: "订单类型名称" },
+    //   { key: "oaDemandNo", title: "OA需求单号" },
+    //   { key: "code", title: "订单编号" },
+    //   { key: "billDate", title: "订单日期" },
+    //   { key: "supplier", title: "供应商" },
+    //   { key: "supplierName", title: "供应商名称" },
+    //   { key: "paymentAgreement", title: "付款协议" },
+    //   { key: "finalType", title: "结算方式" },
+    //   { key: "currency", title: "币种" },
+    //   { key: "currencyName", title: "币种名称" },
+    //   { key: "buyer", title: "采购员" },
+    //   { key: "buyerName", title: "采购员名称" },
+    //   { key: "puDept", title: "采购部门" },
+    //   { key: "puDeptName", title: "采购部门名称" },
+    //   { key: "customer", title: "收货客户" },
+    //   { key: "customerName", title: "收货客户名称" },
+    //   { key: "qty", title: "总数量" },
+    //   { key: "originalQty", title: "原始总数量" },
+    //   { key: "money", title: "价税合计" },
+    //   { key: "originalMoney", title: "原始总金额" },
+    //   { key: "notaxMoney", title: "无税金额" },
+    //   { key: "status", title: "单据状态" },
+    //   { key: "freezeCause", title: "冻结原因" },
+    //   { key: "isBack", title: "退货" },
+    //   { key: "isMarketing", title: "已协同生成销售订单" },
+    //   { key: "isMarketingSource", title: "由销售订单协同生成" },
+    //   { key: "warehouse", title: "WMS入库仓库" },
+    //   { key: "warehouseName", title: "WMS入库仓库名称" },
+    //   { key: "goodsAllocation", title: "货位" },
+    //   { key: "goodsAllocationName", title: "货位名称" },
+    //   { key: "isSendSrm", title: "是否同步SRM" },
+    //   { key: "isInvoice", title: "发票标识" },
+    //   { key: "supplierOrderNo", title: "供应商订单号" },
+    //   { key: "rebateMoney", title: "订单使用返利金额" },
+    //   { key: "deductionMoney", title: "订单抵扣余款金额" },
+    //   { key: "address", title: "收货地址" },
+    //   { key: "contacts", title: "收货联系人" },
+    //   { key: "customerDept", title: "客户部门" },
+    //   { key: "customerDeptName", title: "客户部门名称" },
+    //   { key: "supplierContacts", title: "供应商业务联系人" },
+    //   { key: "supplierContactsName", title: "供应商业务联系人名称" },
+    //   { key: "isUrgency", title: "紧急程度" },
+    //   { key: "isSendWms", title: "已同步WMS" },
+    //   { key: "agent", title: "代理人" },
+    //   { key: "agentName", title: "代理人名称" },
+    //   { key: "isClose", title: "最终关闭" },
+    //   { key: "closeTime", title: "最终关闭日期" },
+    //   { key: "applyPaymentMoney", title: "累计付款申请金额" },
+    //   { key: "paymentMoney", title: "累计付款金额" },
+    //   { key: "invoiceMoney", title: "发票金额" },
+    //   { key: "supplierPersonal", title: "供应商业务员" },
+    //   { key: "supplierPersonalName", title: "供应商业务员名称" },
+    //   { key: "isDeliver", title: "是否发货" },
+    //   { key: "retReason", title: "退换原因" },
+    //   { key: "processType", title: "处理方式" },
+    //   { key: "isEnd", title: "整单关闭标识" },
+    //   { key: "projectNow", title: "在建工程项目" },
+    //   { key: "operatingItems", title: "经营性项目" },
+    //   { key: "isArrivalReson", title: "到货超期原因" },
+    //   { key: "midOrderNo", title: "中台采购订单号" },
+    //   { key: "marketingCode", title: "销售订单号" },
+    //   { key: "isArrival", title: "到货超期" },
+    //   // { key: "tenantId", title: "租户号" },
+    //   // { key: "revision", title: "乐观锁" },
+    //   { key: "createByName", title: "创建人名称" },
+    //   { key: "updateByName", title: "更新人名称" },
+    //   // { key: "delFlag", title: "删除标记" },
+    //   { key: "flowId", title: "OA流程ID" },
+    //   { key: "approver", title: "审批人" },
+    //   { key: "approverFinishTime", title: "审批时间" },
+    //   { key: "approveTime", title: "提交时间" },
+
+    // ];
+    // const initColumns = () =>
+    //   columns.map((column) => {
+    //     const clearable = column.clearable || true;
+    //     if (column.type === "InputNumber") {
+    //       return {
+    //         ...column,
+    //         clearable,
+    //         config: { controlsPosition: "right" },
+    //       };
+    //     }
+    //     if (column.type === "DatePicker") {
+    //       return {
+    //         ...column,
+    //         clearable,
+    //         config: { type: "date" },
+    //       };
+    //     }
+    //     return {
+    //       ...column,
+    //       clearable,
+    //     };
+    //   });
+    // const initParams = () => arr2Obj(initColumns(), "key", "value");
+    // const tabColumns = [
+    //   {
+    //     title: '物料信息',
+    //     key: 'first',
+    //     tableColumns: [
+    //       // { key: "id", title: "主键" },
+    //       { key: "rowNo", title: "行号" },
+    //       { key: "orderId", title: "采购订单ID" },
+    //       { key: "material", title: "物料" },
+    //       { key: "materialName", title: "物料名称" },
+    //       { key: "materialCode", title: "物料编码" },
+    //       { key: "materialClassify", title: "物料分类" },
+    //       { key: "materialManufacturersCode", title: "厂家物料编码" },
+    //       { key: "specification", title: "规格" },
+    //       { key: "model", title: "型号" },
+    //       { key: "isMedcine", title: "医药物料" },
+    //       { key: "manufacturer", title: "生产厂家代理人" },
+    //       { key: "isDrug", title: "物料药品属性" },
+    //       { key: "unit", title: "单位" },
+    //       { key: "qty", title: "数量" },
+    //       { key: "taxPrice", title: "含税单价" },
+    //       { key: "money", title: "价税合计" },
+    //       { key: "tax", title: "税率" },
+    //       { key: "taxDeductMoneya", title: "折扣金额" },
+    //       { key: "arrivalQty", title: "已到货数量" },
+    //       { key: "unarrivedQty", title: "未到货数量" },
+    //       { key: "notaxMoney", title: "无税金额" },
+    //       { key: "priceSource", title: "价格目录ID" },
+    //       { key: "isStorage", title: "入库关闭" },
+    //       { key: "isInvoice", title: "开票关闭" },
+    //       { key: "isArrival", title: "到货关闭" },
+    //       { key: "isPayment", title: "付款关闭" },
+    //       { key: "isGift", title: "赠品" },
+    //       { key: "warehouse", title: "收货仓库" },
+    //       { key: "place", title: "收货地点" },
+    //       { key: "address", title: "收货地址" },
+    //       { key: "productBatch", title: "产品批号" },
+    //       { key: "manufactureDate", title: "生产日期" },
+    //       { key: "efficacyLoseDate", title: "有效期至/失效日期" },
+    //       { key: "approvalNumber", title: "批准文号" },
+    //       { key: "registration", title: "注册证号" },
+    //       { key: "storageCondition", title: "存储条件" },
+    //       { key: "carriageCondition", title: "运输条件" },
+    //       { key: "isBatchLock", title: "批号锁定标识" },
+    //       { key: "isReplenishment", title: "补单标识" },
+    //       { key: "isUrgency", title: "紧急标识" },
+    //       { key: "originalQty", title: "原始数量" },
+    //       { key: "originalMoney", title: "原始金额" },
+    //       { key: "directProductBatch", title: "直运产品批号" },
+    //       { key: "discountRule", title: "折扣规则编码" },
+    //       { key: "reservedQty", title: "预留数量" },
+    //       { key: "reservedPeriod", title: "预留周期" },
+    //       { key: "taxDeductClassify", title: "扣税类别" },
+    //       { key: "exchangeRate", title: "折本汇率" },
+    //       { key: "source", title: "上游单据号" },
+    //       { key: "sourceId", title: "上游单据ID" },
+    //       { key: "demandCode", title: "采购需求单号" },
+    //       { key: "arrivalDatePlan", title: "计划到货日期" },
+    //       { key: "priceType", title: "价格类型" },
+    //       { key: "isDistributionPrice", title: "配送价" },
+    //       // { key: "tenantId", title: "租户号" },
+    //       // { key: "revision", title: "乐观锁" },
+    //       { key: "createByName", title: "创建人名称" },
+    //       { key: "updateByName", title: "更新人名称" },
+    //       // { key: "delFlag", title: "删除标记" },
+    //       // { key: "materialClassifyOne", title: "物料一级分类" },
+    //       { key: "materialClassifyOneName", title: "物料一级分类名称" },
+    //       // { key: "materialClassifyTwo", title: "物料二级分类" },
+    //       { key: "materialClassifyTwoName", title: "物料二级分类名称" },
+    //       // { key: "materialClassifyThree", title: "物料三级分类" },
+    //       { key: "materialClassifyThreeName", title: "物料三级分类名称" },
+    //       // { key: "materialClassifyFour", title: "物料四级分类" },
+    //       { key: "materialClassifyFourName", title: "物料四级分类名称" },
+    //       { key: "price", title: "无税单价" }
+    //     ]
+    //   },
+    //   {
+    //     title: '执行结果',
+    //     key: 'second',
+    //     tableColumns: [
+    //       // { key: "id", title: "主键" },
+    //       { key: "orderId", title: "采购订单ID" },
+    //       { key: "rowno", title: "行号" },
+    //       { key: "material", title: "物料" },
+    //       { key: "materialName", title: "物料名称" },
+    //       { key: "specification", title: "规格" },
+    //       { key: "qty", title: "数量" },
+    //       { key: "stroageQty", title: "累计到货主数量" },
+    //       { key: "stockQty", title: "累计入库主数量" },
+    //       { key: "invoiceQty", title: "累计开票主数量" },
+    //       { key: "rollbackQty", title: "累计退货主数量" },
+    //       { key: "backStockQty", title: "累计退库主数量" },
+    //       { key: "floatQty", title: "未到货数量" },
+    //       // { key: "tenantId", title: "租户号" },
+    //       // { key: "revision", title: "乐观锁" },
+    //       { key: "createByName", title: "创建人名称" },
+    //       { key: "updateByName", title: "更新人名称" },
+    //       // { key: "delFlag", title: "删除标记" }
+    //     ]
+    //   },
+    // ];
+    // const initTabColumns = () => tabColumns;
+    return {
+      visible: false,
+      columns: NewColumns,
+      rules: initRules(NewColumns),
+      params: {
+        ...initParams(NewColumns),
+        puOrderItemList: [],
+        puOrderExecuteList: [],
+      },
+
+      tabColumns: NewTabColumns,
+      tabName: "puOrderItemList",
+      // tabTableDatas: {
+      //   first: [],
+      //   second: [],
+      //   // third: [],
+      //   // fourth: [],
+      //   // fifth: [],
+      // },
+    };
+  },
+  computed: {},
+  watch: {},
+  methods: {
+    setVisible(prop) {
+      this.visible = prop;
+    },
+    //
+    async fetchItem(prop) {
+      try {
+        this.loading = true;
+        const { code, msg, data } = await item(prop);
+        if (code === 200) {
+          this.params = data;
+          this.$notify.success({ title: msg });
+        } else {
+          this.$notify.warning({ title: msg });
+        }
+      } catch (err) {
+        this.$notify.error({ title: "error", message: err });
+      } finally {
+        this.loading = false;
+      }
+    },
+    // 取 消
+    handleCancel() {
+      this.setVisible(false);
+      this.params = initParams(Columns);
+    },
+  },
+  created() { },
+  mounted() { },
+  destroyed() { },
+};
+</script>
+<template>
+  <el-drawer direction="btt" size="100%" :with-header="false" :visible.sync="visible" @open="beforeOpen"
+    @close="$emit('close')">
+    <el-form size="mini" label-position="right" label-width="135px" :model="params" :rules="rules">
+      <el-card :body-style="{
+        padding: '20px',
+        display: 'flex',
+        'flex-wrap': 'wrap',
+      }" style="margin: 10px">
+        <div slot="header" style="
+            display: flex;
+            justify-content: space-between;
+            align-items: center;
+          ">
+          <h3>查看</h3>
+          <div style="text-align: right">
+            <el-button size="mini" @click="handleCancel">取 消</el-button>
+          </div>
+        </div>
+        <el-row>
+          <el-col v-for="(column, index) in columns" :key="index" :span="column.span || 6">
+            <el-form-item :prop="column.key" :label="column.title">
+              <el-input v-if="column.type === 'Textarea'" v-model="params[column.key]" type="textarea"
+                :placeholder="column.placeholder" :clearable="column.clearable" :disabled="column.disabled"
+                :readonly="column.readonly" style="width: 100%"></el-input>
+              <el-input-number v-else-if="column.type === 'InputNumber'" v-model="params[column.key]"
+                :controls-position="column.config.controlsPosition" :placeholder="column.placeholder"
+                :clearable="column.clearable" :disabled="column.disabled" :readonly="column.readonly"
+                style="width: 100%"></el-input-number>
+              <el-select v-else-if="column.type === 'Select'" v-model="params[column.key]"
+                :placeholder="column.placeholder" :clearable="column.clearable" :disabled="column.disabled"
+                :readonly="column.readonly" style="width: 100%">
+                <el-option v-for="item in dict.type[column.config.optionsName]" :key="item.value" :label="item.label"
+                  :value="item.value">
+                </el-option>
+              </el-select>
+              <el-date-picker v-else-if="column.type === 'DatePicker'" v-model="params[column.key]"
+                :type="column.config.type" :placeholder="column.placeholder" :clearable="column.clearable"
+                :disabled="column.disabled" :readonly="column.readonly" :picker-options="column.pickerOptions"
+                style="width: 100%">
+              </el-date-picker>
+              <el-upload v-else-if="column.type === 'Upload'" :file-list="params[column.key]" :disabled="column.disabled"
+                :readonly="column.readonly" drag action="https://jsonplaceholder.typicode.com/posts/" multiple>
+                <i class="el-icon-upload"></i>
+                <div class="el-upload__text">
+                  将文件拖到此处，或<em>点击上传</em>
+                </div>
+                <div class="el-upload__tip" slot="tip">
+                  只能上传jpg/png文件，且不超过500kb
+                </div>
+              </el-upload>
+              <el-input v-else v-model="params[column.key]" :placeholder="column.placeholder"
+                :clearable="column.clearable" :disabled="column.disabled" :readonly="column.readonly"
+                style="width: 100%"></el-input>
+            </el-form-item>
+          </el-col>
+        </el-row>
+      </el-card>
+      <el-card :body-style="{
+        padding: '20px',
+        display: 'flex',
+        'flex-wrap': 'wrap',
+        position: 'relative',
+      }" style="margin: 10px">
+        <el-tabs v-model="tabName" style="width: 100%">
+          <el-tab-pane v-for="(column, index) in tabColumns" :key="index" :label="column.title" :name="column.key">
+            <el-table :data="params[column.key]" style="width: 100%">
+              <el-table-column v-for="(cColumn, cIndex) in column.tableColumns" :key="cIndex" :prop="cColumn.key"
+                :label="cColumn.title" :width="cColumn.width">
+                <template slot-scope="scope">
+                  <el-tag v-if="cColumn.key === 'index'">
+                    {{ scope.$index + 1 }}
+                  </el-tag>
+                  <el-input v-if="cColumn.type === 'Input'" v-model="scope.row[cColumn.key]"
+                    :placeholder="cColumn.placeholder" :clearable="cColumn.clearable" :disabled="cColumn.disabled"
+                    size="mini" style="width: 100%"></el-input>
+                  <el-input-number v-if="cColumn.type === 'InputNumber'" v-model="scope.row[cColumn.key]"
+                    :controls-position="cColumn.config.controlsPosition" :placeholder="cColumn.placeholder"
+                    :clearable="cColumn.clearable" :disabled="cColumn.disabled" size="mini"
+                    style="width: 100%"></el-input-number>
+                  <el-input v-if="column.type === 'InputDialog'" v-model="params[column.key]"
+                    :placeholder="column.placeholder" :clearable="column.clearable" :disabled="column.disabled"
+                    :readonly="column.readonly" style="width: 100%; cursor: pointer"
+                    @click.native.stop="openAsyncInputDialog(column, params)">
+                    <template #suffix>
+                      <el-icon class="el-icon-thumb"></el-icon>
+                    </template>
+                  </el-input>
+                </template>
+              </el-table-column>
+              <el-table-column fixed="right" label="操作" width="120">
+                <template slot-scope="scope">
+                  <el-button @click.native.prevent="
+                    delTableRow(params[tabName], scope.$index)
+                    " type="text" size="small">
+                    删行
+                  </el-button>
+                </template>
+              </el-table-column>
+            </el-table>
+          </el-tab-pane>
+        </el-tabs>
+        <el-row style="position: absolute; top: 20px; right: 20px">
+          <el-button size="mini" @click="addTableRow(params[tabName])">增行</el-button>
+        </el-row>
+      </el-card>
+    </el-form>
+  </el-drawer>
+</template>

src/views/purchase/purchase-task/add-purchase-task.vue

@@ -5,13 +5,11 @@ import {
   initDicts,
   initRules,
   initParams,
-  initComponents,
 } from "@/utils/init";
 import { initColumns } from "./config/add";
 
 export default {
   name: "AddPurchaseTaskDrawer",
-  // components: initComponents(initColumns()),
   dicts: initDicts(initColumns()),
   data() {
     return {

vue.config.js

@@ -45,7 +45,7 @@ module.exports = {
         target: `http://172.16.13.152:8000/drp-admin`, //豪哥本地
         // target: `http://172.16.13.47:8000/drp-admin`, //石杨本地
         // target: `http://172.16.13.113:8000/drp-admin`, //DWT本地
-        target: `http://172.16.13.77:8000/drp-admin`, //TQ本地
+        // target: `http://172.16.13.77:8000/drp-admin`, //TQ本地
         changeOrigin: true,
         pathRewrite: {
           ["^" + process.env.VUE_APP_BASE_API]: "",