projects/mes-test #133
Binary file not shown.
|
Before Width: | Height: | Size: 2.0 KiB After Width: | Height: | Size: 4.2 KiB |
@ -113,6 +113,15 @@ export function orderMonitor(query) {
|
||||
})
|
||||
}
|
||||
|
||||
// 获取订单绑定的工单和数量信息，可传订单id列表，map索引为订单id
|
||||
export function orderAssignmentList(query) {
|
||||
return request({
|
||||
url: '/base/order/orderAssignmentList',
|
||||
method: 'get',
|
||||
params: query
|
||||
})
|
||||
}
|
||||
|
||||
// 获得所有客户列表
|
||||
export function customerList() {
|
||||
return request({
|
||||
|
||||
20
src/assets/icons/svg/order-monitoring.svg
Normal file
20
src/assets/icons/svg/order-monitoring.svg
Normal file
@ -0,0 +1,20 @@
|
||||
<?xml version="1.0" encoding="UTF-8"?>
|
||||
<svg width="16px" height="16px" viewBox="0 0 16 16" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
|
||||
<title>编组 17</title>
|
||||
<g id="页面" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd" opacity="0.695141">
|
||||
<g id="最新参考" transform="translate(-1780.000000, -57.000000)" fill="#000000" fill-rule="nonzero">
|
||||
<g id="编组-4" transform="translate(1772.000000, 48.000000)">
|
||||
<g id="编组-17" transform="translate(8.000000, 9.000000)">
|
||||
<rect id="矩形备份-2" opacity="0" x="0" y="0" width="16" height="16"></rect>
|
||||
<g id="文档" transform="translate(2.436519, 1.472460)">
|
||||
<path d="M9.61879642,0.990942446 C9.83682412,0.990942446 10.0548518,1.18867806 10.0548518,1.38641367 L10.0548518,11.6686655 C10.0548518,11.8664011 9.83682412,12.0641367 9.61879642,12.0641367 L3.60123204,12.0641367 L1.02850524,9.69130935 L1.02850524,1.38641367 C1.02850524,1.18867806 1.24653294,0.990942446 1.46456063,0.990942446 L9.61879642,0.990942446 M9.61879642,0.2 L1.50816617,0.2 C0.810477546,0.2 0.2,0.753659712 0.2,1.38641367 L0.2,10.0076863 L3.25238773,12.8550791 L9.61879642,12.8550791 C10.316485,12.8550791 10.9269626,12.3014194 10.9269626,11.6686655 L10.9269626,1.38641367 C10.9269626,0.753659712 10.316485,0.2 9.61879642,0.2 Z" id="形状"></path>
|
||||
<path d="M9.61879642,0 C10.4228194,0 11.1269626,0.638607809 11.1269626,1.38641367 L11.1269626,11.6686655 C11.1269626,12.4164713 10.4228194,13.0550791 9.61879642,13.0550791 L3.25238773,13.0550791 L3.11596256,13.0013261 L0.0635748259,10.1539333 L0,10.0076863 L0,1.38641367 C0,0.638607809 0.704143212,0 1.50816617,0 L9.61879642,0 Z M9.61879642,0.4 L1.50816617,0.4 C0.91681188,0.4 0.4,0.868711615 0.4,1.38641367 L0.4,9.921 L3.331,12.6550791 L9.61879642,12.6550791 C10.1707271,12.6550791 10.657723,12.2467792 10.7202028,11.7714283 L10.7269626,11.6686655 L10.7269626,1.38641367 C10.7269626,0.868711615 10.2101507,0.4 9.61879642,0.4 Z M9.61879642,0.790942446 C9.94315845,0.790942446 10.2548518,1.07362615 10.2548518,1.38641367 L10.2548518,11.6686655 C10.2548518,11.981453 9.94315845,12.2641367 9.61879642,12.2641367 L3.60123204,12.2641367 L3.46563766,12.2111542 L0.892910861,9.83832691 L0.828505241,9.69130935 L0.828505241,1.38641367 C0.828505241,1.07362615 1.1401986,0.790942446 1.46456063,0.790942446 L9.61879642,0.790942446 Z M9.69667678,1.08901006 L1.38668992,1.08901006 C1.27286315,1.08901006 1.14612572,1.20395189 1.14612572,1.28821491 L1.14561083,9.66174324 L3.64342649,11.9659298 L9.69667678,11.9660691 C9.79153243,11.9660691 9.8953538,11.8862484 9.92732605,11.8108781 L9.93724098,11.7668642 L9.93724098,1.28821491 C9.93724098,1.20395189 9.81050356,1.08901006 9.69667678,1.08901006 Z" id="形状"></path>
|
||||
<path d="M4.54092961,3.67913093 L2.25985278,3.67913093 C2.22052387,3.67913093 2.22052387,3.65291165 2.22052387,3.65291165 L2.22052387,2.91877199 C2.22052387,2.89255271 2.22052387,2.89255271 2.25985278,2.89255271 L4.54092961,2.89255271 C4.58025852,2.89255271 4.58025852,2.89255271 4.58025852,2.91877199 L4.58025852,3.65291165 L4.54092961,3.67913093 Z M8.86710981,5.44893192 L2.25985278,5.44893192 C2.22052387,5.44893192 2.22052387,5.44893192 2.22052387,5.40960301 L2.22052387,4.70168261 C2.22052387,4.6623537 2.22052387,4.6623537 2.25985278,4.6623537 L8.86710981,4.6623537 C8.90643872,4.6623537 8.90643872,4.6623537 8.90643872,4.70168261 L8.90643872,5.40960301 L8.86710981,5.44893192 Z M8.86710981,7.41537746 L2.25985278,7.41537746 C2.22052387,7.41537746 2.22052387,7.41537746 2.22052387,7.37604855 L2.22052387,6.66812815 C2.22052387,6.62879924 2.22052387,6.62879924 2.25985278,6.62879924 L8.86710981,6.62879924 C8.90643872,6.62879924 8.90643872,6.62879924 8.90643872,6.66812815 L8.90643872,7.37604855 L8.86710981,7.41537746 Z" id="形状"></path>
|
||||
<path d="M8.86710981,6.44841431 C9.00606257,6.44841431 9.08682365,6.5291754 9.08682365,6.66812815 L9.08682365,7.37604855 L9.03399013,7.50359996 L8.99466122,7.54292887 L8.86710981,7.59576239 L2.25985278,7.59576239 C2.12090003,7.59576239 2.04013894,7.51500131 2.04013894,7.37604855 L2.04013894,6.66812815 C2.04013894,6.5291754 2.12090003,6.44841431 2.25985278,6.44841431 L8.86710981,6.44841431 Z M8.72520451,6.80870958 L2.40090881,6.80870958 L2.40090881,7.23441802 L8.72520451,7.23441802 L8.72520451,6.80870958 Z M8.86710981,4.48196877 C9.00606257,4.48196877 9.08682365,4.56272985 9.08682365,4.70168261 L9.08682365,5.40960301 L9.03399013,5.53715441 L8.99466122,5.57648333 L8.86710981,5.62931685 L2.25985278,5.62931685 C2.12090003,5.62931685 2.04013894,5.54855576 2.04013894,5.40960301 L2.04013894,4.70168261 C2.04013894,4.56272985 2.12090003,4.48196877 2.25985278,4.48196877 L8.86710981,4.48196877 Z M8.72520451,4.84251382 L2.40090881,4.84251382 L2.40090881,5.26822226 L8.72520451,5.26822226 L8.72520451,4.84251382 Z M4.54092961,2.71216778 C4.66811215,2.71216778 4.76064346,2.77385532 4.76064346,2.91877199 L4.76064346,3.65291165 L4.68031808,3.80300099 L4.64098917,3.82922026 L4.54092961,3.85951586 L2.25985278,3.85951586 C2.18859958,3.85951586 2.12331983,3.83050264 2.08113204,3.77425225 C2.04130723,3.6964836 2.04130723,3.6964836 2.04013894,3.65291165 L2.04013894,2.91877199 C2.04013894,2.77385532 2.13267025,2.71216778 2.25985278,2.71216778 L4.54092961,2.71216778 Z M4.39957385,3.07293764 L2.40090881,3.07293764 L2.40090881,3.49864608 L4.39957385,3.49864608 L4.39957385,3.07293764 Z" id="形状"></path>
|
||||
<path d="M3.50158987,12.5394187 L3.50158987,9.83587533 L0.88525753,9.83587533 L0.88525753,8.96376455 L3.93764526,8.96376455 C4.19927849,8.96376455 4.37370065,9.1381867 4.37370065,9.39981994 L4.37370065,12.5394187 L3.50158987,12.5394187 Z" id="路径"></path>
|
||||
</g>
|
||||
</g>
|
||||
</g>
|
||||
</g>
|
||||
</g>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 5.8 KiB |
@ -37,6 +37,9 @@ $tabWidth: $tabW * 1px;
|
||||
$rowHeight: $rowH * 1px;
|
||||
$buttonHeight: $buttonH * 1px;
|
||||
|
||||
// 1080px 高度为基准的 1px
|
||||
$base1px: 0.15vh; // 1px / 1080px;
|
||||
|
||||
// - - - - - 页面基础设置
|
||||
.container {
|
||||
.login-code {
|
||||
@ -87,7 +90,7 @@ $buttonHeight: $buttonH * 1px;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
background-color: #ffffff;
|
||||
// box-shadow: 0px 16px 40px rgba(0, 0, 0, 0.07);
|
||||
// box-shadow: 0px calc(16 * 0.12vh) 40px rgba(0, 0, 0, 0.07);
|
||||
// border-radius: 20px;
|
||||
// 定位
|
||||
position: relative;
|
||||
@ -100,6 +103,7 @@ $buttonHeight: $buttonH * 1px;
|
||||
// 元素
|
||||
// width: $picWidth;
|
||||
height: $picHeight;
|
||||
// height: 10vh;
|
||||
background-image: url($picImage);
|
||||
background-repeat: no-repeat;
|
||||
background-size: 100% 100%;
|
||||
@ -118,7 +122,7 @@ $buttonHeight: $buttonH * 1px;
|
||||
}
|
||||
.field {
|
||||
position: relative;
|
||||
margin-top: 8%;
|
||||
margin-top: 14vh;
|
||||
flex: 2;
|
||||
// width: 800px;
|
||||
display: flex;
|
||||
@ -130,17 +134,36 @@ $buttonHeight: $buttonH * 1px;
|
||||
text-align: center;
|
||||
clear: both;
|
||||
position: relative;
|
||||
top: -36px;
|
||||
height: 128px;
|
||||
top: calc(-32 * $base1px);
|
||||
height: calc(128 * $base1px);
|
||||
|
||||
.title {
|
||||
margin: 0;
|
||||
margin-left: 32px;
|
||||
margin-left: calc(28 * 0.12vh);
|
||||
font-weight: 400;
|
||||
user-select: none;
|
||||
color: #000;
|
||||
font-size: 36px;
|
||||
line-height: 54px;
|
||||
font-size: calc(28 * 0.12vh);
|
||||
line-height: calc(40 * 0.12vh);
|
||||
letter-spacing: calc(2 * 0.12vh);
|
||||
|
||||
.cnbm_logo {
|
||||
height: calc(40 * 0.12vh);
|
||||
width: calc(40 * 0.12vh);
|
||||
position: relative;
|
||||
top: calc(8 * 0.12vh);
|
||||
right: calc(8 * 0.12vh);
|
||||
}
|
||||
}
|
||||
|
||||
.sub-title {
|
||||
margin: 0;
|
||||
margin-left: calc(28 * 0.12vh);
|
||||
font-weight: 400;
|
||||
user-select: none;
|
||||
color: #000;
|
||||
font-size: calc(28 * 0.12vh);
|
||||
line-height: calc(48 * 0.12vh);
|
||||
letter-spacing: 2px;
|
||||
}
|
||||
}
|
||||
@ -159,10 +182,10 @@ $buttonHeight: $buttonH * 1px;
|
||||
.footer {
|
||||
user-select: none;
|
||||
// 元素
|
||||
margin: 12px 0;
|
||||
height: 16px;
|
||||
line-height: 16px;
|
||||
font-size: 12px;
|
||||
margin: calc(12 * 0.12vh) 0;
|
||||
height: calc(16 * 0.12vh);
|
||||
line-height: calc(16 * 0.12vh);
|
||||
font-size: calc(12 * 0.12vh);
|
||||
color: #8c8c8c;
|
||||
|
||||
a,
|
||||
@ -176,12 +199,8 @@ $buttonHeight: $buttonH * 1px;
|
||||
.form {
|
||||
margin-top: 0;
|
||||
box-sizing: border-box;
|
||||
// width: $formWidth;
|
||||
width: 100%;
|
||||
// - - - tab
|
||||
:deep(.el-tabs__nav) {
|
||||
// background: #f0f3;
|
||||
}
|
||||
|
||||
:deep(.el-tabs__content) {
|
||||
padding: 20px 0 0;
|
||||
}
|
||||
@ -189,12 +208,13 @@ $buttonHeight: $buttonH * 1px;
|
||||
user-select: none;
|
||||
// 元素
|
||||
width: $tabWidth;
|
||||
height: $rowHeight;
|
||||
// height: $rowHeight;
|
||||
height: calc(54 * 0.12vh);
|
||||
padding: 0;
|
||||
// 文字
|
||||
line-height: $rowHeight;
|
||||
color: #666666;
|
||||
font-size: 18px;
|
||||
font-size: calc(14 * 0.12vh);
|
||||
font-weight: 400;
|
||||
text-align: center;
|
||||
}
|
||||
@ -210,7 +230,8 @@ $buttonHeight: $buttonH * 1px;
|
||||
:deep(.el-input__inner) {
|
||||
// 元素
|
||||
width: 100%;
|
||||
height: $rowHeight;
|
||||
// height: $rowHeight;
|
||||
height: calc(72 * 0.12vh);
|
||||
background: #f5f5f5;
|
||||
border: 0;
|
||||
border-radius: 28px;
|
||||
@ -280,7 +301,7 @@ $buttonHeight: $buttonH * 1px;
|
||||
margin-bottom: 20px;
|
||||
// 文字
|
||||
line-height: 26px;
|
||||
font-size: 20px;
|
||||
font-size: calc(18 * 0.12vh);
|
||||
color: #ffffff;
|
||||
}
|
||||
.button-active {
|
||||
@ -299,13 +320,14 @@ $buttonHeight: $buttonH * 1px;
|
||||
:deep(.el-input__inner) {
|
||||
// 元素
|
||||
width: 420px;
|
||||
height: 66px;
|
||||
height: calc(52 * 0.12vh);
|
||||
// height: 66px;
|
||||
color: #262626;
|
||||
font-size: 18px;
|
||||
font-size: calc(14 * 0.12vh);
|
||||
}
|
||||
:deep(.el-checkbox__label) {
|
||||
font-size: 18px;
|
||||
line-height: 14px;
|
||||
font-size: calc(14 * 0.12vh);
|
||||
line-height: calc(12 * 0.12vh);
|
||||
}
|
||||
}
|
||||
}
|
||||
@ -314,19 +336,42 @@ $buttonHeight: $buttonH * 1px;
|
||||
@media screen and (min-width: 1920px) {
|
||||
.container {
|
||||
.content {
|
||||
|
||||
.field {
|
||||
flex: initial;
|
||||
width: 800px;
|
||||
// width: 800px;
|
||||
width: 40vw;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@media screen and (min-height: 1024px) {
|
||||
.container {
|
||||
.content {
|
||||
.field {
|
||||
margin-top: 16vh;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@media screen and (max-height: 1024px) {
|
||||
.container {
|
||||
.content {
|
||||
.field {
|
||||
margin-top: 8vh;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
|
||||
@media screen and (min-width: 599px) and (max-width: 1366px) {
|
||||
.container {
|
||||
min-width: 599px;
|
||||
// min-width: 599px;
|
||||
min-width: 42vw;
|
||||
|
||||
.content {
|
||||
// width: 710px;
|
||||
// height: 397px;
|
||||
@ -337,6 +382,7 @@ $buttonHeight: $buttonH * 1px;
|
||||
display: none;
|
||||
}
|
||||
.field {
|
||||
// margin-top: 6vh;
|
||||
// width: calc(710px - 314px);
|
||||
// left: 314px;
|
||||
// justify-content: center;
|
||||
@ -363,6 +409,14 @@ $buttonHeight: $buttonH * 1px;
|
||||
}
|
||||
}
|
||||
|
||||
// @media screen and (max-height: 1080px) {
|
||||
// .container {
|
||||
// .field {
|
||||
// transform: scale(0.74);
|
||||
// }
|
||||
// }
|
||||
// }
|
||||
|
||||
/* ===== MOBILE DESIGN ===== */
|
||||
$mobileW: 375;
|
||||
$mobileH: 812;
|
||||
@ -503,7 +557,7 @@ $iconBgImage: '../assets/images/icon.png';
|
||||
|
||||
.footer {
|
||||
// 元素
|
||||
font-size: 12px;
|
||||
font-size: calc(12 * 0.12vh);
|
||||
font-family: PingFang SC;
|
||||
font-weight: 400;
|
||||
line-height: 17px;
|
||||
@ -511,7 +565,7 @@ $iconBgImage: '../assets/images/icon.png';
|
||||
opacity: 0.6;
|
||||
// 定位
|
||||
// position: absolute;
|
||||
bottom: -32px;
|
||||
bottom: -calc(32 * 0.12vh);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@ -347,6 +347,8 @@ export default {
|
||||
console.log('setting code: ', response.data);
|
||||
// 处理输入框数据
|
||||
this.form[opt.prop] = response.data;
|
||||
// 更新下外部的 dataForm，防止code字段有数据也报空的bug
|
||||
this.$emit('update', this.form)
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
@ -69,7 +69,7 @@ const tableProps = [
|
||||
prop: 'createTime',
|
||||
label: '添加时间',
|
||||
filter: parseTime,
|
||||
minWidth: 150
|
||||
minWidth: 160
|
||||
},
|
||||
{
|
||||
prop: 'deliveryCarCode',
|
||||
@ -81,7 +81,7 @@ const tableProps = [
|
||||
prop: 'loadTime',
|
||||
label: '装车时间',
|
||||
filter: parseTime,
|
||||
minWidth: 150
|
||||
minWidth: 160
|
||||
},
|
||||
{
|
||||
prop: 'productName',
|
||||
|
||||
@ -78,7 +78,7 @@ const tableProps = [
|
||||
prop: 'deliveryTime',
|
||||
label: '发货时间',
|
||||
filter: parseTime,
|
||||
minWidth: 150
|
||||
minWidth: 160
|
||||
},
|
||||
{
|
||||
prop: 'code',
|
||||
|
||||
@ -122,7 +122,7 @@ const tableProps = [
|
||||
prop: 'deliveryTime',
|
||||
label: '发货时间',
|
||||
filter: parseTime,
|
||||
minWidth: 150
|
||||
minWidth: 160
|
||||
},
|
||||
{
|
||||
prop: 'code',
|
||||
@ -151,7 +151,7 @@ const tableProps2 = [
|
||||
prop: 'createTime',
|
||||
label: '添加时间',
|
||||
filter: parseTime,
|
||||
minWidth: 150
|
||||
minWidth: 160
|
||||
},
|
||||
{
|
||||
prop: 'deliveryCarCode',
|
||||
@ -162,7 +162,7 @@ const tableProps2 = [
|
||||
prop: 'loadTime',
|
||||
label: '装车时间',
|
||||
filter: parseTime,
|
||||
minWidth: 150
|
||||
minWidth: 160
|
||||
},
|
||||
{
|
||||
prop: 'productName',
|
||||
|
||||
@ -39,14 +39,12 @@
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-row>
|
||||
<el-col :span="24">
|
||||
<el-col :span="12">
|
||||
<el-form-item label="是否采集" prop="collection">
|
||||
<el-switch v-model="form.collection"></el-switch>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-row>
|
||||
<el-col :span="24">
|
||||
<el-col :span="12">
|
||||
<el-form-item label="描述" prop="description">
|
||||
<el-input v-model="form.description"></el-input>
|
||||
</el-form-item>
|
||||
|
||||
@ -37,6 +37,7 @@
|
||||
@cancel="handleCancel"
|
||||
@confirm="handleConfirm"
|
||||
:before-close="handleCancel"
|
||||
width='30%'
|
||||
>
|
||||
<energy-plc-connect-add ref="energyPlcConnect" :objList="objList" @successSubmit="successSubmit" />
|
||||
</base-dialog>
|
||||
|
||||
@ -9,7 +9,7 @@
|
||||
width="120">
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
<span v-if='singlePrice'><span class='priceTitle'>单价(元): </span>{{ singlePrice }}</span>
|
||||
<span v-if='singlePrice'><span class='priceTitle'>单价(元): </span>{{ singlePrice.toFixed(2) }}</span>
|
||||
<el-button
|
||||
slot="reference"
|
||||
type="text"
|
||||
@ -32,7 +32,8 @@ const temp1 = [
|
||||
},
|
||||
{
|
||||
prop: 'price',
|
||||
label: '单价(元)'
|
||||
label: '单价(元)',
|
||||
align: 'right'
|
||||
}
|
||||
]
|
||||
const temp2 = [
|
||||
@ -46,7 +47,8 @@ const temp2 = [
|
||||
},
|
||||
{
|
||||
prop: 'price',
|
||||
label: '单价(元)'
|
||||
label: '单价(元)',
|
||||
align: 'right'
|
||||
}
|
||||
]
|
||||
export default {
|
||||
@ -78,12 +80,20 @@ export default {
|
||||
console.log(res)
|
||||
if (res.data.pricingMethod === 0) {
|
||||
this.tableProps = this.temp1
|
||||
this.tableData = res.data.segPriceList
|
||||
this.singlePrice = ''
|
||||
let arr1 = res.data.segPriceList
|
||||
for (let item of arr1) {
|
||||
item.price = item.price.toFixed(2)
|
||||
}
|
||||
this.tableData = arr1
|
||||
} else if (res.data.pricingMethod === 1) {
|
||||
this.tableProps = this.temp2
|
||||
this.tableData = res.data.usedPriceList
|
||||
this.singlePrice = ''
|
||||
let arr2 = res.data.usedPriceList
|
||||
for (let item of arr2) {
|
||||
item.price = item.price.toFixed(2)
|
||||
}
|
||||
this.tableData = arr2
|
||||
} else {
|
||||
this.tableProps = []
|
||||
this.tableData = []
|
||||
|
||||
@ -1,5 +1,5 @@
|
||||
<template>
|
||||
<el-form ref="form" :rules="rules" label-width="80px" :model="form">
|
||||
<el-form ref="form" :rules="rules" label-width="100px" :model="form">
|
||||
<el-row>
|
||||
<el-col :span="12">
|
||||
<el-form-item label="能源类型" prop="name">
|
||||
|
||||
@ -26,28 +26,6 @@
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-row>
|
||||
<el-col :span="12">
|
||||
<el-form-item label="监控模式" prop="type">
|
||||
<el-select v-model="form.type" placeholder="请选择" style="width: 100%;" @change="typeChange">
|
||||
<el-option label="合并" :value= "1" ></el-option>
|
||||
<el-option label="详细" :value= "2" ></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item label="监控详细参数" prop="type" v-if="form.type === 2">
|
||||
<el-select v-model="form.plcParamId" placeholder="请选择" style="width: 100%;" @change="selectDetail">
|
||||
<el-option
|
||||
v-for="item in detailList"
|
||||
:key="item.id"
|
||||
:label="item.name"
|
||||
:value="item.id">
|
||||
</el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-row>
|
||||
<el-col :span="12">
|
||||
<el-form-item label="指标类型" prop="limitType">
|
||||
@ -61,10 +39,32 @@
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item label="监控模式" prop="type">
|
||||
<el-select v-model="form.type" placeholder="请选择" style="width: 100%;" @change="typeChange">
|
||||
<el-option label="合并" :value= "1" ></el-option>
|
||||
<el-option label="详细" :value= "2" ></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-row>
|
||||
<el-col :span="12">
|
||||
<el-form-item label="消耗量阈值">
|
||||
<el-input-number v-model="form.minValue" placeholder="最小值" :max="10000000000000000" style="width: 50%;"></el-input-number>
|
||||
<el-input-number v-model="form.maxValue" placeholder="最大值" :max="10000000000000000" style="width: 50%;"></el-input-number>
|
||||
<el-input-number v-model="form.minValue" placeholder="最小值" :max="9999999" style="width: 50%;"></el-input-number>
|
||||
<el-input-number v-model="form.maxValue" placeholder="最大值" :max="9999999" style="width: 50%;"></el-input-number>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item label="监控详细参数" prop="type" v-if="form.type === 2">
|
||||
<el-select v-model="form.plcParamId" placeholder="请选择" style="width: 100%;" @change="selectDetail">
|
||||
<el-option
|
||||
v-for="item in detailList"
|
||||
:key="item.id"
|
||||
:label="item.name"
|
||||
:value="item.id">
|
||||
</el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
|
||||
@ -37,7 +37,7 @@
|
||||
@cancel="handleCancel"
|
||||
@confirm="handleConfirm"
|
||||
:before-close="handleCancel"
|
||||
width='60%'
|
||||
width='50%'
|
||||
>
|
||||
<energy-limit-add ref="energyLimit" @successSubmit="successSubmit" :energyTypeList="energyTypeList" :objList="objList"/>
|
||||
</base-dialog>
|
||||
|
||||
@ -40,13 +40,13 @@ const tableProps = [
|
||||
prop: 'startTime',
|
||||
label: '开始时间',
|
||||
filter: parseTime,
|
||||
minWidth: 150
|
||||
minWidth: 160
|
||||
},
|
||||
{
|
||||
prop: 'endTime',
|
||||
label: '结束时间',
|
||||
filter: parseTime,
|
||||
minWidth: 150
|
||||
minWidth: 160
|
||||
},
|
||||
{
|
||||
prop: 'statisticName',
|
||||
|
||||
@ -70,7 +70,7 @@ export default {
|
||||
},
|
||||
{
|
||||
type: 'datePicker',
|
||||
label: '时间(必填)',
|
||||
label: '时间',
|
||||
dateType: 'datetimerange',
|
||||
format: 'yyyy-MM-dd HH:mm:ss',
|
||||
valueFormat: "timestamp",
|
||||
@ -80,7 +80,8 @@ export default {
|
||||
param: 'timeVal',
|
||||
defaultSelect: [],
|
||||
width: 350,
|
||||
clearable: false
|
||||
clearable: false,
|
||||
required:true
|
||||
},
|
||||
{
|
||||
type: 'button',
|
||||
|
||||
@ -172,11 +172,11 @@ export default {
|
||||
this.$modal.msgWarning('工单不能为空')
|
||||
return false
|
||||
}
|
||||
if (!val.objType) {
|
||||
if (!val.energyTypeId) {
|
||||
this.$modal.msgWarning('能源类型不能为空')
|
||||
return false
|
||||
}
|
||||
if (!val.energyTypeId) {
|
||||
if (!val.objType) {
|
||||
this.$modal.msgWarning('对象维度不能为空')
|
||||
return false
|
||||
}
|
||||
|
||||
@ -61,7 +61,7 @@
|
||||
rows: drawerBaseInfoRows,
|
||||
},
|
||||
{
|
||||
name: '属性列表',
|
||||
name: '采集参数',
|
||||
key: 'attrs',
|
||||
props: drawerListProps,
|
||||
url: '/base/equipment-plc-param/page',
|
||||
@ -75,18 +75,26 @@
|
||||
pageSize: 10,
|
||||
},
|
||||
tableBtn: [
|
||||
this.$auth.hasPermi('equipment:collection-config-param:update')
|
||||
? {
|
||||
{
|
||||
type: 'edit',
|
||||
btnName: '修改',
|
||||
}
|
||||
: undefined,
|
||||
this.$auth.hasPermi('equipment:collection-config-param:delete')
|
||||
? {
|
||||
},
|
||||
{
|
||||
type: 'delete',
|
||||
btnName: '删除',
|
||||
}
|
||||
: undefined,
|
||||
},
|
||||
// this.$auth.hasPermi('equipment:collection-config-param:update')
|
||||
// ? {
|
||||
// type: 'edit',
|
||||
// btnName: '修改',
|
||||
// }
|
||||
// : undefined,
|
||||
// this.$auth.hasPermi('equipment:collection-config-param:delete')
|
||||
// ? {
|
||||
// type: 'delete',
|
||||
// btnName: '删除',
|
||||
// }
|
||||
// : undefined,
|
||||
].filter((v) => v),
|
||||
allowAdd: true,
|
||||
},
|
||||
@ -106,7 +114,6 @@ import {
|
||||
getEquipmentPlcConnectPage,
|
||||
exportEquipmentPlcConnectExcel,
|
||||
} from '@/api/base/equipmentPlcConnect';
|
||||
import moment from 'moment';
|
||||
import basicPageMixin from '@/mixins/lb/basicPageMixin';
|
||||
// import './http';
|
||||
import BasicDrawer from './components/BasicDrawer.vue';
|
||||
@ -182,13 +189,15 @@ export default {
|
||||
placeholder: '请选择设备',
|
||||
param: 'equipmentId',
|
||||
selectOptions: [],
|
||||
filterable: true
|
||||
},
|
||||
{
|
||||
type: 'select',
|
||||
label: '编码',
|
||||
placeholder: '请选择编码',
|
||||
label: '关联表编码',
|
||||
placeholder: '请选择关联表编码',
|
||||
param: 'plcId',
|
||||
selectOptions: [],
|
||||
filterable: true
|
||||
},
|
||||
{
|
||||
type: 'button',
|
||||
@ -224,7 +233,9 @@ export default {
|
||||
prop: 'plcId',
|
||||
labelKey: `plcTableName`,
|
||||
url: '/base/equipment-plc/listAll',
|
||||
rules: [{ required: true, message: '关联表名不能为空', trigger: 'blur' }],
|
||||
rules: [
|
||||
{ required: true, message: '关联表名不能为空', trigger: 'blur' },
|
||||
],
|
||||
bind: {
|
||||
filterable: true,
|
||||
},
|
||||
@ -236,7 +247,9 @@ export default {
|
||||
label: '设备',
|
||||
prop: 'equipmentId',
|
||||
url: '/base/core-equipment/page?pageNo=1&pageSize=99',
|
||||
rules: [{ required: true, message: '设备不能为空', trigger: 'blur' }],
|
||||
rules: [
|
||||
{ required: true, message: '设备不能为空', trigger: 'blur' },
|
||||
],
|
||||
bind: {
|
||||
filterable: true,
|
||||
},
|
||||
@ -262,7 +275,9 @@ export default {
|
||||
input: true,
|
||||
label: '设备名',
|
||||
prop: 'equipmentName',
|
||||
rules: [{ required: true, message: '设备名不能为空', trigger: 'blur' }],
|
||||
rules: [
|
||||
{ required: true, message: '设备名不能为空', trigger: 'blur' },
|
||||
],
|
||||
// bind: {
|
||||
// disabled: this.editMode == 'detail', // some condition, like detail mode...
|
||||
// }
|
||||
@ -296,7 +311,8 @@ export default {
|
||||
label: '生产参数类型',
|
||||
filter: (val) =>
|
||||
val != null
|
||||
? ['', '进片数量', '出片数量', '破损数量', '无类型', ''][val]
|
||||
// ? ['', '进片数量', '出片数量', '破损数量', '无类型', ''][val]
|
||||
? ['', '进口计数', '出口计数', '损耗计数', '无类型', ''][val]
|
||||
: '-',
|
||||
},
|
||||
{
|
||||
|
||||
@ -59,7 +59,6 @@ import {
|
||||
getEquipmentPlcPage,
|
||||
exportEquipmentPlcExcel,
|
||||
} from '@/api/base/equipmentPlc';
|
||||
import moment from 'moment';
|
||||
import basicPageMixin from '@/mixins/lb/basicPageMixin';
|
||||
|
||||
const switchBtn = {
|
||||
@ -352,7 +351,7 @@ export default {
|
||||
handleDelete(row) {
|
||||
const id = row.id;
|
||||
this.$modal
|
||||
.confirm('是否确认删除实时数据采集配置编号为"' + id + '"的数据项?')
|
||||
.confirm('是否确认删除该配置?')
|
||||
.then(function () {
|
||||
return deleteEquipmentPlc(id);
|
||||
})
|
||||
|
||||
@ -194,13 +194,17 @@ export default {
|
||||
input: true,
|
||||
label: '参数列名',
|
||||
prop: 'plcParamName',
|
||||
rules: [{ required: true, message: '参数列名不能为空', trigger: 'blur' }],
|
||||
rules: [
|
||||
{ required: true, message: '参数列名不能为空', trigger: 'blur' },
|
||||
],
|
||||
},
|
||||
{
|
||||
input: true,
|
||||
label: '参数名称',
|
||||
prop: 'name',
|
||||
rules: [{ required: true, message: '参数名称不能为空', trigger: 'blur' }],
|
||||
rules: [
|
||||
{ required: true, message: '参数名称不能为空', trigger: 'blur' },
|
||||
],
|
||||
},
|
||||
],
|
||||
[
|
||||
@ -230,19 +234,35 @@ export default {
|
||||
{ label: '工艺参数', value: 2 },
|
||||
{ label: '报警参数', value: 3 },
|
||||
],
|
||||
rules: [{ required: true, message: '设备参数类型不能为空', trigger: 'blur' }],
|
||||
rules: [
|
||||
{
|
||||
required: true,
|
||||
message: '设备参数类型不能为空',
|
||||
trigger: 'blur',
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
select: true,
|
||||
label: '生产参数类型',
|
||||
prop: 'production_param_type',
|
||||
options: [
|
||||
{ label: '进片数量', value: 1 },
|
||||
{ label: '出片数量', value: 2 },
|
||||
{ label: '破损数量', value: 3 },
|
||||
// { label: '进片数量', value: 1 },
|
||||
// { label: '出片数量', value: 2 },
|
||||
// { label: '破损数量', value: 3 },
|
||||
// { label: '无类型', value: 4 },
|
||||
{ label: '进口计数', value: 1 },
|
||||
{ label: '出口计数', value: 2 },
|
||||
{ label: '损耗计数', value: 3 },
|
||||
{ label: '无类型', value: 4 },
|
||||
],
|
||||
rules: [{ required: true, message: '生产参数类型不能为空', trigger: 'blur' }],
|
||||
rules: [
|
||||
{
|
||||
required: true,
|
||||
message: '生产参数类型不能为空',
|
||||
trigger: 'blur',
|
||||
},
|
||||
],
|
||||
},
|
||||
],
|
||||
[
|
||||
@ -305,6 +325,7 @@ export default {
|
||||
infoQuery: null, // 基本信息的请求
|
||||
attrFormSubmitting: false,
|
||||
attrListLoading: false,
|
||||
shouldRefreshPageView: false,
|
||||
};
|
||||
},
|
||||
computed: {
|
||||
@ -323,10 +344,12 @@ export default {
|
||||
});
|
||||
},
|
||||
tableBtn() {
|
||||
return this.mode == 'detail' ? [] : this.sections[1].tableBtn;
|
||||
return this.sections[1].tableBtn;
|
||||
// return this.mode == 'detail' ? [] : this.sections[1].tableBtn;
|
||||
},
|
||||
},
|
||||
mounted() {
|
||||
this.shouldRefreshPageView = false;
|
||||
this.mode = this.defaultMode || 'detail';
|
||||
for (const section of this.sections) {
|
||||
// 请求具体信息
|
||||
@ -403,6 +426,9 @@ export default {
|
||||
},
|
||||
|
||||
handleCancel() {
|
||||
if (this.shouldRefreshPageView) {
|
||||
this.$emit('refreshDataList');
|
||||
}
|
||||
this.visible = false;
|
||||
},
|
||||
|
||||
@ -426,7 +452,7 @@ export default {
|
||||
remark: '',
|
||||
alarmContent: '',
|
||||
};
|
||||
this.attrTitle = '添加设备绑定信息';
|
||||
this.attrTitle = '添加参数绑定信息';
|
||||
this.attrFormVisible = true;
|
||||
},
|
||||
|
||||
@ -439,14 +465,14 @@ export default {
|
||||
});
|
||||
if (res.code == 0) {
|
||||
this.attrForm = res.data;
|
||||
this.attrTitle = '编辑设备绑定信息';
|
||||
this.attrTitle = '编辑参数绑定信息';
|
||||
this.attrFormVisible = true;
|
||||
}
|
||||
},
|
||||
|
||||
// 删除属性
|
||||
handleDeleteAttr(attrId) {
|
||||
this.$confirm('确定删除该分组报警?', '提示', {
|
||||
this.$confirm('确定删除该参数?', '提示', {
|
||||
confirmButtonText: '确定',
|
||||
cancelButtonText: '取消',
|
||||
type: 'warning',
|
||||
@ -458,6 +484,7 @@ export default {
|
||||
params: { id: attrId },
|
||||
});
|
||||
if (res.code == 0) {
|
||||
this.shouldRefreshPageView = true;
|
||||
this.$message({
|
||||
message: '删除成功',
|
||||
type: 'success',
|
||||
@ -472,12 +499,12 @@ export default {
|
||||
},
|
||||
|
||||
// 提交属性表
|
||||
async submitAttrForm() {
|
||||
this.$refs['attrForm'].validate((valid) => {
|
||||
submitAttrForm() {
|
||||
this.$refs['attrForm'].validate(async (valid) => {
|
||||
if (!valid) {
|
||||
return;
|
||||
}
|
||||
});
|
||||
|
||||
const isEdit = this.attrForm.id != null;
|
||||
this.attrFormSubmitting = true;
|
||||
const res = await this.$axios({
|
||||
@ -497,10 +524,12 @@ export default {
|
||||
duration: 1500,
|
||||
onClose: () => {
|
||||
this.getAttrList();
|
||||
this.shouldRefreshPageView = true;
|
||||
},
|
||||
});
|
||||
}
|
||||
this.attrFormSubmitting = false;
|
||||
});
|
||||
},
|
||||
|
||||
closeAttrForm() {
|
||||
@ -509,7 +538,7 @@ export default {
|
||||
|
||||
handleClick(raw) {
|
||||
if (raw.type === 'delete') {
|
||||
this.$confirm(`确定删除该报警?`, '提示', {
|
||||
this.$confirm(`确定删除该参数?`, '提示', {
|
||||
confirmButtonText: '确定',
|
||||
cancelButtonText: '取消',
|
||||
type: 'warning',
|
||||
|
||||
@ -482,7 +482,7 @@ export default {
|
||||
|
||||
async submitForm() {
|
||||
const { code, data } = await this.$axios({
|
||||
url: '/analysis/equipment-analysis/quantity',
|
||||
url: '/monitoring/equipment-monitor/quantity-series',
|
||||
method: 'get',
|
||||
params: this.queryParams,
|
||||
});
|
||||
|
||||
@ -6,19 +6,29 @@
|
||||
-->
|
||||
|
||||
<template>
|
||||
<div class="status-timegraph-container" style="background: #f2f4f9; flex: 1; display: flex; flex-direction: column">
|
||||
<el-row class="" style="
|
||||
<div
|
||||
class="status-timegraph-container"
|
||||
style="background: #f2f4f9; flex: 1; display: flex; flex-direction: column">
|
||||
<el-row
|
||||
class=""
|
||||
style="
|
||||
margin-bottom: 12px;
|
||||
background: #fff;
|
||||
padding: 16px 16px 0;
|
||||
border-radius: 8px;
|
||||
">
|
||||
<div class="blue-title">生产节拍时序图</div>
|
||||
<SearchBar :formConfigs="searchBarFormConfig" ref="search-bar" :remove-blue="true"
|
||||
@select-changed="handleSearchBarSelectChange" @headBtnClick="handleSearchBarBtnClick" />
|
||||
<SearchBar
|
||||
:formConfigs="searchBarFormConfig"
|
||||
ref="search-bar"
|
||||
:remove-blue="true"
|
||||
@select-changed="handleSearchBarSelectChange"
|
||||
@headBtnClick="handleSearchBarBtnClick" />
|
||||
</el-row>
|
||||
|
||||
<el-row class="" style="
|
||||
<el-row
|
||||
class=""
|
||||
style="
|
||||
height: 1px;
|
||||
flex: 1;
|
||||
margin-bottom: 12px;
|
||||
@ -47,17 +57,36 @@
|
||||
</div>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<div class="main-area" style="flex: 1; display: flex; flex-direction: column">
|
||||
<div class="graphs" v-show="graphList.length" id="status-chart" style="height: 1px; flex: 1"></div>
|
||||
<div
|
||||
class="main-area"
|
||||
style="flex: 1; display: flex; flex-direction: column">
|
||||
<div
|
||||
class="graphs"
|
||||
v-show="graphList.length"
|
||||
id="status-chart"
|
||||
style="height: 1px; flex: 1"></div>
|
||||
<h2 v-if="!graphList || graphList.length == 0" class="no-data-bg"></h2>
|
||||
</div>
|
||||
</el-row>
|
||||
|
||||
<!-- 对话框(添加 / 修改) -->
|
||||
<base-dialog dialogTitle="添加设备" :dialogVisible="open" width="500px" @close="open = false" @cancel="open = false"
|
||||
<base-dialog
|
||||
dialogTitle="添加设备"
|
||||
:dialogVisible="open"
|
||||
width="500px"
|
||||
@close="open = false"
|
||||
@cancel="open = false"
|
||||
@confirm="submitForm">
|
||||
<el-select v-if="open" style="width: 100%" v-model="queryParams.equipmentId" placeholder="请选择一个设备">
|
||||
<el-option v-for="eq in eqList" :key="eq.id" :value="eq.id" :label="eq.name"></el-option>
|
||||
<el-select
|
||||
v-if="open"
|
||||
style="width: 100%"
|
||||
v-model="queryParams.equipmentId"
|
||||
placeholder="请选择一个设备">
|
||||
<el-option
|
||||
v-for="eq in eqList"
|
||||
:key="eq.id"
|
||||
:value="eq.id"
|
||||
:label="eq.name"></el-option>
|
||||
</el-select>
|
||||
</base-dialog>
|
||||
</div>
|
||||
@ -129,7 +158,7 @@ export default {
|
||||
open: false,
|
||||
eqList: [],
|
||||
startTime: null,
|
||||
gantt: null
|
||||
gantt: null,
|
||||
// demo: [
|
||||
// [
|
||||
// {
|
||||
@ -159,7 +188,7 @@ export default {
|
||||
this.initEquipment();
|
||||
// this.getList();
|
||||
},
|
||||
mounted() { },
|
||||
mounted() {},
|
||||
watch: {
|
||||
graphList: {
|
||||
handler(val) {
|
||||
@ -171,7 +200,6 @@ export default {
|
||||
return;
|
||||
}
|
||||
this.gantt.update(val);
|
||||
|
||||
});
|
||||
}
|
||||
return;
|
||||
@ -215,7 +243,9 @@ export default {
|
||||
params: this.queryParams,
|
||||
});
|
||||
if (code == 0) {
|
||||
this.existingEquipments = Object.values(data).map((eq) => eq[0].equipmentId);
|
||||
this.existingEquipments = Object.values(data).map(
|
||||
(eq) => eq[0].equipmentId
|
||||
);
|
||||
this.graphList = this.objectToArray(data);
|
||||
}
|
||||
},
|
||||
@ -302,7 +332,7 @@ export default {
|
||||
return;
|
||||
}
|
||||
|
||||
this.startTime = new Date(payload.recordTime)
|
||||
this.startTime = new Date(payload.recordTime);
|
||||
this.queryParams.lineId = payload.lineId || null;
|
||||
this.queryParams.sectionId = payload.sectionId || null;
|
||||
this.queryParams.equipmentId = payload.equipmentId || null;
|
||||
@ -337,7 +367,7 @@ export default {
|
||||
return;
|
||||
}
|
||||
const { code, data } = await this.$axios({
|
||||
url: '/analysis/equipment-analysis/status',
|
||||
url: '/monitoring/equipment-monitor/status-series',
|
||||
method: 'get',
|
||||
params: this.queryParams,
|
||||
});
|
||||
@ -444,7 +474,7 @@ export default {
|
||||
}
|
||||
|
||||
.running {
|
||||
background-color: #288AFF;
|
||||
background-color: #288aff;
|
||||
// background-color: #84f04e;
|
||||
}
|
||||
|
||||
@ -455,7 +485,7 @@ export default {
|
||||
|
||||
.fault {
|
||||
// background-color: #ea5b5b;
|
||||
background-color: #FC9C91;
|
||||
background-color: #fc9c91;
|
||||
}
|
||||
|
||||
.full {
|
||||
@ -469,7 +499,7 @@ export default {
|
||||
}
|
||||
|
||||
.stop {
|
||||
background-color: #FFDC94;
|
||||
background-color: #ffdc94;
|
||||
}
|
||||
|
||||
.legend-row {
|
||||
@ -478,7 +508,7 @@ export default {
|
||||
display: flex;
|
||||
justify-content: flex-end;
|
||||
|
||||
>.legend:not(:last-child) {
|
||||
> .legend:not(:last-child) {
|
||||
margin-right: 12px;
|
||||
}
|
||||
|
||||
@ -521,7 +551,7 @@ export default {
|
||||
background: #ccc;
|
||||
}
|
||||
|
||||
.echarts__status-chart>div {
|
||||
.echarts__status-chart > div {
|
||||
height: 100% !important;
|
||||
width: 100% !important;
|
||||
}
|
||||
|
||||
@ -58,7 +58,7 @@ const tableProps = [
|
||||
prop: 'createTime',
|
||||
label: '创建时间',
|
||||
filter: parseTime,
|
||||
minWidth: 150
|
||||
minWidth: 160
|
||||
},
|
||||
{
|
||||
prop: 'name',
|
||||
|
||||
@ -2,14 +2,16 @@
|
||||
<div>
|
||||
<el-drawer title="查看详情" :visible.sync="visible" size="70%">
|
||||
<div class="box">
|
||||
<el-form :inline="true">
|
||||
<el-form-item label="工单名称">
|
||||
<el-input v-model="queryParams.workOrderName" size='small' readonly></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item label="班组名称">
|
||||
<el-input v-model="queryParams.teamName" size='small' readonly></el-input>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
<el-row class="topBox">
|
||||
<el-col :span="6">
|
||||
<p class="boldTitle">工单名称</p>
|
||||
<p class="lightText">{{ queryParams.workOrderName ? queryParams.workOrderName : '-' }}</p>
|
||||
</el-col>
|
||||
<el-col :span="6">
|
||||
<p class="boldTitle">班组名称</p>
|
||||
<p class="lightText">{{ queryParams.teamName ? queryParams.teamName : '-' }}</p>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<base-table
|
||||
:table-props="tableProps"
|
||||
:table-data="tableData"
|
||||
@ -27,13 +29,13 @@ const tableProps = [
|
||||
prop: 'startTime',
|
||||
label: '开始时间',
|
||||
filter: parseTime,
|
||||
minWidth: 150
|
||||
minWidth: 160
|
||||
},
|
||||
{
|
||||
prop: 'endTime',
|
||||
label: '结束时间',
|
||||
filter: parseTime,
|
||||
minWidth: 150
|
||||
minWidth: 160
|
||||
},
|
||||
{
|
||||
prop: 'num',
|
||||
@ -49,17 +51,15 @@ export default {
|
||||
data() {
|
||||
return {
|
||||
visible: false,
|
||||
workOrderName: '',
|
||||
teamName: '',
|
||||
tableProps,
|
||||
tableData: [],
|
||||
tableH: this.tableHeight(200),
|
||||
tableH: this.tableHeight(260),
|
||||
queryParams: {}
|
||||
}
|
||||
},
|
||||
created() {
|
||||
window.addEventListener('resize', () => {
|
||||
this.tableH = this.tableHeight(200)
|
||||
this.tableH = this.tableHeight(260)
|
||||
})
|
||||
},
|
||||
methods: {
|
||||
@ -79,5 +79,23 @@ export default {
|
||||
<style lang="scss" scoped>
|
||||
.box {
|
||||
padding: 0 32px;
|
||||
.topBox {
|
||||
padding-bottom: 30px;
|
||||
margin-bottom: 30px;
|
||||
border-bottom: 1px solid #E9E9E9;
|
||||
.boldTitle {
|
||||
font-size: 14px;
|
||||
font-weight: 600;
|
||||
color: rgba(0,0,0,0.85);
|
||||
margin: 0;
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
.lightText {
|
||||
font-size: 14px;
|
||||
font-weight: 400;
|
||||
color: rgba(102,102,102,0.75);
|
||||
margin: 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@ -59,7 +59,8 @@ export default {
|
||||
label: '工单',
|
||||
selectOptions: [],
|
||||
param: 'workOrderId',
|
||||
clearable: false
|
||||
clearable: false,
|
||||
filterable: true
|
||||
},
|
||||
{
|
||||
type: 'button',
|
||||
|
||||
@ -17,7 +17,7 @@
|
||||
<method-btn
|
||||
v-if="tableBtn.length"
|
||||
slot="handleBtn"
|
||||
:width="160"
|
||||
:width="80"
|
||||
label="操作"
|
||||
:method-list="tableBtn"
|
||||
@clickBtn="handleClick"
|
||||
@ -42,7 +42,7 @@ const tableProps = [
|
||||
prop: 'createTime',
|
||||
label: '排班创建时间',
|
||||
filter: parseTime,
|
||||
minWidth: 150
|
||||
minWidth: 160
|
||||
},
|
||||
{
|
||||
prop: 'startDay',
|
||||
@ -53,13 +53,13 @@ const tableProps = [
|
||||
prop: 'startTime',
|
||||
label: '上班时间',
|
||||
filter: parseTime,
|
||||
minWidth: 150
|
||||
minWidth: 160
|
||||
},
|
||||
{
|
||||
prop: 'endTime',
|
||||
label: '下班时间',
|
||||
filter: parseTime,
|
||||
minWidth: 150
|
||||
minWidth: 160
|
||||
},
|
||||
{
|
||||
prop: 'classesName',
|
||||
@ -120,8 +120,8 @@ export default {
|
||||
tableBtn: [
|
||||
this.$auth.hasPermi('base:team-production:detail')
|
||||
? {
|
||||
type: 'viewDetail',
|
||||
btnName: '查看生产情况'
|
||||
type: 'detail',
|
||||
btnName: '详情'
|
||||
}
|
||||
: undefined
|
||||
].filter((v) => v),
|
||||
|
||||
@ -71,29 +71,11 @@
|
||||
<img
|
||||
src="../assets/logo/cnbm.png"
|
||||
alt="cnbm_logo"
|
||||
style="
|
||||
height: 48px;
|
||||
width: 48px;
|
||||
position: relative;
|
||||
top: 12px;
|
||||
right: 8px;
|
||||
" />
|
||||
style=""
|
||||
class="cnbm_logo" />
|
||||
<span>中建材智能自动化研究院有限公司</span>
|
||||
</h3>
|
||||
<h3
|
||||
class="sub-title"
|
||||
style="
|
||||
margin: 0;
|
||||
margin-left: 32px;
|
||||
font-weight: 400;
|
||||
user-select: none;
|
||||
color: #000;
|
||||
font-size: 36px;
|
||||
line-height: 54px;
|
||||
letter-spacing: 2px;
|
||||
">
|
||||
MES
|
||||
</h3>
|
||||
<h3 class="sub-title" style="">MES</h3>
|
||||
</h2>
|
||||
|
||||
<!-- 表单 -->
|
||||
@ -193,9 +175,9 @@
|
||||
style="
|
||||
cursor: pointer;
|
||||
color: #0b58ff;
|
||||
font-size: 18px;
|
||||
line-height: 66px;
|
||||
padding-right: 12px;
|
||||
font-size: calc(12 * 0.12vh);
|
||||
line-height: calc(54 * 0.12vh);
|
||||
padding-right: calc(10 * 0.12vh);
|
||||
">
|
||||
获取验证码
|
||||
</span>
|
||||
@ -215,7 +197,11 @@
|
||||
:loading="loading"
|
||||
size="medium"
|
||||
type="primary"
|
||||
style="width: 100%; height: 66px; font-size: 18px"
|
||||
style="
|
||||
width: 100%;
|
||||
height: calc(52 * 0.12vh);
|
||||
font-size: calc(14 * 0.12vh);
|
||||
"
|
||||
@click.native.prevent="getCode">
|
||||
<span v-if="!loading">登 录</span>
|
||||
<span v-else>登 录 中...</span>
|
||||
@ -349,7 +335,7 @@ export default {
|
||||
};
|
||||
},
|
||||
created() {
|
||||
document.body.style['min-height'] = '1024px';
|
||||
// document.body.style['min-height'] = '1024px';
|
||||
// 租户开关
|
||||
this.tenantEnable = getTenantEnable();
|
||||
if (this.tenantEnable) {
|
||||
|
||||
@ -65,7 +65,7 @@ const tableProps = [
|
||||
prop: 'createTime',
|
||||
label: '添加时间',
|
||||
filter: parseTime,
|
||||
minWidth: 150
|
||||
minWidth: 160
|
||||
},
|
||||
{
|
||||
prop: 'name',
|
||||
@ -101,12 +101,12 @@ const tableProps = [
|
||||
{
|
||||
prop: 'planQuantity',
|
||||
label: '计划加工量',
|
||||
width: 90
|
||||
width: 100
|
||||
},
|
||||
{
|
||||
prop: 'actualQuantity',
|
||||
label: '实际加工量',
|
||||
width: 90
|
||||
width: 100
|
||||
},
|
||||
{
|
||||
prop: 'productName',
|
||||
@ -341,6 +341,7 @@ export default {
|
||||
item.customerId = i.name
|
||||
}
|
||||
}
|
||||
item.price = item.price.toFixed(2)
|
||||
})
|
||||
this.list = arr
|
||||
}
|
||||
|
||||
@ -5,6 +5,7 @@
|
||||
<span class="blueTitle"></span>
|
||||
<span>订单编码: {{orderMsg.code}}</span>
|
||||
</div>
|
||||
<el-button type="primary" plain size="small" style="float: right;" @click="returnOrderManage">返回</el-button>
|
||||
<div style="padding-left: 14px;">
|
||||
<el-row>
|
||||
<el-col :span='3'>
|
||||
@ -133,7 +134,7 @@ const tableProps1 = [
|
||||
prop: 'issueTime',
|
||||
label: '下发时间',
|
||||
filter: parseTime,
|
||||
minWidth: 150
|
||||
minWidth: 160
|
||||
},
|
||||
{
|
||||
prop: 'name',
|
||||
@ -147,19 +148,19 @@ const tableProps1 = [
|
||||
minWidth: 150
|
||||
},
|
||||
{
|
||||
prop: 'planQuantity',
|
||||
prop: 'planAssignmentQuantity',
|
||||
label: '计划加工量',
|
||||
width: 90
|
||||
width: 100
|
||||
},
|
||||
{
|
||||
prop: 'actualQuantity',
|
||||
label: '实际加工量',
|
||||
width: 90
|
||||
width: 100
|
||||
},
|
||||
{
|
||||
prop: 'actualArea',
|
||||
label: '加工平方数',
|
||||
width: 90
|
||||
width: 100
|
||||
},
|
||||
{
|
||||
prop: 'status',
|
||||
@ -170,13 +171,13 @@ const tableProps1 = [
|
||||
prop: 'startProduceTime',
|
||||
label: '开始时间',
|
||||
filter: parseTime,
|
||||
minWidth: 150
|
||||
minWidth: 160
|
||||
},
|
||||
{
|
||||
prop: 'finishProduceTime',
|
||||
label: '结束时间',
|
||||
filter: parseTime,
|
||||
minWidth: 150
|
||||
minWidth: 160
|
||||
},
|
||||
{
|
||||
prop: 'productLineNames',
|
||||
@ -278,6 +279,10 @@ export default {
|
||||
}
|
||||
})
|
||||
})
|
||||
},
|
||||
// 返回
|
||||
returnOrderManage() {
|
||||
this.$router.push({path: '/order/base/order-manage'})
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
168
src/views/order/monitoring/components/monitoringRingCharts.vue
Normal file
168
src/views/order/monitoring/components/monitoringRingCharts.vue
Normal file
@ -0,0 +1,168 @@
|
||||
<template>
|
||||
<div>
|
||||
<div class="boxTitle">
|
||||
<span class="blueTitle"></span>
|
||||
<span>各订单环形图</span>
|
||||
</div>
|
||||
<div class="chartBox" id='orderChartBox' v-show='chartList.length'>
|
||||
<div class="chartItem" v-for="(item, index) in chartList" :key='index' :style="{width: 388*beilv+'px',height: 286*beilv+'px',padding:14*beilv+'px',marginRight:9*beilv+'px',marginBottom:9*beilv+'px'}">
|
||||
<div class="topTitle" :style="{fontSize: 14 * beilv + 'px'}">
|
||||
<svg-icon icon-class="order-monitoring" :style="{fontSize: 16*beilv+'px'}"/>
|
||||
<span class="orderName" :style="{paddingRight:8*beilv+'px',marginRight:8*beilv+'px'}">{{item.orderName}}</span>
|
||||
<span>订单计划数量{{item.num}}</span>
|
||||
</div>
|
||||
<div
|
||||
:id="item.id"
|
||||
:style="{width: 166*beilv+'px',height: 166*beilv+'px',margin: 'auto'}"
|
||||
></div>
|
||||
<div class="legend" :style="{height: 54 * beilv + 'px', marginTop: 10*beilv+'px'}">
|
||||
<div class="legendItem" v-for="(subItem, i) in item.workOrder" :key='i' :style="{paddingRight:9*beilv+'px',marginRight:9*beilv+'px'}">
|
||||
<span class="itemNum" :style="{fontSize: 18 * beilv + 'px'}">{{subItem.value}}</span>
|
||||
<div>
|
||||
<span class="itemName" :style="{fontSize: 14 * beilv + 'px'}">
|
||||
<span class="smallBlock" :style="{backgroundColor:subItem.color,width:8*beilv+'px',height:8*beilv+'px'}"></span>
|
||||
{{subItem.name}}
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- 空图 -->
|
||||
<div class="no-data-bg" v-show='!chartList.length'></div>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
import * as echarts from 'echarts'
|
||||
import { debounce } from '@/utils/debounce'
|
||||
export default {
|
||||
name: 'MonitoringRingCharts',
|
||||
props: {
|
||||
chartList: {
|
||||
type: Array,
|
||||
default: () => {
|
||||
return []
|
||||
}
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
myChart: [],
|
||||
beilv: 1,
|
||||
canvasReset: ''
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
this.beilv = document.getElementById('orderChartBox').offsetWidth / 1610
|
||||
this.canvasReset = debounce(() => {
|
||||
this.initChart()
|
||||
}, 500)
|
||||
window.addEventListener('resize', () => {
|
||||
this.beilv = document.getElementById('orderChartBox').offsetWidth / 1610
|
||||
this.canvasReset()
|
||||
})
|
||||
},
|
||||
methods: {
|
||||
// 饼图
|
||||
initChart() {
|
||||
if (this.chartList.length <= 0) {
|
||||
return false
|
||||
}
|
||||
// 销毁实例
|
||||
for (let j = 0;j < this.chartList.length; j++) {
|
||||
if (this.myChart[j]) {
|
||||
this.myChart[j].dispose() // 页面多次刷新会出现警告，Dom已经初始化了一个实例，这是销毁实例
|
||||
}
|
||||
}
|
||||
for (let i = 0; i < this.chartList.length; i++) {
|
||||
var chartDom = document.getElementById(this.chartList[i].id);
|
||||
this.myChart[i] = echarts.init(chartDom);
|
||||
let colorList = []
|
||||
this.chartList[i].workOrder.map(item => {
|
||||
colorList.push(item.color)
|
||||
})
|
||||
let percentage = (this.chartList[i].sunNum/this.chartList[i].num*100).toFixed(0)
|
||||
var option = {
|
||||
color: colorList,
|
||||
series: [
|
||||
{
|
||||
name: 'Access From',
|
||||
type: 'pie',
|
||||
radius: ['75%', '95%'],
|
||||
avoidLabelOverlap: false,
|
||||
itemStyle: {
|
||||
borderRadius: 5,
|
||||
borderColor: '#fff',
|
||||
borderWidth: 2
|
||||
},
|
||||
label: {
|
||||
show: true,
|
||||
position: 'center',
|
||||
color: '#000',
|
||||
formatter: [
|
||||
'{a|'+percentage+'%}',
|
||||
'{b|生产'+this.chartList[i].sunNum+'}'
|
||||
].join('\n\n'),
|
||||
rich: {
|
||||
a: {
|
||||
fontSize: this.beilv*24 +'px'
|
||||
},
|
||||
b: {
|
||||
fontSize: this.beilv*12 +'px'
|
||||
}
|
||||
}
|
||||
},
|
||||
emphasis: {
|
||||
disabled: true
|
||||
},
|
||||
labelLine: {
|
||||
show: false
|
||||
},
|
||||
data: this.chartList[i].workOrder
|
||||
}
|
||||
]
|
||||
};
|
||||
option && this.myChart[i].setOption(option)
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
<style lang='scss' scoped>
|
||||
.chartBox {
|
||||
width: 100%;
|
||||
padding-right: 6px;
|
||||
height: calc(100vh - 310px);
|
||||
display: flex;
|
||||
flex-flow: row wrap;
|
||||
overflow: auto;
|
||||
align-content: flex-start;
|
||||
.chartItem {
|
||||
border-radius: 8px;
|
||||
border: 1px solid #CACACA;
|
||||
.topTitle {
|
||||
margin-bottom: 10px;
|
||||
.orderName {
|
||||
border-right: 1px solid #CACACA;
|
||||
}
|
||||
}
|
||||
.legend {
|
||||
text-align: center;
|
||||
white-space: nowrap;
|
||||
overflow: auto;
|
||||
.legendItem {
|
||||
display: inline-block;
|
||||
border-right: 1px solid #E8E8E8;
|
||||
.itemName {
|
||||
.smallBlock {
|
||||
display: inline-block;
|
||||
}
|
||||
}
|
||||
}
|
||||
.legendItem:last-child {
|
||||
border: none;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@ -6,24 +6,12 @@
|
||||
ref="searchBarForm"
|
||||
@headBtnClick="buttonClick"
|
||||
/>
|
||||
<base-table
|
||||
:page="1"
|
||||
:limit="5000"
|
||||
:table-props="tableProps"
|
||||
:table-data="list"
|
||||
:max-height="tableH"
|
||||
>
|
||||
<method-btn
|
||||
v-if="tableBtn.length"
|
||||
slot="handleBtn"
|
||||
:width="250"
|
||||
label="操作"
|
||||
:method-list="tableBtn"
|
||||
@clickBtn="handleClick"
|
||||
/>
|
||||
</base-table>
|
||||
<!-- <el-tabs v-model="activeName" @tab-click="toggleTab">
|
||||
<el-tab-pane label="数据列表" name="dataList">
|
||||
<el-tabs v-model="activeName" @tab-click="toggleTab">
|
||||
<el-tab-pane label="数据列表" name="dataList"></el-tab-pane>
|
||||
<el-tab-pane label="环形图" name="barChart"></el-tab-pane>
|
||||
</el-tabs>
|
||||
<!-- 表 -->
|
||||
<div v-if="activeName === 'dataList'">
|
||||
<base-table
|
||||
:page="queryParams.pageNo"
|
||||
:limit="queryParams.pageSize"
|
||||
@ -40,25 +28,23 @@
|
||||
@clickBtn="handleClick"
|
||||
/>
|
||||
</base-table>
|
||||
</el-tab-pane>
|
||||
<el-tab-pane label="环形图" name="barChart">
|
||||
<div class="boxTitle">
|
||||
<span class="blueTitle"></span>
|
||||
<span>各订单环形图</span>
|
||||
<pagination
|
||||
:page.sync="queryParams.pageNo"
|
||||
:limit.sync="queryParams.pageSize"
|
||||
:total="total"
|
||||
@pagination="getPage"
|
||||
/>
|
||||
</div>
|
||||
<div
|
||||
id="orderPieBar"
|
||||
style="width: 182px; height: 180px;"
|
||||
></div>
|
||||
</el-tab-pane>
|
||||
</el-tabs> -->
|
||||
<!-- 图 -->
|
||||
<monitoring-ring-charts ref='monitoringRingCharts' v-else :chart-list='chartList'/>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
import * as echarts from 'echarts'
|
||||
import { parseTime } from '@/utils/ruoyi'
|
||||
import { publicFormatter } from '@/utils/dict'
|
||||
import { orderMonitor, orderList } from '@/api/base/orderManage'
|
||||
import { orderMonitor, orderAssignmentList } from '@/api/base/orderManage'
|
||||
import MonitoringRingCharts from './../components/monitoringRingCharts'
|
||||
import moment from "moment"
|
||||
const tableProps = [
|
||||
{
|
||||
prop: 'name',
|
||||
@ -76,13 +62,13 @@ const tableProps = [
|
||||
prop: 'planStartTime',
|
||||
label: '计划开始时间',
|
||||
filter: parseTime,
|
||||
minWidth: 150
|
||||
minWidth: 160
|
||||
},
|
||||
{
|
||||
prop: 'planFinishTime',
|
||||
label: '计划完成时间',
|
||||
filter: parseTime,
|
||||
minWidth: 150
|
||||
minWidth: 160
|
||||
},
|
||||
{
|
||||
prop: 'status',
|
||||
@ -93,13 +79,13 @@ const tableProps = [
|
||||
prop: 'startProduceTime',
|
||||
label: '实际开始时间',
|
||||
filter: parseTime,
|
||||
minWidth: 150
|
||||
minWidth: 160
|
||||
},
|
||||
{
|
||||
prop: 'finishProduceTime',
|
||||
label: '实际完成时间',
|
||||
filter: parseTime,
|
||||
minWidth: 150
|
||||
minWidth: 160
|
||||
},
|
||||
{
|
||||
prop: 'productLines',
|
||||
@ -125,7 +111,7 @@ const tableProps = [
|
||||
{
|
||||
prop: 'workOrderNum',
|
||||
label: '关联工单数量',
|
||||
width: 100
|
||||
width: 110
|
||||
}
|
||||
]
|
||||
export default {
|
||||
@ -134,9 +120,8 @@ export default {
|
||||
return {
|
||||
formConfig: [
|
||||
{
|
||||
type: 'select',
|
||||
type: 'input',
|
||||
label: '订单名称',
|
||||
selectOptions: [],
|
||||
param: 'name'
|
||||
},
|
||||
{
|
||||
@ -162,15 +147,14 @@ export default {
|
||||
activeName: 'dataList',
|
||||
// 查询参数
|
||||
queryParams: {
|
||||
// pageNo: 1,
|
||||
// pageSize: 5000,
|
||||
pageNo: 1,
|
||||
pageSize: 20,
|
||||
name: null,
|
||||
startProduceTime: []
|
||||
},
|
||||
tableProps,
|
||||
list: [],
|
||||
// tableH: this.tableHeight(270),
|
||||
tableH: this.tableHeight(230),
|
||||
tableH: this.tableHeight(315),
|
||||
total: 0,
|
||||
tableBtn: [
|
||||
this.$auth.hasPermi('base:order-completion-monitoring:orderDet')
|
||||
@ -191,148 +175,78 @@ export default {
|
||||
btnName: '发货详情'
|
||||
}
|
||||
: undefined
|
||||
].filter((v) => v)
|
||||
].filter((v) => v),
|
||||
chartList: []
|
||||
}
|
||||
},
|
||||
components: { MonitoringRingCharts },
|
||||
mounted() {
|
||||
window.addEventListener('resize', () => {
|
||||
// this.tableH = this.tableHeight(270)
|
||||
this.tableH = this.tableHeight(230)
|
||||
this.tableH = this.tableHeight(315)
|
||||
})
|
||||
this.getOrderList()
|
||||
let start = moment().subtract(30, 'days').format('yyyy-MM-DD')
|
||||
let end = moment().format('yyyy-MM-DD')
|
||||
this.formConfig[1].defaultSelect = [start, end]
|
||||
this.queryParams.startProduceTime[0] = start + ' 00:00:00'
|
||||
this.queryParams.startProduceTime[1] = end + ' 23:59:59'
|
||||
this.getPage()
|
||||
},
|
||||
methods: {
|
||||
getOrderList() {
|
||||
orderList({}).then(res => {
|
||||
this.formConfig[0].selectOptions = res.data || []
|
||||
})
|
||||
},
|
||||
getPage() {
|
||||
// 表数据
|
||||
orderMonitor({...this.queryParams}).then(res => {
|
||||
this.list = res.data || []
|
||||
// this.getPieChart()
|
||||
this.list = res.data.records || []
|
||||
this.total = res.data.total || 0
|
||||
if (this.list.length > 0) {
|
||||
let orderIdList = []
|
||||
this.list.map(item => {
|
||||
orderIdList.push(item.orderid)
|
||||
})
|
||||
},
|
||||
// 饼图
|
||||
getPieChart() {
|
||||
var chartDom = document.getElementById('orderPieBar');
|
||||
var myChart = echarts.init(chartDom);
|
||||
var option = {
|
||||
color:['#288AFF','#7164FF','#fff','#63BDFF','#8EF0AB','#FFCE6A'],
|
||||
series: [
|
||||
{
|
||||
name: 'Access From',
|
||||
type: 'pie',
|
||||
radius: ['92%', '100%'],
|
||||
avoidLabelOverlap: false,
|
||||
label: {
|
||||
show: true,
|
||||
position: 'center'
|
||||
},
|
||||
emphasis: {
|
||||
disabled: true,
|
||||
scale:false,
|
||||
scaleSize: 0
|
||||
},
|
||||
labelLine: {
|
||||
show: false
|
||||
},
|
||||
data: [
|
||||
{ value: 1000, name: '1' }
|
||||
]
|
||||
},
|
||||
{
|
||||
name: 'Access From',
|
||||
type: 'pie',
|
||||
radius: ['84%', '92%'],
|
||||
avoidLabelOverlap: false,
|
||||
label: {
|
||||
show: false,
|
||||
position: 'center'
|
||||
},
|
||||
emphasis: {
|
||||
disabled: true,
|
||||
scale:false,
|
||||
scaleSize: 0
|
||||
},
|
||||
labelLine: {
|
||||
show: false
|
||||
},
|
||||
data: [
|
||||
{ value: 50 ,name: '2' },
|
||||
{ value: 500, name: 'xxx' }
|
||||
]
|
||||
},
|
||||
{
|
||||
name: 'Access From',
|
||||
type: 'pie',
|
||||
radius: ['76%', '84%'],
|
||||
avoidLabelOverlap: false,
|
||||
label: {
|
||||
show: false,
|
||||
position: 'center'
|
||||
},
|
||||
emphasis: {
|
||||
disabled: true,
|
||||
scale:false,
|
||||
scaleSize: 0
|
||||
},
|
||||
labelLine: {
|
||||
show: false
|
||||
},
|
||||
data: [
|
||||
{ value: 250, name: '3' },
|
||||
{ value: 750, name: 'xxx' }
|
||||
]
|
||||
},
|
||||
{
|
||||
name: 'Access From',
|
||||
type: 'pie',
|
||||
radius: ['68%', '76%'],
|
||||
avoidLabelOverlap: false,
|
||||
label: {
|
||||
show: false,
|
||||
position: 'center'
|
||||
},
|
||||
emphasis: {
|
||||
disabled: true,
|
||||
scale:false,
|
||||
scaleSize: 0
|
||||
},
|
||||
labelLine: {
|
||||
show: false
|
||||
},
|
||||
data: [
|
||||
{ value: 800, name: '4' },
|
||||
{ value: 1048, name: 'xxx' }
|
||||
]
|
||||
},
|
||||
{
|
||||
name: 'Access From',
|
||||
type: 'pie',
|
||||
radius: ['60%', '68%'],
|
||||
avoidLabelOverlap: false,
|
||||
label: {
|
||||
show: false,
|
||||
position: 'center'
|
||||
},
|
||||
emphasis: {
|
||||
disabled: true,
|
||||
scale:false,
|
||||
scaleSize: 0
|
||||
},
|
||||
labelLine: {
|
||||
show: false
|
||||
},
|
||||
data: [
|
||||
{ value: 800, name: '5' },
|
||||
{ value: 1048, name: 'xxx' }
|
||||
]
|
||||
// 图的数据
|
||||
orderAssignmentList({orderIdList:orderIdList}).then(res => {
|
||||
let color = ['#7164FF','#288AFF','#63BDFF','#8EF0AB','#FFCE6A']
|
||||
let tempArr = res.data || {}
|
||||
let tempArr2 = []
|
||||
for (let key in tempArr) {
|
||||
let tempArr3 = []
|
||||
let obj = {}
|
||||
obj.orderName = tempArr[key][0].orderName
|
||||
obj.id = key
|
||||
obj.num = tempArr[key][0].planQuantity
|
||||
let sunNum = 0
|
||||
for (let i = 0; i < tempArr[key].length; i++) {
|
||||
let subObj = {}
|
||||
subObj.value = tempArr[key][i].actualAssignmentQuantity
|
||||
subObj.name = tempArr[key][i].woName
|
||||
if (i < 5) {
|
||||
subObj.color = color[i]
|
||||
} else {
|
||||
subObj.color = color[i%5]
|
||||
}
|
||||
]
|
||||
sunNum+=tempArr[key][i].actualAssignmentQuantity
|
||||
tempArr3.push(subObj)
|
||||
}
|
||||
option && myChart.setOption(option)
|
||||
tempArr3.push({
|
||||
value: tempArr[key][0].planQuantity - sunNum > 0 ? tempArr[key][0].planQuantity - sunNum : 0,
|
||||
name: '未下发',
|
||||
color: '#F5F5F5'
|
||||
})
|
||||
obj.sunNum = sunNum
|
||||
obj.workOrder = tempArr3
|
||||
tempArr2.push(obj)
|
||||
}
|
||||
this.chartList = tempArr2
|
||||
if (this.activeName === 'barChart' && this.chartList.length > 0) {
|
||||
this.$nextTick(() => {
|
||||
this.$refs.monitoringRingCharts.initChart()
|
||||
})
|
||||
}
|
||||
})
|
||||
}else{
|
||||
// 显示无数据的图片
|
||||
this.chartList = []
|
||||
}
|
||||
})
|
||||
},
|
||||
// 查询
|
||||
buttonClick(val) {
|
||||
@ -365,8 +279,10 @@ export default {
|
||||
}
|
||||
},
|
||||
toggleTab() {
|
||||
if (this.activeName === 'barChart') {
|
||||
this.getPieChart()
|
||||
if (this.activeName === 'barChart' && this.chartList.length > 0) {
|
||||
this.$nextTick(() => {
|
||||
this.$refs.monitoringRingCharts.initChart()
|
||||
})
|
||||
}
|
||||
}
|
||||
}
|
||||
@ -382,7 +298,6 @@ export default {
|
||||
width: 100%;
|
||||
height: 2px;
|
||||
background-color: #e4e7ed;
|
||||
/* z-index: 1; */
|
||||
}
|
||||
.el-tabs__nav-wrap::after {
|
||||
width: 0;
|
||||
@ -404,7 +319,7 @@ export default {
|
||||
font-size: 16px;
|
||||
font-weight: 400;
|
||||
color: #000000;
|
||||
margin:0 10px 20px 0;
|
||||
margin:0 10px 16px 0;
|
||||
}
|
||||
.blueTitle {
|
||||
content: '';
|
||||
|
||||
Loading…
Reference in New Issue
Block a user