Browse Source

update contract

002201 1 year ago
parent
commit
9058ad7b0c

+ 106 - 140
src/views/purchase/contract/add/index.vue

@@ -4,7 +4,7 @@ import { ADD, CODE, LINKAGREEMENT } from "@/api/business/purchase/contract";
 import { tax, currency } from "@/components/popover-select-v2/fetch";
 
 export default {
-  name: "AddDrawer",
+  name: "AddFormModel",
   props: {
     selectData: {
       type: [Array],
@@ -14,9 +14,8 @@ export default {
       type: Object,
       require: true,
     },
-    addType: {
+    title: {
       type: String,
-      default: "add",
     },
   },
   components: {
@@ -37,9 +36,8 @@ export default {
     const rules = this.$init.rules([...TabColumns, ...TableColumns]);
     const params = this.$init.params([...TabColumns, ...TableColumns]);
     return {
-      width: "100%",
-      visible: false,
       loading: false,
+      loadingText: "",
       rules: rules,
       params: params,
       tabName: tabName,
@@ -47,22 +45,7 @@ export default {
       TableColumns: TableColumns,
     };
   },
-  computed: {
-    title: {
-      get() {
-        const { addType } = this.$props;
-        if (addType === "add") {
-          this.params.source = "自制";
-          return "新 增";
-        }
-        if (addType === "record") {
-          this.params.source = "期初补录";
-          return "期初补录";
-        }
-      },
-      set() {},
-    },
-  },
+  computed: {},
   watch: {
     "params.isRebate": {
       handler: function (newValue) {
@@ -130,8 +113,8 @@ export default {
     async open() {
       try {
         //
-        this.visible = true;
         this.loading = true;
+        this.loadingText = "获取合同编码中";
         //
         const {
           user: {
@@ -150,6 +133,9 @@ export default {
         this.params.puDept = puDept;
         this.params.puDeptName = puDeptName;
         //
+        const { title } = this.$props;
+        this.params.source = title === "新 增" ? "自制" : "期初补录";
+        //
         const { id, code, name } = await currency("人民币");
         this.params.currency = id;
         this.params.currencyCode = code;
@@ -165,18 +151,7 @@ export default {
     },
     //
     async hide() {
-      const {
-        TabColumns,
-        TableColumns,
-        TabColumns: [
-          {
-            item: { key: tabName },
-          },
-        ],
-      } = useColumns();
-      this.visible = false;
-      this.tabName = tabName;
-      this.params = this.$init.params([...TabColumns, ...TableColumns]);
+      this.$emit("close");
     },
     //
     async useRowAdd(prop) {
@@ -194,11 +169,12 @@ export default {
           try {
             // try
             this.loading = true;
+            this.loadingText = "提交合同中";
             const params = { ...this.params };
             const { msg, code } = await ADD(params);
             if (code === 200) {
               this.hide();
-              this.$emit("success");
+              this.$emit("submit-success");
               this.$notify.success(msg);
             }
           } catch (err) {
@@ -214,122 +190,112 @@ export default {
       });
     },
   },
-  created() {},
+  created() {
+    this.open();
+  },
   mounted() {},
   destroyed() {},
 };
 </script>
 <template>
-  <el-button v-bind="$attrs" v-on="$listeners" @click="open">
-    {{ title }}
-    <el-drawer
-      :size="width"
-      :title="title"
-      :visible.sync="visible"
-      append-to-body
-      destroy-on-close
-      :show-close="false"
-      @close="hide"
+  <div
+    v-loading="loading"
+    :element-loading-text="loadingText"
+    style="height: 100vh; display: flex; flex-direction: column"
+  >
+    <div
+      style="
+        height: 50px;
+        display: flex;
+        justify-content: space-between;
+        align-items: center;
+        padding: 0 18px;
+      "
     >
-      <div
-        slot="title"
-        style="
-          display: flex;
-          justify-content: space-between;
-          align-items: center;
-        "
+      <h4 class="m-0" style="font-weight: 500; flex: 1">{{ title }}</h4>
+      <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
       >
-        <h3 class="m-0">{{ title }}</h3>
-        <div style="text-align: right">
-          <el-button
-            type="primary"
+    </div>
+    <div v-if="params.code" style="flex: 1; overflow-y: auto">
+      <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: 18px"
+      >
+        <template slot="paymentAgreement" slot-scope="scope">
+          <component
+            v-bind="scope.attr"
+            v-model="scope.row[scope.item.key]"
             :size="$attrs.size"
-            :loading="loading"
-            @click="useSubmit('superForm')"
-            >确 认</el-button
-          >
-          <el-button :size="$attrs.size" :loading="loading" @click="hide"
-            >取 消</el-button
+            :source.sync="scope.row"
+            @change="changePaymentAgreement({ ...scope, selectData: $event })"
           >
-        </div>
-      </div>
-      <div
-        v-loading="loading"
-        style="height: 100%; display: flex; flex-direction: column"
+          </component>
+        </template>
+      </el-super-form>
+    </div>
+    <el-tabs v-if="params.code" v-model="tabName" style="margin: 0 18px 18px">
+      <el-tab-pane
+        v-for="{ item, TableColumns: columns } in TabColumns"
+        :key="item.key"
+        :label="item.title"
+        :name="item.key"
+        lazy
       >
-        <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: 18px; flex: 1; overflow-y: auto"
-        >
-          <template slot="paymentAgreement" slot-scope="scope">
-            <component
-              v-bind="scope.attr"
-              v-model="scope.row[scope.item.key]"
-              :size="$attrs.size"
-              :source.sync="scope.row"
-              @change="changePaymentAgreement({ ...scope, selectData: $event })"
-            >
-            </component>
-          </template>
-        </el-super-form>
-
-        <el-tabs v-model="tabName" style="margin: 0 18px 18px">
-          <el-tab-pane
-            v-for="{ item, TableColumns: columns } in TabColumns"
-            :key="item.key"
-            :label="item.title"
-            :name="item.key"
-            lazy
+        <div style="height: 25vh; display: flex">
+          <el-super-table
+            v-model="params[item.key]"
+            :dict="dict"
+            :ref="tabName"
+            :columns="columns"
+            :size="$attrs.size"
+            index
           >
-            <div style="height: 25vh; display: flex">
-              <el-super-table
-                v-model="params[item.key]"
-                :dict="dict"
-                :ref="tabName"
-                :columns="columns"
+            <template slot="materialName" slot-scope="scope">
+              <component
+                v-bind="scope.attr"
+                v-model="scope.row[scope.item.key]"
                 :size="$attrs.size"
-                index
+                :source.sync="scope.row"
+                @change="changeMaterialName(scope)"
               >
-                <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>
-                <el-table-column fixed="right" label="操作" width="75">
-                  <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>
-                  </template>
-                </el-table-column>
-              </el-super-table>
-            </div>
-          </el-tab-pane>
-        </el-tabs>
-      </div>
-    </el-drawer>
-  </el-button>
+              </component>
+            </template>
+            <el-table-column fixed="right" label="操作" width="75">
+              <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>
+              </template>
+            </el-table-column>
+          </el-super-table>
+        </div>
+      </el-tab-pane>
+    </el-tabs>
+  </div>
 </template>

+ 115 - 150
src/views/purchase/contract/edit/index.vue

@@ -1,16 +1,15 @@
 <script>
 import useColumns from "./columns";
-import { REFER } from "@/components/popover-select/api";
 import {
   EDIT,
   ITEM,
   TABLE,
   ALTERATION,
 } from "@/api/business/purchase/contract";
-import { tax, currency } from "@/components/popover-select-v2/fetch";
+import { tax } from "@/components/popover-select-v2/fetch";
 
 export default {
-  name: "EditDrawer",
+  name: "EditFormModel",
   props: {
     selectData: {
       type: [Array],
@@ -20,6 +19,9 @@ export default {
       type: Object,
       require: true,
     },
+    title: {
+      type: String,
+    },
   },
   components: {
     ElSuperForm: () => import("@/components/super-form/index.vue"),
@@ -39,10 +41,8 @@ export default {
     const rules = this.$init.rules(TableColumns);
     const params = this.$init.params([...TabColumns, ...TableColumns]);
     return {
-      title: "编 辑",
-      width: "100%",
-      visible: false,
       loading: false,
+      loadingText: "",
       rules: rules,
       params: params,
       tabName: tabName,
@@ -51,21 +51,9 @@ export default {
     };
   },
   computed: {
-    disabled: {
+    id: {
       get() {
-        const {
-          selectData,
-          selectData: [{ status } = {}],
-        } = this;
-        if (selectData.length !== 1) {
-          return true;
-        }
-        if (selectData.length === 1 && status === "1") {
-          return true;
-        }
-        if (selectData.length === 1 && status === "2") {
-          return true;
-        }
+        return this.$props.selectData[0].id;
       },
       set() {},
     },
@@ -138,6 +126,7 @@ export default {
       try {
         // try
         this.loading = true;
+        this.loadingText = "获取合同中";
         const { code, data } = await ITEM(prop);
         if (code === 200) {
           this.params = data;
@@ -153,25 +142,11 @@ export default {
     },
     //
     async open() {
-      const { selectData } = this.$props;
-      const [{ id }] = selectData;
-      this.visible = true;
-      await this.fetchItem(id);
+      await this.fetchItem(this.id);
     },
     //
     async hide() {
-      const {
-        TabColumns,
-        TableColumns,
-        TabColumns: [
-          {
-            item: { key: tabName },
-          },
-        ],
-      } = useColumns();
-      this.visible = false;
-      this.tabName = tabName;
-      this.params = this.$init.params([...TabColumns, ...TableColumns]);
+      this.$emit("close");
     },
     //
     async useRowAdd(prop) {
@@ -188,6 +163,7 @@ export default {
         try {
           // try
           this.loading = true;
+          this.loadingText = "删除子表中";
           const { code } = REMOVE(id, prop);
           if (code === 200) {
             this.fetchItem(contractId);
@@ -215,8 +191,10 @@ export default {
         // try
         this.loading = true;
         if (contractId) {
+          this.loadingText = "更新子表中";
           await EDIT(row, prop);
         } else {
+          this.loadingText = "新增信息中";
           await ADD({ ...row, contractId: id }, prop);
         }
       } catch (err) {
@@ -235,6 +213,7 @@ export default {
           try {
             // try
             this.loading = true;
+            this.loadingText = "更新合同中";
             const {
               params,
               params: { status },
@@ -243,7 +222,7 @@ export default {
             const { msg, code } = await TASK(params);
             if (code === 200) {
               this.hide();
-              this.$emit("success");
+              this.$emit("submit-success");
               this.$notify.success(msg);
             }
           } catch (err) {
@@ -259,131 +238,117 @@ export default {
       });
     },
   },
-  created() {},
+  created() {
+    this.open();
+  },
   mounted() {},
   destroyed() {},
 };
 </script>
 <template>
-  <el-button
-    v-bind="$attrs"
-    v-on="$listeners"
-    :disabled="disabled"
-    @click="open"
+  <div
+    v-loading="loading"
+    :element-loading-text="loadingText"
+    style="height: 100vh; display: flex; flex-direction: column"
   >
-    {{ title }}
-    <el-drawer
-      :size="width"
-      :title="title"
-      :visible.sync="visible"
-      append-to-body
-      :show-close="false"
-      destroy-on-close
-      @close="hide"
+    <div
+      style="
+        height: 50px;
+        display: flex;
+        justify-content: space-between;
+        align-items: center;
+        padding: 0 18px;
+      "
     >
-      <div
-        slot="title"
-        style="
-          display: flex;
-          justify-content: space-between;
-          align-items: center;
-        "
+      <h4 class="m-0" style="font-weight: 500; flex: 1">{{ title }}</h4>
+      <el-button
+        type="primary"
+        :size="$attrs.size"
+        :loading="loading"
+        @click="useSubmit('superForm')"
+        >确 认</el-button
       >
-        <h3 class="m-0">{{ title }}</h3>
-        <div style="text-align: right">
-          <el-button
-            type="primary"
+      <el-button :size="$attrs.size" :loading="loading" @click="hide"
+        >取 消</el-button
+      >
+    </div>
+    <div v-if="params.code" style="flex: 1; overflow-y: auto">
+      <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: 18px"
+      >
+        <template slot="paymentAgreement" slot-scope="scope">
+          <component
+            v-bind="scope.attr"
+            v-model="scope.row[scope.item.key]"
             :size="$attrs.size"
-            :loading="loading"
-            @click="useSubmit('superForm')"
-            >确 认</el-button
-          >
-          <el-button :size="$attrs.size" :loading="loading" @click="hide"
-            >取 消</el-button
+            :source.sync="scope.row"
+            @change="changePaymentAgreement({ ...scope, selectData: $event })"
           >
-        </div>
-      </div>
-      <div
-        v-loading="loading"
-        style="height: 100%; display: flex; flex-direction: column"
+          </component> </template
+      ></el-super-form>
+    </div>
+    <el-tabs v-if="params.code" v-model="tabName" style="margin: 0 18px 18px">
+      <el-tab-pane
+        v-for="{ item, TableColumns: columns } in TabColumns"
+        :key="item.key"
+        :label="item.title"
+        :name="item.key"
+        lazy
       >
-        <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: 18px; flex: 1; overflow-y: auto"
-        >
-          <template slot="paymentAgreement" slot-scope="scope">
-            <component
-              v-bind="scope.attr"
-              v-model="scope.row[scope.item.key]"
-              :size="$attrs.size"
-              :source.sync="scope.row"
-              @change="changePaymentAgreement({ ...scope, selectData: $event })"
-            >
-            </component> </template
-        ></el-super-form>
-        <el-tabs v-model="tabName" style="margin: 0 18px 18px">
-          <el-tab-pane
-            v-for="{ item, TableColumns: columns } in TabColumns"
-            :key="item.key"
-            :label="item.title"
-            :name="item.key"
-            lazy
+        <div style="height: 25vh; display: flex">
+          <el-super-table
+            v-model="params[item.key]"
+            :dict="dict"
+            :ref="tabName"
+            :columns="columns"
+            :size="$attrs.size"
+            index
           >
-            <div style="height: 25vh; display: flex">
-              <el-super-table
-                v-model="params[item.key]"
-                :dict="dict"
-                :ref="tabName"
-                :columns="columns"
+            <template slot="materialName" slot-scope="scope">
+              <component
+                v-bind="scope.attr"
+                v-model="scope.row[scope.item.key]"
                 :size="$attrs.size"
-                index
+                :source.sync="scope.row"
+                @change="changeMaterialName(scope)"
               >
-                <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>
-                <el-table-column fixed="right" label="操作" width="100">
-                  <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="useRowSubmit(tabName, scope)"
-                      >更新
-                    </el-button>
-                    <el-button
-                      type="text"
-                      :size="$attrs.size"
-                      @click.native.prevent="useRowRemove(tabName, scope)"
-                      >删行
-                    </el-button>
-                  </template>
-                </el-table-column>
-              </el-super-table>
-            </div>
-          </el-tab-pane>
-        </el-tabs>
-      </div>
-    </el-drawer>
-  </el-button>
+              </component>
+            </template>
+            <el-table-column fixed="right" label="操作" width="100">
+              <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="useRowSubmit(tabName, scope)"
+                  >更新
+                </el-button>
+                <el-button
+                  type="text"
+                  :size="$attrs.size"
+                  @click.native.prevent="useRowRemove(tabName, scope)"
+                  >删行
+                </el-button>
+              </template>
+            </el-table-column>
+          </el-super-table>
+        </div>
+      </el-tab-pane>
+    </el-tabs>
+  </div>
 </template>

+ 86 - 34
src/views/purchase/contract/index.vue

@@ -6,9 +6,10 @@ export default {
   name: "PuchaseContract",
   dicts: dicts,
   components: {
-    AddButton: () => import("./add/index.vue"),
+    AddFormModel: () => import("./add/index.vue"),
+    EditFormModel: () => import("./edit/index.vue"),
+    SeeFormModel: () => import("./see/index.vue"),
     SeeButton: () => import("./see/index.vue"),
-    EditButton: () => import("./edit/index.vue"),
     DeleButton: () => import("./delete/index.vue"),
     SubmButton: () => import("./submit/index.vue"),
     TermButton: () => import("./termination/index.vue"),
@@ -23,6 +24,8 @@ export default {
     return {
       size: "mini",
       loading: false,
+      drawerVisible: false,
+      components: { is: "", title: "" },
       params: params,
       tableData: [],
       selectData: [],
@@ -31,7 +34,35 @@ export default {
       page: { pageNum: 1, pageSize: 10, total: 0 },
     };
   },
-  computed: {},
+  computed: {
+    SeeDisabled: {
+      get() {
+        const { selectData } = this;
+        if (selectData.length !== 1) {
+          return true;
+        }
+      },
+      set() {},
+    },
+    EditDisabled: {
+      get() {
+        const {
+          selectData,
+          selectData: [{ status } = {}],
+        } = this;
+        if (selectData.length !== 1) {
+          return true;
+        }
+        if (selectData.length === 1 && status === "1") {
+          return true;
+        }
+        if (selectData.length === 1 && status === "3") {
+          return true;
+        }
+      },
+      set() {},
+    },
+  },
   created() {
     this.useQuery(this.params, this.page);
   },
@@ -83,8 +114,27 @@ export default {
     // 明 细
     async useSee(prop) {
       const { id } = prop;
-      const { open } = this.$refs.SeeButton;
-      await open(id);
+      this.drawerVisible = true;
+      this.components.title = id ? "明 细-" + id : "明 细";
+      this.components.is = "SeeFormModel";
+    },
+    // 新 增
+    useAdd() {
+      this.drawerVisible = true;
+      this.components.title = "新 增";
+      this.components.is = "AddFormModel";
+    },
+    // 期 初 补 录
+    useReord() {
+      this.drawerVisible = true;
+      this.components.title = "期 初 补 录";
+      this.components.is = "AddFormModel";
+    },
+    // 编 辑
+    useEdit() {
+      this.drawerVisible = true;
+      this.components.title = "编 辑";
+      this.components.is = "EditFormModel";
     },
   },
 };
@@ -108,43 +158,45 @@ export default {
       @reset="useReset"
       @submit="useQuery(params, page)"
     ></el-super-search>
-    <div style="margin: 20px 0; text-align: right">
+    <el-drawer
+      size="100%"
+      title="title"
+      :show-close="false"
+      :with-header="false"
+      :visible.sync="drawerVisible"
+      append-to-body
+      destroy-on-close
+    >
+      <components
+        :size="size"
+        :dict="dict"
+        :is="components.is"
+        :title="components.title"
+        :select-data="selectData"
+        @close="drawerVisible = false"
+        @submit-success="useQuery(params, page)"
+      ></components>
+    </el-drawer>
+    <div style="margin: 18px 0; text-align: right">
       <el-button-group>
-        <add-button
-          :size="size"
-          :dict="dict"
-          :add-type="'add'"
-          :select-data="selectData"
-          @success="useQuery(params, page)"
-        ></add-button>
-        <add-button
-          :size="size"
-          :dict="dict"
-          :add-type="'record'"
-          :select-data="selectData"
-          @success="useQuery(params, page)"
-        ></add-button>
+        <el-button :size="size" :disabled="SeeDisabled" @click="useSee">
+          明细
+        </el-button>
       </el-button-group>
       <el-button-group>
-        <edit-button
-          :size="size"
-          :dict="dict"
-          :select-data="selectData"
-          @success="useQuery(params, page)"
-        ></edit-button>
+        <el-button :size="size" @click="useAdd">新增</el-button>
+        <el-button :size="size" @click="useReord">期初补录</el-button>
+      </el-button-group>
+      <el-button-group>
+        <el-button :size="size" :disabled="EditDisabled" @click="useEdit">
+          编辑
+        </el-button>
         <dele-button
           :size="size"
           :select-data="selectData"
           @success="useQuery(params, page)"
         ></dele-button>
-        <see-button
-          v-show="false"
-          :size="size"
-          :dict="dict"
-          :select-data="selectData"
-          ref="SeeButton"
-        ></see-button
-      ></el-button-group>
+      </el-button-group>
       <el-button-group>
         <subm-button
           :size="size"

+ 65 - 47
src/views/purchase/contract/see/index.vue

@@ -3,7 +3,7 @@ import useColumns from "./columns";
 import { ITEM } from "@/api/business/purchase/contract";
 
 export default {
-  name: "SeeDrawer",
+  name: "SeeFormModel",
   props: {
     dict: {
       type: Object,
@@ -12,6 +12,9 @@ export default {
       type: [Array],
       require: true,
     },
+    title: {
+      type: String,
+    },
   },
   components: {
     ElSuperDescriptions: () =>
@@ -30,23 +33,20 @@ export default {
     } = useColumns();
     return {
       column: 2,
-      width: "100%",
-      title: "明 细",
-      visible: false,
       loading: false,
+      loadingText: "",
       params: {},
       tabName: tabName,
-      TabColumns,
-      TableColumns,
+      TabColumns: TabColumns,
+      TableColumns: TableColumns,
     };
   },
   computed: {
-    disabled: {
+    id: {
       get() {
-        const { selectData } = this;
-        if (selectData.length !== 1) {
-          return true;
-        }
+        const { title, selectData } = this.$props;
+        const id = title.split("-")[1];
+        return id ? id : selectData[0].id;
       },
       set() {},
     },
@@ -57,12 +57,11 @@ export default {
       try {
         // try
         this.loading = true;
+        this.loadingText = "获取合同中";
         const { code, data } = await ITEM(prop);
         if (code === 200) {
           this.params = data;
-          return true;
         } else {
-          return false;
         }
       } catch (err) {
         // catch
@@ -74,56 +73,75 @@ export default {
     },
     //
     async open(prop) {
-      this.visible = await this.fetchItem(prop);
+      this.fetchItem(prop ? prop : this.id);
     },
     //
     async hide() {
-      const {
-        TabColumns: [
-          {
-            item: { key: tabName },
-          },
-        ],
-      } = useColumns();
-      this.visible = false;
-      this.tabName = tabName;
+      this.$emit("close");
     },
   },
-  created() {},
+  created() {
+    this.open();
+  },
   mounted() {},
   destroyed() {},
 };
 </script>
 <template>
-  <el-button
-    v-bind="$attrs"
-    v-on="$listeners"
-    :disabled="disabled"
-    @click="open(selectData[0])"
+  <div
+    v-loading="loading"
+    :element-loading-text="loadingText"
+    style="height: 100vh; display: flex; flex-direction: column"
   >
-    {{ title }}
-    <el-drawer
-      :size="width"
-      :title="title"
-      :visible.sync="visible"
-      append-to-body
+    <div
+      style="
+        height: 50px;
+        display: flex;
+        justify-content: space-between;
+        align-items: center;
+        padding: 0 18px;
+      "
     >
+      <h4 class="m-0" style="font-weight: 500; flex: 1">
+        {{ title.split("-")[0] }}
+      </h4>
+      <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 v-if="params.code" style="flex: 1; overflow-y: auto">
       <el-super-descriptions
+        v-if="params.code"
         v-model="params"
         :dict="dict"
         :column="column"
         :size="$attrs.size"
         :columns="TableColumns"
+        style="padding: 18px"
       >
       </el-super-descriptions>
-      <el-tabs v-model="tabName" :size="$attrs.size" style="margin: 10px">
-        <el-tab-pane
-          v-for="{ item, TableColumns: columns } in TabColumns"
-          :key="item.key"
-          :name="item.key"
-          :label="item.title"
-          lazy
-        >
+    </div>
+    <el-tabs
+      v-if="params.code"
+      v-model="tabName"
+      :size="$attrs.size"
+      style="margin: 0 18px 18px"
+    >
+      <el-tab-pane
+        v-for="{ item, TableColumns: columns } in TabColumns"
+        :key="item.key"
+        :name="item.key"
+        :label="item.title"
+        lazy
+      >
+        <div style="height: 25vh; display: flex">
           <el-super-table
             v-model="params[item.key]"
             :size="$attrs.size"
@@ -132,8 +150,8 @@ export default {
             :iconOperation="false"
           >
           </el-super-table>
-        </el-tab-pane>
-      </el-tabs>
-    </el-drawer>
-  </el-button>
+        </div>
+      </el-tab-pane>
+    </el-tabs>
+  </div>
 </template>