发票管理-关联凭证的弹窗修改选择框

src/views/accounting/invoices/index.vue

@@ -688,7 +688,7 @@
     </el-dialog>
     <!-- 密码输入框-->
     <el-dialog
-      :title="title"
+      title="输入密码"
       :visible.sync="open1"
       width="800px"
       append-to-body
@@ -717,24 +717,35 @@
     </el-dialog>
     <!-- 会计凭证选择框-->
     <el-dialog
-      :title="title"
+      title="关联凭证"
       :visible.sync="open2"
       width="800px"
       append-to-body
     >
-      <el-form ref="form" :model="form" :rules="rules1" label-width="140px">
+      <el-form ref="form" :model="form" :rules="rules" label-width="140px">
         <el-row>
           <el-col :span="14">
             <el-form-item label="会计凭证" prop="voucherId">
-              <el-select v-model="form.voucherId" placeholder="请选择会计凭证">
-                <el-option
-                  v-for="item in kjpzOptions"
-                  :key="item.id"
-                  :label="item.voucherNum"
-                  :value="item.id"
-                >
-                </el-option>
-              </el-select>
+              <el-input
+                v-model="form.voucherId"
+                placeholder="请选择凭证"
+                readonly
+              >
+                <el-button
+                  slot="append"
+                  @click="handleSelectVoucher"
+                  icon="el-icon-search"
+                  style="
+                    border-color: #46a6ff;
+                    background-color: #46a6ff;
+                    color: white;
+                  "
+                ></el-button>
+              </el-input>
+              <VoucherSelect
+                ref="VoucherSelect"
+                @onSelected="onVoucherSelected"
+              />
             </el-form-item>
           </el-col>
         </el-row>
@@ -762,10 +773,14 @@ import {
 import { getVoucherPage } from "@/api/accounting/voucher";
 import { listData } from "@/api/system/dict/data";
 import { getAccessToken } from "@/utils/auth";
+import VoucherSelect from "@/components/VoucherSelect/single.vue";
 
 export default {
   name: "Invoices",
-  components: { UploadInvoice: () => import("@/components/UploadInvoice") },
+  components: {
+    UploadInvoice: () => import("@/components/UploadInvoice"),
+    VoucherSelect,
+  },
   data() {
     return {
       // 遮罩层
@@ -875,8 +890,6 @@ export default {
         inputPassword: [
           { required: true, message: "密码不能为空", trigger: "blur" },
         ],
-      },
-      rules1: {
         voucherId: [{ required: true, message: "请选择凭证", trigger: "blur" }],
       },
       // 用户导入参数
@@ -1211,8 +1224,9 @@ export default {
     },
     //关联凭证
     handleGLPZ() {
-      this.open2 = true;
       this.form.voucherId = null;
+      this.open2 = true;
+      console.log(this.form);
     },
     submitForm2() {
       this.$refs["form"].validate((valid) => {
@@ -1304,6 +1318,15 @@ export default {
           .catch(() => {});
       });
     },
+    handleSelectVoucher() {
+      this.$refs.VoucherSelect.showFlag = true;
+    },
+    onVoucherSelected(obj) {
+      console.log(obj);
+      if (obj != undefined && obj != null) {
+        this.form.voucherId = obj.id;
+      }
+    },
   },
 };
 </script>