From 30198d2cac12b753b1bc3a4bb6e696cf57f5f39c Mon Sep 17 00:00:00 2001
From: yangfeng <wanwan926_4@163.com>
Date: 星期四, 17 八月 2023 18:46:59 +0800
Subject: [PATCH] 收款计划、收款单、销售发票列表及新增页面

---
 src/views/service/index.vue                                         |    2 
 src/views/other/payment/receipt/addReceipt.vue                      |  638 ++++++++++++
 src/views/service/serviceContract/DetailServiceContract.vue         |   13 
 src/views/sales/index.vue                                           |    2 
 src/views/sales/salesDetails/AddSalesDetailsDialog.vue              |  100 +
 src/views/other/product/index.vue                                   |   10 
 src/views/service/clientServiceOrder/AddCientServiceOrderDialog.vue |    6 
 src/views/backgroundConfig/index.vue                                |    2 
 src/views/sales/salesDetails/DetailSpecification.vue                |   11 
 src/views/other/payment/receipt/index.vue                           |  231 ++++
 src/views/other/payment/collectionPlan/AddCollectionPlan.vue        |  531 ++++++++++
 src/views/service/serviceContract/index.vue                         |    4 
 src/views/service/serviceContract/AddServiceContractDialog.vue      |   59 
 src/views/client/client/index.vue                                   |    4 
 src/api/common/payment.js                                           |  127 ++
 src/components/makepager/CommonFormTableView.vue                    |   30 
 src/views/other/commonDialog/SelectCommonDialog.vue                 |   15 
 src/views/other/payment/saleInvoice/index.vue                       |  234 ++++
 src/views/sales/masterOrder/AddMasterOrderDialog.vue                |    9 
 src/views/sales/salesReturn/AddSalesReturnDialog.vue                |    4 
 src/views/sales/refundForm/AddRefundFormDialog.vue                  |    4 
 src/views/client/index.vue                                          |    2 
 src/views/client/client/AddClientManageDialog.vue                   |    5 
 src/views/other/payment/saleInvoice/addSaleInvoice.vue              |  726 ++++++++++++++
 src/views/other/payment/collectionPlan/index.vue                    |  234 ++++
 src/views/service/clientServiceOrder/index.vue                      |    5 
 26 files changed, 2,933 insertions(+), 75 deletions(-)

diff --git a/src/api/common/payment.js b/src/api/common/payment.js
new file mode 100644
index 0000000..d0da76d
--- /dev/null
+++ b/src/api/common/payment.js
@@ -0,0 +1,127 @@
+import request from "@/common/untils/request.js"
+import axios from "axios"
+
+// 鑾峰彇鏀舵璁″垝
+export const getCollectionPlanList = async (data) => {
+  return await axios.get(`/api/serviceCollectionPlan/list`, {
+    params: data
+  })
+}
+// 娣诲姞鏀舵璁″垝
+export function addCollectionPlan(data) {
+  return request({
+    url: "/api/serviceCollectionPlan/add",
+    method: "post",
+    data
+  })
+}
+// 鏇存柊鏀舵璁″垝
+export function updateCollectionPlan(data) {
+  return request({
+    url: "/api/serviceCollectionPlan/update",
+    method: "put",
+    data
+  })
+}
+// 鍒犻櫎鏀舵璁″垝
+export function deleteCollectionPlan(data) {
+  return request({
+    url: "/api/serviceCollectionPlan/delete/" + data.id,
+    method: "delete"
+  })
+}
+
+// 鑾峰彇鏀舵鍗�
+export const getReceiptList = async (data) => {
+  return await axios.get(`/api/receipt/list`, {
+    params: data
+  })
+}
+// 娣诲姞鏀舵鍗�
+export function addReceipt(data) {
+  return request({
+    url: "/api/receipt/add",
+    method: "post",
+    data
+  })
+}
+// 鏇存柊鏀舵鍗�
+export function updateReceipt(data) {
+  return request({
+    url: "/api/receipt/update",
+    method: "put",
+    data
+  })
+}
+// 鍒犻櫎鏀舵鍗�
+export function deleteReceipt(data) {
+  return request({
+    url: "/api/receipt/delete/" + data.id,
+    method: "delete"
+  })
+}
+
+// 鑾峰彇閿�鍞彂绁�
+export const getInvoiceList = async (data) => {
+  return await axios.get(`/api/invoice/list`, {
+    params: data
+  })
+}
+// 娣诲姞閿�鍞彂绁�
+export function addInvoice(data) {
+  return request({
+    url: "/api/invoice/add",
+    method: "post",
+    data
+  })
+}
+// 鏇存柊閿�鍞彂绁�
+export function updateInvoice(data) {
+  return request({
+    url: "/api/invoice/update",
+    method: "put",
+    data
+  })
+}
+// 鍒犻櫎閿�鍞彂绁�
+export function deleteInvoice(data) {
+  return request({
+    url: "/api/invoice/delete/" + data.id,
+    method: "delete"
+  })
+}
+
+// 鑾峰彇閾惰璐︽埛鍒楄〃
+export const getBankAccountList = async (data) => {
+  return await axios.get(`/api/bankAccount/list`, {
+    params: data
+  })
+}
+
+// 鑾峰彇鏀粯鏂瑰紡鍒楄〃
+export const getPaymentTypeList = async (data) => {
+  return await axios.get(`/api/paymentType/list`, {
+    params: data
+  })
+}
+
+// 鑾峰彇鍙戠エ绫诲埆鍒楄〃
+export const getInvoiceTypeList = async (data) => {
+  return await axios.get(`/api/invoiceType/list`, {
+    params: data
+  })
+}
+
+// 绁ㄦ嵁鐘舵�佸垪琛�
+export const getInvoiceStatusList = async (data) => {
+  return await axios.get(`/api/invoiceStatus/list`, {
+    params: data
+  })
+}
+
+// 鐗╃悊鍏徃鍒楄〃
+export const getCourierCompanyList = async (data) => {
+  return await axios.get(`/api/courierCompany/list`, {
+    params: data
+  })
+}
diff --git a/src/components/makepager/CommonFormTableView.vue b/src/components/makepager/CommonFormTableView.vue
index dedaea4..128caa4 100644
--- a/src/components/makepager/CommonFormTableView.vue
+++ b/src/components/makepager/CommonFormTableView.vue
@@ -62,14 +62,14 @@
     <div v-if="!detailEnter" style="margin: 10px">
       <el-button size="small" type="primary" @click="add">鏂板</el-button>
       <!-- <el-button size="small" type="primary" disabled>瀵煎叆鏄庣粏</el-button> -->
-      <el-button size="small" type="primary">娓呯┖</el-button>
-      <el-button size="small" type="primary">閲嶇畻</el-button>
+      <el-button size="small" type="primary" @click="empty">娓呯┖</el-button>
+      <el-button size="small" type="primary" @click="recalculate">閲嶇畻</el-button>
     </div>
     <div v-if="showSummary.total || showSummary.refundable" style="height: 42px; line-height: 42px">
       <el-row :gutter="10">
         <el-col v-if="showSummary.total" :span="2" :offset="22">
           <span style="font-weight: bold">鍚堣</span>
-          <span style="margin-left: 10px">0.00</span>
+          <span style="margin-left: 10px">{{ total }}</span>
         </el-col>
         <el-col v-if="showSummary.refundable" :span="2" :offset="22">
           <span style="font-weight: bold">搴旈��娆�</span>
@@ -114,7 +114,9 @@
     }
   },
   data() {
-    return {}
+    return {
+      total: 0
+    }
   },
   computed: {},
   methods: {
@@ -160,6 +162,9 @@
                 return this.number_format(prev, 2, ".", ",")
               }
             }, 0)
+            if (column.property === "total") {
+              this.total = sums[index]
+            }
             sums[index]
           }
         })
@@ -194,6 +199,7 @@
       }
       return s.join(dec)
     },
+    // 鏂板
     add() {
       this.$emit("addProductClick")
     },
@@ -201,6 +207,22 @@
       console.log(val, prop)
       console.log(row)
       this.$emit("inputContent", val, prop, row)
+    },
+    // 娓呯┖
+    empty() {
+      this.$emit("emptyProductClick")
+    },
+    // 閲嶇畻
+    recalculate() {
+      this.$confirm("纭畾瑕侀噸绠楁槑缁嗘墍鏈夎?", "鎻愮ず", {
+        confirmButtonText: "纭畾",
+        cancelButtonText: "鍙栨秷",
+        type: "warning"
+      })
+        .then(() => {
+          this.$emit("recalculateProductClick")
+        })
+        .catch(() => {})
     }
   }
 }
diff --git a/src/views/backgroundConfig/index.vue b/src/views/backgroundConfig/index.vue
index b2e8385..ffeca33 100644
--- a/src/views/backgroundConfig/index.vue
+++ b/src/views/backgroundConfig/index.vue
@@ -16,6 +16,6 @@
 .content {
   width: 100%;
   background-color: #fff;
-  height: calc(100vh - 60px);
+  height: calc(100vh - 70px);
 }
 </style>
diff --git a/src/views/client/client/AddClientManageDialog.vue b/src/views/client/client/AddClientManageDialog.vue
index f4180f8..5c15e02 100644
--- a/src/views/client/client/AddClientManageDialog.vue
+++ b/src/views/client/client/AddClientManageDialog.vue
@@ -560,7 +560,8 @@
       provinceOptions: [], // 鐪佷唤
       cityOptions: [], // 鍩庡競
       regionOptions: [], // 鍖哄煙
-      approvalWorkflowOptions: [] // 瀹℃壒娴佺▼
+      approvalWorkflowOptions: [], // 瀹℃壒娴佺▼
+      clientName: this.editClientManageConfig.infomation.name
     }
   },
   created() {
@@ -715,7 +716,7 @@
     },
     // 鏌ラ噸
     async checkNameClient(rule, value, callback) {
-      if (this.editConfig.title === "鏂板缓") {
+      if (this.editConfig.title === "鏂板缓" || this.clientName !== this.editConfig.infomation.name) {
         await checkNameClient({ name: value }).then((res) => {
           if (res.data.code === 700001) {
             return callback(new Error("瀹㈡埛鍚嶇О閲嶅"))
diff --git a/src/views/client/client/index.vue b/src/views/client/client/index.vue
index b9b8999..f4be8f2 100644
--- a/src/views/client/client/index.vue
+++ b/src/views/client/client/index.vue
@@ -5,7 +5,7 @@
         <el-tab-pane label="鍏捣瀹㈡埛" name="first"></el-tab-pane>
         <el-tab-pane label="鎴戠殑瀹㈡埛" name="second"></el-tab-pane>
       </el-tabs>
-      <div class="sel-gonghai">
+      <!-- <div class="sel-gonghai">
         <el-select v-model="gonghaiValue" placeholder="璇烽�夋嫨" class="query-class-sel" size="mini" disabled>
           <el-option v-for="item in gonghaiOptions" :key="item.value" :label="item.label" :value="item.value">
           </el-option>
@@ -13,7 +13,7 @@
         <div class="query-class-btn">
           <i class="el-icon-setting"></i>
         </div>
-      </div>
+      </div> -->
     </div>
     <div class="top">
       <SearchCommonView
diff --git a/src/views/client/index.vue b/src/views/client/index.vue
index 627b038..adc8766 100644
--- a/src/views/client/index.vue
+++ b/src/views/client/index.vue
@@ -16,6 +16,6 @@
 .content {
   width: 100%;
   background-color: #fff;
-  height: calc(100vh - 60px);
+  height: calc(100vh - 70px);
 }
 </style>
diff --git a/src/views/other/commonDialog/SelectCommonDialog.vue b/src/views/other/commonDialog/SelectCommonDialog.vue
index 27111a5..fcc993e 100644
--- a/src/views/other/commonDialog/SelectCommonDialog.vue
+++ b/src/views/other/commonDialog/SelectCommonDialog.vue
@@ -134,9 +134,9 @@
             { label: "鏈嶅姟鍗曠紪鍙�", prop: "serviceNumber", isClick: true }, // 鏈嶅姟鍗曠紪鍙�
             { label: "涓婚", prop: "subject" }, // 涓婚
             { label: "鏈嶅姟鏂瑰紡", prop: "serviceType_name" }, // 鏈嶅姟鏂瑰紡
-            { label: "鏈嶅姟浜哄憳", prop: "serviceManId" }, // 鏈嶅姟浜哄憳
-            { label: "浼樺厛绾у埆", prop: "priorityLevelId" }, // 浼樺厛绾у埆
-            { label: "澶勭悊鐘舵��", prop: "status" }, // 澶勭悊鐘舵��
+            { label: "鏈嶅姟浜哄憳", prop: "serviceMan_name" }, // 鏈嶅姟浜哄憳
+            { label: "浼樺厛绾у埆", prop: "priorityLevel_name" }, // 浼樺厛绾у埆
+            { label: "澶勭悊鐘舵��", prop: "serviceOrderStatus_name" }, // 澶勭悊鐘舵��
             { label: "瀹㈡埛绛惧悕", prop: "qianming" } // 瀹㈡埛绛惧悕
           ]
         }
@@ -282,14 +282,17 @@
         pageSize: 0
       }).then((res) => {
         if (res.code === 200) {
-          if (res.data.list && res.data.list.length > 0) {
-            const list = res.data.list.map((item) => {
+          if (res.data.data && res.data.data.length > 0) {
+            const list = res.data.data.map((item) => {
               return {
                 ...item,
                 client_name: item.Client.name,
                 serviceType_name: item.ServiceType.name,
                 faultType_name: item.FaultType.name,
-                serviceContract_Number: item.ServiceContract.number
+                serviceContract_Number: item.ServiceContract.number,
+                serviceMan_name: item.serviceMan.username,
+                priorityLevel_name: item.PriorityLevel.name,
+                serviceOrderStatus_name: item.ServiceOrderStatus_name
               }
             })
             this.tableList.tableInfomation = list.slice(0, 5) || []
diff --git a/src/views/other/payment/collectionPlan/AddCollectionPlan.vue b/src/views/other/payment/collectionPlan/AddCollectionPlan.vue
new file mode 100644
index 0000000..64b634c
--- /dev/null
+++ b/src/views/other/payment/collectionPlan/AddCollectionPlan.vue
@@ -0,0 +1,531 @@
+<template>
+  <div class="add-collectionPlan">
+    <el-dialog
+      :title="editCommonConfig.title + '鏀舵璁″垝'"
+      :visible.sync="editConfig.visible"
+      :width="dialogWidth"
+      :before-close="handleClose"
+      append-to-body
+      custom-class="iframe-dialog"
+    >
+      <!-- 淇℃伅 -->
+      <div class="basic-info">
+        <div class="collection-view">
+          <div class="label">鏀舵璁″垝绫诲瀷</div>
+          <el-select v-model="editConfig.infomation.collectionType" size="mini">
+            <el-option label="璁″垝鏀舵鏃ユ湡" value="1"></el-option>
+            <el-option label="椤圭洰鐘舵��" value="2"></el-option>
+          </el-select>
+        </div>
+        <div class="collection-view">
+          <div class="label">甯佺</div>
+          <el-select v-model="editConfig.infomation.moneyType" size="mini">
+            <el-option label="浜烘皯甯�" value="浜烘皯甯�"></el-option>
+          </el-select>
+        </div>
+        <div class="collection-view">
+          <div class="label">閲戦</div>
+          <div>{{ editConfig.infomation.amount }}</div>
+        </div>
+        <div class="collection-view">
+          <div class="label">鏈鍒掗噾棰�</div>
+          <div>{{ editConfig.infomation.amount }}</div>
+        </div>
+        <div class="collection-view">
+          <div class="label">鏀舵璁″垝璐熻矗浜�</div>
+          <el-select
+            v-model="editConfig.infomation.principalId"
+            placeholder="璇烽�夋嫨"
+            size="mini"
+            @change="principalClick"
+          >
+            <el-option v-for="item in memberOptions" :key="item.id" :label="item.username" :value="item.id">
+            </el-option>
+          </el-select>
+        </div>
+        <!-- 浜у搧绠＄悊 -->
+        <div class="product-view">
+          <el-table
+            ref="table"
+            border
+            :data="tableData.tableInfomation"
+            tooltip-effect="dark"
+            style="width: 100%"
+            :header-cell-style="{ background: '#ECF4FF', color: '#666' }"
+          >
+            <el-table-column
+              v-for="(item, i) in tableData.tableColumn"
+              :key="i"
+              :prop="item.prop"
+              :label="item.label"
+              :width="item.width"
+              :min-width="item.min"
+              align="center"
+            >
+              <!-- column鏍峰紡 -->
+              <template slot-scope="scope">
+                <div v-if="item.inputNumber">
+                  <el-input-number
+                    v-model="scope.row[item.prop]"
+                    placeholder=""
+                    :min="0"
+                    :controls="false"
+                    style="width: 100%; margin-right: 5px"
+                    @change="
+                      (val) => {
+                        commonInputChange(val, item.prop, scope.row)
+                      }
+                    "
+                  ></el-input-number>
+                </div>
+                <div v-else-if="item.inputFloat">
+                  <el-input-number
+                    v-model="scope.row[item.prop]"
+                    placeholder=""
+                    :min="0"
+                    :precision="2"
+                    :controls="false"
+                    style="width: 100%; margin-right: 5px"
+                    @change="
+                      (val) => {
+                        commonInputChange(val, item.prop, scope.row)
+                      }
+                    "
+                  ></el-input-number>
+                </div>
+
+                <el-input
+                  v-else-if="item.input"
+                  v-model.trim="scope.row[item.prop]"
+                  maxlength="50"
+                  size="mini"
+                  @change="
+                    (val) => {
+                      commonInputChange(val, item.prop, scope.row)
+                    }
+                  "
+                ></el-input>
+                <div v-else-if="item.date">
+                  <el-date-picker v-model="scope.row[item.prop]" type="date" size="mini" style="width: 130px">
+                  </el-date-picker>
+                </div>
+                <div v-else @click="delClick(scope.row)"><i class="el-icon-delete"></i></div>
+              </template>
+            </el-table-column>
+          </el-table>
+        </div>
+      </div>
+      <!-- </el-form> -->
+      <div class="dialog-footer">
+        <div class="bottom-fixed">
+          <div class="all">
+            <span>鎬绘湡鏁�: </span>
+            <el-select v-model="allTerms" size="mini" placeholder="" style="width: 60px">
+              <el-option label="1" :value="1"></el-option>
+              <el-option label="2" :value="2"></el-option>
+              <el-option label="3" :value="3"></el-option>
+            </el-select>
+            <span> 鏈�, </span>
+          </div>
+          <div class="first">
+            <span>棣栨鏀舵鏃ユ湡: </span>
+            <el-date-picker
+              v-model="firstDate"
+              value-format="yyyy-MM-dd"
+              type="date"
+              size="mini"
+              style="width: 130px; margin-right: 10px"
+            >
+            </el-date-picker>
+            <el-button type="text" size="mini" @click="recalculateClick" style="margin-right: 10px">閲嶇畻</el-button>
+          </div>
+        </div>
+        <div class="btn-view">
+          <el-button type="primary" size="small" @click="saveClick">淇濆瓨</el-button>
+          <el-button size="small" @click="editConfig.visible = false">鍙栨秷</el-button>
+        </div>
+      </div>
+    </el-dialog>
+  </div>
+</template>
+
+<script>
+import { getAllData } from "@/api/client/client"
+import { addCollectionPlan } from "@/api/common/payment"
+
+export default {
+  name: "AddCollectionPlanDialog",
+  components: {},
+  props: {
+    editCommonConfig: {
+      type: Object,
+      default: () => {
+        return {
+          visible: false,
+          title: "鏂板缓",
+          sourceType: 1,
+          infomation: {}
+        }
+      }
+    }
+  },
+  computed: {},
+  data() {
+    return {
+      dialogWidth: "45%",
+      editConfig: this.editCommonConfig,
+      productTableList: {},
+      showSummary: {
+        show: true,
+        total: false,
+        sumProp: ["other1", "other7"],
+        mergeNumber: 7
+      },
+      tableData: [],
+      productId: 1,
+      addProductArr: [],
+      memberOptions: [],
+      allTerms: 3,
+      amount: 130,
+      sourceType: this.editCommonConfig.sourceType, // 婧愬崟绫诲瀷 1閿�鍞槑缁�2鏈嶅姟鍚堝悓3閿�鍞彂绁�
+      sourceId: this.editCommonConfig.infomation.id,
+      principalId: 0,
+      planAmount: 0, // 璁″垝閲戦
+      firstDate: this.getCurrentDate(1)
+    }
+  },
+  created() {
+    console.log(this.editCommonConfig.sourceType)
+    this.setData()
+    this.setTableForm()
+    this.getCommonData()
+  },
+  methods: {
+    // 璁剧疆鍒濆鍊�
+    setData() {
+      this.editConfig.infomation = {
+        collectionType: "1",
+        moneyType: "浜烘皯甯�",
+        amount: this.amount.toFixed(2)
+      }
+    },
+    getCommonData() {
+      getAllData()
+        .then((res) => {
+          console.log(res)
+          if (res.code === 200) {
+            this.memberOptions = res.data.member
+          }
+        })
+        .catch((err) => {
+          console.log(err)
+        })
+    },
+    // 淇濆瓨
+    saveClick() {
+      this.sumTotalAmount()
+      if (this.editConfig.title === "鏂板缓") {
+        if (this.principalId === 0) {
+          this.$message.error("璇烽�夋嫨鏀舵璁″垝璐熻矗浜�")
+        } else if (this.amount !== this.planAmount) {
+          this.$message.error("鏀舵璁″垝鍜屾湭璁″垝閲戦涓嶄竴鑷达紝璇烽噸绠�")
+        } else {
+          const params = this.saveParams()
+          addCollectionPlan(params).then((res) => {
+            console.log(res)
+            this.editConfig.visible = false
+            if (res.code === 200) {
+              this.$message.success("娣诲姞鎴愬姛")
+              this.$parent.getData()
+            }
+          })
+        }
+      }
+    },
+    // 璁＄畻璁″垝鎬婚
+    sumTotalAmount() {
+      this.planAmount = 0
+      if (this.tableData.tableInfomation && this.tableData.tableInfomation.length > 0) {
+        this.tableData.tableInfomation.map((item) => {
+          this.planAmount += item.amountReceivable
+        })
+      }
+    },
+    saveParams() {
+      let params = {
+        list: this.tableData.tableInfomation
+      }
+      return params
+    },
+    handleClose() {
+      this.editConfig.visible = false
+    },
+    setTableForm() {
+      this.tableData = {
+        tableInfomation: [
+          {
+            amount: this.amount,
+            amountReceivable: this.amount * 0.3,
+            amountReceived: 0,
+            amountTotal: 0,
+            collectionDate: this.getCurrentDate(1),
+            collectionType: 0,
+            fileId: 0,
+            id: 0,
+            moneyType: "浜烘皯甯�",
+            percent: 30,
+            principalId: this.principalId,
+            remark: "",
+            sourceId: this.sourceId,
+            sourceType: this.sourceType,
+            status: 1,
+            term: 1
+          },
+          {
+            amount: this.amount,
+            amountReceivable: this.amount * 0.5,
+            amountReceived: 0,
+            amountTotal: 0,
+            collectionDate: this.getCurrentDate(2),
+            collectionType: 0,
+            fileId: 0,
+            id: 0,
+            moneyType: "浜烘皯甯�",
+            percent: 50,
+            principalId: this.principalId,
+            remark: "",
+            sourceId: this.sourceId,
+            sourceType: this.sourceType,
+            status: 1,
+            term: 2
+          },
+          {
+            amount: this.amount,
+            amountReceivable: this.amount * 0.2,
+            amountReceived: 0,
+            amountTotal: 0,
+            collectionDate: this.getCurrentDate(3),
+            collectionType: 0,
+            fileId: 0,
+            id: 0,
+            moneyType: "浜烘皯甯�",
+            percent: 20,
+            principalId: this.principalId,
+            remark: "",
+            sourceId: this.sourceId,
+            sourceType: this.sourceType,
+            status: 1,
+            term: 3
+          }
+        ],
+        tableColumn: [
+          { label: "鎿嶄綔", prop: "operate", width: 60 },
+          { label: "鏈熸", prop: "term", inputNumber: true, width: 90 },
+          { label: "姣斾緥(%)", prop: "percent", inputNumber: true, width: 90 },
+          { label: "閲戦", prop: "amountReceivable", inputFloat: true, width: 120 },
+          { label: "璁″垝鏀舵鏃ユ湡", prop: "collectionDate", date: true, width: 150 },
+          { label: "澶囨敞", prop: "remark", input: true }
+        ]
+      }
+    },
+    // 閲嶇畻
+    recalculateClick() {
+      console.log(this.allTerms)
+      this.tableData.tableInfomation = []
+      if (this.allTerms === 1) {
+        console.log("aaa")
+        this.tableData.tableInfomation = [
+          {
+            amount: this.amount,
+            amountReceivable: this.amount,
+            amountReceived: 0,
+            amountTotal: 0,
+            collectionDate: this.setDate(this.firstDate, 0),
+            collectionType: 0,
+            fileId: 0,
+            id: 0,
+            moneyType: "浜烘皯甯�",
+            percent: 100,
+            principalId: this.principalId,
+            remark: "",
+            sourceId: this.sourceId,
+            sourceType: this.sourceType,
+            status: 1,
+            term: 1
+          }
+        ]
+      } else if (this.allTerms === 2) {
+        this.tableData.tableInfomation = [
+          {
+            amount: this.amount,
+            amountReceivable: this.amount * 0.5,
+            amountReceived: 0,
+            amountTotal: 0,
+            collectionDate: this.setDate(this.firstDate, 0),
+            collectionType: 0,
+            fileId: 0,
+            id: 0,
+            moneyType: "浜烘皯甯�",
+            percent: 50,
+            principalId: this.principalId,
+            remark: "",
+            sourceId: this.sourceId,
+            sourceType: this.sourceType,
+            status: 1,
+            term: 1
+          },
+          {
+            amount: this.amount,
+            amountReceivable: this.amount * 0.5,
+            amountReceived: 0,
+            amountTotal: 0,
+            collectionDate: this.setDate(this.firstDate, 1),
+            collectionType: 0,
+            fileId: 0,
+            id: 0,
+            moneyType: "浜烘皯甯�",
+            percent: 50,
+            principalId: this.principalId,
+            remark: "",
+            sourceId: this.sourceId,
+            sourceType: this.sourceType,
+            status: 1,
+            term: 2
+          }
+        ]
+      } else if (this.allTerms === 3) {
+        this.tableData.tableInfomation = [
+          {
+            amount: this.amount,
+            amountReceivable: this.amount * 0.3,
+            amountReceived: 0,
+            amountTotal: 0,
+            collectionDate: this.setDate(this.firstDate, 0),
+            collectionType: 0,
+            fileId: 0,
+            id: 0,
+            moneyType: "浜烘皯甯�",
+            percent: 30,
+            principalId: this.principalId,
+            remark: "",
+            sourceId: this.sourceId,
+            sourceType: this.sourceType,
+            status: 1,
+            term: 1
+          },
+          {
+            amount: this.amount,
+            amountReceivable: this.amount * 0.5,
+            amountReceived: 0,
+            amountTotal: 0,
+            collectionDate: this.setDate(this.firstDate, 1),
+            collectionType: 0,
+            fileId: 0,
+            id: 0,
+            moneyType: "浜烘皯甯�",
+            percent: 50,
+            principalId: this.principalId,
+            remark: "",
+            sourceId: this.sourceId,
+            sourceType: this.sourceType,
+            status: 1,
+            term: 2
+          },
+          {
+            amount: this.amount,
+            amountReceivable: this.amount * 0.2,
+            amountReceived: 0,
+            amountTotal: 0,
+            collectionDate: this.setDate(this.firstDate, 2),
+            collectionType: 0,
+            fileId: 0,
+            id: 0,
+            moneyType: "浜烘皯甯�",
+            percent: 20,
+            principalId: this.principalId,
+            remark: "",
+            sourceId: this.sourceId,
+            sourceType: this.sourceType,
+            status: 1,
+            term: 3
+          }
+        ]
+      }
+    },
+    delClick(row) {
+      console.log(row)
+      this.tableData.tableInfomation = this.tableData.tableInfomation.filter((item) => {
+        return item.term != row.term
+      })
+      this.allTerms = this.tableData.tableInfomation.length === 0 ? 3 : this.tableData.tableInfomation.length
+    },
+    commonInputChange(val, prop, row) {
+      console.log(val, prop)
+      console.log(row)
+    },
+    // 鑾峰彇褰撳墠鏃ユ湡
+    getCurrentDate(monthNumber) {
+      let now = new Date()
+      let year = now.getFullYear()
+      let month = now.getMonth() + monthNumber
+      let day = now.getDate()
+      return year + "-" + month + "-" + day
+    },
+    // 鏃ユ湡澶勭悊
+    setDate(str, monthNumber) {
+      console.log(str.split("-"))
+      let dateArr = str.split("-")
+      let year = parseInt(dateArr[0])
+      let month = parseInt(dateArr[1]) + monthNumber
+      let day = parseInt(dateArr[2])
+      return year + "-" + month + "-" + day
+    },
+    principalClick(val) {
+      this.principalId = val
+    }
+  }
+}
+</script>
+
+<!-- Add "scoped" attribute to limit CSS to this component only -->
+<style lang="scss" scoped>
+::v-deep {
+  .iframe-dialog .el-dialog__body {
+    .basic-info {
+      .collection-view {
+        height: 42px;
+        line-height: 42px;
+        display: flex;
+        border-bottom: 1px solid #ebeef5;
+        color: #666;
+        .label {
+          width: 230px;
+          text-align: right;
+          margin-right: 10px;
+        }
+      }
+    }
+
+    .dialog-footer {
+      position: sticky;
+      .bottom-fixed {
+        height: 42px;
+        line-height: 42px;
+        display: flex;
+        align-items: center;
+        background: #fff;
+
+        .all {
+          margin-left: auto;
+        }
+      }
+      .btn-view {
+        height: 55px;
+        line-height: 55px;
+        text-align: center;
+        background-color: #f5f5f5;
+      }
+    }
+  }
+}
+</style>
diff --git a/src/views/other/payment/collectionPlan/index.vue b/src/views/other/payment/collectionPlan/index.vue
new file mode 100644
index 0000000..02ab516
--- /dev/null
+++ b/src/views/other/payment/collectionPlan/index.vue
@@ -0,0 +1,234 @@
+<template>
+  <div class="collectionPlan">
+    <div v-if="isDetail" class="detail-top">
+      <DetailListCommonBtn :query-class-options="queryClassOptions" />
+      <PagerView class="page" :pager-options="pagerOptions" v-on="pagerEvents" />
+    </div>
+    <div v-else class="top">
+      <SearchCommonView
+        ref="searchCommonView"
+        :query-class-options="queryClassOptions"
+        :search-options="searchOptions"
+        :search-sel="searchSel"
+        @searchClick="searchClick"
+        @resetClick="resetClick"
+      />
+      <div class="btn-pager">
+        <PublicFunctionBtnView :statistics="true" :operates-list="operatesList" @batchDelete="delClick" />
+        <PagerView class="page" :pager-options="pagerOptions" v-on="pagerEvents" />
+      </div>
+    </div>
+    <TableCommonView
+      ref="tableListRef"
+      v-loading="loading"
+      :table-list="tableList"
+      :select-box="!isDetail"
+      @getSelectArray="getSelectArray"
+    >
+      <!-- <template slot="tableButton">
+        <el-table-column label="鎿嶄綔" width="60" fixed="right">
+          <template slot-scope="scope">
+            <el-button @click="handleClick(scope.row)" type="text" size="small">缂栬緫</el-button>
+          </template>
+        </el-table-column>
+      </template> -->
+    </TableCommonView>
+    <!-- 鏂板缓/缂栬緫 -->
+    <AddCollectionPlan v-if="editConfig.visible" :edit-common-config="editConfig" />
+  </div>
+</template>
+
+<script>
+import { getCollectionPlanList } from "@/api/common/payment"
+import pageMixin from "@/components/makepager/pager/mixin/pageMixin"
+import AddCollectionPlan from "@/views/other/payment/collectionPlan/AddCollectionPlan"
+
+export default {
+  name: "CollectionPlan",
+  props: {
+    isDetail: {
+      type: Boolean,
+      default: false
+    },
+    addConfig: {
+      type: Object,
+      default: () => {
+        return {}
+      }
+    },
+    sourceType: {
+      type: Number,
+      default: 1
+    }
+  },
+  mixins: [pageMixin],
+  components: { AddCollectionPlan },
+  computed: {},
+  data() {
+    return {
+      tableList: {},
+      loading: false,
+      activeName: "second",
+      queryClassValue: "1",
+      queryClassOptions: [
+        { value: "1", label: "鍏ㄩ儴" },
+        { value: "2", label: "浠婃棩鑱旂郴" },
+        { value: "3", label: "鏈懆鑱旂郴" },
+        { value: "4", label: "鏈湀鑱旂郴" }
+      ],
+      searchOptions: [],
+      operatesList: [
+        { id: "1", name: "鍏变韩" },
+        { id: "2", name: "鎵归噺缂栬緫" },
+        { id: "3", name: "瀵煎嚭" },
+        { id: "4", name: "涓嬭浇鍏ㄩ儴闄勪欢" },
+        { id: "5", name: "鏇存敼鍒涘缓浜�" },
+        { id: "6", name: "鏍戠粨鏋勮缃�" },
+        { id: "7", name: "瀹℃壒璁剧疆" },
+        { id: "8", name: "鍥炶棰勮鍒楀" }
+      ],
+      editConfig: {
+        visible: false,
+        title: "鏂板缓",
+        infomation: {}
+      },
+      saleChanceName: "",
+      contactsDeail: {
+        visible: false,
+        infomation: {}
+      },
+      clientDeail: {
+        visible: false,
+        infomation: {}
+      },
+      selValueList: [],
+      searchSel: {
+        value: "topic",
+        label: ""
+      },
+      search_map: {},
+      serviceContractId: 0
+    }
+  },
+  created() {
+    this.setTable()
+    if (!this.isDetail) {
+      this.serviceContractId = 0
+    } else {
+      this.serviceContractId = this.addConfig.id
+    }
+    this.getData()
+  },
+  methods: {
+    setTable() {
+      this.tableList = {
+        tableInfomation: [],
+        tableColumn: [
+          { label: "鏀舵璁″垝缂栧彿", prop: "number" },
+          { label: "瀹㈡埛鍚嶇О", prop: "client_name" },
+          { label: "鏈熸", prop: "term" },
+          { label: "璁″垝鏀舵鏃ユ湡", prop: "collectionDate" },
+          { label: "閲戦", prop: "amount" },
+          { label: "宸叉敹閲戦", prop: "amountReceived" },
+          { label: "搴旀敹閲戦", prop: "amountReceivable" },
+          { label: "璐熻矗浜�", prop: "member_name" }
+        ]
+      }
+      this.searchOptions = []
+      for (let i = 0; i < this.tableList.tableColumn.length; i++) {
+        const label = this.tableList.tableColumn[i].label
+        const value = this.tableList.tableColumn[i].prop
+        this.searchOptions.push({ value: value, label: label })
+      }
+    },
+    // 璇锋眰鏁版嵁
+    async getData() {
+      this.loading = true
+      await getCollectionPlanList({
+        serviceContractId: this.serviceContractId
+      })
+        .then((res) => {
+          if (res.code === 200) {
+            if (res.data.list && res.data.list.length > 0) {
+              const list = res.data.list.map((item) => {
+                return {
+                  ...item
+                }
+              })
+              this.tableList.tableInfomation = list || []
+              this.pagerOptions.totalCount = res.data.count
+            } else {
+              this.tableList.tableInfomation = []
+            }
+          } else {
+            this.tableList.tableInfomation = []
+          }
+          this.loading = false
+        })
+        .catch((err) => {
+          console.log(err)
+          this.tableList.tableInfomation = []
+          this.loading = false
+        })
+    },
+    // 鎼滅储
+    searchClick(val, content) {
+      this.serviceContractId = content
+      // this.keywordType = val.label
+      this.getData()
+    },
+    resetClick() {
+      this.serviceContractId = ""
+      // this.keywordType = ""
+      this.getData()
+    },
+    getSelectArray(val) {
+      console.log(val)
+      this.selValueList = []
+      const list = val.map((item) => {
+        return item.id
+      })
+      this.selValueList = list
+    },
+    // 鏂板缓
+    addBtnClick() {
+      if (this.tableList.tableInfomation && this.tableList.tableInfomation.length > 0) {
+        this.$message.success("璇ヨ鍗曞凡鍒涘缓鏀舵璁″垝")
+        this.$confirm("璇ヨ鍗曞凡鍒涘缓鏀舵璁″垝", "鎻愮ず", {
+          confirmButtonText: "纭畾",
+          cancelButtonText: "鍙栨秷",
+          type: "warning"
+        })
+          .then(() => {})
+          .catch(() => {})
+      } else {
+        this.editConfig.visible = true
+        this.editConfig.title = "鏂板缓"
+        this.editConfig.sourceType = this.sourceType
+        this.editConfig.infomation = { ...this.addConfig }
+      }
+    }
+  }
+}
+</script>
+
+<!-- Add "scoped" attribute to limit CSS to this component only -->
+<style lang="scss" scoped>
+.collectionPlan {
+  .top {
+    margin-bottom: 20px;
+    .btn-pager {
+      display: flex;
+      .page {
+        margin-left: auto;
+      }
+    }
+  }
+  .detail-top {
+    display: flex;
+    .page {
+      margin-left: auto;
+    }
+  }
+}
+</style>
diff --git a/src/views/other/payment/receipt/addReceipt.vue b/src/views/other/payment/receipt/addReceipt.vue
new file mode 100644
index 0000000..1c58f1a
--- /dev/null
+++ b/src/views/other/payment/receipt/addReceipt.vue
@@ -0,0 +1,638 @@
+<template>
+  <div class="add-receipt">
+    <el-dialog
+      :title="editCommonConfig.title + '鏀舵鍗�'"
+      :visible.sync="editConfig.visible"
+      :width="dialogWidth"
+      :before-close="handleClose"
+      append-to-body
+      custom-class="iframe-dialog"
+    >
+      <el-form
+        ref="form"
+        :model="editConfig.infomation"
+        :rules="rules"
+        label-position="right"
+        label-width="308px"
+        size="mini"
+        style="height: 60vh; overflow-x: hidden"
+      >
+        <!-- 淇℃伅 -->
+        <div class="basic-info">
+          <!-- 鍩烘湰淇℃伅 -->
+          <div class="basic-info-title">鍩烘湰淇℃伅</div>
+          <div class="basic-info-view">
+            <el-row>
+              <el-col :span="12">
+                <el-form-item label="瀹㈡埛鍚嶇О" prop="client_name">
+                  <div class="custom-name">
+                    <el-autocomplete
+                      v-model="editConfig.infomation.client_name"
+                      :fetch-suggestions="
+                        (queryString, callback) => {
+                          querySearchAsync(queryString, callback, 'client')
+                        }
+                      "
+                      value-key="name"
+                      @select="handleSelectClient('client', $event)"
+                    ></el-autocomplete>
+                    <div class="common-select-btn" @click="selClientClick('client')">
+                      <i class="el-icon-circle-plus-outline" title="閫夋嫨"></i>
+                    </div>
+                    <div class="common-select-btn" @click="clearupClient('client')">
+                      <i class="el-icon-edit-outline" title="娓呴櫎"></i>
+                    </div>
+                  </div>
+                </el-form-item>
+              </el-col>
+              <el-col v-if="editConfig.title === '缂栬緫'" :span="12">
+                <el-form-item label="鏀舵鍗曠紪鍙�" prop="number">
+                  <!-- <el-input v-model="editConfig.infomation.number"></el-input> -->
+                  <div>{{ editConfig.infomation.id }}</div>
+                </el-form-item>
+              </el-col>
+              <el-col v-if="editConfig.sourceType === 2" :span="12">
+                <el-form-item label="鏈嶅姟鍚堝悓">
+                  <div class="custom-name">
+                    <el-autocomplete
+                      v-model="editConfig.infomation.serviceContract_Number"
+                      :fetch-suggestions="
+                        (queryString, callback) => {
+                          querySearchAsync(queryString, callback, 'serviceContract')
+                        }
+                      "
+                      value-key="number"
+                      @select="handleSelectClient('serviceContract', $event)"
+                    ></el-autocomplete>
+                    <div class="common-select-btn" @click="selClientClick('serviceContract')">
+                      <i class="el-icon-circle-plus-outline" title="閫夋嫨"></i>
+                    </div>
+                    <div class="common-select-btn" @click="clearupClient('serviceContract')">
+                      <i class="el-icon-edit-outline" title="娓呴櫎"></i>
+                    </div>
+                  </div>
+                </el-form-item>
+              </el-col>
+              <el-col v-else :span="12">
+                <el-form-item label="鍚堝悓璁㈠崟">
+                  <div class="custom-name">
+                    <el-autocomplete
+                      v-model="editConfig.infomation.number"
+                      :fetch-suggestions="
+                        (queryString, callback) => {
+                          querySearchAsync(queryString, callback, 'contract')
+                        }
+                      "
+                      value-key="number"
+                      @select="handleSelectClient('contract', $event)"
+                    ></el-autocomplete>
+                    <div class="common-select-btn" @click="selClientClick('contract')">
+                      <i class="el-icon-circle-plus-outline" title="閫夋嫨"></i>
+                    </div>
+                    <div class="common-select-btn" @click="clearupClient('contract')">
+                      <i class="el-icon-edit-outline" title="娓呴櫎"></i>
+                    </div>
+                  </div>
+                </el-form-item>
+              </el-col>
+              <el-col :span="12">
+                <el-form-item label="璐熻矗浜�" prop="principalId">
+                  <el-select
+                    v-model="editConfig.infomation.principalId"
+                    placeholder="璇烽�夋嫨"
+                    size="mini"
+                    style="width: 63%"
+                  >
+                    <el-option v-for="item in memberOptions" :key="item.id" :label="item.username" :value="item.id">
+                    </el-option>
+                  </el-select>
+                </el-form-item>
+              </el-col>
+              <el-col :span="12">
+                <el-form-item label="鏀舵鏃ユ湡" prop="receiptDate">
+                  <el-date-picker
+                    v-model="editConfig.infomation.receiptDate"
+                    value-format="yyyy-MM-dd"
+                    type="date"
+                    placeholder="閫夋嫨鏃ユ湡"
+                  >
+                  </el-date-picker>
+                </el-form-item>
+              </el-col>
+              <el-col :span="12">
+                <el-form-item label="甯佺">
+                  <div style="font-size: 13px">{{ "浜烘皯甯�" }}</div>
+                  <!-- <el-select
+                    v-model="editConfig.infomation.currency"
+                    placeholder="璇烽�夋嫨"
+                    size="mini"
+                    style="width: 63%"
+                  >
+                    <el-option v-for="item in currencyOptions" :key="item.id" :label="item.name" :value="item.id">
+                    </el-option>
+                  </el-select> -->
+                </el-form-item>
+              </el-col>
+              <el-col :span="12">
+                <el-form-item label="鏀舵鏂瑰紡" prop="paymentTypeId">
+                  <el-select
+                    v-model="editConfig.infomation.paymentTypeId"
+                    placeholder="璇烽�夋嫨"
+                    size="mini"
+                    style="width: 63%"
+                  >
+                    <el-option
+                      v-for="item in paymentTypeListOptions"
+                      :key="item.id"
+                      :label="item.name"
+                      :value="item.id"
+                    >
+                    </el-option>
+                  </el-select>
+                </el-form-item>
+              </el-col>
+              <el-col :span="12">
+                <el-form-item label="璐︽埛" prop="bankAccountId">
+                  <el-select
+                    v-model="editConfig.infomation.bankAccountId"
+                    placeholder="璇烽�夋嫨"
+                    size="mini"
+                    style="width: 63%"
+                  >
+                    <el-option v-for="item in bankAccountOptions" :key="item.id" :label="item.name" :value="item.id">
+                    </el-option>
+                  </el-select>
+                </el-form-item>
+              </el-col>
+              <el-col :span="12">
+                <el-form-item label="鏀舵绫诲瀷" prop="deliveryDate">
+                  <div>{{ "鏀舵" }}</div>
+                </el-form-item>
+              </el-col>
+            </el-row>
+          </div>
+          <!-- 鏀舵淇℃伅 -->
+          <div class="basic-info-title">鏀舵淇℃伅</div>
+          <div class="basic-info-view">
+            <el-row>
+              <el-col :span="24">
+                <el-form-item label="鏈鏀舵閲戦" prop="amount">
+                  <el-input-number
+                    v-model="editConfig.infomation.amount"
+                    placeholder="璇疯緭鍏�"
+                    :min="0"
+                    :precision="2"
+                    :controls="false"
+                    style="width: 25%; margin-right: 5px"
+                  ></el-input-number>
+                </el-form-item>
+              </el-col>
+            </el-row>
+          </div>
+          <!-- 澶囨敞淇℃伅 -->
+          <div class="basic-info-title">澶囨敞淇℃伅</div>
+          <div class="basic-info-view">
+            <el-row>
+              <el-col :span="24">
+                <el-form-item label="澶囨敞" prop="remark">
+                  <el-input
+                    type="textarea"
+                    :autosize="{ minRows: 2 }"
+                    v-model="editConfig.infomation.remark"
+                  ></el-input>
+                </el-form-item>
+              </el-col>
+            </el-row>
+          </div>
+          <!-- 闄勪欢淇℃伅 -->
+          <!-- <div class="basic-info-title">闄勪欢淇℃伅</div>
+          <div class="basic-info-view">
+            <el-row>
+              <el-col :span="12">
+                <el-form-item label="闄勪欢" prop="">
+                  <template slot="label">
+                    <div style="display: flex; float: right">
+                      <div style="font-size: 16px">
+                        <i class="el-icon-warning-outline" title="鏈�澶氫笂浼�20涓檮浠讹紝鏈�澶ч檺鍒�5MB"></i>
+                      </div>
+                      <span style="margin-left: 5px">闄勪欢</span>
+                    </div>
+                  </template>
+                  <div class="annex-view">
+                    <div @click="addAnnexClick">
+                      <div style="display: flex; float: right">
+                        <div style="font-size: 16px"><i class="el-icon-paperclip"></i></div>
+                        <span>娣诲姞</span>
+                      </div>
+                    </div>
+                    <div class="setFormat" @click="setFormatClick">璁剧疆鍏佽涓婁紶鐨勬枃浠舵牸寮�</div>
+                  </div>
+                </el-form-item>
+              </el-col>
+            </el-row>
+          </div> -->
+          <!-- 閫夋嫨瀹℃壒娴佺▼ -->
+          <!-- <div v-if="editConfig.title === '鏂板缓'" class="basic-info-title">閫夋嫨瀹℃壒娴佺▼</div>
+          <div v-if="editConfig.title === '鏂板缓'" class="basic-info-view">
+            <el-row>
+              <el-col :span="20">
+                <el-form-item label="瀹℃壒娴佺▼" prop="approvalWorkflow">
+                  <el-select
+                    v-model="editConfig.infomation.approvalWorkflow"
+                    placeholder="璇烽�夋嫨"
+                    size="mini"
+                    style="width: 100%"
+                  >
+                    <el-option
+                      v-for="item in approvalWorkflowOptions"
+                      :key="item.value"
+                      :label="item.label"
+                      :value="item.value"
+                    >
+                    </el-option>
+                  </el-select>
+                </el-form-item>
+              </el-col>
+              <el-col :span="20">
+                <el-form-item label="瀹℃壒姝ラ" prop="approvalSteps">
+                  <el-input v-model="editConfig.infomation.approvalSteps"></el-input>
+                </el-form-item>
+              </el-col>
+              <el-col :span="20">
+                <el-form-item label="瀹℃壒浜�" prop="approvalPerson">
+                  <el-input v-model="editConfig.infomation.approvalPerson"></el-input>
+                </el-form-item>
+              </el-col>
+              <el-col :span="20">
+                <el-form-item label="闇�瑕佸姞鎬ュ鎵�" prop="approvalUrgent">
+                  <el-checkbox v-model="editConfig.infomation.approvalUrgent"></el-checkbox>
+                </el-form-item>
+              </el-col>
+              <el-col :span="20">
+                <el-form-item label="瀹℃壒鎰忚" prop="approvalOpinion">
+                  <el-input v-model="editConfig.infomation.approvalOpinion" type="textarea" :rows="2"></el-input>
+                </el-form-item>
+              </el-col>
+            </el-row>
+          </div> -->
+        </div>
+      </el-form>
+
+      <div slot="footer" class="dialog-footer">
+        <!-- <el-button type="primary" size="small" @click="editConfig.visible = false">淇濆苟鎻愪氦瀹℃壒</el-button> -->
+        <el-button type="primary" size="small" @click="saveClick('form')">淇濆瓨</el-button>
+        <el-button size="small" @click="editConfig.visible = false">鍙栨秷</el-button>
+      </div>
+      <!-- 閫夋嫨瀹㈡埛 -->
+      <SelectClientDialog
+        v-if="editSelectClientConfig.editVisible"
+        :edit-common-config="editSelectClientConfig"
+        @selClient="selClient"
+      />
+      <!-- 閫夋嫨鏈嶅姟鍚堝悓 閿�鍞槑缁嗚鍗� -->
+      <SelectCommonDialog
+        v-if="editSelCommonConfig.editVisible"
+        :edit-common-config="editSelCommonConfig"
+        @selClient="selClient"
+      />
+    </el-dialog>
+  </div>
+</template>
+
+<script>
+// import CommonFormTableView from "@/components/makepager/CommonFormTableView"
+import { getAllData } from "@/api/client/client"
+// import { getAddSalesDetails, getUpdateSalesDetails } from "@/api/sales/salesDetails"
+import SelectClientDialog from "@/views/other/commonDialog/SelectClientDialog"
+import SelectCommonDialog from "@/views/other/commonDialog/SelectCommonDialog"
+import { getPaymentTypeList, getBankAccountList, addReceipt } from "@/api/common/payment"
+export default {
+  name: "AddReceiptDialog",
+  props: {
+    editCommonConfig: {
+      type: Object,
+      default: () => {
+        return {
+          visible: false,
+          title: "鏂板缓",
+          sourceType: 1,
+          infomation: {}
+        }
+      }
+    }
+  },
+  components: { SelectClientDialog, SelectCommonDialog },
+  computed: {
+    clientList() {
+      return this.$store.state.getClientName.clientList
+    },
+    serviceContractList() {
+      return this.$store.state.getClientName.serviceContractList
+    },
+    salesDetailsList() {
+      return this.$store.state.getClientName.salesDetailsList
+    }
+  },
+  data() {
+    return {
+      dialogWidth: "80%",
+      editConfig: this.editCommonConfig,
+      rules: {
+        client_name: [{ required: true, message: "璇烽�夋嫨瀹㈡埛鍚嶇О", trigger: "change" }],
+        signTime: [{ required: true, message: "璇烽�夋嫨鏀舵鏃ユ湡", trigger: "change" }],
+        memberId: [{ required: true, message: "璇烽�夋嫨閿�鍞礋璐ｄ汉", trigger: "change" }]
+        // approvalOpinion: [{ required: true, message: "璇疯緭鍏�", trigger: "blur" }]
+      },
+      memberOptions: [],
+      bankAccountOptions: [], // 璐︽埛
+      paymentTypeListOptions: [], // 鏀舵鏂瑰紡
+      currencyOptions: [{ id: 1, name: "浜烘皯甯�" }], // 甯佺
+      approvalWorkflowOptions: [], // 瀹℃壒娴佺▼
+      productTableList: {},
+      showSummary: {
+        show: true,
+        total: true,
+        sumProp: ["other1", "other7"],
+        mergeNumber: 2
+      },
+      editSelectClientConfig: {
+        editVisible: false,
+        title: "",
+        infomation: {}
+      },
+      editSelCommonConfig: {
+        editVisible: false,
+        title: "",
+        infomation: {}
+      },
+      clientId: this.editCommonConfig.infomation.client_id,
+      SalesDetailsId: this.editCommonConfig.infomation.SalesDetailsId,
+      serviceContractId: this.editCommonConfig.infomation.id
+    }
+  },
+  created() {
+    this.$store.dispatch("geClient")
+    this.$store.dispatch("geServiceContract")
+    this.$store.dispatch("geSalesDetails")
+    this.setTableForm()
+    this.getCommonData()
+  },
+  methods: {
+    getCommonData() {
+      getAllData().then((res) => {
+        this.memberOptions = res.data.member
+      })
+      this.getPaymentTypeList()
+      this.getBankAccountList()
+    },
+    async getPaymentTypeList() {
+      await getPaymentTypeList().then((res) => {
+        console.log("鏀粯鏂瑰紡")
+        console.log(res.data)
+        if (res.data.code === 200) {
+          this.paymentTypeListOptions = res.data.data.data
+        }
+      })
+    },
+    async getBankAccountList() {
+      await getBankAccountList().then((res) => {
+        console.log("璐︽埛")
+        console.log(res.data)
+        if (res.data.code === 200) {
+          this.bankAccountOptions = res.data.data.data
+        }
+      })
+    },
+    // 淇濆瓨
+    saveClick(formName) {
+      this.$refs[formName].validate((valid) => {
+        if (valid) {
+          console.log(this.editConfig.infomation)
+          const params = this.saveParams()
+          console.log(params)
+          if (this.editConfig.title === "鏂板缓") {
+            addReceipt(params).then((res) => {
+              console.log(res)
+              this.editConfig.visible = false
+              if (res.code === 200) {
+                this.$message.success("娣诲姞鎴愬姛")
+                this.$parent.getData()
+              }
+            })
+          } else {
+            // getUpdateSalesDetails(params).then((res) => {
+            //   console.log(res)
+            //   this.editConfig.visible = false
+            //   if (res.code === 200) {
+            //     this.$message.success("缂栬緫鎴愬姛")
+            //     this.$parent.getData()
+            //   }
+            // })
+          }
+        } else {
+          console.log("error submit")
+          return false
+        }
+      })
+    },
+    saveParams() {
+      let data = this.editConfig.infomation
+      let params = {
+        amount: data.amount || 0,
+        bankAccountId: data.bankAccountId || 0,
+        clientId: this.clientId || 0,
+        fileId: 0,
+        id: 0,
+        moneyType: "浜烘皯甯�",
+        paymentTypeId: data.paymentTypeId || 0,
+        principalId: data.principalId || 0,
+        receiptDate: data.receiptDate || "",
+        remark: data.remark || "",
+        sourceId: this.editConfig.sourceType === 1 ? this.SalesDetailsId : this.serviceContractId,
+        sourceType: this.editConfig.sourceType
+      }
+      return params
+    },
+
+    handleClose() {
+      this.editConfig.visible = false
+    },
+    // 閫夋嫨瀹㈡埛鐩稿叧鏂规硶
+    querySearchAsync(queryString, cb, value) {
+      var restaurants = []
+      if (value === "client") {
+        restaurants = this.clientList
+      } else if (value === "serviceContract") {
+        restaurants = this.serviceContractList
+      } else if (value === "contract") {
+        restaurants = this.salesDetailsList
+      }
+      var results = queryString ? restaurants.filter(this.createStateFilter(queryString, value)) : restaurants
+      cb(results)
+    },
+    createStateFilter(queryString, value) {
+      return (state) => {
+        if (value === "serviceContract" || value === "contract") {
+          return state.number.toLowerCase().indexOf(queryString.toLowerCase()) === 0
+        } else {
+          return state.name.toLowerCase().indexOf(queryString.toLowerCase()) === 0
+        }
+      }
+    },
+    handleSelectClient(value, item) {
+      if (value === "client") {
+        this.clientId = item.id
+      } else if (value === "serviceContract") {
+        this.serviceContractId = item.id
+      } else if (value === "contract") {
+        this.SalesDetailsId = item.id
+      }
+    },
+    selClientClick(value) {
+      if (value === "client") {
+        this.editSelectClientConfig.editVisible = true
+      } else if (value === "serviceContract") {
+        this.editSelCommonConfig.title = "鏈嶅姟鍚堝悓"
+        this.editSelCommonConfig.editVisible = true
+      } else if (value === "contract") {
+        this.editSelCommonConfig.title = "閿�鍞槑缁嗗崟"
+        this.editSelCommonConfig.editVisible = true
+      }
+    },
+    selClient(row, value) {
+      if (value === "contact") {
+        this.editConfig.infomation.contact_name = row.name
+        this.contactId = row.id
+      } else if (value === "serviceContract") {
+        this.editConfig.infomation.serviceContract_Number = row.number
+        this.serviceContractId = row.id
+      } else if (value === "contract") {
+        this.editConfig.infomation.number = row.number
+        this.SalesDetailsId = row.id
+      }
+    },
+    // 娓呴櫎宸查�夋嫨鐢ㄦ埛
+    clearupClient(value) {
+      if (value === "client") {
+        this.editConfig.infomation.client_name = ""
+        this.clientId = 0
+      } else if (value === "serviceContract") {
+        this.editConfig.infomation.serviceContract_Number = ""
+        this.serviceContractId = 0
+      } else if (value === "contract") {
+        this.editConfig.infomation.number = ""
+        this.SalesDetailsId = 0
+      }
+    },
+    // 娣诲姞闄勪欢
+    addAnnexClick() {},
+    // 璁剧疆鍏佽涓婁紶鏂囦欢鏍煎紡
+    setFormatClick() {},
+    setTableForm() {
+      if (this.editConfig.title === "鏂板缓") {
+        this.tableData = [
+          {
+            id: 1,
+            Amount: 0,
+            IsSale: true,
+            MaterialMode: "",
+            MinInventory: 0,
+            Name: "",
+            Number: "",
+            PurchaseType: "",
+            SalePrice: 0,
+            Unit: ""
+          }
+        ]
+      } else {
+        this.tableData = this.editConfig.infomation.products
+      }
+      this.productTableList = {
+        tableData: this.tableData,
+        tableColumn: [
+          { label: "#", prop: "id", width: 40 },
+          { label: "浜у搧鍚嶇О", prop: "Name", input: true, isRequird: true },
+          { label: "浜у搧缂栧彿", prop: "Number" },
+          { label: "鏁伴噺", prop: "Amount", input: true, isRequird: true },
+          { label: "閿�鍞崟浠�", prop: "Unit", input: true },
+          { label: "浠风◣鍚堣", prop: "total", input: true },
+          { label: "鎻忚堪", prop: "other8" }
+        ]
+      }
+    },
+    // 浜у搧鏂板
+    addProductClick() {
+      this.productId++
+      this.tableData.push({
+        id: this.productId,
+        Amount: 0,
+        IsSale: true,
+        MaterialMode: "",
+        MinInventory: 0,
+        Name: "",
+        Number: "",
+        PurchaseType: "",
+        SalePrice: 0,
+        Unit: ""
+      })
+    }
+  }
+}
+</script>
+
+<!-- Add "scoped" attribute to limit CSS to this component only -->
+<style lang="scss" scoped>
+::v-deep {
+  .iframe-dialog .el-dialog__body {
+    .basic-info {
+      .basic-info-title {
+        background-color: #f4f8fe;
+        padding-left: 10px;
+        font-size: 15px;
+        font-weight: bold;
+        color: #666;
+        height: 42px;
+        line-height: 42px;
+      }
+      .basic-info-view {
+        margin-top: 10px;
+        padding-right: 40px;
+        .custom-name,
+        .common-select {
+          display: flex;
+          .common-select-sel {
+            width: 270px;
+          }
+          .common-select-btn {
+            margin-left: 5px;
+            font-size: 16px;
+            cursor: pointer;
+          }
+        }
+      }
+      .annex-view {
+        display: flex;
+        color: #6166d3;
+        .setFormat {
+          margin-left: 10px;
+        }
+      }
+    }
+    .unflod-collapse {
+      display: flex;
+      height: 30px;
+      justify-content: center;
+      align-items: center;
+      color: #6166d3;
+    }
+    .dialog-footer {
+      background-color: #f5f5f5;
+      height: 55px;
+      line-height: 55px;
+    }
+    .el-input__inner {
+      text-align: left;
+    }
+  }
+}
+</style>
diff --git a/src/views/other/payment/receipt/index.vue b/src/views/other/payment/receipt/index.vue
new file mode 100644
index 0000000..2145240
--- /dev/null
+++ b/src/views/other/payment/receipt/index.vue
@@ -0,0 +1,231 @@
+<template>
+  <div class="receipt">
+    <div v-if="isDetail" class="detail-top">
+      <DetailListCommonBtn :query-class-options="queryClassOptions" />
+      <PagerView class="page" :pager-options="pagerOptions" v-on="pagerEvents" />
+    </div>
+    <div v-else class="top">
+      <SearchCommonView
+        ref="searchCommonView"
+        :query-class-options="queryClassOptions"
+        :search-options="searchOptions"
+        :search-sel="searchSel"
+        @searchClick="searchClick"
+        @resetClick="resetClick"
+      />
+      <div class="btn-pager">
+        <PublicFunctionBtnView :statistics="true" :operates-list="operatesList" @batchDelete="delClick" />
+        <PagerView class="page" :pager-options="pagerOptions" v-on="pagerEvents" />
+      </div>
+    </div>
+    <TableCommonView
+      ref="tableListRef"
+      v-loading="loading"
+      :table-list="tableList"
+      :select-box="!isDetail"
+      @getSelectArray="getSelectArray"
+    >
+      <!-- <template slot="tableButton">
+        <el-table-column label="鎿嶄綔" width="60" fixed="right">
+          <template slot-scope="scope">
+            <el-button @click="handleClick(scope.row)" type="text" size="small">缂栬緫</el-button>
+          </template>
+        </el-table-column>
+      </template> -->
+    </TableCommonView>
+    <!-- 鏂板缓/缂栬緫 -->
+    <AddReceipt v-if="editConfig.visible" :edit-common-config="editConfig" />
+  </div>
+</template>
+
+<script>
+import { getReceiptList } from "@/api/common/payment"
+import pageMixin from "@/components/makepager/pager/mixin/pageMixin"
+import AddReceipt from "@/views/other/payment/receipt/addReceipt.vue"
+
+export default {
+  name: "ReceiptView",
+  props: {
+    isDetail: {
+      type: Boolean,
+      default: false
+    },
+    addConfig: {
+      type: Object,
+      default: () => {
+        return {}
+      }
+    },
+    sourceType: {
+      type: Number,
+      default: 1
+    }
+  },
+  mixins: [pageMixin],
+  components: { AddReceipt },
+  computed: {},
+  data() {
+    return {
+      tableList: {},
+      loading: false,
+      activeName: "second",
+      queryClassValue: "1",
+      queryClassOptions: [
+        { value: "1", label: "鍏ㄩ儴" },
+        { value: "2", label: "浠婃棩鑱旂郴" },
+        { value: "3", label: "鏈懆鑱旂郴" },
+        { value: "4", label: "鏈湀鑱旂郴" }
+      ],
+      searchOptions: [],
+      operatesList: [
+        { id: "1", name: "鍏变韩" },
+        { id: "2", name: "鎵归噺缂栬緫" },
+        { id: "3", name: "瀵煎嚭" },
+        { id: "4", name: "涓嬭浇鍏ㄩ儴闄勪欢" },
+        { id: "5", name: "鏇存敼鍒涘缓浜�" },
+        { id: "6", name: "鏍戠粨鏋勮缃�" },
+        { id: "7", name: "瀹℃壒璁剧疆" },
+        { id: "8", name: "鍥炶棰勮鍒楀" }
+      ],
+      editConfig: {
+        visible: false,
+        title: "鏂板缓",
+        infomation: {}
+      },
+      saleChanceName: "",
+      contactsDeail: {
+        visible: false,
+        infomation: {}
+      },
+      clientDeail: {
+        visible: false,
+        infomation: {}
+      },
+      selValueList: [],
+      searchSel: {
+        value: "topic",
+        label: ""
+      },
+      search_map: {},
+      keyword: "",
+      keywordType: ""
+    }
+  },
+  created() {
+    this.setTable()
+    if (!this.isDetail) {
+      this.keyword = ""
+      this.keywordType = ""
+    } else {
+      this.keyword = this.addConfig.keyword
+      this.keywordType = this.addConfig.keywordType
+    }
+    this.getData()
+  },
+  methods: {
+    setTable() {
+      this.tableList = {
+        tableInfomation: [],
+        tableColumn: [
+          { label: "鏀舵鍗曠紪鍙�", prop: "number" },
+          { label: "瀹㈡埛鍚嶇О", prop: "client_name" },
+          { label: "閫夋嫨婧愬崟", prop: "sourceId" },
+          { label: "瀹為檯鏀舵閲戦", prop: "amount" },
+          { label: "鏀舵鏂瑰紡", prop: "paymentType_name" },
+          { label: "閿�鍞礋璐ｄ汉", prop: "principal_name" },
+          { label: "鏀舵鏃ユ湡", prop: "receiptDate" }
+        ]
+      }
+      this.searchOptions = []
+      for (let i = 0; i < this.tableList.tableColumn.length; i++) {
+        const label = this.tableList.tableColumn[i].label
+        const value = this.tableList.tableColumn[i].prop
+        this.searchOptions.push({ value: value, label: label })
+      }
+    },
+    // 璇锋眰鏁版嵁
+    async getData() {
+      this.loading = true
+      await getReceiptList({
+        keyword: this.keyword,
+        keywordType: this.keywordType,
+        page: this.pagerOptions.currPage,
+        pageSize: this.pagerOptions.pageSize
+      })
+        .then((res) => {
+          console.log(res)
+          if (res.code === 200) {
+            if (res.data.list && res.data.list.length > 0) {
+              const list = res.data.list.map((item) => {
+                return {
+                  ...item,
+                  paymentType_name: item.PaymentType.name,
+                  principal_name: item.principal.username
+                }
+              })
+              this.tableList.tableInfomation = list || []
+              this.pagerOptions.totalCount = res.data.count
+            } else {
+              this.tableList.tableInfomation = []
+            }
+          } else {
+            this.tableList.tableInfomation = []
+          }
+          this.loading = false
+        })
+        .catch((err) => {
+          console.log(err)
+          this.tableList.tableInfomation = []
+          this.loading = false
+        })
+    },
+    // 鎼滅储
+    searchClick(val, content) {
+      this.keyword = content
+      this.keywordType = val.label
+      this.getData()
+    },
+    resetClick() {
+      this.keyword = ""
+      this.keywordType = ""
+      this.getData()
+    },
+    getSelectArray(val) {
+      console.log(val)
+      this.selValueList = []
+      const list = val.map((item) => {
+        return item.id
+      })
+      this.selValueList = list
+    },
+    // 鏂板缓
+    addBtnClick() {
+      this.editConfig.visible = true
+      this.editConfig.title = "鏂板缓"
+      this.editConfig.sourceType = this.sourceType
+      this.editConfig.infomation = { ...this.addConfig }
+    }
+  }
+}
+</script>
+
+<!-- Add "scoped" attribute to limit CSS to this component only -->
+<style lang="scss" scoped>
+.receipt {
+  .top {
+    margin-bottom: 20px;
+    .btn-pager {
+      display: flex;
+      .page {
+        margin-left: auto;
+      }
+    }
+  }
+  .detail-top {
+    display: flex;
+    .page {
+      margin-left: auto;
+    }
+  }
+}
+</style>
diff --git a/src/views/other/payment/saleInvoice/addSaleInvoice.vue b/src/views/other/payment/saleInvoice/addSaleInvoice.vue
new file mode 100644
index 0000000..d19d174
--- /dev/null
+++ b/src/views/other/payment/saleInvoice/addSaleInvoice.vue
@@ -0,0 +1,726 @@
+<template>
+  <div class="add-SaleInvoice">
+    <el-dialog
+      :title="editCommonConfig.title + '閿�鍞彂绁�'"
+      :visible.sync="editConfig.visible"
+      :width="dialogWidth"
+      :before-close="handleClose"
+      append-to-body
+      custom-class="iframe-dialog"
+    >
+      <el-form
+        ref="form"
+        :model="editConfig.infomation"
+        :rules="rules"
+        label-position="right"
+        label-width="308px"
+        size="mini"
+        style="height: 60vh; overflow-x: hidden"
+      >
+        <!-- 淇℃伅 -->
+        <div class="basic-info">
+          <!-- 鍩烘湰淇℃伅 -->
+          <div class="basic-info-title">鍩烘湰淇℃伅</div>
+          <div class="basic-info-view">
+            <el-row>
+              <el-col :span="12">
+                <el-form-item label="涓婚" prop="subject">
+                  <el-input v-model="editConfig.infomation.subject"></el-input>
+                </el-form-item>
+              </el-col>
+              <el-col :span="12">
+                <el-form-item label="鍙戠エ缂栧彿" prop="number">
+                  <el-input v-model="editConfig.infomation.number"></el-input>
+                </el-form-item>
+              </el-col>
+              <el-col :span="12">
+                <el-form-item label="瀹㈡埛鍚嶇О" prop="client_name">
+                  <div class="custom-name">
+                    <el-autocomplete
+                      v-model="editConfig.infomation.client_name"
+                      :fetch-suggestions="
+                        (queryString, callback) => {
+                          querySearchAsync(queryString, callback, 'client')
+                        }
+                      "
+                      value-key="name"
+                      @select="handleSelectClient('client', $event)"
+                    ></el-autocomplete>
+                    <div class="common-select-btn" @click="selClientClick('client')">
+                      <i class="el-icon-circle-plus-outline" title="閫夋嫨"></i>
+                    </div>
+                    <div class="common-select-btn" @click="clearupClient('client')">
+                      <i class="el-icon-edit-outline" title="娓呴櫎"></i>
+                    </div>
+                  </div>
+                </el-form-item>
+              </el-col>
+              <el-col :span="12">
+                <el-form-item label="绁ㄦ嵁绫诲瀷" prop="invoiceTypeId">
+                  <div class="common-select">
+                    <el-select
+                      v-model="editConfig.infomation.invoiceTypeId"
+                      placeholder="璇烽�夋嫨"
+                      class="common-select-sel"
+                      size="mini"
+                    >
+                      <el-option v-for="item in invoiceTypeOptions" :key="item.id" :label="item.name" :value="item.id">
+                      </el-option>
+                    </el-select>
+                    <!-- <div class="common-select-btn"><i class="el-icon-setting"></i></div> -->
+                  </div>
+                </el-form-item>
+              </el-col>
+              <el-col :span="12">
+                <el-form-item label="鐘舵��" prop="invoiceStatusId">
+                  <div class="common-select">
+                    <el-select
+                      v-model="editConfig.infomation.invoiceStatusId"
+                      placeholder="璇烽�夋嫨"
+                      class="common-select-sel"
+                      size="mini"
+                    >
+                      <el-option
+                        v-for="item in invoiceStatusOptions"
+                        :key="item.id"
+                        :label="item.name"
+                        :value="item.id"
+                      >
+                      </el-option>
+                    </el-select>
+                    <!-- <div class="common-select-btn"><i class="el-icon-setting"></i></div> -->
+                  </div>
+                </el-form-item>
+              </el-col>
+              <el-col :span="12">
+                <el-form-item label="閿�鍞礋璐ｄ汉" prop="principalId">
+                  <el-select
+                    v-model="editConfig.infomation.principalId"
+                    placeholder="璇烽�夋嫨"
+                    size="mini"
+                    style="width: 63%"
+                  >
+                    <el-option v-for="item in memberOptions" :key="item.id" :label="item.username" :value="item.id">
+                    </el-option>
+                  </el-select>
+                </el-form-item>
+              </el-col>
+              <el-col v-if="editConfig.sourceType === 2" :span="12">
+                <el-form-item label="鏈嶅姟鍚堝悓">
+                  <div class="custom-name">
+                    <el-autocomplete
+                      v-model="editConfig.infomation.serviceContract_Number"
+                      :fetch-suggestions="
+                        (queryString, callback) => {
+                          querySearchAsync(queryString, callback, 'serviceContract')
+                        }
+                      "
+                      value-key="number"
+                      @select="handleSelectClient('serviceContract', $event)"
+                    ></el-autocomplete>
+                    <div class="common-select-btn" @click="selClientClick('serviceContract')">
+                      <i class="el-icon-circle-plus-outline" title="閫夋嫨"></i>
+                    </div>
+                    <div class="common-select-btn" @click="clearupClient('serviceContract')">
+                      <i class="el-icon-edit-outline" title="娓呴櫎"></i>
+                    </div>
+                  </div>
+                </el-form-item>
+              </el-col>
+              <el-col v-else :span="12">
+                <el-form-item label="鍚堝悓璁㈠崟">
+                  <div class="custom-name">
+                    <el-autocomplete
+                      v-model="editConfig.infomation.number"
+                      :fetch-suggestions="
+                        (queryString, callback) => {
+                          querySearchAsync(queryString, callback, 'contract')
+                        }
+                      "
+                      value-key="number"
+                      @select="handleSelectClient('contract', $event)"
+                    ></el-autocomplete>
+                    <div class="common-select-btn" @click="selClientClick('contract')">
+                      <i class="el-icon-circle-plus-outline" title="閫夋嫨"></i>
+                    </div>
+                    <div class="common-select-btn" @click="clearupClient('contract')">
+                      <i class="el-icon-edit-outline" title="娓呴櫎"></i>
+                    </div>
+                  </div>
+                </el-form-item>
+              </el-col>
+              <el-col :span="12">
+                <el-form-item label="绾崇◣璇嗗埆鍙�" prop="taxpayerIdNumber">
+                  <el-input v-model="editConfig.infomation.taxpayerIdNumber"></el-input>
+                </el-form-item>
+              </el-col>
+            </el-row>
+          </div>
+          <!-- 鍔ㄦ�佷俊鎭� -->
+          <div class="basic-info-title">鍔ㄦ�佷俊鎭�</div>
+          <div class="basic-info-view">
+            <el-row>
+              <el-col :span="12">
+                <el-form-item label="鐗╂祦鍏徃" prop="courierCompanyId">
+                  <div class="common-select">
+                    <el-select
+                      v-model="editConfig.infomation.courierCompanyId"
+                      placeholder="璇烽�夋嫨"
+                      class="common-select-sel"
+                      size="mini"
+                    >
+                      <el-option
+                        v-for="item in courierCompanyOptions"
+                        :key="item.id"
+                        :label="item.name"
+                        :value="item.id"
+                      >
+                      </el-option>
+                    </el-select>
+                    <!-- <div class="common-select-btn"><i class="el-icon-setting"></i></div> -->
+                  </div>
+                </el-form-item>
+              </el-col>
+              <el-col :span="12">
+                <el-form-item label="鐗╂祦鍗曞彿" prop="courierNumber">
+                  <el-input v-model="editConfig.infomation.courierNumber"></el-input>
+                </el-form-item>
+              </el-col>
+              <el-col :span="12">
+                <el-form-item label="寮�绁ㄦ棩鏈�" prop="invoiceDate">
+                  <el-date-picker
+                    v-model="editConfig.infomation.invoiceDate"
+                    value-format="yyyy-MM-dd"
+                    type="date"
+                    placeholder="閫夋嫨鏃ユ湡"
+                  >
+                  </el-date-picker>
+                </el-form-item>
+              </el-col>
+              <el-col :span="12">
+                <el-form-item label="鍙戠エ鍙风爜" prop="invoiceNumber">
+                  <el-input v-model="editConfig.infomation.invoiceNumber"></el-input>
+                </el-form-item>
+              </el-col>
+            </el-row>
+          </div>
+          <!-- 鏉℃涓庢潯浠� -->
+          <!-- <div class="basic-info-title">鏉℃涓庢潯浠�</div>
+          <div class="basic-info-view">
+            <el-row>
+              <el-col :span="24">
+                <el-form-item label="鏉℃鍜屾潯绾�" prop="terms">
+                  <el-input
+                    type="textarea"
+                    :autosize="{ minRows: 4, maxRows: 6 }"
+                    placeholder="璇疯緭鍏ュ唴瀹�"
+                    v-model="editConfig.infomation.terms"
+                  ></el-input>
+                </el-form-item>
+              </el-col>
+            </el-row>
+          </div> -->
+          <!-- 闄勪欢淇℃伅 -->
+          <!-- <div class="basic-info-title">闄勪欢淇℃伅</div>
+          <div class="basic-info-view">
+            <el-row>
+              <el-col :span="12">
+                <el-form-item label="闄勪欢" prop="">
+                  <template slot="label">
+                    <div style="display: flex; float: right">
+                      <div style="font-size: 16px">
+                        <i class="el-icon-warning-outline" title="鏈�澶氫笂浼�20涓檮浠讹紝鏈�澶ч檺鍒�5MB"></i>
+                      </div>
+                      <span style="margin-left: 5px">闄勪欢</span>
+                    </div>
+                  </template>
+                  <div class="annex-view">
+                    <div @click="addAnnexClick">
+                      <div style="display: flex; float: right">
+                        <div style="font-size: 16px"><i class="el-icon-paperclip"></i></div>
+                        <span>娣诲姞</span>
+                      </div>
+                    </div>
+                    <div class="setFormat" @click="setFormatClick">璁剧疆鍏佽涓婁紶鐨勬枃浠舵牸寮�</div>
+                  </div>
+                </el-form-item>
+              </el-col>
+            </el-row>
+          </div> -->
+          <!-- 浜у搧绠＄悊 -->
+          <div class="basic-info-title" style="display: flex">
+            浜у搧绠＄悊
+            <div style="margin-left: 400px">
+              甯佺
+              <el-select v-model="editConfig.infomation.currency" placeholder="璇烽�夋嫨" size="mini" style="width: 63%">
+                <el-option v-for="item in currencyOptions" :key="item.value" :label="item.label" :value="item.value">
+                </el-option>
+              </el-select>
+            </div>
+          </div>
+          <div class="product-view">
+            <CommonFormTableView
+              :show-summary="showSummary"
+              :product-table-list="productTableList"
+              @inputContent="inputContent"
+              @addProductClick="addProductClick"
+              @emptyProductClick="emptyProductClick"
+              @recalculateProductClick="recalculateProductClick"
+            />
+          </div>
+          <!-- 閫夋嫨瀹℃壒娴佺▼ -->
+          <!-- <div class="basic-info-title">閫夋嫨瀹℃壒娴佺▼</div>
+          <div class="basic-info-view">
+            <el-row>
+              <el-col :span="20">
+                <el-form-item label="瀹℃壒娴佺▼" prop="approvalWorkflow">
+                  <el-select
+                    v-model="editConfig.infomation.approvalWorkflow"
+                    placeholder="璇烽�夋嫨"
+                    size="mini"
+                    style="width: 100%"
+                  >
+                    <el-option
+                      v-for="item in approvalWorkflowOptions"
+                      :key="item.value"
+                      :label="item.label"
+                      :value="item.value"
+                    >
+                    </el-option>
+                  </el-select>
+                </el-form-item>
+              </el-col>
+              <el-col :span="20">
+                <el-form-item label="瀹℃壒姝ラ" prop="approvalSteps">
+                  <el-input v-model="editConfig.infomation.approvalSteps"></el-input>
+                </el-form-item>
+              </el-col>
+              \
+              <el-col :span="20">
+                <el-form-item label="瀹℃壒浜�" prop="approvalPerson">
+                  <el-input v-model="editConfig.infomation.approvalPerson"></el-input>
+                </el-form-item>
+              </el-col>
+              <el-col :span="20">
+                <el-form-item label="瀹℃壒鎰忚" prop="approvalOpinion">
+                  <el-input v-model="editConfig.infomation.approvalOpinion" type="textarea" :rows="2"></el-input>
+                </el-form-item>
+              </el-col>
+            </el-row>
+          </div> -->
+        </div>
+      </el-form>
+
+      <div slot="footer" class="dialog-footer">
+        <!-- <el-button type="primary" size="small" @click="editConfig.visible = false">淇濆苟鎻愪氦瀹℃壒</el-button> -->
+        <el-button type="primary" size="small" @click="saveClick('form')">淇濆瓨</el-button>
+        <el-button size="small" @click="editConfig.visible = false">鍙栨秷</el-button>
+      </div>
+      <!-- 閫夋嫨瀹㈡埛 -->
+      <SelectClientDialog
+        v-if="editSelectClientConfig.editVisible"
+        :edit-common-config="editSelectClientConfig"
+        @selClient="selClient"
+      />
+      <!-- 鍚堝悓璁㈠崟 -->
+      <SelectCommonDialog
+        v-if="editSelCommonConfig.editVisible"
+        :edit-common-config="editSelCommonConfig"
+        @selClient="selClient"
+      />
+    </el-dialog>
+  </div>
+</template>
+
+<script>
+import CommonFormTableView from "@/components/makepager/CommonFormTableView"
+import { getAllData } from "@/api/client/client"
+// import { getAddServiceContract, getUpdateServiceContract } from "@/api/serviceManage/serviceContract"
+import SelectClientDialog from "@/views/other/commonDialog/SelectClientDialog"
+import SelectCommonDialog from "@/views/other/commonDialog/SelectCommonDialog"
+import { addInvoice, getInvoiceTypeList, getInvoiceStatusList, getCourierCompanyList } from "@/api/common/payment"
+export default {
+  name: "AddSaleInvoiceDialog",
+  props: {
+    editCommonConfig: {
+      type: Object,
+      default: () => {
+        return {
+          visible: false,
+          title: "鏂板缓",
+          sourceType: 1,
+          infomation: {}
+        }
+      }
+    }
+  },
+  components: { CommonFormTableView, SelectClientDialog, SelectCommonDialog },
+  computed: {
+    clientList() {
+      return this.$store.state.getClientName.clientList
+    },
+    salesDetailsList() {
+      return this.$store.state.getClientName.salesDetailsList
+    },
+    serviceContractList() {
+      return this.$store.state.getClientName.serviceContractList
+    }
+  },
+  data() {
+    return {
+      dialogWidth: "80%",
+      editConfig: this.editCommonConfig,
+      rules: {
+        subject: [{ required: true, message: "璇疯緭鍏ヤ富棰�", trigger: "blur" }],
+        client_name: [{ required: true, message: "璇烽�夋嫨瀹㈡埛鍚嶇О", trigger: "change" }],
+        invoiceTypeId: [{ required: true, message: "璇烽�夋嫨绁ㄦ嵁绫诲瀷", trigger: "change" }],
+        principalId: [{ required: true, message: "璇烽�夋嫨閿�鍞礋璐ｄ汉", trigger: "change" }]
+      },
+      memberOptions: [],
+      invoiceTypeOptions: [], // 绁ㄦ嵁绫诲瀷
+      invoiceStatusOptions: [], // 绁ㄦ嵁鐘舵��
+      currencyOptions: [{ id: 1, name: "浜烘皯甯�" }], // 甯佺
+      courierCompanyOptions: [], //鐗╂祦鍏徃
+      approvalWorkflowOptions: [], // 瀹℃壒娴佺▼
+      productTableList: {},
+      showSummary: {
+        show: true,
+        total: true,
+        sumProp: ["Amount", "Unit", "total"],
+        mergeNumber: 3
+      },
+      editSelectClientConfig: {
+        editVisible: false,
+        title: "",
+        infomation: {}
+      },
+      editSelectContactConfig: {
+        editVisible: false,
+        title: "",
+        infomation: {}
+      },
+      editSelectChanceConfig: {
+        editVisible: false,
+        title: "",
+        infomation: {}
+      },
+      editSelCommonConfig: {
+        editVisible: false,
+        title: "",
+        infomation: {}
+      },
+      clientId: this.editCommonConfig.infomation.client_id,
+      SalesDetailsId: this.editCommonConfig.infomation.SalesDetailsId,
+      serviceContractId: this.editCommonConfig.infomation.id,
+      tableData: [],
+      productId: 1
+    }
+  },
+  created() {
+    this.$store.dispatch("geClient")
+    this.$store.dispatch("geServiceContract")
+    this.$store.dispatch("geSalesDetails")
+    this.setTableForm()
+    this.getCommonData()
+  },
+  methods: {
+    getCommonData() {
+      getAllData().then((res) => {
+        if (res.code === 200) {
+          this.memberOptions = res.data.member
+        }
+      })
+      this.getInvoiceTypeList()
+      this.getInvoiceStatusList()
+      this.getCourierCompanyList()
+    },
+    async getInvoiceTypeList() {
+      await getInvoiceTypeList().then((res) => {
+        console.log("绁ㄦ嵁绫诲瀷")
+        console.log(res.data)
+        if (res.data.code === 200) {
+          this.invoiceTypeOptions = res.data.data.data
+        }
+      })
+    },
+    async getInvoiceStatusList() {
+      await getInvoiceStatusList().then((res) => {
+        console.log("绁ㄦ嵁鐘舵��")
+        console.log(res.data)
+        if (res.data.code === 200) {
+          this.invoiceStatusOptions = res.data.data.data
+        }
+      })
+    },
+    async getCourierCompanyList() {
+      await getCourierCompanyList().then((res) => {
+        console.log("鐗╂祦鍏徃")
+        console.log(res.data)
+        if (res.data.code === 200) {
+          this.courierCompanyOptions = res.data.data.data
+        }
+      })
+    },
+    // 淇濆瓨
+    saveClick(formName) {
+      this.$refs[formName].validate((valid) => {
+        if (valid) {
+          console.log(this.editConfig.infomation)
+          const params = this.saveParams()
+          console.log(params)
+          if (this.editConfig.title === "鏂板缓") {
+            addInvoice(params).then((res) => {
+              console.log(res)
+              this.editConfig.visible = false
+              if (res.code === 200) {
+                this.$message.success("娣诲姞鎴愬姛")
+                this.$parent.getData()
+              }
+            })
+          } else {
+            // getUpdateServiceContract(params).then((res) => {
+            //   console.log(res)
+            //   this.editConfig.visible = false
+            //   if (res.code === 200) {
+            //     this.$message.success("缂栬緫鎴愬姛")
+            //     this.$parent.getData()
+            //   }
+            // })
+          }
+        } else {
+          console.log("error submit")
+          return false
+        }
+      })
+    },
+    saveParams() {
+      let data = this.editConfig.infomation
+      let params = {
+        clientId: this.clientId || 0,
+        courierCompanyId: data.courierCompanyId || 0,
+        courierNumber: data.courierNumber || "",
+        invoiceDate: data.invoiceDate || "",
+        invoiceNumber: data.invoiceNumber || "",
+        invoiceStatusId: data.invoiceStatusId || 0,
+        invoiceTypeId: data.invoiceTypeId || 0,
+        principalId: data.principalId || 0,
+        products: this.tableData,
+        sourceId: this.editConfig.sourceType === 1 ? this.SalesDetailsId : this.serviceContractId,
+        sourceType: this.editConfig.sourceType,
+        subject: data.subject || "",
+        taxpayerIdNumber: data.taxpayerIdNumber || ""
+      }
+      return params
+    },
+    handleClose() {
+      this.editConfig.visible = false
+    },
+    // 閫夋嫨瀹㈡埛鐩稿叧鏂规硶
+    querySearchAsync(queryString, cb, value) {
+      var restaurants = []
+      if (value === "client") {
+        restaurants = this.clientList
+      } else if (value === "serviceContract") {
+        restaurants = this.serviceContractList
+      } else if (value === "contract") {
+        restaurants = this.salesDetailsList
+      }
+      var results = queryString ? restaurants.filter(this.createStateFilter(queryString, value)) : restaurants
+      cb(results)
+    },
+    createStateFilter(queryString, value) {
+      return (state) => {
+        if (value === "serviceContract" || value === "contract") {
+          return state.number.toLowerCase().indexOf(queryString.toLowerCase()) === 0
+        } else {
+          return state.name.toLowerCase().indexOf(queryString.toLowerCase()) === 0
+        }
+      }
+    },
+    handleSelectClient(value, item) {
+      if (value === "client") {
+        this.clientId = item.id
+      } else if (value === "serviceContract") {
+        this.serviceContractId = item.id
+      } else if (value === "contract") {
+        this.SalesDetailsId = item.id
+      }
+    },
+    selClientClick(value) {
+      if (value === "client") {
+        this.editSelectClientConfig.editVisible = true
+      } else if (value === "serviceContract") {
+        this.editSelCommonConfig.title = "鏈嶅姟鍚堝悓"
+        this.editSelCommonConfig.editVisible = true
+      } else if (value === "contract") {
+        this.editSelCommonConfig.title = "閿�鍞槑缁嗗崟"
+        this.editSelCommonConfig.editVisible = true
+      }
+    },
+    selClient(row, value) {
+      if (value === "contact") {
+        this.editConfig.infomation.contact_name = row.name
+        this.contactId = row.id
+      } else if (value === "serviceContract") {
+        this.editConfig.infomation.serviceContract_Number = row.number
+        this.serviceContractId = row.id
+      } else if (value === "contract") {
+        this.editConfig.infomation.number = row.number
+        this.SalesDetailsId = row.id
+      }
+    },
+    // 娓呴櫎宸查�夋嫨鐢ㄦ埛
+    clearupClient(value) {
+      if (value === "client") {
+        this.editConfig.infomation.client_name = ""
+        this.clientId = 0
+      } else if (value === "serviceContract") {
+        this.editConfig.infomation.serviceContract_Number = ""
+        this.serviceContractId = 0
+      } else if (value === "contract") {
+        this.editConfig.infomation.number = ""
+        this.SalesDetailsId = 0
+      }
+    },
+    // 娣诲姞闄勪欢
+    addAnnexClick() {},
+    // 璁剧疆鍏佽涓婁紶鏂囦欢鏍煎紡
+    setFormatClick() {},
+    setTableForm() {
+      if (this.editConfig.title === "鏂板缓") {
+        this.tableData = [
+          {
+            id: 1,
+            Amount: 0,
+            IsSale: true,
+            MaterialMode: "",
+            MinInventory: 0,
+            Name: "",
+            Number: "",
+            PurchaseType: "",
+            SalePrice: 0,
+            Unit: ""
+          }
+        ]
+      } else {
+        this.tableData = this.editConfig.infomation.products
+      }
+      this.productTableList = {
+        tableData: this.tableData,
+        tableColumn: [
+          { label: "#", prop: "id", width: 40 },
+          { label: "浜у搧鍚嶇О", prop: "Name", input: true, isRequird: true },
+          { label: "浜у搧缂栧彿", prop: "Number" },
+          { label: "鏁伴噺", prop: "Amount", input: true, isRequird: true },
+          { label: "閿�鍞崟浠�", prop: "Unit", input: true },
+          { label: "浠风◣鍚堣", prop: "total", input: true },
+          { label: "鎻忚堪", prop: "other8" }
+        ]
+      }
+    },
+    // 浜у搧鍒楄〃杈撳叆
+    inputContent(val, prop, row) {
+      console.log("aaaaaaaa")
+      console.log(val, prop)
+      this.productId = row.id
+      this.tableData.map((item) => {
+        if (item.id === row.id) {
+          item[prop] = val
+        }
+      })
+      console.log(this.tableData)
+    },
+    // 浜у搧鏂板
+    addProductClick() {
+      this.productId++
+      this.tableData.push({
+        id: this.productId,
+        Amount: 0,
+        IsSale: true,
+        MaterialMode: "",
+        MinInventory: 0,
+        Name: "",
+        Number: "",
+        PurchaseType: "",
+        SalePrice: 0,
+        Unit: ""
+      })
+    },
+    //  浜у搧娓呯┖
+    emptyProductClick() {
+      this.productId = 1
+      this.tableData = [
+        {
+          id: 1,
+          Amount: 0,
+          IsSale: true,
+          MaterialMode: "",
+          MinInventory: 0,
+          Name: "",
+          Number: "",
+          PurchaseType: "",
+          SalePrice: 0,
+          Unit: ""
+        }
+      ]
+      this.productTableList.tableData = this.tableData
+    },
+    // 浜у搧閲嶇畻
+    recalculateProductClick() {}
+  }
+}
+</script>
+
+<!-- Add "scoped" attribute to limit CSS to this component only -->
+<style lang="scss" scoped>
+::v-deep {
+  .iframe-dialog .el-dialog__body {
+    .basic-info {
+      .basic-info-title {
+        background-color: #f4f8fe;
+        padding-left: 10px;
+        font-size: 15px;
+        font-weight: bold;
+        color: #666;
+        height: 42px;
+        line-height: 42px;
+      }
+      .basic-info-view {
+        margin-top: 10px;
+        padding-right: 40px;
+        .custom-name,
+        .common-select {
+          display: flex;
+          .common-select-sel {
+            width: 270px;
+          }
+          .common-select-btn {
+            margin-left: 5px;
+            font-size: 16px;
+            cursor: pointer;
+          }
+        }
+      }
+      .annex-view {
+        display: flex;
+        color: #6166d3;
+        .setFormat {
+          margin-left: 10px;
+        }
+      }
+    }
+    .unflod-collapse {
+      display: flex;
+      height: 30px;
+      justify-content: center;
+      align-items: center;
+      color: #6166d3;
+    }
+    .dialog-footer {
+      background-color: #f5f5f5;
+      height: 55px;
+      line-height: 55px;
+    }
+  }
+}
+</style>
diff --git a/src/views/other/payment/saleInvoice/index.vue b/src/views/other/payment/saleInvoice/index.vue
new file mode 100644
index 0000000..346233e
--- /dev/null
+++ b/src/views/other/payment/saleInvoice/index.vue
@@ -0,0 +1,234 @@
+<template>
+  <div class="saleInvoice">
+    <div v-if="isDetail" class="detail-top">
+      <DetailListCommonBtn :query-class-options="queryClassOptions" />
+      <PagerView class="page" :pager-options="pagerOptions" v-on="pagerEvents" />
+    </div>
+    <div v-else class="top">
+      <SearchCommonView
+        ref="searchCommonView"
+        :query-class-options="queryClassOptions"
+        :search-options="searchOptions"
+        :search-sel="searchSel"
+        @searchClick="searchClick"
+        @resetClick="resetClick"
+      />
+      <div class="btn-pager">
+        <PublicFunctionBtnView :statistics="true" :operates-list="operatesList" @batchDelete="delClick" />
+        <PagerView class="page" :pager-options="pagerOptions" v-on="pagerEvents" />
+      </div>
+    </div>
+    <TableCommonView
+      ref="tableListRef"
+      v-loading="loading"
+      :table-list="tableList"
+      :select-box="!isDetail"
+      @getSelectArray="getSelectArray"
+    >
+      <!-- <template slot="tableButton">
+        <el-table-column label="鎿嶄綔" width="60" fixed="right">
+          <template slot-scope="scope">
+            <el-button @click="handleClick(scope.row)" type="text" size="small">缂栬緫</el-button>
+          </template>
+        </el-table-column>
+      </template> -->
+    </TableCommonView>
+    <!-- 鏂板缓/缂栬緫 -->
+    <AddSaleInvoice v-if="editConfig.visible" :edit-common-config="editConfig" />
+  </div>
+</template>
+
+<script>
+import { getInvoiceList } from "@/api/common/payment"
+import pageMixin from "@/components/makepager/pager/mixin/pageMixin"
+import AddSaleInvoice from "@/views/other/payment/saleInvoice/addSaleInvoice.vue"
+
+export default {
+  name: "SaleInvoice",
+  props: {
+    isDetail: {
+      type: Boolean,
+      default: false
+    },
+    addConfig: {
+      type: Object,
+      default: () => {
+        return {}
+      }
+    },
+    sourceType: {
+      type: Number,
+      default: 1
+    }
+  },
+  mixins: [pageMixin],
+  components: { AddSaleInvoice },
+  computed: {},
+  data() {
+    return {
+      tableList: {},
+      loading: false,
+      activeName: "second",
+      queryClassValue: "1",
+      queryClassOptions: [
+        { value: "1", label: "鍏ㄩ儴" },
+        { value: "2", label: "浠婃棩鑱旂郴" },
+        { value: "3", label: "鏈懆鑱旂郴" },
+        { value: "4", label: "鏈湀鑱旂郴" }
+      ],
+      searchOptions: [],
+      operatesList: [
+        { id: "1", name: "鍏变韩" },
+        { id: "2", name: "鎵归噺缂栬緫" },
+        { id: "3", name: "瀵煎嚭" },
+        { id: "4", name: "涓嬭浇鍏ㄩ儴闄勪欢" },
+        { id: "5", name: "鏇存敼鍒涘缓浜�" },
+        { id: "6", name: "鏍戠粨鏋勮缃�" },
+        { id: "7", name: "瀹℃壒璁剧疆" },
+        { id: "8", name: "鍥炶棰勮鍒楀" }
+      ],
+      editConfig: {
+        visible: false,
+        title: "鏂板缓",
+        infomation: {}
+      },
+      saleChanceName: "",
+      contactsDeail: {
+        visible: false,
+        infomation: {}
+      },
+      clientDeail: {
+        visible: false,
+        infomation: {}
+      },
+      selValueList: [],
+      searchSel: {
+        value: "topic",
+        label: ""
+      },
+      search_map: {},
+      keyword: "",
+      keywordType: ""
+    }
+  },
+  created() {
+    this.setTable()
+    if (!this.isDetail) {
+      this.keyword = ""
+      this.keywordType = ""
+    } else {
+      this.keyword = this.addConfig.keyword
+      this.keywordType = this.addConfig.keywordType
+    }
+    this.getData()
+  },
+  methods: {
+    setTable() {
+      this.tableList = {
+        tableInfomation: [],
+        tableColumn: [
+          { label: "鍙戠エ缂栧彿", prop: "invoiceNumber" },
+          { label: "涓婚", prop: "subject" },
+          { label: "瀹㈡埛鍚嶇О", prop: "client_name" },
+          { label: "绁ㄦ嵁绫诲瀷", prop: "invoiceType_name" },
+          { label: "寮�绁ㄦ棩鏈�", prop: "invoiceDate" },
+          { label: "閿�鍞礋璐ｄ汉", prop: "principalId" },
+          { label: "浜у搧鍚嶇О", prop: "name", isProductName: true },
+          { label: "鏁伴噺", prop: "amount", isProductAmount: true },
+          { label: "鍚◣鍗曚环", prop: "price", isProductCommon: true },
+          { label: "浠风◣鍚堣", prop: "total", isProductCommon: true }
+        ]
+      }
+      this.searchOptions = []
+      for (let i = 0; i < this.tableList.tableColumn.length; i++) {
+        const label = this.tableList.tableColumn[i].label
+        const value = this.tableList.tableColumn[i].prop
+        this.searchOptions.push({ value: value, label: label })
+      }
+    },
+    // 璇锋眰鏁版嵁
+    async getData() {
+      this.loading = true
+      await getInvoiceList({
+        keyword: this.keyword,
+        keywordType: this.keywordType,
+        page: this.pagerOptions.currPage,
+        pageSize: this.pagerOptions.pageSize
+      })
+        .then((res) => {
+          if (res.data.code === 200) {
+            if (res.data.data.data && res.data.data.data.length > 0) {
+              const list = res.data.data.data.map((item) => {
+                return {
+                  ...item,
+                  client_name: item.Client.name,
+                  invoiceType_name: item.InvoiceType.name
+                  // principalId: item.member.name
+                }
+              })
+              this.tableList.tableInfomation = list || []
+              this.pagerOptions.totalCount = res.data.count
+            } else {
+              this.tableList.tableInfomation = []
+            }
+          } else {
+            this.tableList.tableInfomation = []
+          }
+          this.loading = false
+        })
+        .catch((err) => {
+          console.log(err)
+          this.tableList.tableInfomation = []
+          this.loading = false
+        })
+    },
+    // 鎼滅储
+    searchClick(val, content) {
+      this.keyword = content
+      this.keywordType = val.label
+      this.getData()
+    },
+    resetClick() {
+      this.keyword = ""
+      this.keywordType = ""
+      this.getData()
+    },
+    getSelectArray(val) {
+      console.log(val)
+      this.selValueList = []
+      const list = val.map((item) => {
+        return item.id
+      })
+      this.selValueList = list
+    },
+    // 鏂板缓
+    addBtnClick() {
+      this.editConfig.visible = true
+      this.editConfig.title = "鏂板缓"
+      this.editConfig.sourceType = this.sourceType
+      this.editConfig.infomation = { ...this.addConfig }
+    }
+  }
+}
+</script>
+
+<!-- Add "scoped" attribute to limit CSS to this component only -->
+<style lang="scss" scoped>
+.saleInvoice {
+  .top {
+    margin-bottom: 20px;
+    .btn-pager {
+      display: flex;
+      .page {
+        margin-left: auto;
+      }
+    }
+  }
+  .detail-top {
+    display: flex;
+    .page {
+      margin-left: auto;
+    }
+  }
+}
+</style>
diff --git a/src/views/other/product/index.vue b/src/views/other/product/index.vue
index 8e778bd..9b43bd8 100644
--- a/src/views/other/product/index.vue
+++ b/src/views/other/product/index.vue
@@ -23,8 +23,6 @@
       v-loading="loading"
       :table-list="tableList"
       :select-box="!isDetail"
-      @selContactsClick="selContactsClick"
-      @selClientClick="selClientClick"
       @getSelectArray="getSelectArray"
     >
       <!-- <template slot="tableButton">
@@ -43,19 +41,13 @@
 import pageMixin from "@/components/makepager/pager/mixin/pageMixin"
 
 export default {
-  name: "FollowupRecords",
+  name: "ProductView",
   props: {
     isDetail: {
       type: Boolean,
       default: false
     },
     addConfig: {
-      type: Object,
-      default: () => {
-        return {}
-      }
-    },
-    addIdConfig: {
       type: Object,
       default: () => {
         return {}
diff --git a/src/views/sales/index.vue b/src/views/sales/index.vue
index 1b8fe9f..a384e1e 100644
--- a/src/views/sales/index.vue
+++ b/src/views/sales/index.vue
@@ -16,6 +16,6 @@
 .content {
   width: 100%;
   background-color: #fff;
-  height: calc(100vh - 60px);
+  height: calc(100vh - 70px);
 }
 </style>
diff --git a/src/views/sales/masterOrder/AddMasterOrderDialog.vue b/src/views/sales/masterOrder/AddMasterOrderDialog.vue
index 6a4213d..3040d17 100644
--- a/src/views/sales/masterOrder/AddMasterOrderDialog.vue
+++ b/src/views/sales/masterOrder/AddMasterOrderDialog.vue
@@ -82,7 +82,14 @@
               </el-col>
               <el-col :span="12">
                 <el-form-item label="鍚堝悓閲戦" prop="money">
-                  <el-input v-model="editConfig.infomation.money"></el-input>
+                  <el-input-number
+                    v-model="editConfig.infomation.money"
+                    placeholder="璇疯緭鍏�"
+                    :min="0"
+                    :precision="2"
+                    :controls="false"
+                    style="width: 25%; margin-right: 5px"
+                  ></el-input-number>
                 </el-form-item>
               </el-col>
             </el-row>
diff --git a/src/views/sales/refundForm/AddRefundFormDialog.vue b/src/views/sales/refundForm/AddRefundFormDialog.vue
index 2d4e02b..b024999 100644
--- a/src/views/sales/refundForm/AddRefundFormDialog.vue
+++ b/src/views/sales/refundForm/AddRefundFormDialog.vue
@@ -291,7 +291,7 @@
       refundMethodOptions: [], // 浠樻鏂瑰紡
       accountOptions: [], // 璐︽埛
       isInvoiceOptions: ["鏄�", "鍚�"], // 鏄惁寮�绁�
-      currencyOptions: [], // 甯佺
+      currencyOptions: [{ id: 1, name: "浜烘皯甯�" }], // 甯佺
       approvalWorkflowOptions: [], // 瀹℃壒娴佺▼
       productTableList: {},
       showSummary: {
@@ -321,7 +321,7 @@
           this.refundMethodOptions = res.data.refundMethod
           this.accountOptions = res.data.accountId
           // this.isInvoiceOptions = res.data.isInvoice
-          this.currencyOptions = res.data.currency
+          // this.currencyOptions = res.data.currency
         })
         .catch((err) => {
           console.log(err)
diff --git a/src/views/sales/salesDetails/AddSalesDetailsDialog.vue b/src/views/sales/salesDetails/AddSalesDetailsDialog.vue
index df5a517..8dcd74b 100644
--- a/src/views/sales/salesDetails/AddSalesDetailsDialog.vue
+++ b/src/views/sales/salesDetails/AddSalesDetailsDialog.vue
@@ -256,7 +256,14 @@
             </div>
           </div>
           <div class="product-view">
-            <CommonFormTableView :show-summary="showSummary" :product-table-list="productTableList" />
+            <CommonFormTableView
+              :show-summary="showSummary"
+              :product-table-list="productTableList"
+              @inputContent="inputContent"
+              @addProductClick="addProductClick"
+              @emptyProductClick="emptyProductClick"
+              @recalculateProductClick="recalculateProductClick"
+            />
           </div>
           <!-- 閫夋嫨瀹℃壒娴佺▼ -->
           <!-- <div v-if="editConfig.title === '鏂板缓'" class="basic-info-title">閫夋嫨瀹℃壒娴佺▼</div>
@@ -369,11 +376,7 @@
       memberOptions: [],
       selSourceOrderOptions: [],
       wechatOrderStatusOptions: [], // 寰俊璁㈠崟鐘舵��
-      currencyOptions: [
-        { value: "1", label: "浜烘皯甯�(楼)" },
-        { value: "2", label: "鑻遍晳(拢)" },
-        { value: "3", label: "娆у厓(鈧�)" }
-      ], // 甯佺
+      currencyOptions: [{ id: 1, name: "浜烘皯甯�" }], // 甯佺
       approvalWorkflowOptions: [], // 瀹℃壒娴佺▼
       productTableList: {},
       showSummary: {
@@ -554,21 +557,86 @@
     // 璁剧疆鍏佽涓婁紶鏂囦欢鏍煎紡
     setFormatClick() {},
     setTableForm() {
+      if (this.editConfig.title === "鏂板缓") {
+        this.tableData = [
+          {
+            id: 1,
+            Amount: 0,
+            IsSale: true,
+            MaterialMode: "",
+            MinInventory: 0,
+            Name: "",
+            Number: "",
+            PurchaseType: "",
+            SalePrice: 0,
+            Unit: ""
+          }
+        ]
+      } else {
+        this.tableData = this.editConfig.infomation.products
+      }
       this.productTableList = {
-        tableData: [],
+        tableData: this.tableData,
         tableColumn: [
           { label: "#", prop: "id", width: 40 },
-          { label: "浜у搧鍚嶇О", prop: "productName", input: true, isRequird: true },
-          { label: "浜у搧缂栧彿", prop: "other0" },
-          { label: "鏁伴噺", prop: "other1", input: true, isRequird: true },
-          { label: "鍚◣鍗曚环", prop: "other6", input: true },
-          { label: "浠风◣鍚堣", prop: "other7", input: true },
-          { label: "鎻忚堪", prop: "other8" },
-          { label: "婧愬崟绫诲瀷", prop: "other2" },
-          { label: "婧愬崟", prop: "other3" }
+          { label: "浜у搧鍚嶇О", prop: "Name", input: true, isRequird: true },
+          { label: "浜у搧缂栧彿", prop: "Number" },
+          { label: "鏁伴噺", prop: "Amount", input: true, isRequird: true },
+          { label: "閿�鍞崟浠�", prop: "Unit", input: true },
+          { label: "浠风◣鍚堣", prop: "total", input: true },
+          { label: "鎻忚堪", prop: "other8" }
         ]
       }
-    }
+    },
+    // 浜у搧鍒楄〃杈撳叆
+    inputContent(val, prop, row) {
+      console.log("aaaaaaaa")
+      console.log(val, prop)
+      this.productId = row.id
+      this.tableData.map((item) => {
+        if (item.id === row.id) {
+          item[prop] = val
+        }
+      })
+      console.log(this.tableData)
+    },
+    // 浜у搧鏂板
+    addProductClick() {
+      this.productId++
+      this.tableData.push({
+        id: this.productId,
+        Amount: 0,
+        IsSale: true,
+        MaterialMode: "",
+        MinInventory: 0,
+        Name: "",
+        Number: "",
+        PurchaseType: "",
+        SalePrice: 0,
+        Unit: ""
+      })
+    },
+    //  浜у搧娓呯┖
+    emptyProductClick() {
+      this.productId = 1
+      this.tableData = [
+        {
+          id: 1,
+          Amount: 0,
+          IsSale: true,
+          MaterialMode: "",
+          MinInventory: 0,
+          Name: "",
+          Number: "",
+          PurchaseType: "",
+          SalePrice: 0,
+          Unit: ""
+        }
+      ]
+      this.productTableList.tableData = this.tableData
+    },
+    // 浜у搧閲嶇畻
+    recalculateProductClick() {}
   }
 }
 </script>
diff --git a/src/views/sales/salesDetails/DetailSpecification.vue b/src/views/sales/salesDetails/DetailSpecification.vue
index 24c8b48..540e5f7 100644
--- a/src/views/sales/salesDetails/DetailSpecification.vue
+++ b/src/views/sales/salesDetails/DetailSpecification.vue
@@ -191,13 +191,13 @@
           </div>
         </div>
         <div v-if="activeName === 'collection'" class="second">
-          <!-- <FollowupRecords :isDetail="true" /> -->
+          <CollectionPlan :isDetail="true" :add-config="addConfig" :source-type="1" />
         </div>
         <div v-if="activeName === 'receipt'" class="second">
-          <!-- <FollowupRecords :isDetail="true" /> -->
+          <Receipt :isDetail="true" :add-config="addConfig" :source-type="1" />
         </div>
         <div v-if="activeName === 'invoice'" class="second">
-          <!-- <FollowupRecords :isDetail="true" /> -->
+          <SaleInvoice :isDetail="true" :add-config="addConfig" :source-type="1" />
         </div>
         <div v-if="activeName === 'return'" class="second">
           <SalesReturn :isDetail="true" :add-config="addConfig" />
@@ -219,6 +219,9 @@
 import RefundForm from "@/views/sales/refundForm"
 import Status from "@/common/const/salesFixedStatus"
 import CommonFormTableView from "@/components/makepager/CommonFormTableView"
+import CollectionPlan from "@/views/other/payment/collectionPlan"
+import Receipt from "@/views/other/payment/receipt"
+import SaleInvoice from "@/views/other/payment/saleInvoice"
 export default {
   name: "DetailSpecification",
   props: {
@@ -232,7 +235,7 @@
       }
     }
   },
-  components: { SalesReturn, ServiceContract, RefundForm, CommonFormTableView },
+  components: { SalesReturn, ServiceContract, RefundForm, CommonFormTableView, CollectionPlan, Receipt, SaleInvoice },
   computed: {},
   data() {
     return {
diff --git a/src/views/sales/salesReturn/AddSalesReturnDialog.vue b/src/views/sales/salesReturn/AddSalesReturnDialog.vue
index 9341924..1c1bedc 100644
--- a/src/views/sales/salesReturn/AddSalesReturnDialog.vue
+++ b/src/views/sales/salesReturn/AddSalesReturnDialog.vue
@@ -231,7 +231,7 @@
       selSourceOrderOptions: [], // 閫夋嫨婧愬崟
       repositoryOptions: [], // 閫�鍏ヤ粨搴�
       statusOptions: [], // 鐘舵��
-      currencyOptions: [], // 甯佺
+      currencyOptions: [{ id: 1, name: "浜烘皯甯�" }], // 甯佺
       productTableList: {},
       showSummary: {
         show: true,
@@ -259,7 +259,7 @@
         .then((res) => {
           this.memberOptions = res.data.member
           this.repositoryOptions = res.data.repository
-          this.currencyOptions = res.data.currency
+          // this.currencyOptions = res.data.currency
           this.statusOptions = res.data.salesReturnStatus
         })
         .catch((err) => {
diff --git a/src/views/service/clientServiceOrder/AddCientServiceOrderDialog.vue b/src/views/service/clientServiceOrder/AddCientServiceOrderDialog.vue
index d9d1319..79fffc7 100644
--- a/src/views/service/clientServiceOrder/AddCientServiceOrderDialog.vue
+++ b/src/views/service/clientServiceOrder/AddCientServiceOrderDialog.vue
@@ -338,9 +338,9 @@
               <el-col :span="12">
                 <el-form-item label="瀹為檯澶勭悊鏃堕棿" prop="realTime">
                   <el-date-picker
-                    v-model="editConfig.infomation.startTime"
+                    v-model="editConfig.infomation.realTime"
                     value-format="yyyy-MM-dd HH:mm:ss"
-                    type="realTime"
+                    type="datetime"
                     placeholder="閫夋嫨鏃堕棿"
                   >
                   </el-date-picker>
@@ -862,7 +862,7 @@
         this.editConfig.infomation.client_name = row.name
         this.clientId = row.id
       } else if (value === "serviceContract") {
-        this.editConfig.infomation.service_number = row.number
+        this.editConfig.infomation.serviceContract_Number = row.number
         this.serviceContractId = row.id
       } else if (value === "contract") {
         this.editConfig.infomation.number = row.number
diff --git a/src/views/service/clientServiceOrder/index.vue b/src/views/service/clientServiceOrder/index.vue
index d4b8927..fec8e62 100644
--- a/src/views/service/clientServiceOrder/index.vue
+++ b/src/views/service/clientServiceOrder/index.vue
@@ -138,7 +138,7 @@
           { label: "涓婚", prop: "subject" }, // 涓婚
           { label: "瀹㈡埛鍚嶇О", prop: "client_name", min: 130, isClientClick: true }, // 瀹㈡埛鍚嶇О
           { label: "瀹為檯澶勭悊鏃堕棿", prop: "realTime" }, // 瀹為檯澶勭悊鏃堕棿
-          { label: "鏈嶅姟浜哄憳", prop: "serviceManId" }, // 鏈嶅姟浜哄憳
+          { label: "鏈嶅姟浜哄憳", prop: "serviceMan_name" }, // 鏈嶅姟浜哄憳
           { label: "鏈嶅姟鏂瑰紡", prop: "serviceType_name" }, // 鏈嶅姟鏂瑰紡
           // { label: "浜у搧绫诲埆", prop: "reportSourceId" }, // 浜у搧绫诲埆
           { label: "鏁呴殰绫诲埆", prop: "faultType_name" } // 鏁呴殰绫诲埆
@@ -172,7 +172,8 @@
                   client_name: item.Client.name,
                   serviceType_name: item.ServiceType.name,
                   faultType_name: item.FaultType.name,
-                  serviceContract_Number: item.ServiceContract.number
+                  serviceContract_Number: item.ServiceContract.number,
+                  serviceMan_name: item.serviceMan.username
                 }
               })
               this.tableList.tableInfomation = list || []
diff --git a/src/views/service/index.vue b/src/views/service/index.vue
index 5ac3df7..8ee7861 100644
--- a/src/views/service/index.vue
+++ b/src/views/service/index.vue
@@ -16,6 +16,6 @@
 .content {
   width: 100%;
   background-color: #fff;
-  height: calc(100vh - 60px);
+  height: calc(100vh - 70px);
 }
 </style>
diff --git a/src/views/service/serviceContract/AddServiceContractDialog.vue b/src/views/service/serviceContract/AddServiceContractDialog.vue
index e6d5459..ff2b7dc 100644
--- a/src/views/service/serviceContract/AddServiceContractDialog.vue
+++ b/src/views/service/serviceContract/AddServiceContractDialog.vue
@@ -308,7 +308,10 @@
             <CommonFormTableView
               :show-summary="showSummary"
               :product-table-list="productTableList"
+              @inputContent="inputContent"
               @addProductClick="addProductClick"
+              @emptyProductClick="emptyProductClick"
+              @recalculateProductClick="recalculateProductClick"
             />
           </div>
           <!-- 閫夋嫨瀹℃壒娴佺▼ -->
@@ -442,17 +445,13 @@
       memberOptions: [],
       contractTypeOptions: [], // 鍚堝悓绫诲瀷
       contractStatusOptions: [], // 鍚堝悓鐘舵��
-      currencyOptions: [
-        { value: "1", label: "浜烘皯甯�(楼)" },
-        { value: "2", label: "鑻遍晳(拢)" },
-        { value: "3", label: "娆у厓(鈧�)" }
-      ], // 甯佺
+      currencyOptions: [{ id: 1, name: "浜烘皯甯�" }], // 甯佺
       approvalWorkflowOptions: [], // 瀹℃壒娴佺▼
       productTableList: {},
       showSummary: {
         show: true,
         total: true,
-        sumProp: ["other1", "other2", "other3", "other4"],
+        sumProp: ["Amount", "Unit", "total"],
         mergeNumber: 3
       },
       editSelectClientConfig: {
@@ -480,7 +479,8 @@
       saleChanceId: this.editCommonConfig.infomation.saleChanceId,
       contractId: this.editCommonConfig.infomation.salesDetailsId,
       quotationId: this.editCommonConfig.infomation.quotationId,
-      tableData: []
+      tableData: [],
+      productId: 1
     }
   },
   created() {
@@ -500,7 +500,7 @@
             this.memberOptions = res.data.member
             this.contractTypeOptions = res.data.serviceContractType
             this.contractStatusOptions = res.data.serviceContractStatus
-            this.currencyOptions = res.data.currency
+            // this.currencyOptions = res.data.currency
           }
         })
         .catch((err) => {
@@ -676,6 +676,7 @@
       if (this.editConfig.title === "鏂板缓") {
         this.tableData = [
           {
+            id: 1,
             Amount: 0,
             IsSale: true,
             MaterialMode: "",
@@ -698,15 +699,30 @@
           { label: "浜у搧缂栧彿", prop: "Number" },
           { label: "鏈嶅姟寮�濮嬫棩", prop: "other5", date: true, isRequird: true, min: 100 },
           { label: "鏈嶅姟鍒版湡鏃�", prop: "other6", date: true, isRequird: true, min: 100 },
-          { label: "鏁伴噺", prop: "amount", input: true, isRequird: true },
+          { label: "鏁伴噺", prop: "Amount", input: true, isRequird: true },
           { label: "閿�鍞崟浠�", prop: "Unit", input: true },
-          { label: "浠风◣鍚堣", prop: "other3", input: true },
+          { label: "浠风◣鍚堣", prop: "total", input: true },
           { label: "鎻忚堪", prop: "other8" }
         ]
       }
     },
+    // 浜у搧鍒楄〃杈撳叆
+    inputContent(val, prop, row) {
+      console.log("aaaaaaaa")
+      console.log(val, prop)
+      this.productId = row.id
+      this.tableData.map((item) => {
+        if (item.id === row.id) {
+          item[prop] = val
+        }
+      })
+      console.log(this.tableData)
+    },
+    // 浜у搧鏂板
     addProductClick() {
+      this.productId++
       this.tableData.push({
+        id: this.productId,
         Amount: 0,
         IsSale: true,
         MaterialMode: "",
@@ -717,7 +733,28 @@
         SalePrice: 0,
         Unit: ""
       })
-    }
+    },
+    //  浜у搧娓呯┖
+    emptyProductClick() {
+      this.productId = 1
+      this.tableData = [
+        {
+          id: 1,
+          Amount: 0,
+          IsSale: true,
+          MaterialMode: "",
+          MinInventory: 0,
+          Name: "",
+          Number: "",
+          PurchaseType: "",
+          SalePrice: 0,
+          Unit: ""
+        }
+      ]
+      this.productTableList.tableData = this.tableData
+    },
+    // 浜у搧閲嶇畻
+    recalculateProductClick() {}
   }
 }
 </script>
diff --git a/src/views/service/serviceContract/DetailServiceContract.vue b/src/views/service/serviceContract/DetailServiceContract.vue
index a852e68..2e0123b 100644
--- a/src/views/service/serviceContract/DetailServiceContract.vue
+++ b/src/views/service/serviceContract/DetailServiceContract.vue
@@ -145,16 +145,16 @@
           </div>
         </div>
         <div v-if="activeName === 'collection'" class="second">
-          <!-- <FollowupRecords :isDetail="true" /> -->
+          <CollectionPlan :isDetail="true" :add-config="addConfig" :source-type="2" />
         </div>
         <div v-if="activeName === 'receipt'" class="second">
-          <!-- <FollowupRecords :isDetail="true" /> -->
+          <Receipt :isDetail="true" :add-config="addConfig" :source-type="2" />
         </div>
         <div v-if="activeName === 'clientService'" class="second">
           <ClientServiceOrder :isDetail="true" :add-config="addConfig" />
         </div>
         <div v-if="activeName === 'invoice'" class="second">
-          <!-- <FollowupRecords :isDetail="true" /> -->
+          <SaleInvoice :isDetail="true" :add-config="addConfig" :source-type="2" />
         </div>
       </div>
     </el-drawer>
@@ -165,6 +165,9 @@
 import ClientServiceOrder from "@/views/service/clientServiceOrder"
 import Status from "@/common/const/salesFixedStatus"
 import CommonFormTableView from "@/components/makepager/CommonFormTableView"
+import CollectionPlan from "@/views/other/payment/collectionPlan"
+import Receipt from "@/views/other/payment/receipt"
+import SaleInvoice from "@/views/other/payment/saleInvoice"
 export default {
   name: "DetailSpecification",
   props: {
@@ -178,7 +181,7 @@
       }
     }
   },
-  components: { ClientServiceOrder, CommonFormTableView },
+  components: { ClientServiceOrder, CommonFormTableView, CollectionPlan, Receipt, SaleInvoice },
   computed: {},
   data() {
     return {
@@ -310,7 +313,7 @@
       if (value === "basic") {
         this.isBasicExpand = !this.isBasicExpand
       } else if (value === "dynamic") {
-        this.isDynamicExpand = !this.isLabelExpand
+        this.isDynamicExpand = !this.isDynamicExpand
       } else if (value === "delivery") {
         this.isDeliveryExpand = !this.isDeliveryExpand
       } else if (value === "termsConditions") {
diff --git a/src/views/service/serviceContract/index.vue b/src/views/service/serviceContract/index.vue
index fec9873..55b18a7 100644
--- a/src/views/service/serviceContract/index.vue
+++ b/src/views/service/serviceContract/index.vue
@@ -135,8 +135,8 @@
       this.tableList = {
         tableInfomation: [],
         tableColumn: [
-          { label: "鏈嶅姟鍚堝悓缂栧彿", prop: "number", min: 100, isCommonClick: true }, // 鏈嶅姟鍚堝悓缂栧彿
-          { label: "瀹㈡埛鍚嶇О", prop: "client_name", min: 120, isClientClick: true }, // 瀹㈡埛鍚嶇О
+          { label: "鏈嶅姟鍚堝悓缂栧彿", prop: "number", isCommonClick: true }, // 鏈嶅姟鍚堝悓缂栧彿
+          { label: "瀹㈡埛鍚嶇О", prop: "client_name", isClientClick: true }, // 瀹㈡埛鍚嶇О
           { label: "绛剧害鏃ユ湡", prop: "signTime" }, // 绛剧害鏃ユ湡
           { label: "鍚堝悓绫诲瀷", prop: "serviceContractType" }, // 鍚堝悓绫诲瀷
           { label: "鍚堝悓鐘舵��", prop: "serviceContractStatus" }, // 鍚堝悓鐘舵��

--
Gitblit v1.8.0