| | |
| | | Vue.prototype.HaveJson = (val) => { |
| | | return JSON.parse(JSON.stringify(val)); |
| | | }; |
| | | Vue.prototype.javaApi = "http://192.168.21.53:7002/lims"; |
| | | Vue.prototype.javaApi = process.env.NODE_ENV === "production"?"http://192.168.21.53:7002/lims":"http://127.0.0.1:7002"; |
| | | Vue.prototype.checkPermi = checkPermi; |
| | | Vue.prototype.uploadHeader = { |
| | | Authorization: "Bearer " + getToken(), |
| | |
| | | <el-input v-model="addObj.entrustCode" clearable disabled placeholder="系统生成" size="small"></el-input> |
| | | </el-form-item> |
| | | </el-col> |
| | | <el-row> |
| | | <el-col :span="6"> |
| | | <el-form-item label="新增批号:" prop="updateBatchNo"> |
| | | <el-input v-model="addObj.updateBatchNo" clearable placeholder="请输入新增批号" size="small"> |
| | | </el-input> |
| | | </el-form-item> |
| | | </el-col> |
| | | |
| | | <el-col :span="6"> |
| | | <el-form-item label="零件描述:" prop="partDesc"> |
| | | <el-input v-model="addObj.partDesc" clearable placeholder="请输入零件描述" size="small"> |
| | | </el-input> |
| | | </el-form-item> |
| | | </el-col> |
| | | |
| | | <el-col :span="6"> |
| | | <el-form-item label="供应商名称:" prop="supplierName"> |
| | | <el-input v-model="addObj.supplierName" clearable placeholder="请输入供应商名称" size="small"> |
| | | </el-input> |
| | | </el-form-item> |
| | | </el-col> |
| | | </el-row> |
| | | <el-col :span="6"> |
| | | <el-form-item label="检验类别:" prop="orderType"> |
| | | <el-select v-model="addObj.orderType" :disabled="active>1&&tabIndex!=4" clearable size="small" style="width: 100%;"> |
| | |
| | | <el-button slot="append" :disabled="active>1&&tabIndex!=4" icon="el-icon-search" |
| | | @click="openCompanyList"></el-button> |
| | | </template> |
| | | </el-input> |
| | | </el-form-item> |
| | | </el-col> |
| | | </el-row> |
| | | <el-row> |
| | | <el-col :span="6"> |
| | | <el-form-item label="IFS域:" prop="contract"> |
| | | <el-select v-model="addObj.contract" clearable placeholder="请选择" size="small"> |
| | | <el-option label="ZTNS" value="ZTNS"/> |
| | | <el-option label="KJNS" value="KJNS"/> |
| | | </el-select> |
| | | </el-form-item> |
| | | </el-col> |
| | | <el-col :span="6"> |
| | | <el-form-item label="批次号:" prop="updateBatchNo"> |
| | | <el-input v-model="addObj.updateBatchNo" clearable placeholder="请输入批次号" size="small"> |
| | | </el-input> |
| | | </el-form-item> |
| | | </el-col> |
| | | <el-col :span="6"> |
| | | <el-form-item label="零件描述:" prop="partDesc"> |
| | | <el-input v-model="addObj.partDesc" clearable placeholder="请输入零件描述" size="small"> |
| | | </el-input> |
| | | </el-form-item> |
| | | </el-col> |
| | | <el-col :span="6"> |
| | | <el-form-item label="供应商名称:" prop="supplierName"> |
| | | <el-input v-model="addObj.supplierName" clearable placeholder="请输入供应商名称" size="small"> |
| | | </el-input> |
| | | </el-form-item> |
| | | </el-col> |
| | |
| | | templates: [], |
| | | addObj: { |
| | | entrustCode: null, |
| | | updateBatchNo: null, |
| | | partDesc: null, |
| | | supplierName: null, |
| | | contract:null, |
| | | updateBatchNo: null, |
| | | partDesc: null, |
| | | supplierName: null, |
| | | custom: null, |
| | | company: null, |
| | | userId: null, |
| | |
| | | sampleViewEn: '', // 样品名称英文(报告展示字段) |
| | | }, |
| | | addObjRules: { // 表单校验规则 |
| | | contract: [ |
| | | { required: true, message: '请选择IFS域', trigger: 'change' } |
| | | ], |
| | | orderType: [ |
| | | { required: true, message: '请选择检验类别', trigger: 'change' } |
| | | ], |
| | |
| | | </el-row> |
| | | <el-row> |
| | | <el-col :span="6"> |
| | | <el-form-item label="IFS域:" prop="contract"> |
| | | <el-select :disabled="active>1&&tabIndex!=4" v-model="addObj.contract" clearable placeholder="请选择" size="small"> |
| | | <el-option label="ZTNS" value="ZTNS"/> |
| | | <el-option label="KJNS" value="KJNS"/> |
| | | </el-select> |
| | | </el-form-item> |
| | | </el-col> |
| | | <el-col :span="6"> |
| | | <el-form-item label="批次号:" prop="updateBatchNo"> |
| | | <el-input :disabled="active>1&&tabIndex!=4" v-model="addObj.updateBatchNo" clearable placeholder="请输入批次号" size="small"> |
| | | </el-input> |
| | | </el-form-item> |
| | | </el-col> |
| | | <el-col :span="6"> |
| | | <el-form-item label="零件描述:" prop="partDesc"> |
| | | <el-input :disabled="active>1&&tabIndex!=4" v-model="addObj.partDesc" clearable placeholder="请输入零件描述" size="small"> |
| | | </el-input> |
| | | </el-form-item> |
| | | </el-col> |
| | | <el-col :span="6"> |
| | | <el-form-item label="供应商名称:" prop="supplierName"> |
| | | <el-input :disabled="active>1&&tabIndex!=4" v-model="addObj.supplierName" clearable placeholder="请输入供应商名称" size="small"> |
| | | </el-input> |
| | | </el-form-item> |
| | | </el-col> |
| | | </el-row> |
| | | <el-row> |
| | | <el-col :span="6"> |
| | | <el-form-item label="联系方式:" prop="phone"> |
| | | <el-input v-model="addObj.phone" :disabled="active>1&&tabIndex!=4" clearable placeholder="选择委托客户" size="small"></el-input> |
| | | </el-form-item> |
| | |
| | | <template> |
| | | <div> |
| | | <el-dialog :close-on-press-escape="false" :visible.sync="isShow" title="不合格处理" |
| | | width="1040px" |
| | | @close="$emit('closeOAProcess')"> |
| | | |
| | | <table :border='true' class="table"> |
| | | <tr> |
| | | <th class="th-title">1检验员</th> |
| | | <th class="th-titleSec">处理结果</th> |
| | | <th class="th-info1">{{oneOperation}}</th> |
| | | <th class="th-titleSec">处理意见</th> |
| | | <th class="th-info" colspan="3">{{oneInfo}}</th> |
| | | <th style="display:none;"></th> |
| | | <th style="display:none;"></th> |
| | | <th >{{oneName}}<span v-if="oneName">:</span>{{oneTime}}</th> |
| | | </tr> |
| | | <tr> |
| | | <th class="th-title">2检测主管确认</th> |
| | | <th class="th-titleSec">处理结果</th> |
| | | <th class="th-info1">{{twoOperation}}</th> |
| | | <th class="th-titleSec">处理意见</th> |
| | | <th class="th-info" colspan="3">{{twoInfo}}</th> |
| | | <th style="display:none;"></th> |
| | | <th style="display:none;"></th> |
| | | <th >{{twoName}}<span v-if="twoName">:</span>{{twoTime}}</th> |
| | | </tr> |
| | | <tr> |
| | | <th class="th-title">3物流部确认</th> |
| | | <th class="th-titleSec">处理结果</th> |
| | | <th class="th-info1">{{threeOperation}}</th> |
| | | <th class="th-titleSec">处理意见</th> |
| | | <th class="th-info" colspan="3">{{threeInfo}}</th> |
| | | <th style="display:none;"></th> |
| | | <th style="display:none;"></th> |
| | | <th >{{threeName}}<span v-if="threeName">:</span>{{threeTime}}</th> |
| | | </tr> |
| | | <tr> |
| | | <th class="th-title">4产品工程师处理意见</th> |
| | | <th class="th-titleSec">处理结果</th> |
| | | <th class="th-info1">{{fourOperation}}</th> |
| | | <th class="th-titleSec">处理意见</th> |
| | | <th class="th-info" colspan="3">{{fourInfo}}</th> |
| | | <th style="display:none;"></th> |
| | | <th style="display:none;"></th> |
| | | <th >{{fourName}}<span v-if="fourName">:</span>{{fourTime}}</th> |
| | | </tr> |
| | | <tr> |
| | | <th class="th-title">5.总工或者副经理的处理意见</th> |
| | | <th class="th-titleSec">处理结果</th> |
| | | <th class="th-info1">{{fiveOperation}}</th> |
| | | <th class="th-titleSec">处理意见</th> |
| | | <th class="th-info" colspan="3">{{fiveInfo}}</th> |
| | | <th style="display:none;"></th> |
| | | <th style="display:none;"></th> |
| | | <th >{{fiveName}}<span v-if="fiveName">:</span>{{fiveTime}}</th> |
| | | </tr> |
| | | <tr> |
| | | <th class="th-title">6质量部</th> |
| | | <th class="th-titleSec">处理结果</th> |
| | | <th class="th-info1">{{sixOperation}}</th> |
| | | <th class="th-titleSec">处理意见</th> |
| | | <th class="th-info" colspan="3">{{sixInfo}}</th> |
| | | <th style="display:none;"></th> |
| | | <th style="display:none;"></th> |
| | | <th >{{sixName}}<span v-if="sixName">:</span>{{sixTime}}</th> |
| | | </tr> |
| | | <tr> |
| | | <th class="th-title">7质量部经理</th> |
| | | <th class="th-titleSec">处理结果</th> |
| | | <th class="th-info1">{{sevenOperation}}</th> |
| | | <th class="th-titleSec">处理意见</th> |
| | | <th class="th-info" colspan="3">{{sevenInfo}}</th> |
| | | <th style="display:none;"></th> |
| | | <th style="display:none;"></th> |
| | | <th >{{sevenName}}<span v-if="sevenName">:</span>{{sevenTime}}</th> |
| | | </tr> |
| | | <tr> |
| | | <th class="th-title">8核算员</th> |
| | | <th class="th-titleSec">处理结果</th> |
| | | <th class="th-info1">{{eightOperation}}</th> |
| | | <th class="th-titleSec">处理意见</th> |
| | | <th class="th-info" colspan="3">{{eightInfo}}</th> |
| | | <th style="display:none;"></th> |
| | | <th style="display:none;"></th> |
| | | <th >{{eightName}}<span v-if="eightName">:</span>{{eightTime}}</th> |
| | | </tr> |
| | | <tr> |
| | | <th class="th-title">9物流部索赔结果</th> |
| | | <th class="th-titleSec">处理结果</th> |
| | | <th class="th-info1">{{nineOperation}}</th> |
| | | <th class="th-titleSec">处理意见</th> |
| | | <th class="th-info" colspan="3">{{nineInfo}}</th> |
| | | <th style="display:none;"></th> |
| | | <th style="display:none;"></th> |
| | | <th >{{nineName}}<span v-if="nineName">:</span>{{nineTime}}</th> |
| | | </tr> |
| | | </table> |
| | | <el-dialog |
| | | :close-on-press-escape="false" |
| | | :visible.sync="isShow" |
| | | title="不合格处理OA流程" |
| | | width="900px" |
| | | top="10vh" |
| | | @close="$emit('closeOAProcess')" |
| | | > |
| | | <el-timeline style="height: 80vh; overflow-y: scroll"> |
| | | <el-timeline-item |
| | | placement="top" |
| | | v-for="node in nodes" |
| | | :key="node.id" |
| | | :timestamp="node.name" |
| | | :icon="node.hasData ? 'el-icon-check' : 'el-icon-time'" |
| | | :color="node.hasData ? '#0bbd87' : ''" |
| | | > |
| | | <el-card> |
| | | <h3 class="node-title">{{ node.operation }}</h3> |
| | | <div class="node-details"> |
| | | <div class="detail-item"> |
| | | <span class="label">处理人:</span> |
| | | <span class="value">{{ node.operator || "-" }}</span> |
| | | </div> |
| | | <div class="detail-item"> |
| | | <span class="label">处理时间:</span> |
| | | <span class="value">{{ node.time || "-" }}</span> |
| | | </div> |
| | | <div class="detail-item"> |
| | | <span class="label">{{node.name && node.name==='1检验员'?'不合格描述:':'处理意见:'}}</span> |
| | | <span class="value">{{ node.info || "-" }}</span> |
| | | </div> |
| | | </div> |
| | | </el-card> |
| | | </el-timeline-item> |
| | | </el-timeline> |
| | | </el-dialog> |
| | | </div> |
| | | </template> |
| | | |
| | | <script> |
| | | import {getOaFlow} from "../../../../api/business/unqualifiedHandler"; |
| | | import { getOaFlow } from "../../../../api/business/unqualifiedHandler"; |
| | | |
| | | export default { |
| | | name: "OAProcess", |
| | |
| | | props: { |
| | | OAProcess: { |
| | | type: Boolean, |
| | | default: () => false |
| | | default: () => false, |
| | | }, |
| | | }, |
| | | data() { |
| | | // 这里存放数据 |
| | | return { |
| | | isShow: this.OAProcess, |
| | | oneInfo: '', |
| | | twoInfo: '', |
| | | threeInfo: '', |
| | | fourInfo: '', |
| | | fiveInfo: '', |
| | | sixInfo: '', |
| | | sevenInfo: '', |
| | | eightInfo: '', |
| | | nineInfo: '', |
| | | oneTime: '', |
| | | twoTime: '', |
| | | threeTime: '', |
| | | fourTime: '', |
| | | fiveTime: '', |
| | | sixTime: '', |
| | | sevenTime: '', |
| | | eightTime: '', |
| | | nineTime: '', |
| | | oneName: '', |
| | | twoName: '', |
| | | threeName: '', |
| | | fourName: '', |
| | | fiveName: '', |
| | | sixName: '', |
| | | sevenName: '', |
| | | eightName: '', |
| | | nineName: '', |
| | | oneOperation: '', |
| | | twoOperation: '', |
| | | threeOperation: '', |
| | | fourOperation: '', |
| | | fiveOperation: '', |
| | | sixOperation: '', |
| | | sevenOperation: '', |
| | | eightOperation: '', |
| | | nineOperation: '', |
| | | } |
| | | nodes: [ |
| | | { |
| | | id: 1, |
| | | name: "1检验员", |
| | | info: "", |
| | | time: "", |
| | | operator: "", |
| | | operation: "", |
| | | hasData: false, |
| | | }, |
| | | { |
| | | id: 2, |
| | | name: "2检测主管确认", |
| | | info: "", |
| | | time: "", |
| | | operator: "", |
| | | operation: "", |
| | | hasData: false, |
| | | }, |
| | | { |
| | | id: 3, |
| | | name: "3物流部确认", |
| | | info: "", |
| | | time: "", |
| | | operator: "", |
| | | operation: "", |
| | | hasData: false, |
| | | }, |
| | | { |
| | | id: 4, |
| | | name: "4产品工程师处理意见", |
| | | info: "", |
| | | time: "", |
| | | operator: "", |
| | | operation: "", |
| | | hasData: false, |
| | | }, |
| | | { |
| | | id: 5, |
| | | name: "5.总工或者副经理的处理意见", |
| | | info: "", |
| | | time: "", |
| | | operator: "", |
| | | operation: "", |
| | | hasData: false, |
| | | }, |
| | | { |
| | | id: 6, |
| | | name: "6质量部", |
| | | info: "", |
| | | time: "", |
| | | operator: "", |
| | | operation: "", |
| | | hasData: false, |
| | | }, |
| | | { |
| | | id: 7, |
| | | name: "7质量部经理", |
| | | info: "", |
| | | time: "", |
| | | operator: "", |
| | | operation: "", |
| | | hasData: false, |
| | | }, |
| | | { |
| | | id: 8, |
| | | name: "8核算员", |
| | | info: "", |
| | | time: "", |
| | | operator: "", |
| | | operation: "", |
| | | hasData: false, |
| | | }, |
| | | { |
| | | id: 9, |
| | | name: "9物流部索赔结果", |
| | | info: "", |
| | | time: "", |
| | | operator: "", |
| | | operation: "", |
| | | hasData: false, |
| | | }, |
| | | ], |
| | | }; |
| | | }, |
| | | // 方法集合 |
| | | methods: { |
| | | getInfo (id) { |
| | | getInfo(id,unqualifiedDesc) { |
| | | getOaFlow({ |
| | | id: id |
| | | }).then(res => { |
| | | if (res.code === 200) { |
| | | const data = res.data |
| | | if (data.length > 0) { |
| | | data.forEach(item => { |
| | | if (item.nodeName === '1检验员') { |
| | | this.oneInfo = item.approvalOpinion |
| | | this.oneTime = item.approvalDate |
| | | this.oneName = item.approver |
| | | this.oneOperation = item.operation |
| | | } else if (item.nodeName === '2检测主管确认') { |
| | | this.twoInfo = item.approvalOpinion |
| | | this.twoTime = item.approvalDate |
| | | this.twoName = item.approver |
| | | this.twoOperation = item.operation |
| | | } else if (item.nodeName === '3物流部确认') { |
| | | this.threeInfo = item.approvalOpinion |
| | | this.threeTime = item.approvalDate |
| | | this.threeName = item.approver |
| | | this.threeOperation = item.operation |
| | | } else if (item.nodeName === '4产品工程师处理意见') { |
| | | this.fourInfo = item.approvalOpinion |
| | | this.fourTime = item.approvalDate |
| | | this.fourName = item.approver |
| | | this.fourOperation = item.operation |
| | | } else if (item.nodeName === '5.总工或者副经理的处理意见') { |
| | | this.fiveInfo = item.approvalOpinion |
| | | this.fiveTime = item.approvalDate |
| | | this.fiveName = item.approver |
| | | this.fiveOperation = item.operation |
| | | } else if (item.nodeName === '6质量部') { |
| | | this.sixInfo = item.approvalOpinion |
| | | this.sixTime = item.approvalDate |
| | | this.sixName = item.approver |
| | | this.sixOperation = item.operation |
| | | } else if (item.nodeName === '7质量部经理') { |
| | | this.sevenInfo = item.approvalOpinion |
| | | this.sevenTime = item.approvalDate |
| | | this.sevenName = item.approver |
| | | this.sevenOperation = item.operation |
| | | } else if (item.nodeName === '8核算员') { |
| | | this.eightInfo = item.approvalOpinion |
| | | this.eightTime = item.approvalDate |
| | | this.eightName = item.approver |
| | | this.eightOperation = item.operation |
| | | } else if (item.nodeName === '9物流部索赔结果') { |
| | | this.nineInfo = item.approvalOpinion |
| | | this.nineTime = item.approvalDate |
| | | this.nineName = item.approver |
| | | this.nineOperation = item.operation |
| | | } |
| | | }) |
| | | } |
| | | } |
| | | }).catch(err => { |
| | | this.submitDeclareLoading = false |
| | | console.log(err) |
| | | id: id, |
| | | }) |
| | | } |
| | | .then((res) => { |
| | | if (res.code === 200) { |
| | | const data = res.data; |
| | | if (data.length > 0) { |
| | | data.forEach((item) => { |
| | | const node = this.nodes.find((n) => n.name === item.nodeName); |
| | | if (node) { |
| | | node.time = item.approvalDate + " " + item.approvalTime; |
| | | if(item.nodeName && item.nodeName==="1检验员"){ |
| | | node.info=unqualifiedDesc; |
| | | }else{ |
| | | node.info = item.approvalOpinion; |
| | | } |
| | | node.operator = item.approver; |
| | | node.operation = item.operation; |
| | | node.hasData = true; |
| | | } |
| | | }); |
| | | } |
| | | } |
| | | }) |
| | | .catch((err) => { |
| | | this.submitDeclareLoading = false; |
| | | console.log(err); |
| | | }); |
| | | }, |
| | | }, |
| | | } |
| | | }; |
| | | </script> |
| | | |
| | | <style scoped> |
| | | .table { |
| | | width: 100%; |
| | | height: 500px; |
| | | .timeline-item-content { |
| | | padding: 15px; |
| | | border: 1px solid #e4e7ed; |
| | | border-radius: 4px; |
| | | margin-bottom: 10px; |
| | | transition: all 0.3s ease; |
| | | } |
| | | .th-title { |
| | | width: 160px; |
| | | text-align: left; |
| | | background-color: #e0eaf5; |
| | | |
| | | .node-title { |
| | | font-size: 16px; |
| | | font-weight: bold; |
| | | margin-bottom: 10px; |
| | | color: #333; |
| | | } |
| | | .th-titleSec { |
| | | width: 70px; |
| | | background-color: #e0eaf5; |
| | | font-size: 16px; |
| | | |
| | | .node-details { |
| | | display: flex; |
| | | flex-wrap: wrap; |
| | | gap: 15px; |
| | | } |
| | | .th-info { |
| | | width: 210px; |
| | | text-align: left; |
| | | font-size: 16px; |
| | | |
| | | .detail-item { |
| | | display: flex; |
| | | align-items: center; |
| | | min-width: 350px; |
| | | } |
| | | .th-info1 { |
| | | width: 100px; |
| | | text-align: center; |
| | | font-size: 16px; |
| | | |
| | | .label { |
| | | font-weight: 500; |
| | | color: #606266; |
| | | margin-right: 8px; |
| | | min-width: 90px; |
| | | } |
| | | |
| | | .value { |
| | | color: #303133; |
| | | } |
| | | |
| | | /* 已完成节点样式 */ |
| | | .node-completed { |
| | | color: #67c23a; |
| | | } |
| | | |
| | | .node-completed .timeline-item-content { |
| | | border-color: #c6e2b8; |
| | | background-color: #f0f9eb; |
| | | } |
| | | |
| | | .node-completed .node-title { |
| | | color: #67c23a; |
| | | } |
| | | |
| | | /* 时间线图标样式 */ |
| | | .el-timeline-item__node { |
| | | background-color: #909399; |
| | | } |
| | | |
| | | .node-completed .el-timeline-item__node { |
| | | background-color: #67c23a; |
| | | } |
| | | </style> |
| | |
| | | <div class="search"> |
| | | <div> |
| | | <el-form :model="entity" ref="entity" size="small" :inline="true"> |
| | | <el-form-item label="IFS域" prop="contract"> |
| | | <el-select @keyup.enter.native="refreshTable" v-model="entity.contract" clearable placeholder="请选择" size="small"> |
| | | <el-option label="ZTNS" value="ZTNS"/> |
| | | <el-option label="KJNS" value="KJNS"/> |
| | | </el-select> |
| | | </el-form-item> |
| | | <el-form-item label="批号" prop="updateBatchNo"> |
| | | <el-input v-model="entity.updateBatchNo" clearable placeholder="请输入" size="small" |
| | | @keyup.enter.native="refreshTable()"> |
| | |
| | | return { |
| | | handlerId: null, |
| | | entity: { |
| | | contract: null, |
| | | sample: null, |
| | | specsModels: null, |
| | | }, |
| | | tableData: [], |
| | | tableLoading: false, |
| | | column: [ |
| | | { |
| | | label: 'IFS域', |
| | | prop: 'contract', |
| | | width: '120px', |
| | | dataType: 'tag', |
| | | formatData: (params) => { |
| | | return params |
| | | }, |
| | | formatType: (params) => { |
| | | if (params === 'ZTNS') { |
| | | return '' |
| | | } else if (params === 'KJNS') { |
| | | return 'success' |
| | | }else { |
| | | return null |
| | | } |
| | | } |
| | | |
| | | }, |
| | | { label: '编号', prop: 'no', width: "160px", }, |
| | | // { |
| | | // label: "OA审核状态", |
| | |
| | | OAView (row) { |
| | | this.OAProcess = true |
| | | this.$nextTick(() => { |
| | | this.$refs.OAProcess.getInfo(row.handlerId) |
| | | this.$refs.OAProcess.getInfo(row.handlerId,row?row.unqualifiedDesc:"") |
| | | }) |
| | | }, |
| | | // 关闭查看OA流程的弹框 |
| | |
| | | <template> |
| | | <div class="app-container"> |
| | | <el-row> |
| | | <el-col :span="4"> |
| | | <el-radio-group v-model="dateType" @change="changeDateType"> |
| | | <el-radio-button label="1">本周</el-radio-button> |
| | | <el-radio-button label="2">本月</el-radio-button> |
| | | <el-radio-button label="3">今年</el-radio-button> |
| | | </el-radio-group> |
| | | </el-col> |
| | | <!-- <el-col :span="4">--> |
| | | <!-- <el-radio-group v-model="dateType" @change="changeDateType">--> |
| | | <!-- <el-radio-button label="1">本周</el-radio-button>--> |
| | | <!-- <el-radio-button label="2">本月</el-radio-button>--> |
| | | <!-- <el-radio-button label="3">今年</el-radio-button>--> |
| | | <!-- </el-radio-group>--> |
| | | <!-- </el-col>--> |
| | | <el-col :span="20"> |
| | | <el-form ref="entity" size="small" :inline="true"> |
| | | <el-form-item style="width: 20%;"> |
| | | <el-date-picker v-model="datePicker" end-placeholder="结束日期" format="yyyy-MM-dd" placeholder="选择日期" |
| | | <el-date-picker :picker-options="pickerOptions" v-model="datePicker" end-placeholder="结束日期" format="yyyy-MM-dd" placeholder="选择日期" |
| | | range-separator="至" size="small" start-placeholder="开始日期" type="daterange" style="width: 100%;" |
| | | value-format="yyyy-MM-dd" @change="changeDatePicker"> |
| | | value-format="yyyy-MM-dd" clearable @change="changeDatePicker"> |
| | | </el-date-picker> |
| | | </el-form-item> |
| | | <el-form-item label="样品名称" prop="sampleName"> |
| | |
| | | <el-form-item label="供应商名称" prop="supplierName"> |
| | | <el-input v-model="supplierName" clearable placeholder="请输入供应商名称" size="small" |
| | | @change="changeDate"></el-input> |
| | | </el-form-item> |
| | | <el-form-item label="IFS域" prop="contract"> |
| | | <el-select v-model="contract" clearable placeholder="请选择IFS域" size="small" |
| | | @change="changeDate"> |
| | | <el-option label="ZTNS" value="ZTNS"/> |
| | | <el-option label="KJNS" value="KJNS"/> |
| | | </el-select> |
| | | </el-form-item> |
| | | </el-form> |
| | | </el-col> |
| | |
| | | data() { |
| | | // 这里存放数据 |
| | | return { |
| | | pickerOptions: { |
| | | shortcuts: [{ |
| | | text: '最近一周', |
| | | onClick(picker) { |
| | | const end = new Date(); |
| | | const start = new Date(); |
| | | start.setTime(start.getTime() - 3600 * 1000 * 24 * 6); |
| | | picker.$emit('pick', [start, end]); |
| | | } |
| | | }, { |
| | | text: '最近一个月', |
| | | onClick(picker) { |
| | | const end = new Date(); |
| | | const start = new Date(); |
| | | start.setTime(start.getTime() - 3600 * 1000 * 24 * 30); |
| | | picker.$emit('pick', [start, end]); |
| | | } |
| | | }, { |
| | | text: '最近一年', |
| | | onClick(picker) { |
| | | const end = new Date(); |
| | | const start = new Date(); |
| | | start.setTime(start.getTime() - 3600 * 1000 * 24 * 365); |
| | | picker.$emit('pick', [start, end]); |
| | | } |
| | | }] |
| | | }, |
| | | dateType: '1', |
| | | datePicker: [], |
| | | beginDate: '', |
| | | endDate: '', |
| | | sampleName: '', |
| | | contract: '', |
| | | modelName: '', |
| | | supplierName: '', |
| | | inspectionTitle: '原材料', |
| | |
| | | sum: '', |
| | | } |
| | | }, |
| | | |
| | | mounted() { |
| | | this.setBarChartTitle(); |
| | | this.getBar(); |
| | |
| | | this.getPassRateCom(); |
| | | this.getTableData(); |
| | | }, |
| | | |
| | | watch:{ |
| | | datePicker:{ |
| | | handler(newVal){ |
| | | //计算开始时间与结束时间的天数差 |
| | | if (newVal && newVal.length === 2) { |
| | | const startDate = new Date(newVal[0]); |
| | | const endDate = new Date(newVal[1]); |
| | | const timeDiff = endDate - startDate; |
| | | const dayDiff = timeDiff / (1000 * 3600 * 24); |
| | | if (dayDiff <= 7) { |
| | | this.dateType = '1'; |
| | | } else if (dayDiff > 7 && dayDiff <= 31) { |
| | | this.dateType = '2'; |
| | | } else if (dayDiff > 31) { |
| | | this.dateType = '3'; |
| | | } |
| | | }else{ |
| | | this.dateType = '1'; |
| | | } |
| | | }, immediate:true |
| | | } |
| | | }, |
| | | // 方法集合 |
| | | methods: { |
| | | // 获取合格率图表数据 |
| | |
| | | sampleName: this.sampleName, |
| | | modelName: this.modelName, |
| | | supplierName: this.supplierName, |
| | | contract:this.contract, |
| | | materialProp: t, |
| | | }; |
| | | return getRawPassRateByBarChart(params); |
| | |
| | | let lineData = []; |
| | | let xAxis = []; |
| | | |
| | | console.log(sortedDates) |
| | | sortedDates.forEach(date => { |
| | | const { qualified, unQualified } = dateMap[date]; |
| | | const total = qualified + unQualified; |
| | |
| | | this.echartsSeries[1].data = unQualifiedData; |
| | | this.echartsSeries[2].data = lineData; |
| | | this.xAxis[0].data = xAxis; |
| | | console.log(xAxis) |
| | | }); |
| | | }, |
| | | |
| | |
| | | sampleName: this.sampleName, |
| | | modelName: this.modelName, |
| | | supplierName: this.supplierName, |
| | | contract:this.contract, |
| | | materialProp: t |
| | | }; |
| | | return getRawPassRateByCake(params); |
| | |
| | | sampleName: this.sampleName, |
| | | modelName: this.modelName, |
| | | supplierName: this.supplierName, |
| | | contract:this.contract, |
| | | materialProp: t, |
| | | }; |
| | | return getMaterialPropTable(params); |