瀏覽代碼

详情页改造

chris 3 年之前
父節點
當前提交
01e6a4f504

+ 1 - 0
src/views/modules/check/ibc-detail.vue

@@ -94,6 +94,7 @@
     methods: {
       async init (id) {
         this.visible = true
+        this.dataForm = {}
         await getIncomingInspectionDetail(id).then(({data}) => {
           if (data && data.code === '200') {
             this.dataForm = data.data

+ 0 - 1
src/views/modules/common/upload-component.vue

@@ -117,7 +117,6 @@
           this.previewName = file.name
           this.previewVisible = true
         } else {
-          console.log('ext is not a picture ')
           // 弹出新页面显示下载文件
           window.open(downloadUrl + file.url)
         }

+ 1 - 0
src/views/modules/cus/communicate-detail.vue

@@ -102,6 +102,7 @@
       async init (id) {
         this.visible = true
         this.id = id || 0
+        this.dataForm = {}
         this.cusRCommProductVOS = []
         this.fileList = []
         this.getDetails()

+ 1 - 0
src/views/modules/cus/contract-detail.vue

@@ -71,6 +71,7 @@
       async init (id) {
         this.visible = true
         this.id = id || 0
+        this.dataForm = {}
         this.cusRCommProductVOS = []
         this.fileList = []
         this.fileList1 = []

+ 1 - 0
src/views/modules/cus/customer-detail.vue

@@ -58,6 +58,7 @@
       async init (id) {
         this.visible = true
         this.id = id || 0
+        this.dataForm = {}
         this.getDetails()
       },
       getDetails () {

+ 1 - 0
src/views/modules/msg-center/announcement-detail.vue

@@ -48,6 +48,7 @@
       async init (id) {
         this.visible = true
         this.id = id || 0
+        this.dataForm = {}
         this.getAnnouncementInfo()
       },
       getAnnouncementInfo () {

+ 218 - 0
src/views/modules/sale/purchase-detail.vue

@@ -0,0 +1,218 @@
+<template>
+  <el-dialog
+    title="查看"
+    width="70%"
+    :close-on-click-modal="false"
+    :visible.sync="visible">
+    <div style="margin-left: 20px;margin-right: 20px">
+      <!-- 工作流 -->
+      <div v-show="dataForm.workFlowBusinessExt">
+        <el-steps :active="dataForm.workFlowBusinessExt?dataForm.workFlowBusinessExt.workFlowProcessStepList.length + 2:0" align-center style="margin-bottom: 20px">
+          <template v-for="(item, i) in stepList">
+            <el-step :icon="item.icon" :title="item.title" :description="item.description"></el-step>
+          </template>
+        </el-steps>
+        <el-collapse style="margin-bottom: 20px">
+          <el-collapse-item>
+            <template slot="title">
+              <span style="color: red">审批日志(展开查看更多):</span>
+            </template>
+            <template v-for="(item, i) in logList">
+              <div>{{++i}}:{{item.approverName}}  {{item.createTime}}  {{item.approvalValue}}</div>
+            </template>
+          </el-collapse-item>
+        </el-collapse>
+      </div>
+      <e-desc title="基本信息" column="3">
+        <e-desc-item label="采购编码">{{dataForm.purchaseCode}}</e-desc-item>
+        <e-desc-item label="付款方式" span="2">
+          <el-checkbox-group v-model="idsPayType">
+            <el-checkbox disabled class="my-cb"  v-for="(item,i) in optionsPayType" :label="item.code" :key="item.code"><span>{{item.value}}</span></el-checkbox>
+          </el-checkbox-group>
+        </e-desc-item>
+
+        <e-desc-item label="采购类别">{{dataForm.purchaseTypeDesc}}</e-desc-item>
+        <e-desc-item label="申请人">{{dataForm.applierName}}</e-desc-item>
+        <e-desc-item label="申请部门">{{dataForm.deptName}}</e-desc-item>
+
+        <e-desc-item label="备注说明" span="3">{{dataForm.notes}}</e-desc-item>
+      </e-desc>
+      <e-desc title="采购物品明细">
+        <el-table
+          :data="materialDetails"
+          border
+          style="width: 100%;">
+          <el-table-column
+            label="序号"
+            type="index"
+            width="50"
+            align="center">
+          </el-table-column>
+          <el-table-column
+            prop="detailId"
+            label="ID"
+            v-if="false">
+          </el-table-column>
+          <el-table-column
+            prop="name"
+            header-align="center"
+            align="center"
+            min-width="120"
+            label="物品名称">
+          </el-table-column>
+          <el-table-column
+            prop="specification"
+            header-align="center"
+            align="center"
+            min-width="120"
+            label="型号及规格">
+          </el-table-column>
+          <el-table-column
+            prop="cnt"
+            header-align="center"
+            align="center"
+            label="数量">
+          </el-table-column>
+          <el-table-column
+            prop="unitName"
+            header-align="center"
+            align="center"
+            label="单位">
+          </el-table-column>
+          <el-table-column
+            prop="price"
+            header-align="center"
+            align="center"
+            label="不含税单价">
+          </el-table-column>
+          <el-table-column
+            prop="taxPrice"
+            header-align="center"
+            align="center"
+            label="含税单价">
+          </el-table-column>
+          <el-table-column
+            prop="taxAmount"
+            header-align="center"
+            align="center"
+            label="含税总价">
+          </el-table-column>
+          <el-table-column
+            prop="taxRate"
+            header-align="center"
+            align="center"
+            label="税率">
+            <template slot-scope="scope">
+              <span>{{scope.row.taxRate?(Number(scope.row.taxRate * 100)).toFixed(0):''}}</span>%
+            </template>
+          </el-table-column>
+          <el-table-column
+            prop="notes"
+            header-align="center"
+            align="center"
+            label="备注">
+          </el-table-column>
+        </el-table>
+      </e-desc>
+      <e-desc>
+        <e-desc-item label="合计(含税)" span="3"><span style="margin-left: 20px">{{totalAmount}}</span></e-desc-item>
+      </e-desc>
+    </div>
+    <span slot="footer" class="dialog-footer">
+      <el-button @click="visible = false">返回</el-button>
+    </span>
+  </el-dialog>
+</template>
+
+<script>
+  import EDesc from '../common/e-desc'
+  import EDescItem from '../common/e-desc-item'
+  import { dealStepData, dealStepLogs } from '@/api/util'
+  import { getPurchaseDetail } from '@/api/sale'
+  export default {
+    name: 'contract-detail',
+    components: {
+      EDesc, EDescItem
+    },
+    data () {
+      return {
+        visible: false,
+        id: 0,
+        dataForm: {},
+        materialDetails: [],
+        stepList: [],
+        logList: [],
+        totalAmount: 0,
+        idsPayType: [],
+        optionsPayType: [
+          {
+            code: '0', value: '对公转账'
+          },
+          {
+            code: '1', value: '先行垫付'
+          },
+          {
+            code: '2', value: '财务预支'
+          }
+        ]
+      }
+    },
+    methods: {
+      async init (id) {
+        this.visible = true
+        this.id = id || 0
+        this.dataForm = {}
+        this.materialDetails = []
+        this.stepList = []
+        this.logList = []
+        this.idsPayType = []
+        this.getDetails()
+      },
+      getDetails () {
+        getPurchaseDetail(this.id).then(({data}) => {
+          if (data && data.code === '200') {
+            this.dataForm = data.data
+            // 流程图展示
+            dealStepData(data.data.workFlowBusinessExt.workFlowProcessStepList, this.stepList)
+            dealStepLogs(data.data.workFlowBusinessExt.processLogList, this.logList)
+            // 付款方式
+            if (data.data.payType) {
+              this.idsPayType.push(data.data.payType)
+            }
+            // 获取采购物品明细
+            if (data.data.details) {
+              this.materialDetails = data.data.details
+              this.calTotal()
+            }
+          }
+        })
+      },
+      calTotal () {
+        let total = 0
+        if (this.materialDetails) {
+          this.materialDetails.forEach((item) => {
+            total += item.taxAmount ? Number(item.taxAmount) : 0
+          })
+        }
+        this.totalAmount = Number(total).toFixed(2)
+      },
+      // 百分比
+      formatPercent (row) {
+        if (!row.taxRate) return ''
+        let str = (Number(row.taxRate * 100)).toFixed(0)
+        str += '%'
+        return str
+      }
+    }
+  }
+</script>
+
+<style scoped>
+.my-line{
+  border-bottom: 1px solid #c0c4cc;
+  margin-bottom: 10px;
+}
+.title{
+  padding: 10px 0 ;
+}
+</style>

+ 22 - 12
src/views/modules/sale/purchase.vue

@@ -61,14 +61,15 @@
         prop="purchaseCode"
         header-align="center"
         align="center"
-        min-width="100"
+        min-width="180"
         label="采购编码">
       </el-table-column>
       <el-table-column
         prop="materialName"
         header-align="center"
         align="center"
-        min-width="120"
+        width="120"
+        :show-tooltip-when-overflow="true"
         label="物品名称">
       </el-table-column>
       <el-table-column
@@ -99,14 +100,6 @@
         min-width="100"
         label="申请部门">
       </el-table-column>
-      <el-table-column
-        prop="notes"
-        header-align="center"
-        align="center"
-        min-width="180"
-        :show-overflow-tooltip="true"
-        label="说明">
-      </el-table-column>
       <el-table-column
         prop="purchaseState"
         header-align="center"
@@ -114,6 +107,14 @@
         :formatter="formatState"
         label="当前状态">
       </el-table-column>
+      <el-table-column
+              prop="notes"
+              header-align="center"
+              align="center"
+              min-width="180"
+              :show-overflow-tooltip="true"
+              label="备注说明">
+      </el-table-column>
       <el-table-column
         fixed="right"
         header-align="center"
@@ -121,7 +122,7 @@
         width="150"
         label="操作">
         <template slot-scope="scope">
-          <el-button v-if="isAuth('sale:purchase:info')" type="text" size="small" @click="addOrUpdateHandle(scope.row.purchaseId, true)">查看</el-button>
+          <el-button v-if="isAuth('sale:purchase:info')" type="text" size="small" @click="detailHandle(scope.row.purchaseId)">查看</el-button>
           <el-button v-if="isAuth('sale:purchase:update')" type="text" size="small" @click="addOrUpdateHandle(scope.row.purchaseId, false)">编辑</el-button>
           <el-button v-if="isAuth('sale:purchase:revoke')" style="color: red" type="text" size="small" @click="revokeHandle(scope.row.purchaseId)">撤回</el-button>
         </template>
@@ -138,21 +139,24 @@
     </el-pagination>
     <!-- 弹窗, 新增 / 修改 -->
     <add-or-update v-if="addOrUpdateVisible" ref="addOrUpdate" @refreshDataList="getDataList"></add-or-update>
+    <detail v-if="detailVisible" ref="detail"/>
   </div>
 </template>
 
 <script>
   import AddOrUpdate from './purchase-add-or-update'
+  import Detail from './purchase-detail'
   import { getDictList } from '@/api/dict'
   import { getPurchaseList, revokePurchase } from '@/api/sale'
   export default {
     name: 'purchase',
     components: {
-      AddOrUpdate
+      AddOrUpdate, Detail
     },
     data () {
       return {
         addOrUpdateVisible: false,
+        detailVisible: false,
         dataForm: {},
         dataList: [],
         pageIndex: 1,
@@ -286,6 +290,12 @@
         if (!row.purchaseState) return ''
         const item1 = this.optionsState.find((item) => item.code === row.purchaseState.toString())
         return item1 ? item1.value : ''
+      },
+      detailHandle (id) {
+        this.detailVisible = true
+        this.$nextTick(() => {
+          this.$refs.detail.init(id)
+        })
       }
     }
   }