|
|
@@ -36,11 +36,11 @@
|
|
|
<span>{{ extInfo.documentSource }}</span>
|
|
|
</el-form-item>
|
|
|
</el-col>
|
|
|
- <el-col :span="8" >
|
|
|
+ <el-col :span="8">
|
|
|
<el-form-item label="客户名称:">
|
|
|
<span>{{ infoData.clientName }}</span>
|
|
|
</el-form-item>
|
|
|
- <!-- </el-col>
|
|
|
+ <!-- </el-col>
|
|
|
<el-col :span="8" v-if="infoData.bizType == 3">
|
|
|
<el-form-item label="客户联系人:">
|
|
|
<span>{{ infoData.clientUser }}</span>
|
|
|
@@ -50,7 +50,9 @@
|
|
|
</el-form-item> -->
|
|
|
</el-col>
|
|
|
<el-col :span="8">
|
|
|
- <el-form-item :label="infoData.bizType == 4 ? '领料单:' : '来源单据:'">
|
|
|
+ <el-form-item
|
|
|
+ :label="infoData.bizType == 4 ? '领料单:' : '来源单据:'"
|
|
|
+ >
|
|
|
<span>{{ infoData.sourceBizNo }}</span>
|
|
|
</el-form-item>
|
|
|
</el-col>
|
|
|
@@ -104,39 +106,110 @@
|
|
|
</div>
|
|
|
<div class="content-detail mt20">
|
|
|
<header-title title="产品信息" size="16px"></header-title>
|
|
|
- <el-table ref="productListTable" :data="productList" border tooltip-effect="dark" :max-height="300"
|
|
|
- :header-cell-style="rowClass">
|
|
|
+ <el-table
|
|
|
+ ref="productListTable"
|
|
|
+ :data="productList"
|
|
|
+ border
|
|
|
+ tooltip-effect="dark"
|
|
|
+ :max-height="300"
|
|
|
+ :header-cell-style="rowClass"
|
|
|
+ >
|
|
|
<el-table-column label="序号" type="index" width="50">
|
|
|
</el-table-column>
|
|
|
- <el-table-column label="编码" prop="categoryCode" align="center"
|
|
|
- :show-overflow-tooltip="true"></el-table-column>
|
|
|
- <el-table-column label="名称" align="center" prop="categoryName"
|
|
|
- :show-overflow-tooltip="true"></el-table-column>
|
|
|
- <el-table-column v-if="clientEnvironmentId == 4" label="级别" prop="level" align="center">
|
|
|
+ <el-table-column
|
|
|
+ label="编码"
|
|
|
+ prop="categoryCode"
|
|
|
+ align="center"
|
|
|
+ :show-overflow-tooltip="true"
|
|
|
+ ></el-table-column>
|
|
|
+ <el-table-column
|
|
|
+ label="名称"
|
|
|
+ align="center"
|
|
|
+ prop="categoryName"
|
|
|
+ :show-overflow-tooltip="true"
|
|
|
+ ></el-table-column>
|
|
|
+ <el-table-column
|
|
|
+ v-if="clientEnvironmentId == 4"
|
|
|
+ label="级别"
|
|
|
+ prop="level"
|
|
|
+ align="center"
|
|
|
+ >
|
|
|
</el-table-column>
|
|
|
- <el-table-column label="型号" align="center" prop="categoryModel"
|
|
|
- :show-overflow-tooltip="true"></el-table-column>
|
|
|
- <el-table-column label="规格" align="center" prop="specification"
|
|
|
- :show-overflow-tooltip="true"></el-table-column>
|
|
|
- <el-table-column label="牌号" align="center" prop="brandNum" :show-overflow-tooltip="true"></el-table-column>
|
|
|
-
|
|
|
- <el-table-column v-for="(item, index) in newColumns" :label="item.label" :align="item.align"
|
|
|
- :prop="item.prop" :show-overflow-tooltip="item.showOverflowTooltip"></el-table-column>
|
|
|
- <el-table-column label="批次号" prop="batchNo" align="center" :show-overflow-tooltip="true">
|
|
|
+ <el-table-column
|
|
|
+ label="型号"
|
|
|
+ align="center"
|
|
|
+ prop="categoryModel"
|
|
|
+ :show-overflow-tooltip="true"
|
|
|
+ ></el-table-column>
|
|
|
+ <el-table-column
|
|
|
+ label="规格"
|
|
|
+ align="center"
|
|
|
+ prop="specification"
|
|
|
+ :show-overflow-tooltip="true"
|
|
|
+ ></el-table-column>
|
|
|
+ <el-table-column
|
|
|
+ label="牌号"
|
|
|
+ align="center"
|
|
|
+ prop="brandNum"
|
|
|
+ :show-overflow-tooltip="true"
|
|
|
+ ></el-table-column>
|
|
|
+
|
|
|
+ <el-table-column
|
|
|
+ v-for="(item, index) in newColumns"
|
|
|
+ :label="item.label"
|
|
|
+ :align="item.align"
|
|
|
+ :prop="item.prop"
|
|
|
+ :show-overflow-tooltip="item.showOverflowTooltip"
|
|
|
+ ></el-table-column>
|
|
|
+ <el-table-column
|
|
|
+ label="批次号"
|
|
|
+ prop="batchNo"
|
|
|
+ align="center"
|
|
|
+ :show-overflow-tooltip="true"
|
|
|
+ >
|
|
|
</el-table-column>
|
|
|
- <el-table-column label="包装数量" prop="packingQuantity" align="center">
|
|
|
+ <el-table-column
|
|
|
+ label="包装数量"
|
|
|
+ prop="packingQuantity"
|
|
|
+ align="center"
|
|
|
+ >
|
|
|
</el-table-column>
|
|
|
- <el-table-column label="包装单位" align="center" width="120" prop="packingUnit">
|
|
|
+ <el-table-column
|
|
|
+ label="包装单位"
|
|
|
+ align="center"
|
|
|
+ width="120"
|
|
|
+ prop="packingUnit"
|
|
|
+ >
|
|
|
</el-table-column>
|
|
|
- <el-table-column label="计量数量" prop="measureQuantity" width="100" align="center">
|
|
|
+ <el-table-column
|
|
|
+ label="计量数量"
|
|
|
+ prop="measureQuantity"
|
|
|
+ width="100"
|
|
|
+ align="center"
|
|
|
+ >
|
|
|
</el-table-column>
|
|
|
<el-table-column label="计量单位" prop="measureUnit" align="center">
|
|
|
</el-table-column>
|
|
|
- <el-table-column label="重量" prop="weight" align="center" :show-overflow-tooltip="true">
|
|
|
+ <el-table-column
|
|
|
+ label="重量"
|
|
|
+ prop="weight"
|
|
|
+ align="center"
|
|
|
+ :show-overflow-tooltip="true"
|
|
|
+ >
|
|
|
</el-table-column>
|
|
|
- <el-table-column label="重量单位" prop="weightUnit" align="center" :show-overflow-tooltip="true">
|
|
|
+ <el-table-column
|
|
|
+ label="重量单位"
|
|
|
+ prop="weightUnit"
|
|
|
+ align="center"
|
|
|
+ :show-overflow-tooltip="true"
|
|
|
+ >
|
|
|
</el-table-column>
|
|
|
- <el-table-column label="单价" prop="price" align="center">
|
|
|
+ <el-table-column
|
|
|
+ label="单价"
|
|
|
+ prop="price"
|
|
|
+ align="center"
|
|
|
+ v-if="isPrice == 1"
|
|
|
+ >
|
|
|
<template slot-scope="{ row }">
|
|
|
<template>
|
|
|
{{ row.price ? row.price : '-' + '元' }}/{{ row.measureUnit }}
|
|
|
@@ -144,73 +217,199 @@
|
|
|
</template>
|
|
|
</el-table-column>
|
|
|
|
|
|
- <el-table-column label="金额" align="center" prop="contentImage" :show-overflow-tooltip="true">
|
|
|
+ <el-table-column
|
|
|
+ v-if="isPrice == 1"
|
|
|
+ label="金额"
|
|
|
+ align="center"
|
|
|
+ prop="contentImage"
|
|
|
+ :show-overflow-tooltip="true"
|
|
|
+ >
|
|
|
<template slot-scope="{ row, $index }">
|
|
|
{{ row.totalMoney ? row.totalMoney : 0 }}
|
|
|
</template>
|
|
|
</el-table-column>
|
|
|
- <el-table-column v-if="clientEnvironmentId == 4" label="采购原因" align="center" prop="purpose"
|
|
|
- :show-overflow-tooltip="true"></el-table-column>
|
|
|
- <el-table-column label="仓库" prop="warehouseName" :show-overflow-tooltip="true">
|
|
|
+ <el-table-column
|
|
|
+ v-if="clientEnvironmentId == 4"
|
|
|
+ label="采购原因"
|
|
|
+ align="center"
|
|
|
+ prop="purpose"
|
|
|
+ :show-overflow-tooltip="true"
|
|
|
+ ></el-table-column>
|
|
|
+ <el-table-column
|
|
|
+ label="仓库"
|
|
|
+ prop="warehouseName"
|
|
|
+ :show-overflow-tooltip="true"
|
|
|
+ >
|
|
|
</el-table-column>
|
|
|
</el-table>
|
|
|
</div>
|
|
|
<div class="mt20">
|
|
|
<header-title :title="`包装明细`" size="16px"></header-title>
|
|
|
- <el-table ref="showPackingListTable" :data="showPackingList" tooltip-effect="dark" :max-height="300" border
|
|
|
- :row-class-name="tableRowClassName" :header-cell-style="rowClass"
|
|
|
- v-el-table-infinite-scroll="pickingHandleScroll">
|
|
|
+ <el-table
|
|
|
+ ref="showPackingListTable"
|
|
|
+ :data="showPackingList"
|
|
|
+ tooltip-effect="dark"
|
|
|
+ :max-height="300"
|
|
|
+ border
|
|
|
+ :row-class-name="tableRowClassName"
|
|
|
+ :header-cell-style="rowClass"
|
|
|
+ v-el-table-infinite-scroll="pickingHandleScroll"
|
|
|
+ >
|
|
|
<el-table-column label="序号" type="index" width="50">
|
|
|
</el-table-column>
|
|
|
- <el-table-column label="编码" prop="categoryCode" :show-overflow-tooltip="true"></el-table-column>
|
|
|
- <el-table-column label="名称" prop="categoryName" :show-overflow-tooltip="true"></el-table-column>
|
|
|
- <el-table-column label="批次号" prop="batchNo" :show-overflow-tooltip="true"></el-table-column>
|
|
|
- <el-table-column label="发货条码" prop="barcodes" :show-overflow-tooltip="true"></el-table-column>
|
|
|
- <el-table-column label="包装编码" prop="packageNo" :show-overflow-tooltip="true"></el-table-column>
|
|
|
- <el-table-column label="包装数量" prop="packingQuantity" :show-overflow-tooltip="true"></el-table-column>
|
|
|
- <el-table-column label="包装单位" prop="packingUnit" :show-overflow-tooltip="true"></el-table-column>
|
|
|
- <el-table-column label="计量数量" prop="measureQuantity" :show-overflow-tooltip="true"></el-table-column>
|
|
|
- <el-table-column label="计量单位" prop="measureUnit" :show-overflow-tooltip="true"></el-table-column>
|
|
|
- <el-table-column label="物料代号" prop="materielDesignation" :show-overflow-tooltip="true">
|
|
|
+ <el-table-column
|
|
|
+ label="编码"
|
|
|
+ prop="categoryCode"
|
|
|
+ :show-overflow-tooltip="true"
|
|
|
+ ></el-table-column>
|
|
|
+ <el-table-column
|
|
|
+ label="名称"
|
|
|
+ prop="categoryName"
|
|
|
+ :show-overflow-tooltip="true"
|
|
|
+ ></el-table-column>
|
|
|
+ <el-table-column
|
|
|
+ label="批次号"
|
|
|
+ prop="batchNo"
|
|
|
+ :show-overflow-tooltip="true"
|
|
|
+ ></el-table-column>
|
|
|
+ <el-table-column
|
|
|
+ label="发货条码"
|
|
|
+ prop="barcodes"
|
|
|
+ :show-overflow-tooltip="true"
|
|
|
+ ></el-table-column>
|
|
|
+ <el-table-column
|
|
|
+ label="包装编码"
|
|
|
+ prop="packageNo"
|
|
|
+ :show-overflow-tooltip="true"
|
|
|
+ ></el-table-column>
|
|
|
+ <el-table-column
|
|
|
+ label="包装数量"
|
|
|
+ prop="packingQuantity"
|
|
|
+ :show-overflow-tooltip="true"
|
|
|
+ ></el-table-column>
|
|
|
+ <el-table-column
|
|
|
+ label="包装单位"
|
|
|
+ prop="packingUnit"
|
|
|
+ :show-overflow-tooltip="true"
|
|
|
+ ></el-table-column>
|
|
|
+ <el-table-column
|
|
|
+ label="计量数量"
|
|
|
+ prop="measureQuantity"
|
|
|
+ :show-overflow-tooltip="true"
|
|
|
+ ></el-table-column>
|
|
|
+ <el-table-column
|
|
|
+ label="计量单位"
|
|
|
+ prop="measureUnit"
|
|
|
+ :show-overflow-tooltip="true"
|
|
|
+ ></el-table-column>
|
|
|
+ <el-table-column
|
|
|
+ label="物料代号"
|
|
|
+ prop="materielDesignation"
|
|
|
+ :show-overflow-tooltip="true"
|
|
|
+ >
|
|
|
</el-table-column>
|
|
|
- <el-table-column label="客户代号" prop="clientCode" :show-overflow-tooltip="true">
|
|
|
+ <el-table-column
|
|
|
+ label="客户代号"
|
|
|
+ prop="clientCode"
|
|
|
+ :show-overflow-tooltip="true"
|
|
|
+ >
|
|
|
</el-table-column>
|
|
|
- <el-table-column label="刻码" prop="engrave" :show-overflow-tooltip="true">
|
|
|
+ <el-table-column
|
|
|
+ label="刻码"
|
|
|
+ prop="engrave"
|
|
|
+ :show-overflow-tooltip="true"
|
|
|
+ >
|
|
|
</el-table-column>
|
|
|
- <el-table-column label="重量" prop="weight" :show-overflow-tooltip="true">
|
|
|
+ <el-table-column
|
|
|
+ label="重量"
|
|
|
+ prop="weight"
|
|
|
+ :show-overflow-tooltip="true"
|
|
|
+ >
|
|
|
</el-table-column>
|
|
|
- <el-table-column label="重量单位" prop="weightUnit" :show-overflow-tooltip="true">
|
|
|
+ <el-table-column
|
|
|
+ label="重量单位"
|
|
|
+ prop="weightUnit"
|
|
|
+ :show-overflow-tooltip="true"
|
|
|
+ >
|
|
|
</el-table-column>
|
|
|
- <el-table-column label="质检结果" prop="result" :show-overflow-tooltip="true">
|
|
|
+ <el-table-column
|
|
|
+ label="质检结果"
|
|
|
+ prop="result"
|
|
|
+ :show-overflow-tooltip="true"
|
|
|
+ >
|
|
|
<template slot-scope="{ row }">
|
|
|
<span>{{ qualityResults[row.result] }}</span>
|
|
|
</template>
|
|
|
</el-table-column>
|
|
|
- <el-table-column label="质检状态" prop="status" :show-overflow-tooltip="true">
|
|
|
+ <el-table-column
|
|
|
+ label="质检状态"
|
|
|
+ prop="status"
|
|
|
+ :show-overflow-tooltip="true"
|
|
|
+ >
|
|
|
<template slot-scope="{ row }">
|
|
|
<span>{{ qualityStatus[row.status] }}</span>
|
|
|
</template>
|
|
|
</el-table-column>
|
|
|
- <el-table-column label="生产日期" prop="productionDate" :show-overflow-tooltip="true">
|
|
|
+ <el-table-column
|
|
|
+ label="生产日期"
|
|
|
+ prop="productionDate"
|
|
|
+ :show-overflow-tooltip="true"
|
|
|
+ >
|
|
|
</el-table-column>
|
|
|
- <el-table-column label="采购日期" prop="purchaseDate" :show-overflow-tooltip="true">
|
|
|
+ <el-table-column
|
|
|
+ label="采购日期"
|
|
|
+ prop="purchaseDate"
|
|
|
+ :show-overflow-tooltip="true"
|
|
|
+ >
|
|
|
</el-table-column>
|
|
|
</el-table>
|
|
|
</div>
|
|
|
<div class="mt20">
|
|
|
<header-title :title="`物料明细`" size="16px"> </header-title>
|
|
|
- <el-table ref="multipleTable" :data="showMaterialList" tooltip-effect="dark" :max-height="300"
|
|
|
- :row-class-name="tableRowClassName" :header-cell-style="rowClass" border style="width: 100%" stripe
|
|
|
- height="300px" v-el-table-infinite-scroll="materielHandleScroll">
|
|
|
+ <el-table
|
|
|
+ ref="multipleTable"
|
|
|
+ :data="showMaterialList"
|
|
|
+ tooltip-effect="dark"
|
|
|
+ :max-height="300"
|
|
|
+ :row-class-name="tableRowClassName"
|
|
|
+ :header-cell-style="rowClass"
|
|
|
+ border
|
|
|
+ style="width: 100%"
|
|
|
+ stripe
|
|
|
+ height="300px"
|
|
|
+ v-el-table-infinite-scroll="materielHandleScroll"
|
|
|
+ >
|
|
|
<el-table-column label="序号" type="index" width="50">
|
|
|
</el-table-column>
|
|
|
- <el-table-column label="编码" prop="categoryCode" :show-overflow-tooltip="true"></el-table-column>
|
|
|
- <el-table-column label="名称" prop="categoryName" :show-overflow-tooltip="true"></el-table-column>
|
|
|
+ <el-table-column
|
|
|
+ label="编码"
|
|
|
+ prop="categoryCode"
|
|
|
+ :show-overflow-tooltip="true"
|
|
|
+ ></el-table-column>
|
|
|
+ <el-table-column
|
|
|
+ label="名称"
|
|
|
+ prop="categoryName"
|
|
|
+ :show-overflow-tooltip="true"
|
|
|
+ ></el-table-column>
|
|
|
<el-table-column label="批次号" prop="batchNo"></el-table-column>
|
|
|
- <el-table-column label="物料编码" prop="materialCode" :show-overflow-tooltip="true"></el-table-column>
|
|
|
- <el-table-column label="发货条码" prop="barcodes" :show-overflow-tooltip="true"></el-table-column>
|
|
|
- <el-table-column label="计量数量" prop="measureQuantity"></el-table-column>
|
|
|
- <el-table-column label="计量单位" prop="measureUnit"></el-table-column>
|
|
|
+ <el-table-column
|
|
|
+ label="物料编码"
|
|
|
+ prop="materialCode"
|
|
|
+ :show-overflow-tooltip="true"
|
|
|
+ ></el-table-column>
|
|
|
+ <el-table-column
|
|
|
+ label="发货条码"
|
|
|
+ prop="barcodes"
|
|
|
+ :show-overflow-tooltip="true"
|
|
|
+ ></el-table-column>
|
|
|
+ <el-table-column
|
|
|
+ label="计量数量"
|
|
|
+ prop="measureQuantity"
|
|
|
+ ></el-table-column>
|
|
|
+ <el-table-column
|
|
|
+ label="计量单位"
|
|
|
+ prop="measureUnit"
|
|
|
+ ></el-table-column>
|
|
|
<el-table-column label="物料代号" prop="materielDesignation">
|
|
|
</el-table-column>
|
|
|
<el-table-column label="客户代号" prop="clientCode">
|
|
|
@@ -238,477 +437,489 @@
|
|
|
</template>
|
|
|
|
|
|
<script>
|
|
|
-import elTableInfiniteScroll from 'el-table-infinite-scroll';
|
|
|
-import { getFile } from '@/api/system/file/index.js';
|
|
|
-import PageHeader from '@/components/PageHeader';
|
|
|
-import storageApi from '@/api/warehouseManagement';
|
|
|
-import { allCategoryLevel } from '@/api/classifyManage';
|
|
|
-import { useDictLabel, outputSceneState, qualityStatus, qualityResults } from '@/utils/dict/index';
|
|
|
-import { mapGetters, mapActions } from 'vuex';
|
|
|
-
|
|
|
-
|
|
|
-export default {
|
|
|
- components: { PageHeader },
|
|
|
- directives: {
|
|
|
- 'el-table-infinite-scroll': elTableInfiniteScroll
|
|
|
- },
|
|
|
- data() {
|
|
|
- return {
|
|
|
- newColumns: [], // 动态表头
|
|
|
- // qualityStatus: {
|
|
|
- // 0: '未质检',
|
|
|
- // 1: '已质检'
|
|
|
- // }, // 质检状态 0未检 1已检
|
|
|
- // qualityResults: {
|
|
|
- // 1: '合格',
|
|
|
- // 2: '不合格'
|
|
|
- // }, // 质检结果 1合格 2不合格
|
|
|
- qualityStatus,
|
|
|
- qualityResults,
|
|
|
- productList: [], // 产品列表
|
|
|
- showPackingList: [], // 展示的包装列表
|
|
|
- packingList: [], // 包装列表
|
|
|
- showMaterialList: [], // 展示物料列表
|
|
|
- materialList: [], // 物料列表
|
|
|
- extInfo: {}, // 扩展信息
|
|
|
- pageSize: 20,
|
|
|
- pickingPageNum: 1,
|
|
|
- materielPageNum: 1,
|
|
|
- codeList: [],
|
|
|
- infoData: {},
|
|
|
- stepsTitle: '已完成',
|
|
|
- stepsStatus: 'success',
|
|
|
- active: 0
|
|
|
- };
|
|
|
- },
|
|
|
- watch: {
|
|
|
- 'infoData.verifyStatus': {
|
|
|
- immediate: true,
|
|
|
- handler(val) {
|
|
|
- if (val == 0) {
|
|
|
- this.active = 1;
|
|
|
- this.stepsTitle = '未审核';
|
|
|
- this.stepsStatus = 'wait';
|
|
|
- } else if (val == 1) {
|
|
|
- this.active = 2;
|
|
|
- this.stepsTitle = '审核中';
|
|
|
- this.stepsStatus = 'process';
|
|
|
- } else if (val == 2) {
|
|
|
- this.active = 2;
|
|
|
- this.stepsTitle = '审核通过';
|
|
|
- this.stepsStatus = 'success';
|
|
|
- } else if (val == 3) {
|
|
|
- this.active = 2;
|
|
|
- this.stepsTitle = '驳回';
|
|
|
- this.stepsStatus = 'error';
|
|
|
- }
|
|
|
- }
|
|
|
- },
|
|
|
- packingList: {
|
|
|
- handler(newVal) {
|
|
|
- console.log('包装列表', newVal);
|
|
|
- console.log('当前包装列表加载页数', this.pickingPageNum);
|
|
|
- this.showPackingList = newVal.slice(
|
|
|
- 0,
|
|
|
- this.pageSize * (this.pickingPageNum > 0 ? this.pickingPageNum : 1)
|
|
|
- );
|
|
|
- },
|
|
|
- deep: true
|
|
|
- },
|
|
|
- materialList: {
|
|
|
- handler(newVal) {
|
|
|
- console.log('物料列表', newVal);
|
|
|
- console.log('当前物料列表加载页数', this.materielPageNum);
|
|
|
- this.showMaterialList = newVal.slice(
|
|
|
- 0,
|
|
|
- this.pageSize *
|
|
|
- (this.materielPageNum > 0 ? this.materielPageNum : 1)
|
|
|
- );
|
|
|
- },
|
|
|
- deep: true
|
|
|
- }
|
|
|
- },
|
|
|
- computed: {
|
|
|
- ...mapGetters(['getDictValue']),
|
|
|
- clientEnvironmentId() {
|
|
|
- return this.$store.state.user.info.clientEnvironmentId;
|
|
|
- }
|
|
|
- },
|
|
|
- created() {
|
|
|
- this.getFieldModel();
|
|
|
- this.requestDict('类型用途');
|
|
|
- this.getAllCategoryType();
|
|
|
- this._getInfo();
|
|
|
- },
|
|
|
- methods: {
|
|
|
- // 获取动态表头
|
|
|
- getFieldModel() {
|
|
|
- storageApi.fieldModel({ fieldModel: 't_main_category' }).then((res) => {
|
|
|
- let newRes = res.map((m) => {
|
|
|
- return {
|
|
|
- prop: 'extField.' + m.prop,
|
|
|
- label: m.label,
|
|
|
- align: 'center',
|
|
|
- showOverflowTooltip: true
|
|
|
- };
|
|
|
- });
|
|
|
- this.newColumns = [...newRes];
|
|
|
- });
|
|
|
+ import elTableInfiniteScroll from 'el-table-infinite-scroll';
|
|
|
+ import { getFile } from '@/api/system/file/index.js';
|
|
|
+ import PageHeader from '@/components/PageHeader';
|
|
|
+ import storageApi from '@/api/warehouseManagement';
|
|
|
+ import { allCategoryLevel } from '@/api/classifyManage';
|
|
|
+ import {
|
|
|
+ useDictLabel,
|
|
|
+ outputSceneState,
|
|
|
+ qualityStatus,
|
|
|
+ qualityResults
|
|
|
+ } from '@/utils/dict/index';
|
|
|
+ import { mapGetters, mapActions } from 'vuex';
|
|
|
+ import { parameterGetByCode } from '@/api/sys/index.js';
|
|
|
+
|
|
|
+ export default {
|
|
|
+ components: { PageHeader },
|
|
|
+ directives: {
|
|
|
+ 'el-table-infinite-scroll': elTableInfiniteScroll
|
|
|
},
|
|
|
- pickingHandleScroll() {
|
|
|
- console.log('---------pickingHandleScroll------------');
|
|
|
- if (this.showPackingList.length < this.packingList.length) {
|
|
|
- if (this.packingList.length > this.pageSize) {
|
|
|
- this.pickingPageNum += 1;
|
|
|
- }
|
|
|
- this.pickingFetchData();
|
|
|
- }
|
|
|
- },
|
|
|
- pickingFetchData() {
|
|
|
- const start = (this.pickingPageNum - 1) * this.pageSize;
|
|
|
- const end = start + this.pageSize;
|
|
|
- this.showPackingList = this.showPackingList.concat(
|
|
|
- this.packingList.slice(start, end)
|
|
|
- );
|
|
|
+ data() {
|
|
|
+ return {
|
|
|
+ newColumns: [], // 动态表头
|
|
|
+ // qualityStatus: {
|
|
|
+ // 0: '未质检',
|
|
|
+ // 1: '已质检'
|
|
|
+ // }, // 质检状态 0未检 1已检
|
|
|
+ // qualityResults: {
|
|
|
+ // 1: '合格',
|
|
|
+ // 2: '不合格'
|
|
|
+ // }, // 质检结果 1合格 2不合格
|
|
|
+ qualityStatus,
|
|
|
+ qualityResults,
|
|
|
+ productList: [], // 产品列表
|
|
|
+ showPackingList: [], // 展示的包装列表
|
|
|
+ packingList: [], // 包装列表
|
|
|
+ showMaterialList: [], // 展示物料列表
|
|
|
+ materialList: [], // 物料列表
|
|
|
+ extInfo: {}, // 扩展信息
|
|
|
+ pageSize: 20,
|
|
|
+ pickingPageNum: 1,
|
|
|
+ materielPageNum: 1,
|
|
|
+ codeList: [],
|
|
|
+ infoData: {},
|
|
|
+ stepsTitle: '已完成',
|
|
|
+ stepsStatus: 'success',
|
|
|
+ active: 0,
|
|
|
+ isPrice: 1
|
|
|
+ };
|
|
|
},
|
|
|
- materielHandleScroll() {
|
|
|
- console.log('---------materielHandleScroll------------');
|
|
|
- if (this.showMaterialList.length < this.materialList.length) {
|
|
|
- if (this.materialList.length > this.pageSize) {
|
|
|
- this.materielPageNum += 1;
|
|
|
+ watch: {
|
|
|
+ 'infoData.verifyStatus': {
|
|
|
+ immediate: true,
|
|
|
+ handler(val) {
|
|
|
+ if (val == 0) {
|
|
|
+ this.active = 1;
|
|
|
+ this.stepsTitle = '未审核';
|
|
|
+ this.stepsStatus = 'wait';
|
|
|
+ } else if (val == 1) {
|
|
|
+ this.active = 2;
|
|
|
+ this.stepsTitle = '审核中';
|
|
|
+ this.stepsStatus = 'process';
|
|
|
+ } else if (val == 2) {
|
|
|
+ this.active = 2;
|
|
|
+ this.stepsTitle = '审核通过';
|
|
|
+ this.stepsStatus = 'success';
|
|
|
+ } else if (val == 3) {
|
|
|
+ this.active = 2;
|
|
|
+ this.stepsTitle = '驳回';
|
|
|
+ this.stepsStatus = 'error';
|
|
|
+ }
|
|
|
}
|
|
|
- this.materielFetchData();
|
|
|
- }
|
|
|
- },
|
|
|
- materielFetchData() {
|
|
|
- const start = (this.materielPageNum - 1) * this.pageSize;
|
|
|
- const end = start + this.pageSize;
|
|
|
- this.showMaterialList = this.showMaterialList.concat(
|
|
|
- this.materialList.slice(start, end)
|
|
|
- );
|
|
|
- console.log(this.showMaterialList);
|
|
|
- },
|
|
|
- ...mapActions('dict', ['requestDict']),
|
|
|
- getSceneState: useDictLabel(outputSceneState),
|
|
|
- handleAssetType(r) {
|
|
|
- const code = this.codeList.find((item) => item.dictCode == r);
|
|
|
- return code?.dictValue;
|
|
|
- },
|
|
|
- tableRowClassName({ row, rowIndex }) {
|
|
|
- console.log(row);
|
|
|
- if (row.result == 2) {
|
|
|
- return 'warning-row';
|
|
|
- } else {
|
|
|
- return '';
|
|
|
+ },
|
|
|
+ packingList: {
|
|
|
+ handler(newVal) {
|
|
|
+ console.log('包装列表', newVal);
|
|
|
+ console.log('当前包装列表加载页数', this.pickingPageNum);
|
|
|
+ this.showPackingList = newVal.slice(
|
|
|
+ 0,
|
|
|
+ this.pageSize * (this.pickingPageNum > 0 ? this.pickingPageNum : 1)
|
|
|
+ );
|
|
|
+ },
|
|
|
+ deep: true
|
|
|
+ },
|
|
|
+ materialList: {
|
|
|
+ handler(newVal) {
|
|
|
+ console.log('物料列表', newVal);
|
|
|
+ console.log('当前物料列表加载页数', this.materielPageNum);
|
|
|
+ this.showMaterialList = newVal.slice(
|
|
|
+ 0,
|
|
|
+ this.pageSize *
|
|
|
+ (this.materielPageNum > 0 ? this.materielPageNum : 1)
|
|
|
+ );
|
|
|
+ },
|
|
|
+ deep: true
|
|
|
}
|
|
|
},
|
|
|
- rowClass({ row, column, rowIndex, columnIndex }) {
|
|
|
- if (rowIndex === 1) {
|
|
|
- return {
|
|
|
- display: 'none',
|
|
|
- background: '#EEEEEE'
|
|
|
- };
|
|
|
+ computed: {
|
|
|
+ ...mapGetters(['getDictValue']),
|
|
|
+ clientEnvironmentId() {
|
|
|
+ return this.$store.state.user.info.clientEnvironmentId;
|
|
|
}
|
|
|
- return { background: '#0000' };
|
|
|
},
|
|
|
- async getAllCategoryType() {
|
|
|
- const { data } = await allCategoryLevel();
|
|
|
- this.codeList = data.map((item) => {
|
|
|
- return { dictCode: item.id, dictValue: item.name };
|
|
|
+ created() {
|
|
|
+ //仓库出入库是否显示金额（0：不显示 1：显示）
|
|
|
+ parameterGetByCode({
|
|
|
+ code: 'wms_price'
|
|
|
+ }).then((res) => {
|
|
|
+ this.isPrice = res.value;
|
|
|
});
|
|
|
+ this.getFieldModel();
|
|
|
+ this.requestDict('类型用途');
|
|
|
+ this.getAllCategoryType();
|
|
|
+ this._getInfo();
|
|
|
},
|
|
|
- getDeptName() {
|
|
|
- if (this.extInfo.createUserId) {
|
|
|
- storageApi.getGroupById(this.extInfo.createUserId).then((res) => {
|
|
|
- this.extInfo.deptName = res?.groupName
|
|
|
+ methods: {
|
|
|
+ // 获取动态表头
|
|
|
+ getFieldModel() {
|
|
|
+ storageApi.fieldModel({ fieldModel: 't_main_category' }).then((res) => {
|
|
|
+ let newRes = res.map((m) => {
|
|
|
+ return {
|
|
|
+ prop: 'extField.' + m.prop,
|
|
|
+ label: m.label,
|
|
|
+ align: 'center',
|
|
|
+ showOverflowTooltip: true
|
|
|
+ };
|
|
|
+ });
|
|
|
+ this.newColumns = [...newRes];
|
|
|
});
|
|
|
- }
|
|
|
- },
|
|
|
- async _getInfo() {
|
|
|
- let res = null;
|
|
|
- if (this.$route.query.id) {
|
|
|
- res = await storageApi.getInboundDetailsById(this.$route.query.id);
|
|
|
- } else {
|
|
|
- res = await storageApi.getInboundDetailsByBizNo(
|
|
|
- this.$route.query.bizNo
|
|
|
+ },
|
|
|
+ pickingHandleScroll() {
|
|
|
+ console.log('---------pickingHandleScroll------------');
|
|
|
+ if (this.showPackingList.length < this.packingList.length) {
|
|
|
+ if (this.packingList.length > this.pageSize) {
|
|
|
+ this.pickingPageNum += 1;
|
|
|
+ }
|
|
|
+ this.pickingFetchData();
|
|
|
+ }
|
|
|
+ },
|
|
|
+ pickingFetchData() {
|
|
|
+ const start = (this.pickingPageNum - 1) * this.pageSize;
|
|
|
+ const end = start + this.pageSize;
|
|
|
+ this.showPackingList = this.showPackingList.concat(
|
|
|
+ this.packingList.slice(start, end)
|
|
|
);
|
|
|
- }
|
|
|
- this.infoData = res;
|
|
|
- this.extInfo = res.extInfo;
|
|
|
- this.getDeptName()
|
|
|
- this.productList = res.outInDetailList.map(
|
|
|
- (productItem, productIndex) => {
|
|
|
+ },
|
|
|
+ materielHandleScroll() {
|
|
|
+ console.log('---------materielHandleScroll------------');
|
|
|
+ if (this.showMaterialList.length < this.materialList.length) {
|
|
|
+ if (this.materialList.length > this.pageSize) {
|
|
|
+ this.materielPageNum += 1;
|
|
|
+ }
|
|
|
+ this.materielFetchData();
|
|
|
+ }
|
|
|
+ },
|
|
|
+ materielFetchData() {
|
|
|
+ const start = (this.materielPageNum - 1) * this.pageSize;
|
|
|
+ const end = start + this.pageSize;
|
|
|
+ this.showMaterialList = this.showMaterialList.concat(
|
|
|
+ this.materialList.slice(start, end)
|
|
|
+ );
|
|
|
+ console.log(this.showMaterialList);
|
|
|
+ },
|
|
|
+ ...mapActions('dict', ['requestDict']),
|
|
|
+ getSceneState: useDictLabel(outputSceneState),
|
|
|
+ handleAssetType(r) {
|
|
|
+ const code = this.codeList.find((item) => item.dictCode == r);
|
|
|
+ return code?.dictValue;
|
|
|
+ },
|
|
|
+ tableRowClassName({ row, rowIndex }) {
|
|
|
+ console.log(row);
|
|
|
+ if (row.result == 2) {
|
|
|
+ return 'warning-row';
|
|
|
+ } else {
|
|
|
+ return '';
|
|
|
+ }
|
|
|
+ },
|
|
|
+ rowClass({ row, column, rowIndex, columnIndex }) {
|
|
|
+ if (rowIndex === 1) {
|
|
|
return {
|
|
|
- ...productItem,
|
|
|
- outInDetailRecordRequestList:
|
|
|
- productItem.outInDetailRecordRequestList.map((packingItem) => {
|
|
|
- return {
|
|
|
- ...packingItem,
|
|
|
- categoryName: productItem.categoryName,
|
|
|
- categoryCode: productItem.categoryCode,
|
|
|
- materialDetailList: packingItem.materialDetailList.map(
|
|
|
- (materialItem) => {
|
|
|
- return {
|
|
|
- ...materialItem,
|
|
|
- categoryName: productItem.categoryName,
|
|
|
- categoryCode: productItem.categoryCode
|
|
|
- };
|
|
|
- }
|
|
|
- )
|
|
|
- };
|
|
|
- })
|
|
|
+ display: 'none',
|
|
|
+ background: '#EEEEEE'
|
|
|
};
|
|
|
}
|
|
|
- );
|
|
|
- // 获取包装维度数据
|
|
|
- const arr = [];
|
|
|
- for (const key in this.productList) {
|
|
|
- for (const k in this.productList[key].outInDetailRecordRequestList) {
|
|
|
- arr.push({
|
|
|
- ...this.productList[key].outInDetailRecordRequestList[k]
|
|
|
+ return { background: '#0000' };
|
|
|
+ },
|
|
|
+ async getAllCategoryType() {
|
|
|
+ const { data } = await allCategoryLevel();
|
|
|
+ this.codeList = data.map((item) => {
|
|
|
+ return { dictCode: item.id, dictValue: item.name };
|
|
|
+ });
|
|
|
+ },
|
|
|
+ getDeptName() {
|
|
|
+ if (this.extInfo.createUserId) {
|
|
|
+ storageApi.getGroupById(this.extInfo.createUserId).then((res) => {
|
|
|
+ this.extInfo.deptName = res?.groupName;
|
|
|
});
|
|
|
}
|
|
|
- }
|
|
|
- this.packingList = arr;
|
|
|
- // 获取物料维度数据
|
|
|
- let iArr = [];
|
|
|
- arr.forEach((item) => {
|
|
|
- item.materialDetailList.forEach((ele) => {
|
|
|
- iArr.push({ ...ele });
|
|
|
+ },
|
|
|
+ async _getInfo() {
|
|
|
+ let res = null;
|
|
|
+ if (this.$route.query.id) {
|
|
|
+ res = await storageApi.getInboundDetailsById(this.$route.query.id);
|
|
|
+ } else {
|
|
|
+ res = await storageApi.getInboundDetailsByBizNo(
|
|
|
+ this.$route.query.bizNo
|
|
|
+ );
|
|
|
+ }
|
|
|
+ this.infoData = res;
|
|
|
+ this.extInfo = res.extInfo;
|
|
|
+ this.getDeptName();
|
|
|
+ this.productList = res.outInDetailList.map(
|
|
|
+ (productItem, productIndex) => {
|
|
|
+ return {
|
|
|
+ ...productItem,
|
|
|
+ outInDetailRecordRequestList:
|
|
|
+ productItem.outInDetailRecordRequestList.map((packingItem) => {
|
|
|
+ return {
|
|
|
+ ...packingItem,
|
|
|
+ categoryName: productItem.categoryName,
|
|
|
+ categoryCode: productItem.categoryCode,
|
|
|
+ materialDetailList: packingItem.materialDetailList.map(
|
|
|
+ (materialItem) => {
|
|
|
+ return {
|
|
|
+ ...materialItem,
|
|
|
+ categoryName: productItem.categoryName,
|
|
|
+ categoryCode: productItem.categoryCode
|
|
|
+ };
|
|
|
+ }
|
|
|
+ )
|
|
|
+ };
|
|
|
+ })
|
|
|
+ };
|
|
|
+ }
|
|
|
+ );
|
|
|
+ // 获取包装维度数据
|
|
|
+ const arr = [];
|
|
|
+ for (const key in this.productList) {
|
|
|
+ for (const k in this.productList[key].outInDetailRecordRequestList) {
|
|
|
+ arr.push({
|
|
|
+ ...this.productList[key].outInDetailRecordRequestList[k]
|
|
|
+ });
|
|
|
+ }
|
|
|
+ }
|
|
|
+ this.packingList = arr;
|
|
|
+ // 获取物料维度数据
|
|
|
+ let iArr = [];
|
|
|
+ arr.forEach((item) => {
|
|
|
+ item.materialDetailList.forEach((ele) => {
|
|
|
+ iArr.push({ ...ele });
|
|
|
+ });
|
|
|
});
|
|
|
- });
|
|
|
- this.materialList = iArr;
|
|
|
- console.log(this.packingList);
|
|
|
- console.log(this.materialList);
|
|
|
- this.pickingFetchData();
|
|
|
- this.materielFetchData();
|
|
|
- },
|
|
|
- download(row) {
|
|
|
- if (row.storePath) {
|
|
|
- getFile({ objectName: row.storePath }, row.name);
|
|
|
+ this.materialList = iArr;
|
|
|
+ console.log(this.packingList);
|
|
|
+ console.log(this.materialList);
|
|
|
+ this.pickingFetchData();
|
|
|
+ this.materielFetchData();
|
|
|
+ },
|
|
|
+ download(row) {
|
|
|
+ if (row.storePath) {
|
|
|
+ getFile({ objectName: row.storePath }, row.name);
|
|
|
+ }
|
|
|
}
|
|
|
}
|
|
|
- }
|
|
|
-};
|
|
|
+ };
|
|
|
</script>
|
|
|
|
|
|
<style lang="scss" scoped>
|
|
|
-.stepsStatus {
|
|
|
- width: 40%;
|
|
|
- margin: 0 auto;
|
|
|
-}
|
|
|
-
|
|
|
-.p20 {
|
|
|
- padding: 20px;
|
|
|
-}
|
|
|
-
|
|
|
-.flex {
|
|
|
- display: flex;
|
|
|
-}
|
|
|
-
|
|
|
-.title {
|
|
|
- justify-content: space-between;
|
|
|
- border-bottom: 1px solid #ccc;
|
|
|
- padding-bottom: 5px;
|
|
|
-
|
|
|
- span {
|
|
|
- font-size: 16px;
|
|
|
+ .stepsStatus {
|
|
|
+ width: 40%;
|
|
|
+ margin: 0 auto;
|
|
|
}
|
|
|
|
|
|
- .col {
|
|
|
- padding-left: 40px;
|
|
|
- font-size: 14px;
|
|
|
- color: #aaaaaa;
|
|
|
- }
|
|
|
-}
|
|
|
-
|
|
|
-.degree {
|
|
|
- margin-right: 10px;
|
|
|
- padding: 0px 15px;
|
|
|
- color: #fff;
|
|
|
- font-size: 13px;
|
|
|
- line-height: 23px;
|
|
|
- border-radius: 23px;
|
|
|
- display: flex;
|
|
|
- align-items: center;
|
|
|
- justify-content: space-between;
|
|
|
-
|
|
|
- span {
|
|
|
- width: 5px;
|
|
|
- height: 5px;
|
|
|
- border-radius: 100%;
|
|
|
- margin-right: 6px;
|
|
|
- background-color: #fff;
|
|
|
+ .p20 {
|
|
|
+ padding: 20px;
|
|
|
}
|
|
|
-}
|
|
|
-
|
|
|
-.red {
|
|
|
- background-color: rgb(163, 0, 20);
|
|
|
-}
|
|
|
|
|
|
-.blue {
|
|
|
- background-color: #1989fa;
|
|
|
-}
|
|
|
+ .flex {
|
|
|
+ display: flex;
|
|
|
+ }
|
|
|
|
|
|
-.createdInfo {
|
|
|
- justify-content: space-around;
|
|
|
- margin-top: 10px;
|
|
|
- font-size: 14px;
|
|
|
+ .title {
|
|
|
+ justify-content: space-between;
|
|
|
+ border-bottom: 1px solid #ccc;
|
|
|
+ padding-bottom: 5px;
|
|
|
|
|
|
- .col {
|
|
|
- color: #6e6e6e;
|
|
|
- padding-right: 10px;
|
|
|
- }
|
|
|
-}
|
|
|
-
|
|
|
-.mt40 {
|
|
|
- margin-top: 40px;
|
|
|
-}
|
|
|
-
|
|
|
-.custSteps {
|
|
|
- margin-top: 20px;
|
|
|
- margin-left: 70px;
|
|
|
-
|
|
|
- .box {
|
|
|
- width: 158px;
|
|
|
- border: 1px solid #ccc;
|
|
|
- padding: 10px;
|
|
|
- flex-direction: row;
|
|
|
- flex-wrap: wrap;
|
|
|
- // justify-content: space-between;
|
|
|
- font-size: 12px;
|
|
|
- color: #9e9e9e;
|
|
|
-
|
|
|
- .x {
|
|
|
- width: 20px;
|
|
|
- height: 15px;
|
|
|
- margin-right: 5px;
|
|
|
+ span {
|
|
|
+ font-size: 16px;
|
|
|
}
|
|
|
|
|
|
- .q {
|
|
|
- background-color: #d0e4d5;
|
|
|
+ .col {
|
|
|
+ padding-left: 40px;
|
|
|
+ font-size: 14px;
|
|
|
+ color: #aaaaaa;
|
|
|
}
|
|
|
+ }
|
|
|
|
|
|
- .b {
|
|
|
- background-color: #1989fa;
|
|
|
- }
|
|
|
+ .degree {
|
|
|
+ margin-right: 10px;
|
|
|
+ padding: 0px 15px;
|
|
|
+ color: #fff;
|
|
|
+ font-size: 13px;
|
|
|
+ line-height: 23px;
|
|
|
+ border-radius: 23px;
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ justify-content: space-between;
|
|
|
|
|
|
- .g {
|
|
|
- background-color: #157a2c;
|
|
|
+ span {
|
|
|
+ width: 5px;
|
|
|
+ height: 5px;
|
|
|
+ border-radius: 100%;
|
|
|
+ margin-right: 6px;
|
|
|
+ background-color: #fff;
|
|
|
}
|
|
|
+ }
|
|
|
|
|
|
- .r {
|
|
|
- background-color: #a30014;
|
|
|
- }
|
|
|
+ .red {
|
|
|
+ background-color: rgb(163, 0, 20);
|
|
|
+ }
|
|
|
|
|
|
- .a {
|
|
|
- align-items: center;
|
|
|
- margin-bottom: 10px;
|
|
|
- }
|
|
|
+ .blue {
|
|
|
+ background-color: #1989fa;
|
|
|
+ }
|
|
|
|
|
|
- .mr10 {
|
|
|
- margin-right: 10px;
|
|
|
- }
|
|
|
+ .createdInfo {
|
|
|
+ justify-content: space-around;
|
|
|
+ margin-top: 10px;
|
|
|
+ font-size: 14px;
|
|
|
|
|
|
- .mb0 {
|
|
|
- margin-bottom: 0;
|
|
|
+ .col {
|
|
|
+ color: #6e6e6e;
|
|
|
+ padding-right: 10px;
|
|
|
}
|
|
|
}
|
|
|
|
|
|
- .stepsInfo {
|
|
|
- // flex: 1;
|
|
|
- width: 483px;
|
|
|
+ .mt40 {
|
|
|
+ margin-top: 40px;
|
|
|
}
|
|
|
-}
|
|
|
|
|
|
-.mt20 {
|
|
|
- margin-top: 20px;
|
|
|
-}
|
|
|
+ .custSteps {
|
|
|
+ margin-top: 20px;
|
|
|
+ margin-left: 70px;
|
|
|
+
|
|
|
+ .box {
|
|
|
+ width: 158px;
|
|
|
+ border: 1px solid #ccc;
|
|
|
+ padding: 10px;
|
|
|
+ flex-direction: row;
|
|
|
+ flex-wrap: wrap;
|
|
|
+ // justify-content: space-between;
|
|
|
+ font-size: 12px;
|
|
|
+ color: #9e9e9e;
|
|
|
+
|
|
|
+ .x {
|
|
|
+ width: 20px;
|
|
|
+ height: 15px;
|
|
|
+ margin-right: 5px;
|
|
|
+ }
|
|
|
+
|
|
|
+ .q {
|
|
|
+ background-color: #d0e4d5;
|
|
|
+ }
|
|
|
|
|
|
-.content-detail {
|
|
|
- overflow: hidden;
|
|
|
-}
|
|
|
+ .b {
|
|
|
+ background-color: #1989fa;
|
|
|
+ }
|
|
|
|
|
|
-.executor {
|
|
|
- font-size: 14px;
|
|
|
+ .g {
|
|
|
+ background-color: #157a2c;
|
|
|
+ }
|
|
|
|
|
|
- .col {
|
|
|
- color: #6e6e6e;
|
|
|
- padding-right: 10px;
|
|
|
+ .r {
|
|
|
+ background-color: #a30014;
|
|
|
+ }
|
|
|
+
|
|
|
+ .a {
|
|
|
+ align-items: center;
|
|
|
+ margin-bottom: 10px;
|
|
|
+ }
|
|
|
+
|
|
|
+ .mr10 {
|
|
|
+ margin-right: 10px;
|
|
|
+ }
|
|
|
+
|
|
|
+ .mb0 {
|
|
|
+ margin-bottom: 0;
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ .stepsInfo {
|
|
|
+ // flex: 1;
|
|
|
+ width: 483px;
|
|
|
+ }
|
|
|
}
|
|
|
-}
|
|
|
|
|
|
-.result {
|
|
|
- justify-content: space-around;
|
|
|
-}
|
|
|
+ .mt20 {
|
|
|
+ margin-top: 20px;
|
|
|
+ }
|
|
|
|
|
|
-.mr20 {
|
|
|
- margin-right: 20px;
|
|
|
-}
|
|
|
+ .content-detail {
|
|
|
+ overflow: hidden;
|
|
|
+ }
|
|
|
|
|
|
-.details {
|
|
|
- font-size: 14px;
|
|
|
- margin-bottom: 10px;
|
|
|
-}
|
|
|
+ .executor {
|
|
|
+ font-size: 14px;
|
|
|
|
|
|
-.customSteps {
|
|
|
- margin-top: 40px;
|
|
|
- font-size: 14px;
|
|
|
- margin-left: 80px;
|
|
|
+ .col {
|
|
|
+ color: #6e6e6e;
|
|
|
+ padding-right: 10px;
|
|
|
+ }
|
|
|
+ }
|
|
|
|
|
|
- .time {
|
|
|
- font-size: 12px;
|
|
|
- color: #6e6e6e;
|
|
|
+ .result {
|
|
|
+ justify-content: space-around;
|
|
|
+ }
|
|
|
+
|
|
|
+ .mr20 {
|
|
|
margin-right: 20px;
|
|
|
- position: relative;
|
|
|
+ }
|
|
|
|
|
|
- &::after {
|
|
|
- content: '';
|
|
|
- width: 1px;
|
|
|
- height: 100%;
|
|
|
- background-color: #157a2c;
|
|
|
- position: absolute;
|
|
|
- right: -26px;
|
|
|
- }
|
|
|
+ .details {
|
|
|
+ font-size: 14px;
|
|
|
+ margin-bottom: 10px;
|
|
|
}
|
|
|
|
|
|
- .flex:last-child {
|
|
|
+ .customSteps {
|
|
|
+ margin-top: 40px;
|
|
|
+ font-size: 14px;
|
|
|
+ margin-left: 80px;
|
|
|
+
|
|
|
.time {
|
|
|
+ font-size: 12px;
|
|
|
+ color: #6e6e6e;
|
|
|
+ margin-right: 20px;
|
|
|
+ position: relative;
|
|
|
+
|
|
|
&::after {
|
|
|
- display: none;
|
|
|
+ content: '';
|
|
|
+ width: 1px;
|
|
|
+ height: 100%;
|
|
|
+ background-color: #157a2c;
|
|
|
+ position: absolute;
|
|
|
+ right: -26px;
|
|
|
}
|
|
|
}
|
|
|
- }
|
|
|
|
|
|
- .round {
|
|
|
- margin-right: 20px;
|
|
|
- width: 10px;
|
|
|
- height: 10px;
|
|
|
- border-radius: 100%;
|
|
|
- background-color: #157a2c;
|
|
|
- position: relative;
|
|
|
+ .flex:last-child {
|
|
|
+ .time {
|
|
|
+ &::after {
|
|
|
+ display: none;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
|
|
|
- span {
|
|
|
- position: absolute;
|
|
|
- top: 50%;
|
|
|
- left: 50%;
|
|
|
- width: 4px;
|
|
|
- height: 4px;
|
|
|
- background-color: #fff;
|
|
|
+ .round {
|
|
|
+ margin-right: 20px;
|
|
|
+ width: 10px;
|
|
|
+ height: 10px;
|
|
|
border-radius: 100%;
|
|
|
- transform: translate(-2px, -2px);
|
|
|
+ background-color: #157a2c;
|
|
|
+ position: relative;
|
|
|
+
|
|
|
+ span {
|
|
|
+ position: absolute;
|
|
|
+ top: 50%;
|
|
|
+ left: 50%;
|
|
|
+ width: 4px;
|
|
|
+ height: 4px;
|
|
|
+ background-color: #fff;
|
|
|
+ border-radius: 100%;
|
|
|
+ transform: translate(-2px, -2px);
|
|
|
+ }
|
|
|
}
|
|
|
- }
|
|
|
|
|
|
- .text {
|
|
|
- .info {
|
|
|
- margin-top: 10px;
|
|
|
- width: 955px;
|
|
|
- background-color: #f0f3f3;
|
|
|
- overflow: hidden;
|
|
|
- padding: 10px;
|
|
|
- margin-bottom: 10px;
|
|
|
+ .text {
|
|
|
+ .info {
|
|
|
+ margin-top: 10px;
|
|
|
+ width: 955px;
|
|
|
+ background-color: #f0f3f3;
|
|
|
+ overflow: hidden;
|
|
|
+ padding: 10px;
|
|
|
+ margin-bottom: 10px;
|
|
|
+ }
|
|
|
}
|
|
|
}
|
|
|
-}
|
|
|
</style>
|
yusheng