凭证框修改

src/views/accounting/attachment/index.vue

@@ -169,25 +169,6 @@
         style="margin-top: 20px"
       >
         <el-row>
-          <el-col :span="8">
-            <el-form-item label="会计凭证" prop="voucherNum">
-              <el-select
-                v-model="form.voucherNum"
-                filterable
-                placeholder="请选择会计凭证"
-                value-key="id"
-                @change="handleSelectVoucher"
-              >
-                <el-option
-                  v-for="item in kjpzOptions"
-                  :key="item.id"
-                  :label="item.voucherNum"
-                  :value="item"
-                >
-                </el-option>
-              </el-select>
-            </el-form-item>
-          </el-col>
           <el-col :span="8">
             <el-form-item label="OA/ERP流程编号" prop="flowCode">
               <el-input
@@ -196,6 +177,30 @@
               />
             </el-form-item>
           </el-col>
+          <el-col :span="8">
+            <el-form-item label="凭证号" prop="voucherNum">
+              <el-input
+                v-model="form.voucherNum"
+                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>
         <el-form-item label="备注" prop="remark">
           <el-input
@@ -226,10 +231,11 @@ import {
 } from "@/api/accounting/attachment";
 import { getAccessToken, getTenantId } from "@/utils/auth";
 import { getVoucherPage } from "@/api/accounting/voucher";
+import VoucherSelect from "@/components/VoucherSelect/single.vue";
 
 export default {
   name: "Attachment",
-  components: {},
+  components: { VoucherSelect },
   data() {
     return {
       optType: undefined,
@@ -460,6 +466,15 @@ export default {
         })
         .catch(() => {});
     },
+    handleSelectVoucher() {
+      this.$refs.VoucherSelect.showFlag = true;
+    },
+    onVoucherSelected(obj) {
+      console.log(obj);
+      if (obj != undefined && obj != null) {
+        this.form.voucherNum = obj.voucherNum;
+      }
+    },
   },
 };
 </script>

src/views/accounting/flow/index.vue

@@ -188,22 +188,27 @@
             </el-form-item>
           </el-col>
           <el-col :span="8">
-            <el-form-item label="会计凭证" prop="voucherNum">
-              <el-select
+            <el-form-item label="凭证号" prop="voucherNum">
+              <el-input
                 v-model="form.voucherNum"
-                filterable
-                placeholder="请选择会计凭证"
-                value-key="id"
-                @change="handleSelectVoucher"
+                placeholder="请选择凭证"
+                readonly
               >
-                <el-option
-                  v-for="item in kjpzOptions"
-                  :key="item.id"
-                  :label="item.voucherNum"
-                  :value="item"
-                >
-                </el-option>
-              </el-select>
+                <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>
@@ -266,10 +271,11 @@ import {
 } from "@/api/accounting/flow";
 import { getAccessToken, getTenantId } from "@/utils/auth";
 import { getVoucherPage } from "@/api/accounting/voucher";
+import VoucherSelect from "@/components/VoucherSelect/single.vue";
 
 export default {
   name: "Flow",
-  components: {},
+  components: { VoucherSelect },
   data() {
     return {
       optType: undefined,
@@ -429,11 +435,6 @@ export default {
         this.title = "修改审批流程";
       });
     },
-    //凭证选择
-    handleSelectVoucher(val) {
-      this.form.voucherId = val.id;
-      this.form.voucherNum = val.voucherNum;
-    },
     /** 提交按钮 */
     submitForm() {
       this.$refs["form"].validate((valid) => {
@@ -521,6 +522,15 @@ export default {
           .catch(() => {});
       });
     },
+    handleSelectVoucher() {
+      this.$refs.VoucherSelect.showFlag = true;
+    },
+    onVoucherSelected(obj) {
+      console.log(obj);
+      if (obj != undefined && obj != null) {
+        this.form.voucherNum = obj.voucherNum;
+      }
+    },
   },
 };
 </script>