新增采购发票模块，采购物流运输改字段

src/api/myTrade/purchaseBill.js

@@ -46,3 +46,22 @@ export function getTransportList(data) {
     data
   })
 }
+
+// 采购发票列表
+export function purchaseInvoiceList(data) {
+  return request({
+    url: '/purchaseOrder/get/invoicePage',
+    method: 'post',
+    data
+  })
+}
+
+// 采购发票详情
+export function purchaseInvoiceDetail(params) {
+  return request({
+    url: '/purchaseOrder/get/invoiceDetail',
+    method: 'get',
+    params
+  })
+}
+

src/router/moudules/myTrade.js

@@ -166,6 +166,15 @@ export default {
           meta: {
             title: '采购订单详情', activeMenu: '/purchaseBill'
           }
+        },
+        {
+          path: 'purchaseInvoiceView',
+          name: 'PurchaseInvoiceView',
+          component: () => import('@/views/myTrade/purchaseBill/purchaseInvoice/view'),
+          hidden: true,
+          meta: {
+            title: '采购发票详情', activeMenu: '/purchaseBill'
+          }
         }
       ]
     }

src/views/myTrade/purchaseBill/main.vue

@@ -29,11 +29,13 @@
     </div> -->
     <el-tabs v-model="type" type="card" @tab-click="handlerOptions()">
       <el-tab-pane label="采购订单" :name="'PurchaseOrder'" />
+      <el-tab-pane label="采购发票" :name="'PurchaseInvoice'" />
       <el-tab-pane label="物流运输" :name="'PurchaseTransport'" />
     </el-tabs>
 
     <transition name="fade-transform" mode="out-in">
       <purchaseOrder v-if="type === 'PurchaseOrder'" />
+      <purchase-invoice v-if="type === 'PurchaseInvoice'" />
       <purchaseTransport v-if="type === 'PurchaseTransport'" />
     </transition>
 
@@ -44,7 +46,8 @@
 export default {
   components: {
     PurchaseOrder: () => import('./purchaseOrder/index'),
-    PurchaseTransport: () => import('./purchaseTransport/index')
+    PurchaseTransport: () => import('./purchaseTransport/index'),
+    PurchaseInvoice: () => import('./purchaseInvoice/index')
   },
   data() {
     return {

src/views/myTrade/purchaseBill/purchaseInvoice/index.vue

@@ -0,0 +1,264 @@
+<template>
+  <div class="purchase-order">
+    <div class="search">
+      <div class="left" />
+      <div class="right">
+        <div>
+          <el-select v-model="search.invoiceType" placeholder="请选择发票类型" clearable>
+            <el-option
+              v-for="item in constant.invoice_type"
+              :key="item.dictCode"
+              :label="item.dictLabel"
+              :value="item.dictValue"
+            />
+          </el-select>
+        </div>
+        <div>
+          <el-input v-model="search.invoiceInfo" placeholder="发票代码/发票号码" />
+        </div>
+        <div>
+          <el-select v-model="search.entityNo" placeholder="请选择供应商" clearable>
+            <el-option
+              v-for="item in supplierList"
+              :key="item.entityNo"
+              :label="item.entityName"
+              :value="item.entityNo"
+            />
+          </el-select>
+        </div>
+        <div>
+          <el-input v-model="search.orderNo" placeholder="采购订单ID" />
+        </div>
+        <el-date-picker
+          v-model="invoiceDate"
+          type="daterange"
+          range-separator="至"
+          start-placeholder="开票日期范围"
+          end-placeholder="开票日期范围"
+          value-format="yyyy-MM-dd"
+        />
+        <div class="right-btn">
+          <el-button type="primary" @click="fetchData('reset')">重置</el-button>
+          <el-button type="primary" @click="fetchData('search')">查询</el-button>
+        </div>
+      </div>
+    </div>
+    <cy-comm-table
+      ref="commTable"
+      v-loading="loading"
+      :columns="columns"
+      :data="tableData"
+      :count="count"
+      parent-component="PurchaseInvoice"
+    />
+  </div>
+</template>
+
+<script>
+import { mapGetters } from 'vuex'
+import { purchaseInvoiceList } from '@/api/myTrade/purchaseBill'
+import { getSupplierList } from '@/api/myTrade/salesContract'
+import { codeChangeName, handleMoney } from '@/utils'
+import store from '@/store'
+export default {
+  name: 'PurchaseInvoice',
+  data() {
+    return {
+      count: 0,
+      search: {
+        invoiceType: '',
+        invoiceInfo: '',
+        entityNo: '',
+        orderNo: ''
+      },
+      page: 1,
+      size: 10,
+      invoiceDate: [],
+      tableData: [],
+      columns: [
+        {
+          label: '序号',
+          index: true
+        },
+        {
+          label: '发票类型',
+          prop: 'invoiceType',
+          showTooltip: true,
+          render: (h, row) => {
+            return <div> <el-tooltip class='item' effect='dark' content={codeChangeName(this.constant.invoice_type, row.invoiceType, 'dictValue', 'dictLabel')} placement='top'>
+              <div class='one-ellipsis'>
+                {codeChangeName(this.constant.invoice_type, row.invoiceType, 'dictValue', 'dictLabel')}
+              </div>
+            </el-tooltip></div>
+          }
+        },
+        {
+          label: '发票代码',
+          prop: 'invoiceCode',
+          showTooltip: true
+        },
+        {
+          label: '发票号码',
+          prop: 'invoiceNumber',
+          showTooltip: true
+        },
+        {
+          label: '供应商名称',
+          prop: 'vendorEntityName',
+          showTooltip: true
+        },
+        {
+          label: '采购订单ID',
+          prop: 'orderNo',
+          showTooltip: true
+        },
+        {
+          label: '发票金额',
+          showTooltip: true,
+          prop: 'amount',
+          render: (h, row) => {
+            return <div> <el-tooltip class='item' effect='dark' content={row.currency + ' ' + handleMoney(row.amount)} placement='top'>
+              <div class='one-ellipsis'>
+                {row.currency + ' ' + handleMoney(row.amount)}
+              </div>
+            </el-tooltip></div>
+          }
+        },
+        {
+          label: '发票税额',
+          showTooltip: true,
+          prop: 'taxAmount',
+          render: (h, row) => {
+            return <div> <el-tooltip class='item' effect='dark' content={row.currency + ' ' + handleMoney(row.taxAmount)} placement='top'>
+              <div class='one-ellipsis'>
+                {row.currency + ' ' + handleMoney(row.taxAmount)}
+              </div>
+            </el-tooltip></div>
+          }
+        },
+        {
+          label: '商品数量',
+          showTooltip: true,
+          prop: 'number'
+        },
+        {
+          label: '开票日期',
+          showTooltip: true,
+          prop: 'invoicingDate'
+        },
+        {
+          label: '操作',
+          render: (h, row) => {
+            const btnList = [
+              {
+                msg: '预览',
+                icon: 'iconfont icon-a-Group8151',
+                rowPower: 'purchaseOrderInvoice',
+                category: 'edit'
+              },
+              {
+                msg: '详情',
+                icon: 'iconfont icon-a-Group957',
+                category: 'see'
+              }
+            ]
+            const options = btnList.map(item => {
+              return (
+                this.tablePower({ item, row }) && <el-tooltip class='item' effect='dark' content={item.msg} placement='top'>
+                  <span class='table-icon-box'>
+                    <i class={item.icon} onClick={() => { this.handlerOperate(item.category, row) }}></i>
+                  </span>
+                </el-tooltip>
+              )
+            })
+            return <div>{ options }</div>
+          },
+          width: 120
+        }
+      ],
+      loading: false,
+      supplierList: []
+    }
+  },
+  computed: {
+    ...mapGetters(['constant']),
+    tablePower() {
+      return ({ item, row }) => {
+        const { rowPower } = item
+        if (rowPower) {
+          if (row[rowPower] !== null) {
+            return true
+          }
+          return false
+        } else {
+          return true
+        }
+      }
+    }
+  },
+  created() {
+    this.$store.dispatch('getConstant', ['invoice_type'])
+
+    const userId = store.getters.userInfo.id
+    getSupplierList({ userId: userId }).then(res => {
+      this.supplierList = res.data || []
+    })
+  },
+  mounted() {
+    this.fetchData()
+  },
+  methods: {
+    fetchData(type) {
+      this.loading = true
+      if (type) {
+        this.page = 1
+        this.size = 10
+        if (type === 'reset') {
+          for (const key in this.search) {
+            this.search[key] = ''
+          }
+          this.invoiceDate = []
+        }
+      }
+      const params = {
+        ...this.search,
+        timeStart: this.invoiceDate && this.invoiceDate.length ? this.invoiceDate[0] : '',
+        timeEnd: this.invoiceDate && this.invoiceDate.length ? this.invoiceDate[1] : '',
+        page: this.page || 1,
+        rows: this.size || 10
+      }
+      purchaseInvoiceList(params).then(({ data }) => {
+        this.loading = false
+        this.tableData = data.rows
+        this.count = data.records
+      })
+    },
+    handlerOperate(type, row) {
+      if (type === 'edit') {
+        window.open(`${process.env.VUE_APP_BASE_API}/file_storage_oss/preview/${row.id}#toolbar=0&navpanes=0&scrollbar=0`)
+      } else if (type === 'see') {
+        this.$router.push({
+          name: 'PurchaseInvoiceView',
+          query: {
+            type: 'view',
+            id: row.id
+          }
+        })
+      }
+    }
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+    .purchase-order {
+
+    }
+</style>
+<style lang="scss">
+    .purchase-order {
+        .icon-a-Group957, .icon-a-Group1087 {
+            font-size: 28px;
+        }
+    }
+</style>

src/views/myTrade/purchaseBill/purchaseInvoice/view.vue

@@ -0,0 +1,138 @@
+<template>
+  <div class="sales-invoice-view">
+    <el-form
+      ref="ruleFormRef"
+      :model="ruleForm"
+      label-position="top"
+      label-width="150px"
+      class="rule-form-orange"
+    >
+      <cy-info-title>基础信息</cy-info-title>
+      <el-form-item label="发票类型">
+        <el-input :value="ruleForm.invoiceType ? codeToName(constant.invoice_type, ruleForm.invoiceType, 'dictValue', 'dictLabel') : ''" :disabled="disabled" />
+      </el-form-item>
+      <el-form-item label="发票代码">
+        <el-input :value="ruleForm.invoiceCode || '——'" :disabled="disabled" />
+      </el-form-item>
+      <el-form-item label="发票号码">
+        <el-input :value="ruleForm.invoiceNumber" :disabled="disabled" />
+      </el-form-item>
+      <el-form-item label="供应商名称">
+        <el-input :value="ruleForm.vendorEntityName" :disabled="disabled" />
+      </el-form-item>
+      <el-form-item label="采购订单ID">
+        <el-input :value="ruleForm.orderNo" :disabled="disabled" />
+      </el-form-item>
+      <el-form-item label="开票日期">
+        <el-input :value="ruleForm.invoicingDate" :disabled="disabled" />
+      </el-form-item>
+      <el-form-item label="发票金额">
+        <el-input :value="ruleForm.currency + ' ' + formatMoney(ruleForm.amount)" :disabled="disabled" />
+      </el-form-item>
+      <el-form-item label="发票税额">
+        <el-input :value="ruleForm.currency + ' ' + formatMoney(ruleForm.taxAmount)" :disabled="disabled" />
+      </el-form-item>
+      <el-form-item label="商品数量">
+        <el-input :value="ruleForm.number" :disabled="disabled" />
+      </el-form-item>
+      <el-form-item label="认证标志">
+        <el-input :value="ruleForm.certificationState === 'Y' ? '已认证' : ruleForm.certificationState === 'N' ? '未认证' : ''" :disabled="disabled" />
+      </el-form-item>
+      <el-form-item label="发票">
+        <cy-upload
+          :file-data="ruleForm.purchaseOrderInvoice ? [ruleForm.purchaseOrderInvoice] : []"
+          :upload-from-orange-status="true"
+          :limit="1"
+          disabled
+        />
+      </el-form-item>
+      <el-form-item label="认证日期">
+        <el-input :value="ruleForm.certificationDate" :disabled="disabled" />
+      </el-form-item>
+      <el-form-item label="备注">
+        <el-input :value="ruleForm.bz" :disabled="disabled" />
+      </el-form-item>
+      <cy-info-title style="margin-top: 20px;">商品信息</cy-info-title>
+      <div style="width: 100%;" class="table-box">
+        <el-table :data="goodsInfo" style="width: 100%;">
+          <el-table-column label="序号" type="index" width="50" />
+          <el-table-column label="报关品名" prop="declarationName" :show-overflow-tooltip="true" />
+          <el-table-column label="型号 (选填)" prop="model" :show-overflow-tooltip="true" />
+          <el-table-column label="申报计量单位" prop="measurementUnit" :show-overflow-tooltip="true" />
+          <el-table-column label="数量" prop="number" :show-overflow-tooltip="true" />
+          <el-table-column prop="priceUnit" :label="'采购单价 (不含税) (' + ruleForm.currency + ')'" width="180" :show-overflow-tooltip="true">
+            <template slot-scope="{ row }">
+              <span>{{ formatMoney(row.priceUnit) }}</span>
+            </template>
+          </el-table-column>
+          <el-table-column prop="amount" :label="'金额 (不含税) (' + ruleForm.currency + ')'" width="150" :show-overflow-tooltip="true">
+            <template slot-scope="{ row }">
+              <span>{{ formatMoney(row.amount) }}</span>
+            </template>
+          </el-table-column>
+          <el-table-column label="增值税税率（%）" prop="price" width="140" :show-overflow-tooltip="true" />
+          <el-table-column prop="taxAmount" :label="'税额 (' + ruleForm.currency + ')'" :show-overflow-tooltip="true">
+            <template slot-scope="{ row }">
+              <span>{{ formatMoney(row.taxAmount) }}</span>
+            </template>
+          </el-table-column>
+          <el-table-column prop="totalAmount" :label="'商品金额 (' + ruleForm.currency + ')'" width="130" :show-overflow-tooltip="true">
+            <template slot-scope="{ row }">
+              <span>{{ formatMoney(row.totalAmount) }}</span>
+            </template>
+          </el-table-column>
+        </el-table>
+      </div>
+    </el-form>
+    <div class="submit-btn">
+      <el-button @click="() => { $router.push({name: 'PurchaseBill'}) }">返回</el-button>
+    </div>
+  </div>
+</template>
+
+<script>
+import { mapGetters } from 'vuex'
+import { purchaseInvoiceDetail } from '@/api/myTrade/purchaseBill'
+import { codeChangeName, handleMoney } from '@/utils'
+export default {
+  name: 'SalesInvoiceView',
+  data() {
+    return {
+      goodsInfo: [],
+      ruleForm: {},
+      disabled: true
+    }
+  },
+  computed: {
+    ...mapGetters(['constant']),
+    formatMoney(val) {
+      return (val) => {
+        return handleMoney(val)
+      }
+    }
+  },
+
+  created() {
+    this.$store.dispatch('getConstant', ['invoice_type'])
+    this.getDetails()
+  },
+  methods: {
+    getDetails() {
+      purchaseInvoiceDetail({ invoiceId: this.$route.query.id }).then(({ data }) => {
+        this.ruleForm = data || {}
+        this.goodsInfo = data.invoiceCommodityList || []
+      })
+    },
+    codeToName(list, type, code, name) {
+      return codeChangeName(list, type, code, name)
+    }
+
+  }
+}
+</script>
+
+  <style lang="scss" scoped>
+    .sales-invoice-view {
+      padding: 10px 20px;
+    }
+  </style>

src/views/myTrade/purchaseBill/purchaseTransport/index.vue

@@ -35,6 +35,9 @@
             />
           </el-select>
         </div>
+        <div>
+          <el-input v-model="search.transportInvoiceNumber" placeholder="运输发票号码" />
+        </div>
         <div>
           <el-date-picker
             v-model="addDate"
@@ -45,6 +48,7 @@
           />
         </div>
         <div class="right-btn">
+          <el-button type="primary" @click="fetchData('reset')">重置</el-button>
           <el-button type="primary" @click="fetchData('search')">查询</el-button>
         </div>
       </div>
@@ -76,8 +80,8 @@ export default {
         logisticsOrderNumber: '',
         purchaseContractInfo: '',
         purchaseOrderNo: '',
-        vendorEntityNo: ''
-
+        vendorEntityNo: '',
+        transportInvoiceNumber: ''
       },
       page: 1,
       size: 10,
@@ -134,7 +138,17 @@ export default {
           prop: 'arriveTime'
         },
         {
-          label: '运输证明',
+          label: '运输发票号码',
+          showTooltip: true,
+          prop: 'transportInvoiceNumber'
+        },
+        {
+          label: '开票日期',
+          showTooltip: true,
+          prop: 'kprq'
+        },
+        {
+          label: '运输发票',
           showTooltip: true,
           prop: 'transportCertificateFileId',
           render: (h, row, index) => {
@@ -151,6 +165,11 @@ export default {
 
             // return <span style={'cursor: pointer;color: #5AC4FC;font-size: 14px;'} onClick={ () => { this.downloadContract(row) } } > { row.purchaseOrderTransProve ? row.purchaseOrderTransProve.originalName : '' } </span>
           }
+        },
+        {
+          label: '备注',
+          showTooltip: true,
+          prop: 'remark'
         }
         // {
         //   label: '操作',
@@ -220,6 +239,16 @@ export default {
   methods: {
     fetchData(type) {
       this.loading = true
+      if (type) {
+        this.page = 1
+        this.size = 10
+        if (type === 'reset') {
+          for (const key in this.search) {
+            this.search[key] = ''
+          }
+          this.addDate = []
+        }
+      }
       if (type === 'search') {
         this.page = 1
         this.size = 10