From 611a7f0c4a20ea97f56b2b08e30100ffa9327420 Mon Sep 17 00:00:00 2001
From: linfso <linfso@sina.com>
Date: Thu, 25 Jul 2024 14:12:48 +0800
Subject: [PATCH] md

---
 .../EmisBaseTools/BaseInvoiceInfoPicker.vue   | 126 +++++++++++
 src/views/emis/EmisBaseTools/TaxInput.vue     | 208 ++++++++++++++++++
 2 files changed, 334 insertions(+)
 create mode 100644 src/views/emis/EmisBaseTools/BaseInvoiceInfoPicker.vue
 create mode 100644 src/views/emis/EmisBaseTools/TaxInput.vue

diff --git a/src/views/emis/EmisBaseTools/BaseInvoiceInfoPicker.vue b/src/views/emis/EmisBaseTools/BaseInvoiceInfoPicker.vue
new file mode 100644
index 00000000..c864da78
--- /dev/null
+++ b/src/views/emis/EmisBaseTools/BaseInvoiceInfoPicker.vue
@@ -0,0 +1,126 @@
+<template>
+   <el-select
+      style="width:100%"
+      ref="selectRef"
+      filterable
+      clearable
+      remote
+      :remote-method="remoteDebounce"
+      v-model="svalue"
+      :placeholder="placeholder"
+      auto-complete="new-password"
+
+      :disabled="disabled"
+
+      @blur="onBlur"
+      @change="onChange"
+      @click.native="onClick"
+      @visible-change="reverseArrow"
+      >
+        <el-option v-for="item in optionItems" :key="item.companyTaxNo" :label="item.comCode" :value="item.companyTaxNo" ></el-option>
+    </el-select>
+</template>
+<script>
+  import emitter from 'element-ui/src/mixins/emitter';
+  import { listEmisBaseInvoiceInfo } from "@/api/emis/emisBaseInvoiceInfo";
+
+  import { debounce} from "@/utils/custom";
+
+  export default {
+    name: "BaseInvoiceInfoPicker",
+    mixins: [emitter],
+    props: {
+      value: {
+        type: [String],
+        required: false
+      },
+      placeholder:{
+        type: [String],
+        required: false
+      },
+      disabled:{
+        type: [Boolean],
+        required: false
+      },
+
+    },
+    data() {
+      return {
+        svalue: this.value,
+        optionItems: [],
+
+        // 缺省值
+        defaultItems: null,
+        countryMap:new Map()
+      };
+    },
+    watch: {
+      value(newVal,oldVal) {
+        // 逻辑 有初始值先查询初值
+        // if(this.value!=null){
+
+          this.svalue=this.value;
+          this.queryData(null,this.svalue);
+        // }
+      },
+    },
+    created() {
+      if(this.svalue!=null){
+          this.queryData(null,this.svalue);
+      }
+    },
+    mounted(){
+      let rulesDom = this.$refs["selectRef"].$el.querySelector(".el-input .el-input__suffix .el-input__suffix-inner .el-input__icon"); // 找到dom
+      rulesDom.classList.add("el-icon-arrow-up"); // 对dom新增class
+    },
+    methods: {
+      onClick(){
+        // 第一次点击时需要初始化
+        if(!this.defaultItems){
+          this.queryData(null,null);
+        }else{
+          this.optionItems = [...this.defaultItems];
+        }
+      },
+      onBlur(val){
+        this.$emit("input", this.svalue);
+        this.dispatch('ElFormItem', 'el.form.blur');
+      },
+      onChange() {
+          this.$emit("input", this.svalue);
+          let itemData = this.optionItems.find(item => item.companyTaxNo == this.svalue);
+          this.$emit("change",itemData);
+          this.$emit("onChange",itemData);
+          this.dispatch('ElFormItem', 'el.form.change', [this.svalue]);
+      },
+      remoteDebounce(val,key){
+        debounce(this.queryData(val,key),1000);
+      },
+      queryData(val,key) {
+        this.optionItems=[];
+        let queryParams = {
+          pageNum:1,
+          pageSize:10,
+          companyName:val
+        };
+        listEmisBaseInvoiceInfo(queryParams).then(response => {
+          this.optionItems =response.rows;
+          // 初始值存储
+          if(key==null && val==null){
+            this.defaultItems=[...this.optionItems]
+          }
+        });
+      },
+      reverseArrow(flag) {
+        let rulesDom = this.$refs["selectRef"].$el.querySelector(
+          ".el-input .el-input__suffix .el-input__suffix-inner .el-input__icon"
+        ); // 找到dom
+        if (flag) {
+          rulesDom.classList.add("is-reverse"); // 对dom新增class
+        } else {
+          rulesDom.classList.remove("is-reverse"); // 对dom新增class
+        }
+      },
+    }
+  };
+</script>
diff --git a/src/views/emis/EmisBaseTools/TaxInput.vue b/src/views/emis/EmisBaseTools/TaxInput.vue
new file mode 100644
index 00000000..0c6a28c6
--- /dev/null
+++ b/src/views/emis/EmisBaseTools/TaxInput.vue
@@ -0,0 +1,208 @@
+<template>
+  <div :id="createdId">
+    <el-popover
+          placement="bottom"
+          trigger="click"
+          ref="popoverRef"
+          :popper-options="{ boundariesElement: '.el-form', removeOnDestroy: true }"
+        >
+        <div >
+            <el-table
+              ref="comboGridTable"
+              v-loading="loading"
+              style="width: 100%;"
+              :data="optionItems"
+              @row-click="onRowClick"
+              :row-key="row => row.goodsCode"
+              stripe
+              :row-style="isRed"
+              element-loading-text="Loading"
+              >
+              <el-table-column label="序号" align="center" width="60">
+                  <template slot-scope="scope">
+                      <span v-text="getIndex(scope.$index)"> </span>
+                  </template>
+              </el-table-column>
+              <el-table-column label="货物名称" align="left" prop="goodsName" width="100" />
+
+            </el-table>
+            <el-pagination v-show="pagination" small
+            :total="total"
+            :page-size="5"
+            layout="prev, pager, next, total"
+            @current-change="changePage"
+            />
+        </div>
+
+          <el-input
+          slot="reference"
+          ref="inputValue"
+          :value="svalue"
+          :placeholder="placeholder"
+          @input="onInput"
+          @blur="onBlur"
+          @clear="onClear"
+          clearable
+            >
+                <!-- <template slot="suffix">
+                  <i slot="suffix" class="el-icon-edit"></i>
+                </template> -->
+          </el-input>
+
+    </el-popover>
+
+  </div>
+</template>
+<script>
+
+import emitter from 'element-ui/src/mixins/emitter';
+import { debounce } from 'throttle-debounce'
+
+ export default {
+   name: "TaxInput",
+   mixins: [emitter],
+   props: {
+      value: {
+        type: String,
+        required: false
+      },
+      placeholder:{
+        type: String,
+        required: false
+      },
+      disabled:{
+       type: [Boolean,String],
+       required: false
+      },
+      pagination: {
+        type: Boolean, default: true
+      },
+   },
+   data() {
+     return {
+       createdId: '0',
+       loading:false,
+
+       total:0,
+       optionItems: [],
+
+       svalue: this.value,
+
+       queryParams:{
+         pageNum:1,
+         pageSize:5,
+         goodsName:null,
+         searchValue:null,
+       }
+     };
+   },
+   watch: {
+     value(newVal,oldVal) {
+        this.svalue=this.value;
+     },
+
+   },
+   mounted() {
+    // 给个随机id 判断是否clickoutside
+    this.createdId = String(new Date().getTime())
+   },
+   created() {
+    this.svalue=this.value;
+    this.optionItems=[
+          {
+            "goodsName": "代理报关费",
+            "goodsCode": "304080202",
+            "specType": "次",
+            "unit": "次",
+            "price": "0",
+            "num": "1",
+            "taxRate": "0.06",
+            "withTaxFlag": "1"
+          },
+          {
+            "goodsName": "国际代理运输",
+            "goodsCode": "30408020102",
+            "specType": "次",
+            "unit": "次",
+            "price": "0",
+            "num": "1",
+            "taxRate": "0.00",
+            "withTaxFlag": "1"
+          },
+          {
+            "goodsName": "派送费",
+            "goodsCode": "304040903",
+            "specType": "次",
+            "unit": "次",
+            "price": "0",
+            "num": "1",
+            "taxRate": "0.06",
+            "withTaxFlag": "1"
+          },
+          {
+            "goodsName": "代理运输费",
+            "goodsCode": "30105020202",
+            "specType": "次",
+            "unit": "次",
+            "price": "0",
+            "num": "1",
+            "taxRate": "0.09",
+            "withTaxFlag": "1"
+          }
+       ];
+   },
+   methods: {
+    onInput(val) {
+      this.svalue = val;
+      this.queryParams.pageNum = 1
+      this.queryParams.goodsName=val;
+      debounce(250, this.queryData() );
+    },
+    onRowClick(row, column, event) {
+        this.svalue=row.goodsName;
+
+        this.$emit("input", this.svalue);
+        this.$emit("onChange",row);
+        this.$refs.popoverRef.doClose();
+     },
+    isRed({ row }) {
+     if (row.goodsName == this.svalue) {
+        return {
+          "color": "red",
+          "font-weight": "bold",
+        };
+      }
+    },
+    onClear(el){
+      this.svalue = null;
+
+      this.$emit("input", this.svalue);
+      this.dispatch('ElFormItem', 'el.form.blur', [this.svalue]);
+    },
+    onBlur(el) {
+      this.$emit("input", this.svalue);
+      this.dispatch('ElFormItem', 'el.form.blur', [this.svalue]);
+    },
+    changePage(cur) {
+      this.queryParams.pageNum = cur
+      this.queryData()
+    },
+    queryData() {
+       this.loading = true;
+
+
+      //  代理报关费 :6% ,国际代理运输费:0% 派送费:6% 代理运输费 9%
+
+      //  listSimpleEmisGoods(this.queryParams).then(response => {
+      //    this.loading = false;
+      //    this.total = response.total;
+      //    this.optionItems = response.rows;
+
+      //  });
+     },
+     getIndex($index) {
+          return (this.queryParams.pageNum - 1) * this.queryParams.pageSize + $index + 1
+    },
+   }
+ };
+</script>