<template>
|
<div>
|
<div class="content-main">
|
<div class="top-bar">
|
<el-form :hidden="lookVisible" ref="form" :inline="true" :model="searchData">
|
<el-form-item :label="this.radioValue === 0 ? '仪器设备编号:' : '计划单号:'" class="sermargin">
|
<el-input v-model="searchData.code" @blur="blurSearch()" class="input-form" placeholder="请输入">
|
</el-input>
|
</el-form-item>
|
<el-form-item v-if="this.radioValue === 0" :label="this.radioValue === 0 ? '仪器设备名称:' : '设备名称'"
|
class="sermargin">
|
<el-input v-model="searchData.name" class="input-form" placeholder="请输入">
|
</el-input>
|
</el-form-item>
|
<el-form-item v-if="this.radioValue === 0" :label="this.radioValue === 0 ? '计量单位:' : '计量单位：'"
|
style="margin-right: 20px;">
|
<el-input v-model="searchData.measureunit" class="input-form" placeholder="请输入">
|
</el-input>
|
</el-form-item>
|
</el-form>
|
<el-form :hidden="lookVisible">
|
<el-form-item v-if="this.radioValue === 0" class="rightBtn">
|
<el-button type="primary" @click="search">查询</el-button>
|
<el-button type="primary" plain @click="reset()">重置</el-button>
|
</el-form-item>
|
<el-form-item v-if="this.radioValue === 1" class="rightBtn">
|
<el-button type="primary" @click="addPlan()" icon="el-icon-plus">新增计划</el-button>
|
</el-form-item>
|
</el-form>
|
</div>
|
<div class="library-table">
|
<div class="table-header">
|
<div class="search-bar">
|
<el-radio-group v-model="radioValue" @change="radioclick">
|
<el-radio-button v-for="item in options" :key="item.value" :label="item.value">
|
{{ item.label }}
|
</el-radio-button>
|
</el-radio-group>
|
</div>
|
</div>
|
<div class="table-box">
|
<el-table v-if="this.radioValue == 0" :max-height="800" :cell-style="{ textAlign: 'center' }"
|
:header-cell-style="{ border: '0px', background: '#f5f7fa', color: '#606266', boxShadow: 'inset 0 1px 0 #ebeef5', textAlign: 'center' }"
|
:data="measureLedgerTable" style="width: 100%">
|
<el-table-column type="index" min-width="10%" />
|
<el-table-column prop="equipmentCode" label="仪器设备编号" min-width="10%" />
|
<el-table-column label="计量单位" prop="measurementUnit" min-width="10%"></el-table-column>
|
<el-table-column prop="equipmentName" label="仪器设备名称" min-width="10%" />
|
<el-table-column prop="measuringRange" label="测量范围" min-width="10%" />
|
<el-table-column prop="termValidity" label="计量周期" min-width="10%">
|
<template slot-scope="scope">
|
{{ scope.row.termValidity }}月
|
</template>
|
</el-table-column>
|
<el-table-column prop="result" label="计量结果" min-width="10%">
|
<template slot-scope="scope">
|
<div v-if="scope.row.result === 1">
|
<span style="color: rgb(78, 210, 16);">正常</span>
|
</div>
|
<div v-else-if="scope.row.result === 2">
|
<span style="color: rgb(27, 202, 233);">矫正后可用</span>
|
</div>
|
<div v-else>
|
<span style="color: red;">失准</span>
|
</div>
|
</template>
|
</el-table-column>
|
<el-table-column prop="endDate" label="计量日期" min-width="12%" />
|
<el-table-column prop="validit" label="计量有效期" min-width="10%" />
|
<el-table-column prop="name" label="负责人" min-width="10%" />
|
<el-table-column prop="createTime" label="创建日期" min-width="10%" />
|
<el-table-column prop="name" label="创建人" min-width="8%" />
|
<el-table-column prop="code" label="计量编号" min-width="8%" />
|
<el-table-column label="操作" min-width="15%">
|
<template slot-scope="scope">
|
<el-button type="text" @click="lookMeasurement(scope.row.equipmentCode)" size="small">查看计量履历</el-button>
|
<el-button type="text" size="small">查看附件</el-button>
|
</template>
|
</el-table-column>
|
</el-table>
|
<el-table v-show="this.radioValue == 1" :max-height="800" :cell-style="{ textAlign: 'center' }"
|
:header-cell-style="{ border: '0px', background: '#f5f7fa', color: '#606266', boxShadow: 'inset 0 1px 0 #ebeef5', textAlign: 'center' }"
|
:data="measurePlanTable" style="width: 100%">
|
<el-table-column type="index" min-width="10%" />
|
<el-table-column prop="plannedOrderNumber" label="计划单号" min-width="10%" />
|
<el-table-column prop="palanDate" label="计划日期" min-width="10%">
|
<template lot-scope="scope">
|
<!-- {{ scope.row.palanDate }} -->
|
</template>
|
</el-table-column>
|
<el-table-column prop="status" label="计划状态" min-width="6%">
|
<template slot-scope="scope">
|
<div v-if="scope.row.status == 1">
|
<span style="color: green;">已完成</span>
|
</div>
|
<div v-else>
|
<span style="color: red;">未完成</span>
|
</div>
|
</template>
|
</el-table-column>
|
<el-table-column prop="measurePerson" label="计划负责人" min-width="12%" />
|
<el-table-column prop="createPerson" label="创建人" min-width="10%" />
|
<el-table-column label="创建时间" prop="createTime" min-width="10%" />
|
<el-table-column prop="id" label="操作" min-width="15%">
|
<template slot-scope="scope">
|
<el-button type="text" size="small" @click="lookPalan(scope.row.id)">查看计量履历</el-button>
|
<el-button type="text" size="small">查看附件</el-button>
|
</template>
|
</el-table-column>
|
</el-table>
|
<!-- 分页器 -->
|
<div style="display: flex;justify-content: end;">
|
<el-pagination @size-change="handleSizeChange" @current-change="handleCurrentChange"
|
:current-page="currentPage" :page-sizes="[5, 10, 20]" :page-size="pageSize"
|
layout="total, sizes, prev, pager, next, jumper" :total="total">
|
</el-pagination>
|
</div>
|
</div>
|
</div>
|
<el-drawer title="我是标题" :visible.sync="drawer" :direction="direction" :before-close="handleClose">
|
<span>我来啦!</span>
|
</el-drawer>
|
<div id="myMOdel"
|
:style="`position: absolute;transition: 1s;top:${mymodelTop}px; left: 9px; width: 100%; height: 60vh; background-color: #fff;z-index: 20;`">
|
<el-col :span="10">
|
<p style="font-size: 13px;padding-left: 40px;">计划信息</p>
|
</el-col>
|
<el-col>
|
<el-form :model="planInfo" style="padding-left: 150px;color: #9b9898;">
|
<el-form-item>
|
<el-col :span="8">计划编号：<span style="color: black;">{{ planInfo.plannedOrderNumber }}</span></el-col>
|
<el-col :span="8">负责人：<span style="color: black;">{{ planInfo.measurePerson }}</span></el-col>
|
<el-col :span="8">计划时间：<span style="color: black;">{{ planInfo.palanDate }}</span></el-col>
|
</el-form-item>
|
<el-form-item>
|
<el-col :span="8">计量单位：<span style="color: black;">{{ planInfo.unit }}</span></el-col>
|
<el-col :span="8">创建人：<span style="color: black;">{{ planInfo.createPerson }}</span></el-col>
|
<el-col :span="8">创建时间：<span style="color: black;">{{ planInfo.createTime }}</span></el-col>
|
</el-form-item>
|
</el-form>
|
</el-col>
|
<el-col>
|
<el-col style="font-size: 13px;padding-left: 55px;">
|
计量信息
|
</el-col>
|
<el-col>
|
<el-progress style="width: 95%;padding-left: 40px;margin-top: 20px;" :percentage="6" :stroke-width="2"
|
:show-text="false"></el-progress>
|
</el-col>
|
</el-col>
|
<el-col style="width:93%;height: 20vh;margin-top: 30px; margin-left: 40px;">
|
<el-table :data="measureData">
|
<el-table-column type="inde" label="序号"/>
|
<el-table-column type="inde" label="仪器设备编号"/>
|
<el-table-column type="inde" label="仪器设备名称"/>
|
<el-table-column type="inde" label="测量范围"/>
|
<el-table-column type="inde" label="计算周期"/>
|
<el-table-column type="inde" label="计算结果"/>
|
<el-table-column type="inde" label="计算日期"/>
|
<el-table-column type="inde" label="计算有效期"/>
|
<el-table-column type="inde" label="负责人"/>
|
<el-table-column type="inde" label="创建日期"/>
|
<el-table-column type="inde" label="创建人"/>
|
<el-table-column type="inde" label="计量单位"/>
|
<el-table-column type="inde" label="计量编号"/>
|
</el-table>
|
</el-col>
|
<el-col style="width: 93%;margin-left: 40px; display: flex;justify-content: end;">
|
<el-pagination @size-change="handleSizeChangePlan" @current-change="handleCurrentChangePllan"
|
:current-page="currentPagePlan" :page-sizes="[5, 10, 20]" :page-size="pageSizePlan"
|
layout="total, sizes, prev, pager, next, jumper" :total="totalPlan">
|
</el-pagination>
|
</el-col>
|
</div>
|
</div>
|
</div>
|
</template>
|
|
<script>
|
import { getPlanPageList, getStandingPageList } from '@/api/laboratory/measure'
|
export default {
|
data() {
|
return {
|
searchData: {
|
code: '',
|
name: '',
|
measureunit: ''
|
},
|
radioValue: 0,
|
options: [{
|
value: 0,
|
label: '计量台账'
|
}, {
|
value: 1,
|
label: '计量计划'
|
}],
|
measureLedgerTable: [{
|
equipment_code: 'JSTC-W1-00001', // 仪器设备编号
|
equipment_name: '数字电桥', // 仪器设备名称
|
measure_range: '---', // 测量范围
|
measurecycle: '12月', // 计量周期
|
mesureresult: 1, // 计量结果
|
date: '2022-07-20', // 计量日期
|
term_validity: '2023-07-20', // 计量有效期
|
head: '黄小明' , // 负责人
|
create_time: '2023-07-20', // 创建日期
|
create_person: '黄小明', // 创建人
|
measure_code: 'QCX20230720' // 计量编号
|
},{
|
equipment_code: 'JSTC-W1-00001', // 仪器设备编号
|
equipment_name: '数字电桥', // 仪器设备名称
|
measure_range: '---', // 测量范围
|
measurecycle: '12月', // 计量周期
|
mesureresult: 0, // 计量结果
|
date: '2022-07-20', // 计量日期
|
term_validity: '2023-07-20', // 计量有效期
|
head: '黄小明' , // 负责人
|
create_time: '2023-07-20', // 创建日期
|
create_person: '黄小明', // 创建人
|
measure_code: 'QCX20230720' // 计量编号
|
},{
|
equipment_code: 'JSTC-W1-00001', // 仪器设备编号
|
equipment_name: '数字电桥', // 仪器设备名称
|
measure_range: '---', // 测量范围
|
measurecycle: '12月', // 计量周期
|
mesureresult: 1, // 计量结果
|
date: '2022-07-20', // 计量日期
|
term_validity: '2023-07-20', // 计量有效期
|
head: '黄小明' , // 负责人
|
create_time: '2023-07-20', // 创建日期
|
create_person: '黄小明', // 创建人
|
measure_code: 'QCX20230720' // 计量编号
|
}],
|
measurePlanTable: [{
|
measure_number: 'QC568946512', // 计量单号
|
equipment_code: '010101', // 设备编号
|
equipment_name: '拉力机', // 设备名称
|
scheduled_date: '2023-04-08 ~ 2023-08-08', // 计划日期
|
measure_state: 1, // 计量状态
|
head: '黄小明', // 计量负责人
|
department: '地线检测', // 计量单位
|
creater: '黄小明', // 创建人
|
create_date: '2023-07-20', // 创建日期
|
},{
|
measure_number: 'QC568946512', // 计量单号
|
equipment_code: '010101', // 设备编号
|
equipment_name: '拉力机', // 设备名称
|
scheduled_date: '2023-04-08 ~ 2023-08-08', // 计划日期
|
measure_state: 1, // 计量状态
|
head: '黄小明', // 计量负责人
|
department: '地线检测', // 计量单位
|
creater: '黄小明', // 创建人
|
create_date: '2023-07-20', // 创建日期
|
},{
|
measure_number: 'QC568946512', // 计量单号
|
equipment_code: '010101', // 设备编号
|
equipment_name: '拉力机', // 设备名称
|
scheduled_date: '2023-04-08 ~ 2023-08-08', // 计划日期
|
measure_state: 0, // 计量状态
|
head: '黄小明', // 计量负责人
|
department: '地线检测', // 计量单位
|
creater: '黄小明', // 创建人
|
create_date: '2023-07-20', // 创建日期
|
}],
|
currentPage: 1,
|
pageSize: 5,
|
total: 0,
|
currentPagePlan: 1,
|
pageSizePlan: 5,
|
totalPlan: 0,
|
drawer: false,
|
direction: 'rtl',
|
lookVisible: false,
|
measureData: [],
|
planInfo: {
|
plannedOrderNumber: 7897897987,
|
measurePerson: '某某人',
|
palanDate: "2021-09-08 ~ 2024-08-09",
|
unit: '某某检测局',
|
createPerson: '某某负责人',
|
createTime: '2021-09-08'
|
},
|
mymodelTop: -450//14
|
}
|
},
|
created() {
|
this.getStandingPageList()
|
// this.getPlanPageList()
|
},
|
methods: {
|
handleSizeChangePlan(){
|
|
},
|
handleCurrentChangePllan(){
|
|
},
|
addPlan() {
|
this.drawer = true
|
},
|
lookPalan(id) {
|
this.lookVisible = true
|
this.mymodelTop=10
|
this.$parent.triggerMainBtnPlan()
|
},
|
combackLookPlan(){
|
this.lookVisible = false
|
this.mymodelTop=-450
|
},
|
blurSearch() {
|
if (this.radioValue === 1) {
|
console.log("计划");
|
}
|
},
|
handleClose() {
|
this.drawer = false
|
},
|
handleCurrentChange() {
|
this.getStandingPageList()
|
},
|
handleSizeChange() {
|
this.getStandingPageList()
|
},
|
async getStandingPageList() {
|
const res = await getStandingPageList({
|
currentPage: this.currentPage, pageSize: this.pageSize,
|
code: this.searchData.code, name: this.searchData.name, unit: this.searchData.measureunit
|
})
|
this.measureLedgerTable = res.data.records
|
this.total = res.data.total
|
this.measureLedgerTable.forEach(item => {
|
let dateStr = ''
|
let dateArr = item.createTime
|
dateStr = dateArr[0] + "-" + dateArr[1] + "-" + dateArr[2]
|
item.createTime = dateStr
|
let endArr = item.endDate
|
item.endDate = endArr[0] + "-" + endArr[1] + "-" + endArr[2]
|
item.validit = this.addMonths(item.endDate, item.termValidity)
|
})
|
},
|
addMonths(yearMonthDay, monthNum) {
|
var arr = yearMonthDay.split('-');//2020-08-19或2020-08
|
var year = parseInt(arr[0]);
|
var month = parseInt(arr[1]);
|
month = month + monthNum;
|
if (month > 12) {//月份加
|
var yearNum = parseInt((month - 1) / 12);
|
month = month % 12 == 0 ? 12 : month % 12;
|
year += yearNum;
|
} else if (month <= 0) {//月份减
|
month = Math.abs(month);
|
var yearNum = parseInt((month + 12) / 12);
|
year -= yearNum;
|
}
|
month = month < 10 ? "0" + month : month;
|
return year + "-" + month + "-" + arr[2];
|
},
|
search() {
|
this.getStandingPageList()
|
},
|
reset(formName) {
|
this.searchData.name = ''
|
this.searchData.code = ''
|
this.searchData.measureunit = ''
|
},
|
radioclick() {
|
this.radioValue ? this.getPlanPageList() : this.getStandingPageList()
|
this.reset()
|
},
|
async getPlanPageList() {
|
const res = await getPlanPageList({
|
currentPage: this.currentPage, pageSize: this.pageSize,
|
code: this.searchData.code, name: this.searchData.name, unit: this.searchData.measureunit
|
})
|
res.data.list.forEach(item => {
|
item.palanDate = item.beginTime + " ~ " + item.endTime
|
})
|
this.measurePlanTable = res.data.list
|
this.total = res.data.total
|
},
|
lookMeasurement(code) {
|
console.log(code);
|
},
|
}
|
}
|
</script>
|
|
<style scoped>
|
.top-bar {
|
margin: -25px -15px;
|
background: #fff;
|
display: flex;
|
justify-content: space-between;
|
padding: 5px 24px 0px 24px;
|
|
.sermargin {
|
margin-right: 60px;
|
}
|
}
|
|
.rightBtn {
|
margin-right: 50px
|
}
|
|
.library-table {
|
background-color: #fff;
|
flex: 1;
|
margin: 0px -15px;
|
margin-top: 40px;
|
display: flex;
|
flex-direction: column;
|
|
.table-header {
|
padding: 20px;
|
display: flex;
|
justify-content: space-between;
|
|
.el-form-item {
|
margin-bottom: 30px !important;
|
}
|
}
|
|
.table-box {
|
padding: 0px 20px;
|
margin-top: 0px;
|
flex: 1;
|
background: #fff;
|
/* padding: 20px 20px 10px 20px; */
|
display: flex;
|
flex-direction: column;
|
|
.el-table {
|
flex: 1;
|
}
|
|
>div:nth-child(2) {
|
display: flex;
|
justify-content: end;
|
margin: 10px 0;
|
}
|
}
|
}
|
</style>
|
