技术中心部分修改，添加库存系统

src/views/PurchasingCenter/ContractChange/index.vue

@@ -0,0 +1,636 @@
+<template>
+  <div class="app-container">
+    <el-row :gutter="20">
+      <el-col :span="12">
+        <el-card>
+          <el-row>
+            <span>时间段:</span>
+            <el-date-picker
+              v-model="startEndDate"
+              style="width:250px"
+              size="small"
+              type="daterange"
+              value-format="yyyy-MM-dd"
+              format="yyyy-MM-dd"
+              start-placeholder="开始日期"
+              end-placeholder="结束日期"/>
+            <span>合同号:</span>
+            <el-select v-model="contractNumValue" placeholder="合同号" size="small" filterable clearable>
+              <el-option
+                v-for="item in contractNum"
+                :key="item.value"
+                :label="item.label"
+                :value="item.value">
+                <div style="float: left">{{ item.label }}</div>
+                <div style="float: right; color: #8492a6; font-size: 13px">{{ item.name }}</div>
+              </el-option>
+            </el-select>
+            <span>采购员:</span>
+            <el-select v-model="personValue" placeholder="采购员" size="small" style="width: 100px">
+              <el-option
+                v-for="item in person"
+                :key="item.value"
+                :label="item.label"
+                :value="item.value"/>
+            </el-select>
+          </el-row>
+          <el-row>
+            <span>供应商:</span>
+            <el-input v-model="supplierName" placeholder="供应商" size="small" clearable style="width:180px"/>
+            <el-button
+              type="success"
+              size="small"
+              icon="el-icon-search"
+              style="margin-left:10px"
+              @click="total1=0;pageCurrent1=1;pageSize1=10;searchTable1()">查询新合同</el-button>
+            <span>变更原因:</span>
+            <el-input v-model="changeReason" placeholder="变更原因" size="small" clearable style="width:200px"/>
+            <el-button
+              type="primary"
+              size="small"
+              icon="el-icon-edit-outline"
+              style="margin-left:10px"
+              @click="contractChange">合同变更</el-button>
+          </el-row>
+          <el-table
+            v-loading="loading1"
+            :data="tableData1"
+            size="mini"
+            border
+            style="width: 100%;max-height: 250px;"
+            height="250px"
+            highlight-current-row
+            @row-click="searchTable2">
+            <el-table-column label="采购合同号" align="center" min-width="100">
+              <template slot-scope="scope">
+                {{ scope.row.采购合同编号 }}
+              </template>
+            </el-table-column>
+            <el-table-column label="采购合同名称" align="center" min-width="150">
+              <template slot-scope="scope">
+                {{ scope.row.采购合同名称 }}
+              </template>
+            </el-table-column>
+            <el-table-column label="供应商" align="center" min-width="150">
+              <template slot-scope="scope">
+                {{ scope.row.供应商名称 }}
+              </template>
+            </el-table-column>
+            <el-table-column label="规定到货时间" align="center" min-width="100">
+              <template slot-scope="scope">
+                {{ scope.row.规定到货时间.split(' ')[0] }}
+              </template>
+            </el-table-column>
+            <el-table-column label="采购员" align="center" min-width="70">
+              <template slot-scope="scope">
+                {{ scope.row.姓名 }}
+              </template>
+            </el-table-column>
+            <el-table-column label="总金额" align="center" min-width="80">
+              <template slot-scope="scope">
+                {{ scope.row.总金额 }}
+              </template>
+            </el-table-column>
+            <el-table-column label="付款方式" align="center" min-width="100">
+              <template slot-scope="scope">
+                {{ scope.row.付款方式内容 }}
+              </template>
+            </el-table-column>
+            <el-table-column label="操作" align="center" min-width="100" fixed="right">
+              <template slot-scope="scope">
+                <el-button type="danger" size="mini" icon="el-icon-delete" @click="deleteContract(scope.row)">作废</el-button>
+              </template>
+            </el-table-column>
+          </el-table>
+          <div class="block" style="margin: 10px 0 10px 0;">
+            <el-pagination
+              :current-page="pageCurrent1"
+              :page-sizes="[10, 20, 30, 40]"
+              :page-size="pageSize1"
+              :total="total1"
+              style="display:inline-block;width:50%"
+              layout="total, sizes, prev, pager, next, jumper"
+              @size-change="handleSizeChange1"
+              @current-change="handleCurrentChange1"/>
+          </div>
+          <el-card>
+            <table id="01" cellspacing="0px" align="center" border width="100%" style="">
+              <tr style="height: 40px">
+                <td colspan="1" align="center" style="font-weight: bold">GAOJING</td>
+                <td colspan="3" align="center" style="font-weight: bold">产品销售合同</td>
+              </tr>
+              <tr style="height: 40px">
+                <td colspan="1" align="center">需方</td>
+                <td colspan="1" align="center">江苏高精机电装备有限公司</td>
+                <td colspan="1" align="center">合同编号</td>
+                <td colspan="1" align="center">{{ contract01 }}</td>
+              </tr>
+              <tr style="height: 40px">
+                <td colspan="1" align="center">供方</td>
+                <td colspan="1" align="center">{{ supplier01 }}</td>
+                <td colspan="1" align="center">签订地点</td>
+                <td colspan="1" align="center">江苏盐城</td>
+              </tr>
+            </table>
+            <div>一、 产品名称、型号、数量、单价、品牌：</div>
+            <table id="02" cellspacing="0px" align="center" border width="100%" style="">
+              <tbody id="04">
+                <tr id="tableHead01" style="height: 40px">
+                  <td colspan="1" align="center">物料名称</td>
+                  <td colspan="1" align="center">物料规格</td>
+                  <td colspan="1" align="center">物料型号</td>
+                  <td colspan="1" align="center">发货天数</td>
+                  <td colspan="1" align="center">数量</td>
+                  <td colspan="1" align="center">单价</td>
+                  <td colspan="1" align="center">总价</td>
+                </tr>
+              </tbody>
+              <tfoot>
+                <tr style="height: 40px">
+                  <td colspan="6">运费：</td>
+                  <td colspan="1" align="center">{{ freight01 }}</td>
+                </tr>
+                <tr style="height: 40px">
+                  <td colspan="6">总价:  (人民币){{ RMB01 }}(含0.17增值税) </td>
+                  <td colspan="1" align="center">{{ TotalAmount01 }}</td>
+                </tr>
+              </tfoot>
+            </table>
+            <div id="textarea01"/>
+          </el-card>
+        </el-card>
+      </el-col>
+
+      <el-col :span="12">
+        <el-card>
+          <el-row>
+            <span>时间段:</span>
+            <el-date-picker
+              v-model="startEndDate3"
+              style="width:250px"
+              size="small"
+              type="daterange"
+              value-format="yyyy-MM-dd"
+              format="yyyy-MM-dd"
+              start-placeholder="开始日期"
+              end-placeholder="结束日期"/>
+            <span>合同号:</span>
+            <el-select v-model="contractNumValue3" placeholder="合同号" size="small" filterable clearable>
+              <el-option
+                v-for="item in contractNum3"
+                :key="item.value"
+                :label="item.label"
+                :value="item.value">
+                <div style="float: left">{{ item.label }}</div>
+                <div style="float: right; color: #8492a6; font-size: 13px">{{ item.name }}</div>
+              </el-option>
+            </el-select>
+            <span>采购员:</span>
+            <el-select v-model="personValue3" placeholder="采购员" size="small" style="width: 100px">
+              <el-option
+                v-for="item in person"
+                :key="item.value"
+                :label="item.label"
+                :value="item.value"/>
+            </el-select>
+          </el-row>
+          <el-row>
+            <span>供应商:</span>
+            <el-input v-model="supplierName3" placeholder="供应商" size="small" clearable style="width:180px"/>
+            <el-button
+              type="success"
+              size="small"
+              icon="el-icon-search"
+              style="margin-left:10px"
+              @click="total3=0;pageCurrent3=1;pageSize3=10;searchTable3()">查询旧合同</el-button>
+          </el-row>
+          <el-table
+            v-loading="loading3"
+            :data="tableData3"
+            size="mini"
+            border
+            style="width: 100%;max-height: 250px;"
+            height="250px"
+            highlight-current-row
+            @row-click="searchTable4">
+            <el-table-column label="采购合同号" align="center" min-width="100">
+              <template slot-scope="scope">
+                {{ scope.row.采购合同编号 }}
+              </template>
+            </el-table-column>
+            <el-table-column label="采购合同名称" align="center" min-width="150">
+              <template slot-scope="scope">
+                {{ scope.row.采购合同名称 }}
+              </template>
+            </el-table-column>
+            <el-table-column label="供应商" align="center" min-width="150">
+              <template slot-scope="scope">
+                {{ scope.row.供应商名称 }}
+              </template>
+            </el-table-column>
+            <el-table-column label="规定到货时间" align="center" min-width="100">
+              <template slot-scope="scope">
+                {{ scope.row.规定到货时间 }}
+              </template>
+            </el-table-column>
+            <el-table-column label="采购员" align="center" min-width="70">
+              <template slot-scope="scope">
+                {{ scope.row.姓名 }}
+              </template>
+            </el-table-column>
+            <el-table-column label="总金额" align="center" min-width="70">
+              <template slot-scope="scope">
+                {{ scope.row.总金额 }}
+              </template>
+            </el-table-column>
+            <el-table-column label="付款方式" align="center" min-width="100">
+              <template slot-scope="scope">
+                {{ scope.row.付款方式内容 }}
+              </template>
+            </el-table-column>
+            <el-table-column label="更改标记" align="center" min-width="70">
+              <template slot-scope="scope">
+                {{ scope.row.更改标记 }}
+              </template>
+            </el-table-column>
+            <el-table-column label="合同变更原因" align="center" min-width="100">
+              <template slot-scope="scope">
+                {{ scope.row.合同变更原因 }}
+              </template>
+            </el-table-column>
+          </el-table>
+          <div class="block" style="margin: 10px 0 10px 0;">
+            <el-pagination
+              :current-page="pageCurrent3"
+              :page-sizes="[10, 20, 30, 40]"
+              :page-size="pageSize3"
+              :total="total3"
+              style="display:inline-block;width:50%"
+              layout="total, sizes, prev, pager, next, jumper"
+              @size-change="handleSizeChange3"
+              @current-change="handleCurrentChange3"/>
+          </div>
+          <el-card>
+            <table id="11" cellspacing="0px" align="center" border width="100%" style="">
+              <tr style="height: 40px">
+                <td colspan="1" align="center" style="font-weight: bold">GAOJING</td>
+                <td colspan="3" align="center" style="font-weight: bold">产品销售合同</td>
+              </tr>
+              <tr style="height: 40px">
+                <td colspan="1" align="center">需方</td>
+                <td colspan="1" align="center">江苏高精机电装备有限公司</td>
+                <td colspan="1" align="center">合同编号</td>
+                <td colspan="1" align="center">{{ contract02 }}</td>
+              </tr>
+              <tr style="height: 40px">
+                <td colspan="1" align="center">供方</td>
+                <td colspan="1" align="center">{{ supplier02 }}</td>
+                <td colspan="1" align="center">签订地点</td>
+                <td colspan="1" align="center">江苏盐城</td>
+              </tr>
+            </table>
+            <div>一、 产品名称、型号、数量、单价、品牌：</div>
+            <table id="12" cellspacing="0px" align="center" border width="100%" style="">
+              <tbody id="14">
+                <tr id="tableHead02" style="height: 40px">
+                  <td colspan="1" align="center">物料名称</td>
+                  <td colspan="1" align="center">物料规格</td>
+                  <td colspan="1" align="center">物料型号</td>
+                  <td colspan="1" align="center">发货天数</td>
+                  <td colspan="1" align="center">数量</td>
+                  <td colspan="1" align="center">单价</td>
+                  <td colspan="1" align="center">总价</td>
+                </tr>
+              </tbody>
+              <tfoot>
+                <tr style="height: 40px">
+                  <td colspan="6">运费：</td>
+                  <td colspan="1" align="center">{{ freight02 }}</td>
+                </tr>
+                <tr style="height: 40px">
+                  <td colspan="6">总价:  (人民币){{ RMB02 }}(含0.17增值税) </td>
+                  <td colspan="1" align="center">{{ TotalAmount02 }}</td>
+                </tr>
+              </tfoot>
+            </table>
+            <div id="textarea02"/>
+          </el-card>
+        </el-card>
+      </el-col>
+    </el-row>
+  </div>
+</template>
+
+<script>
+import { initContract, initBuyer, searchTable1, searchTable2, contractChange,
+  searchChangeContract, initChangeContract, searchTable4, initPayMethod, deleteContract } from '@/api/PurchasingCenter/ContractChange'
+
+export default {
+  data() {
+    return {
+      returns01: [],
+      contract01: '',
+      supplier01: '',
+      freight01: '',
+      RMB01: '',
+      TotalAmount01: '',
+      textarea01: '',
+      returns02: [],
+      contract02: '',
+      supplier02: '',
+      freight02: '',
+      RMB02: '',
+      TotalAmount02: '',
+      textarea02: '',
+      check1: 0,
+      check2: 0,
+      check3: 0,
+      check4: 0,
+      startEndDate: '',
+      contractNumValue: '',
+      contractNum: [],
+      personValue: '',
+      person: [],
+      supplierName: '',
+      supplierValue: '',
+      total1: 0,
+      pageCurrent1: 1,
+      pageSize1: 10,
+      tableData1: [],
+      loading1: false,
+      tableData01: [],
+      tableData02: [],
+      submitDisable: true,
+      dialogVisible2: false,
+      changeReason: '',
+      contractValue: '', // 显示表2和变更合同用的变量
+      tableData3: [],
+      loading3: false,
+      total3: 0,
+      pageCurrent3: 1,
+      pageSize3: 10,
+      check31: 0,
+      check32: 0,
+      check33: 0,
+      check34: 0,
+      check35: 0,
+      check36: 0,
+      startEndDate3: '',
+      contractNumValue3: '',
+      supplierName3: '',
+      project3: '',
+      personValue3: '',
+      contractNum3: [],
+      payMethod: [],
+      payMethodValue: ''
+    }
+  },
+  created() {
+    this.fetchData()
+  },
+  methods: {
+    fetchData() {
+      this.contractNum = []
+      initContract().then(response => {
+        for (let i = 0; i < response.data.length; i++) {
+          this.contractNum.push({
+            label: response.data[i].采购合同编号,
+            name: response.data[i].采购合同名称,
+            value: response.data[i].采购合同流水号
+          })
+        }
+      })
+      this.contractNum3 = []
+      initChangeContract().then(response => {
+        for (let i = 0; i < response.data.length; i++) {
+          this.contractNum3.push({
+            label: response.data[i].采购合同编号,
+            name: response.data[i].采购合同名称,
+            value: response.data[i].采购合同流水号
+          })
+        }
+      })
+      this.payMethod = []
+      initPayMethod().then(response => {
+        for (let i = 0; i < response.data.length; i++) {
+          this.payMethod.push({
+            label: response.data[i].付款方式内容,
+            value: response.data[i].付款方式流水号
+          })
+        }
+      })
+      this.person = []
+      initBuyer().then(response => {
+        for (let i = 0; i < response.data.length; i++) {
+          this.person.push({
+            text: response.data[i].姓名,
+            label: response.data[i].姓名,
+            value: response.data[i].人员编号
+          })
+        }
+      })
+    },
+    searchTable1() {
+      this.textarea01 = ''
+      this.loading1 = true
+      if (this.startEndDate === '' || this.startEndDate === null || this.startEndDate[0] === '' || this.startEndDate[1] === '') {
+        this.check1 = 0
+        this.startEndDate = ''
+      } else { this.check1 = 1 }
+      this.contractNumValue ? this.check2 = 1 : this.check2 = 0
+      this.personValue ? this.check3 = 1 : this.check3 = 0
+      this.supplierName ? this.check4 = 1 : this.check4 = 0
+      searchTable1(this.pageCurrent1, this.pageSize1, this.check1, this.startEndDate[0], this.startEndDate[1], this.check2, this.contractNumValue, this.check3, this.personValue, this.check4, this.supplierName).then(response => {
+        this.loading1 = false
+        this.tableData1 = response.data.rows
+        this.total1 = response.data.total
+      })
+    },
+    handleSizeChange1(val) {
+      this.pageCurrent1 = 1
+      this.pageSize1 = val
+      this.searchTable1()
+    },
+    handleCurrentChange1(val) {
+      this.pageCurrent1 = val
+      this.searchTable1()
+    },
+    searchTable2(row) {
+      this.supplier01 = row.供应商名称
+      this.contract01 = row.采购合同编号
+      this.freight01 = parseFloat(row.总金额) - parseFloat(row.总金额_小计)
+      this.RMB01 = row.总金额_文本
+      this.TotalAmount01 = row.总金额
+      this.textarea01 = row.合同文本
+      document.getElementById('textarea01').innerText = this.textarea01
+      this.contractValue = parseInt(row.采购合同流水号)
+      searchTable2(this.contractValue).then(response => {
+        this.returns01 = response.data
+        const children = document.getElementsByClassName('tableData01')
+        const parent = document.getElementById('04')
+        if (children.length !== 0) {
+          for (let i = children.length - 1; i >= 0; i--) {
+            parent.removeChild(children[i])
+          }
+        }
+        const tr = []
+        for (let i = 0; i < this.returns01.length; i++) {
+          tr[i] = document.createElement('tr')
+          tr[i].setAttribute('class', 'tableData01')
+          tr[i].innerHTML = '<td colspan="1" align="center"></td>' + '<td colspan="1" align="center"></td>' + '<td colspan="1" align="center"></td>' + '<td colspan="1" align="center"></td>' +
+              '<td colspan="1" align="center"></td>' + '<td colspan="1" align="center"></td>' + '<td colspan="1" align="center"></td>'
+          document.getElementById('tableHead01').after(tr[i])
+        }
+        for (let j = 0; j < this.returns01.length; j++) {
+          document.getElementsByClassName('tableData01')[j].children[0].innerHTML = response.data[j].物料名称
+          document.getElementsByClassName('tableData01')[j].children[1].innerHTML = response.data[j].物料规格
+          document.getElementsByClassName('tableData01')[j].children[2].innerHTML = response.data[j].物料型号
+          document.getElementsByClassName('tableData01')[j].children[3].innerHTML = response.data[j].发货天数
+          document.getElementsByClassName('tableData01')[j].children[4].innerHTML = response.data[j].数量
+          document.getElementsByClassName('tableData01')[j].children[5].innerHTML = response.data[j].单价
+          document.getElementsByClassName('tableData01')[j].children[6].innerHTML = response.data[j].金额
+        }
+      })
+    },
+    contractChange() {
+      if (this.contractValue) {
+        contractChange(this.contractValue, this.changeReason).then(response => {
+          this.contractValue = ''
+          this.changeReason = ''
+          if (response.data[0].result === '1') {
+            this.$message.success('变更成功')
+            this.searchTable1()
+            this.contractNumValue = ''
+            this.contractNumValue3 = ''
+            this.fetchData()
+          } else { this.$message.error('变更失败') }
+        })
+      } else {
+        this.$message.error('请先选择合同')
+      }
+    },
+    searchTable3() {
+      this.textarea02 = ''
+      this.loading3 = true
+      if (this.startEndDate3 === '' || this.startEndDate3 === null || this.startEndDate3[0] === '' || this.startEndDate3[1] === '') {
+        this.check31 = 0
+        this.startEndDate3 = ''
+      } else { this.check31 = 1 }
+      this.contractNumValue3 ? this.check32 = 1 : this.check32 = 0
+      this.personValue3 ? this.check33 = 1 : this.check33 = 0
+      this.supplierName3 ? this.check34 = 1 : this.check34 = 0
+      this.project3 ? this.check35 = 1 : this.check35 = 0
+      this.payMethodValue ? this.check36 = 1 : this.check36 = 0
+      searchChangeContract(this.pageCurrent3, this.pageSize3, this.check31, this.startEndDate3[0], this.startEndDate3[1], this.check32, this.contractNumValue3, this.check33, this.personValue3, this.check34, this.supplierName3, this.check35, this.project3, this.check36, this.payMethodValue).then(response => {
+        this.loading3 = false
+        console.log(response.data)
+        for (let j = 0; j < response.data.rows.length; j++) {
+          if (response.data.rows[j].预到货时间 !== null) {
+            response.data.rows[j].预到货时间 = response.data.rows[j].预到货时间.substring(0, response.data.rows[j].预到货时间.indexOf(' '))
+          }
+          if (response.data.rows[j].规定到货时间 !== null) {
+            response.data.rows[j].规定到货时间 = response.data.rows[j].规定到货时间.substring(0, response.data.rows[j].规定到货时间.indexOf(' '))
+          }
+          if (response.data.rows[j].实际到货时间 !== null) {
+            response.data.rows[j].实际到货时间 = response.data.rows[j].实际到货时间.substring(0, response.data.rows[j].实际到货时间.indexOf(' '))
+          }
+        }
+        this.tableData3 = response.data.rows
+        this.total3 = response.data.total
+      })
+    },
+    handleSizeChange3(val) {
+      this.pageCurrent3 = 1
+      this.pageSize3 = val
+      this.searchTable3()
+    },
+    handleCurrentChange3(val) {
+      this.pageCurrent3 = val
+      this.searchTable3()
+    },
+    searchTable4(row) {
+      this.supplier02 = row.供应商名称
+      this.contract02 = row.采购合同编号
+      this.freight02 = parseFloat(row.运费)
+      this.RMB02 = row.总金额_文本
+      this.TotalAmount02 = row.总金额
+      this.textarea02 = row.合同文本
+      document.getElementById('textarea02').innerText = this.textarea02
+      this.contractValue = parseInt(row.采购合同变更流水号)
+      searchTable4(this.contractValue).then(response => {
+        this.returns02 = response.data
+        const children = document.getElementsByClassName('tableData02')
+        const parent = document.getElementById('14')
+        if (children.length !== 0) {
+          for (let i = children.length - 1; i >= 0; i--) {
+            parent.removeChild(children[i])
+          }
+        }
+        const tr = []
+        for (let i = 0; i < this.returns02.length; i++) {
+          tr[i] = document.createElement('tr')
+          tr[i].setAttribute('class', 'tableData02')
+          tr[i].innerHTML = '<td colspan="1" align="center"></td>' + '<td colspan="1" align="center"></td>' + '<td colspan="1" align="center"></td>' + '<td colspan="1" align="center"></td>' +
+              '<td colspan="1" align="center"></td>' + '<td colspan="1" align="center"></td>' + '<td colspan="1" align="center"></td>'
+          document.getElementById('tableHead02').after(tr[i])
+        }
+        for (let j = 0; j < this.returns02.length; j++) {
+          document.getElementsByClassName('tableData02')[j].children[0].innerHTML = response.data[j].物料名称
+          document.getElementsByClassName('tableData02')[j].children[1].innerHTML = response.data[j].物料规格
+          document.getElementsByClassName('tableData02')[j].children[2].innerHTML = response.data[j].物料型号
+          document.getElementsByClassName('tableData02')[j].children[3].innerHTML = response.data[j].发货天数
+          document.getElementsByClassName('tableData02')[j].children[4].innerHTML = response.data[j].数量
+          document.getElementsByClassName('tableData02')[j].children[5].innerHTML = response.data[j].单价
+          document.getElementsByClassName('tableData02')[j].children[6].innerHTML = response.data[j].金额
+        }
+      })
+    },
+    deleteContract(row) { // 合同作废
+      this.$confirm('确定作废该合同?', '提示', {
+        confirmButtonText: '确定',
+        cancelButtonText: '取消',
+        type: 'warning'
+      }).then(() => {
+        deleteContract(row.采购合同流水号).then(response => {
+          if (response.data[0].result === '1') {
+            this.$message.success('作废成功')
+            this.searchTable1()
+            this.contractNumValue = ''
+            this.contractNumValue3 = ''
+            this.fetchData()
+          } else { this.$message.error('作废失败') }
+        })
+      }).catch(() => {
+        this.$message({
+          type: 'info',
+          message: '已取消操作'
+        })
+      })
+    }
+  }
+}
+</script>
+
+<style scoped>
+  .el-card{
+    margin-bottom: 15px;
+  }
+  .el-date-editor{
+    width:200px
+  }
+  .el-select{
+    width:200px
+  }
+  .el-input{
+    width:200px
+  }
+  span{
+    margin: 10px 0 10px 10px;
+  }
+  .searchForm .el-form-item{
+    margin-bottom: 5px;
+  }
+  .el-row{
+    margin-bottom: 10px;
+  }
+</style>