123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551 |
- <!-- 任务单详情 -->
- <template>
- <div>
- <div class="my-title">查看</div>
- <div style="margin-left: 20px;margin-right: 20px">
- <!-- 工作流 -->
- <div v-show="dataForm.workFlowBusinessExt">
- <el-steps :active="activeNo" finish-status="success" 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>
- <div v-if="isFlow">
- <approve-component ref="approve" @approveFinished="approveFinished"/>
- </div>
- <e-desc title="基本信息" column="3">
- <e-desc-item label="公司任务单编码">{{dataForm.orderCode}}</e-desc-item>
- <e-desc-item label="合同号">{{dataForm.contractNumber}}</e-desc-item>
- <e-desc-item label="客户名称">{{dataForm.customerName}}</e-desc-item>
- <e-desc-item label="业务员">{{dataForm.salesmanName}}</e-desc-item>
- <e-desc-item label="合同交期">{{dataForm.deliveryDate?dataForm.deliveryDate.substring(0,10):''}}</e-desc-item>
- <e-desc-item label="备注说明" span="3">{{dataForm.notes}}</e-desc-item>
- <e-desc-item label="附件" span="3">
- <div v-for="(item, index) in dataForm.attachList" style="display: inline">
- <span v-if="index > 0">,</span>
- <a :key="item.fileName + index" type="primary" href="#" @click="previewFile(item.fileName, item.url)">{{ item.fileName }}</a>
- </div>
- </e-desc-item>
- </e-desc>
- <e-desc title="物料清单明细">
- <el-table
- :data="productDetails"
- row-key="productId"
- border
- :indent='20'
- lazy
- :load="loadingData"
- style="width: 100%;">
- <el-table-column
- label="序号"
- type="index"
- width="50"
- align="center">
- </el-table-column>
- <el-table-column
- prop="mapNumber"
- header-align="center"
- align="left"
- width="160"
- :show-tooltip-when-overflow="true"
- label="图号">
- </el-table-column>
- <el-table-column
- prop="productName"
- header-align="center"
- align="left"
- width="160"
- :show-tooltip-when-overflow="true"
- label="物料名称">
- </el-table-column>
- <el-table-column
- prop="relatedProduct"
- header-align="center"
- align="center"
- width="120"
- :show-tooltip-when-overflow="true"
- label="物料关联">
- </el-table-column>
- <el-table-column
- header-align="center"
- align="center"
- min-width="100"
- :show-tooltip-when-overflow="true"
- label="简图">
- <template slot-scope="scope">
- <el-popover placement="right" title="" trigger="hover">
- <img :src="scope.row.simplePic" style="height: 400px;width: 500px">
- <img slot="reference" :src="scope.row.simplePic" :alt="scope.row.simplePic" style="max-height: 50px;max-width: 130px">
- </el-popover>
- </template>
- </el-table-column>
- <el-table-column
- prop="productSpecifications"
- header-align="center"
- align="center"
- width="120"
- :show-tooltip-when-overflow="true"
- label="规格">
- </el-table-column>
- <el-table-column
- prop="cnt"
- header-align="center"
- align="center"
- width="80"
- label="数量">
- </el-table-column>
- <el-table-column
- prop="unit"
- header-align="center"
- align="center"
- width="80"
- label="单位">
- </el-table-column>
- <el-table-column
- prop="productNumber"
- header-align="center"
- align="center"
- width="120"
- :show-tooltip-when-overflow="true"
- label="生产编号">
- </el-table-column>
- <el-table-column
- prop="batchNumber"
- header-align="center"
- align="center"
- width="120"
- :show-tooltip-when-overflow="true"
- label="批次号">
- </el-table-column>
- <el-table-column
- prop="produceRequire"
- header-align="center"
- align="center"
- width="160"
- :show-tooltip-when-overflow="true"
- label="生产要求">
- </el-table-column>
- <el-table-column
- prop="price"
- header-align="center"
- align="center"
- width="80"
- label="含税单价">
- </el-table-column>
- <el-table-column
- prop="amount"
- header-align="center"
- align="center"
- width="80"
- label="含税总价">
- <template slot-scope="scope">
- <span>{{ (scope.row.cnt*scope.row.price).toFixed(1) }}</span>
- </template>
- </el-table-column>
- <el-table-column
- prop="rate"
- header-align="center"
- align="center"
- width="100"
- label="税率">
- <template slot-scope="scope">
- {{scope.row.rate}}%
- </template>
- </el-table-column>
- <el-table-column
- prop="mapNumber"
- header-align="center"
- align="center"
- min-width="100"
- :show-tooltip-when-overflow="true"
- label="主图号">
- </el-table-column>
- <el-table-column
- prop="noticeChangeRecord"
- header-align="center"
- align="center"
- min-width="120"
- :show-tooltip-when-overflow="true"
- label="产品变更记录">
- </el-table-column>
- <el-table-column
- header-align="center"
- align="center"
- min-width="100"
- :show-tooltip-when-overflow="true"
- label="技术文件">
- <template slot-scope="scope">
- <el-button :disabled="!scope.row.attachList || scope.row.attachList.length === 0" type="text" size="small" @click="attachDetails(scope.row.attachList)">查看</el-button>
- </template>
- </el-table-column>
- <el-table-column
- header-align="center"
- align="center"
- label="对应图纸">
- <template slot-scope="scope">
- <el-button :disabled="!scope.row.drawingList || scope.row.drawingList.length === 0" type="text" size="small" @click="drawDetails(scope.row)">查看</el-button>
- </template>
- </el-table-column>
- <el-table-column
- header-align="center"
- align="center"
- label="对应工艺">
- <template slot-scope="scope">
- <el-button :disabled="!scope.row.techId" type="text" size="small" @click="techDetails(scope.row.techId)">查看</el-button>
- </template>
- </el-table-column>
- <el-table-column
- header-align="center"
- align="center"
- label="生产明细">
- <template slot-scope="scope">
- <el-button :disabled="!scope.row.prodProductionList || scope.row.prodProductionList.length === 0" type="text" size="small" @click="productListHandle(scope.row)">查看</el-button>
- </template>
- </el-table-column>
- <el-table-column
- prop="appraisal"
- header-align="center"
- align="center"
- width="120"
- :show-tooltip-when-overflow="true"
- label="首件鉴定">
- <template slot-scope="scope">
- <span>{{!scope.row.appraisal?'':(Number(scope.row.appraisal) === 2?'是':'否')}}</span>
- </template>
- </el-table-column>
- <el-table-column
- header-align="center"
- align="center"
- width="120"
- :show-tooltip-when-overflow="true"
- label="试制前检查">
- <template slot-scope="scope">
- <span>{{!scope.row.inspect?'':(Number(scope.row.inspect) === 2?'是':'否')}}</span>
- </template>
- </el-table-column>
- <el-table-column
- header-align="center"
- align="center"
- min-width="120"
- :show-tooltip-when-overflow="true"
- label="试制前准备状态检查报告">
- <template slot-scope="scope">
- <el-button :disabled="!scope.row.attachListInspection || scope.row.attachListInspection.length === 0" type="text" size="small" @click="attachDetails(scope.row.attachListInspection)">查看</el-button>
- </template>
- </el-table-column>
- <el-table-column
- header-align="center"
- align="center"
- min-width="100"
- :show-tooltip-when-overflow="true"
- label="试制前准备状态自查表">
- <template slot-scope="scope">
- <el-button :disabled="!scope.row.attachListExamine || scope.row.attachListExamine.length === 0" type="text" size="small" @click="attachDetails(scope.row.attachListExamine)">查看</el-button>
- </template>
- </el-table-column>
- <el-table-column
- prop="notes"
- header-align="center"
- align="center"
- min-width="120"
- :show-tooltip-when-overflow="true"
- label="备注">
- </el-table-column>
- <el-table-column
- prop="prodState"
- header-align="center"
- fixed="right"
- align="center"
- :formatter="formatState"
- :show-tooltip-when-overflow="true"
- label="状态">
- </el-table-column>
- </el-table>
- </e-desc>
- <e-desc title="任务工单派发">
- <el-table
- :data="workInfoDetails"
- border
- style="width: 100%;">
- <el-table-column
- label="序号"
- type="index"
- width="50"
- align="center">
- </el-table-column>
- <el-table-column
- prop="taskType"
- header-align="center"
- align="center"
- min-width="80"
- :show-tooltip-when-overflow="true"
- label="工单类型">
- </el-table-column>
- <el-table-column
- prop="taskName"
- header-align="center"
- align="center"
- width="120"
- :show-tooltip-when-overflow="true"
- label="工单名称">
- </el-table-column>
- <el-table-column
- prop="ranks"
- header-align="center"
- align="center"
- min-width="50"
- label="级别">
- </el-table-column>
- <el-table-column
- prop="content"
- header-align="center"
- align="center"
- width="160"
- :show-tooltip-when-overflow="true"
- label="工单内容">
- </el-table-column>
- <el-table-column
- prop="receiverName"
- header-align="center"
- align="center"
- min-width="100"
- label="任务接收人">
- </el-table-column>
- <el-table-column
- prop="planCompletionTime"
- header-align="center"
- align="center"
- min-width="80"
- label="要求完成时间">
- </el-table-column>
- <el-table-column
- prop="attachList"
- header-align="center"
- align="center"
- label="工单附件">
- <template slot-scope="scope">
- <div v-for="(item, index) in scope.row.attachList" style="display: inline">
- <span v-if="index > 0">,</span>
- <a :key="item.fileName + index" type="primary" href="#" @click="previewFile(item.fileName, item.url)">{{ item.fileName }}</a>
- </div>
- </template>
- </el-table-column>
- <el-table-column
- prop="notes"
- header-align="center"
- align="center"
- width="120"
- :show-tooltip-when-overflow="true"
- label="备注">
- </el-table-column>
- </el-table>
- </e-desc>
- </div>
- <span slot="footer" class="dialog-footer">
- <el-button @click="onChose">返回</el-button>
- </span>
- <!-- 文件预览 -->
- <preview-component v-if="previewVisible" ref="preview"/>
- <product-draw-detail-dialog v-if="drawVisible" ref="drawDetail"/>
- <attach-detail-dialog v-if="attachVisible" ref="attachDetail"/>
- <crafts-detail-dialog v-if="craftsVisible" ref="craftsDetail"/>
- <prod-management-details-dialog v-if="prodVisible" ref="prodDetail"/>
- </div>
- </template>
- <script>
- import EDesc from '../common/e-desc'
- import EDescItem from '../common/e-desc-item'
- import { dealStepData, dealStepLogs } from '@/api/util'
- import { getOrderDetail } from '@/api/sale'
- import { getChildren2 } from '@/api/product'
- import uploadComponent from '../common/upload-component'
- import ApproveComponent from '../common/approve-component'
- import PreviewComponent from '@/views/modules/common/preview-component'
- import ProductDrawDetailDialog from '@/views/modules/tech/product-draw-detail-dialog'
- import AttachDetailDialog from '@/views/modules/common/attach-detail-dialog'
- import { downloadUrl } from '@/api/file'
- import CraftsDetailDialog from '@/views/modules/tech/crafts-detail-dialog'
- import {optionsMaterialState} from '@/utils/enums'
- import ProdManagementDetailsDialog from '@/views/modules/production/prod-list-dialog'
- export default {
- name: 'order-detail',
- components: {
- ProdManagementDetailsDialog,
- CraftsDetailDialog,
- AttachDetailDialog,
- ProductDrawDetailDialog,
- PreviewComponent,
- EDesc,
- EDescItem,
- uploadComponent,
- ApproveComponent
- },
- data () {
- return {
- visible: false,
- isFlow: false,
- previewVisible: false,
- id: 0,
- dataForm: {},
- productDetails: [],
- workInfoDetails: [],
- activeNo: 0,
- stepList: [],
- logList: [],
- drawVisible: false,
- attachVisible: false,
- craftsVisible: false,
- optionsState: optionsMaterialState,
- prodVisible: false
- }
- },
- methods: {
- onChose () {
- this.$emit('onChose')
- },
- async init (id, businessType) {
- this.visible = true
- this.isFlow = !!(businessType && businessType !== '')
- this.id = id || 0
- this.dataForm = {
- workFlowBusinessExt: null
- }
- this.productDetails = []
- this.stepList = []
- this.logList = []
- this.getDetails(businessType)
- },
- getDetails (businessType) {
- getOrderDetail(this.id).then(({data}) => {
- if (data && data.code === '200') {
- this.dataForm = data.data
- // 流程图展示
- if (data.data.workFlowBusinessExt.workFlowProcessStepList) {
- dealStepData(data.data.workFlowBusinessExt.workFlowProcessStepList, this.stepList)
- }
- if (data.data.workFlowBusinessExt.processLogList) {
- dealStepLogs(data.data.workFlowBusinessExt.processLogList, this.logList)
- }
- if (data.data.workFlowProcessStepList) {
- this.activeNo = Number(data.data.workFlowProcessStepList.activeNo)
- }
- // 任务单物料明细
- if (data.data.saleROrderProductList) {
- this.productDetails = data.data.saleROrderProductList
- // 简图格式调整
- this.productDetails.forEach(item => {
- if (item.attachList2 && item.attachList2.length > 0) {
- item.simplePic = downloadUrl + item.attachList2[0].url
- } else {
- item.simplePic = ''
- }
- })
- }
- // 任务工单派发
- if (data.data.workInfoList) {
- this.workInfoDetails = data.data.workInfoList
- }
- // 初始化审批Form
- this.showApproveForm(businessType, this.id)
- }
- })
- },
- // 初始化审批Form
- showApproveForm (businessType, businessId) {
- if (this.isFlow) {
- this.$nextTick(() => {
- this.$refs.approve.init(businessType, businessId)
- })
- }
- },
- // 审批完成
- approveFinished () {
- this.onChose()
- this.$emit('approveFinished')
- },
- // 对应图纸
- drawDetails (row) {
- this.drawVisible = true
- this.$nextTick(() => {
- this.$refs.drawDetail.init(row.drawingList)
- })
- },
- // 预览
- previewFile (fileName, url) {
- this.previewVisible = true
- this.$nextTick(() => {
- this.$refs.preview.init(fileName, url)
- })
- },
- loadingData (row, treeNode, resolve) {
- getChildren2(row.productId, row.id).then(({data}) => {
- // console.log(JSON.stringify(data))
- if (data && data.code === '200') {
- data.data.forEach(item => {
- if (item.attachList2 && item.attachList2.length > 0) {
- item.simplePic = downloadUrl + item.attachList2[0].url
- } else {
- item.simplePic = ''
- }
- })
- resolve(data.data)
- } else {
- this.$message.error(data.msg)
- }
- })
- },
- // 物料技术文件
- attachDetails (list) {
- this.attachVisible = true
- this.$nextTick(() => {
- this.$refs.attachDetail.init(list)
- })
- },
- // 对应工艺
- techDetails (id) {
- this.craftsVisible = true
- this.$nextTick(() => {
- this.$refs.craftsDetail.init(id)
- })
- },
- // 格式化物料状态
- formatState (row) {
- if (!row.prodState) return ''
- const item1 = this.optionsState.find((item) => item.code === row.prodState.toString())
- return item1 ? item1.value : ''
- },
- // 查看生产明细
- productListHandle (row) {
- this.prodVisible = true
- this.$nextTick(() => {
- this.$refs.prodDetail.init(row.prodProductionList)
- })
- }
- }
- }
- </script>
- <style scoped>
- .my-line{
- border-bottom: 1px solid #c0c4cc;
- margin-bottom: 10px;
- }
- .title{
- padding: 10px 0 ;
- }
- </style>
|