From 36ca71eaff11519ef34eb6e4fb192f24bf3bf47c Mon Sep 17 00:00:00 2001
From: zhuzhuanzhuan
Date: 星期四, 12 十月 2023 11:24:24 +0800
Subject: [PATCH] 新增大屏车间管理页面并基本实现基础功能（除车间删除与批量删除与查询）
---
src/views/mdc/base/modules/openRateTrendAnalysis/openRateTrendAnalysisMain.vue | 1
src/views/system/modules/SelectDeviceModal.vue | 256 ++++++++++++
src/views/mdc/base/modules/StatisticalAnalysis/StatisticalAnalysisMain.vue | 1
src/views/WorkshopSignage.vue | 251 +++++-------
src/views/mdc/base/modules/openRateFractionAnalysis/openRateFractionAnalysisMain.vue | 3
src/views/system/modules/UserModal.vue | 6
src/api/mdc.js | 27 +
src/views/system/WorkshopSignageManagement.vue | 495 ++++++++++++++++++++++++
src/views/mdc/base/modules/alarmAnalysis/alarmAnalysisMain.vue | 1
src/views/system/modules/WorkshopModal.vue | 134 ++++++
10 files changed, 1,024 insertions(+), 151 deletions(-)
diff --git a/src/api/mdc.js b/src/api/mdc.js
index 716a1d1..58fb992 100644
--- a/src/api/mdc.js
+++ b/src/api/mdc.js
@@ -1,7 +1,28 @@
import { getAction, deleteAction, putAction, postAction, httpAction } from '@/api/manage'
export default {
-// -------------------------------------椹卞姩鍙傛暟绠＄悊椤甸潰----------------------------------------
-// 鑾峰彇鎺у埗绯荤粺绫诲瀷
- getDriveTypeApi:()=>getAction('/mdc/mdcDriveTypeParamConfig/getDriveParamOptions')
+ // -------------------------------------椹卞姩鍙傛暟绠＄悊椤甸潰----------------------------------------
+ // 鑾峰彇鎺у埗绯荤粺绫诲瀷
+ getDriveTypeApi: () => getAction('/mdc/mdcDriveTypeParamConfig/getDriveParamOptions'),
+ // -------------------------------------杞﹂棿鐪嬫澘椤甸潰----------------------------------------
+ // 鏍规嵁杞﹂棿id鏌ヨ璁惧鍒楄〃
+ getDeviceListByWorkshopIdApi: params => getAction('/mdc/mdcWorkshopInfo/workshopEquipmentList', params),
+ // 鏍规嵁杞﹂棿id鏌ヨ杞﹂棿璇︾粏淇℃伅
+ getWorkshopDetailByWorkshopIdApi: id => getAction('/mdc/mdcWorkshopInfo/queryById', { id }),
+ // 鏌ヨ杞﹂棿鍒楄〃
+ getWorkshopListApi: params => getAction('/mdc/mdcWorkshopInfo/list', params),
+ // 鏂板杞﹂棿淇℃伅
+ addWorkshopApi: params => postAction('/mdc/mdcWorkshopInfo/add', params),
+ // 缂栬緫杞﹂棿淇℃伅
+ editWorkshopApi: params => putAction('/mdc/mdcWorkshopInfo/edit', params),
+ // 鍒犻櫎鍗曚釜杞﹂棿淇℃伅
+ deleteSingleWorkshopApi: id => deleteAction('/mdc/mdcWorkshopInfo/delete', { id }),
+ // 鎵归噺鍒犻櫎杞﹂棿淇℃伅
+ deleteBatchWorkshopApi: ids => deleteAction('/mdc/mdcWorkshopInfo/deleteBatch', { ids }),
+ // 鏂板澶у睆杞﹂棿鍜岃澶囧叧绯�
+ addDeviceInWorkshopApi: params => postAction('/mdc/mdcWorkshopInfo/addWorkshopEquipment', params),
+ // 鍒犻櫎鍗曚釜澶у睆杞﹂棿鍜岃澶囧叧绯�
+ deleteSingleDeviceInWorkshopApi: params => deleteAction('/mdc/mdcWorkshopInfo/deleteWorkshopEquipment', params),
+ // 鎵归噺鍒犻櫎澶у睆杞﹂棿鍜岃澶囧叧绯�
+ deleteBatchDeviceInWorkshopApi: params => deleteAction('/mdc/mdcWorkshopInfo/deleteWorkshopEquipmentBatch', params)
}
\ No newline at end of file
diff --git a/src/views/WorkshopSignage.vue b/src/views/WorkshopSignage.vue
index d77fc20..fc8a61f 100644
--- a/src/views/WorkshopSignage.vue
+++ b/src/views/WorkshopSignage.vue
@@ -3,43 +3,25 @@
<header class="page-header">
{{getWorkshopName}}
<div class="header-right">
- <a-button type="primary" icon="save" size="large" @click="saveDevicePositionByApi">淇濆瓨浣嶇疆</a-button>
+ <a-button type="primary" icon="save" size="large" @click="saveDevicePositionAndSizeByApi"
+ v-has="'home:saveDevicePositionAndSize'">淇濆瓨浣嶇疆
+ </a-button>
</div>
</header>
<dv-border-box-8 class="content-container">
- <!--<div v-for="item in deviceList" :key="item.equipmentId" class="single-device"-->
- <!--:style="{top:item.top+'px',left:item.left+'px',height:'135px',width:'175px'}" @mousedown="handleMouseDown"-->
- <!--:id="item.equipmentId">-->
- <!--<div class="device-status">-->
- <!--<img v-if="item.status==0" src="@/assets/yellow.png" draggable="false">-->
- <!--<img v-if="item.status==1" src="@/assets/red.png" draggable="false">-->
- <!--<img v-if="item.status==2" src="@/assets/gray.png" draggable="false">-->
- <!--<img v-if="item.status==3" src="@/assets/green.png" draggable="false">-->
- <!--<img :src="item.equipmentImageUrl" draggable="false">-->
- <!--</div>-->
- <!--<div class="device-id">{{item.equipmentId}}</div>-->
- <!--<!–<div draggable="false" class="device-info">–>-->
- <!--<!–<div v-if="item.status==0" class="status-square" style="background-color: gray"></div>–>-->
- <!--<!–<div v-if="item.status==1" class="status-square" style="background-color: red"></div>–>-->
- <!--<!–<div v-if="item.status==2" class="status-square" style="background-color: green"></div>–>-->
- <!--<!–<div v-if="item.status==3" class="status-square" style="background-color: yellow"></div>–>-->
- <!--<!–<div class="device-id">{{item.equipmentId}}</div>–>-->
- <!--<!–</div>–>-->
- <!--<!–</div>–>-->
- <!--</div>-->
<VueDragResize v-for="(item,index) in deviceList" :key="item.equipmentId" :w="item.vw"
:h="item.vh" :x="item.left" :y="item.top"
v-on:resizing="resize($event,index)"
v-on:dragging="resize($event,index)"
:parentLimitation="true"
- :minw="175"
- :minh="135"
+ :minw="100"
+ :minh="100"
:id="item.equipmentId"
-
+ :stickSize="6"
>
<div class="single-device"
- :style="{width: + item.vw+ 'px',height:+item.vh+'px'}">
+ :style="{width: item.vw+ 'px',height:item.vh+'px'}">
<div class="device-status">
<div v-if="item.status==0"
:style="{backgroundImage:`url(${require('@/assets/yellow.png')})`}" class="status-image"></div>
@@ -50,21 +32,20 @@
<div v-if="item.status==3" :style="{backgroundImage:`url(${require('@/assets/green.png')})`}"
class="status-image"></div>
<div
- :style="{backgroundImage:`url(${item.equipmentImageUrl})`}"
- class="device-image"></div>
+ :style="{backgroundImage:`url(${item.equipmentImageUrl})`}" class="device-image"></div>
</div>
<div class="device-id" :style="{fontSize: item.fontSize+'px'}">
{{item.equipmentId}}
</div>
- <!--<div draggable="false" class="device-info">-->
- <!--<div v-if="item.status==0" class="status-square" style="background-color: gray"></div>-->
- <!--<div v-if="item.status==1" class="status-square" style="background-color: red"></div>-->
- <!--<div v-if="item.status==2" class="status-square" style="background-color: green"></div>-->
- <!--<div v-if="item.status==3" class="status-square" style="background-color: yellow"></div>-->
- <!--<div class="device-id">{{item.equipmentId}}</div>-->
- <!--</div>-->
</div>
</VueDragResize>
+ <div class="device-status-info">
+ <div v-for="item in deviceStatusList" :key="item.value" class="single-status-info">
+ <div>{{item.label}}</div>
+ <div class="status-square" :style="{backgroundColor:item.color}"></div>
+ <div>{{getDeviceNumberByStatus(item.value)}}</div>
+ </div>
+ </div>
</dv-border-box-8>
</dv-full-screen-container>
</template>
@@ -78,31 +59,26 @@
},
data() {
return {
- mouseX: 0, // 榧犳爣鍦ㄥ厓绱犲唴鐨刋鍧愭爣
- mouseY: 0, // 榧犳爣鍦ㄥ厓绱犲唴鐨刌鍧愭爣,
- dragging: false, //鏄惁鍦ㄦ嫋鎷戒腑
- elementId: '',// 琚嫋鎷藉厓绱犵殑id灞炴�у��
- elementWidth: '',
- elementHeight: '',
+ // 璁惧淇℃伅鍒楄〃
deviceList: [
{
- equipmentId: '123213213123232',
- equipmentImageUrl: require('@/assets/8.png'),
- top: 200,
- left: 100,
- vw: 175,
- vh: 135,
- fontSize: 20,
- status: 1
+ equipmentId: '123213213123232',// 璁惧ID
+ equipmentImageUrl: require('@/assets/8.png'), // 璁惧鍥剧墖
+ top: 200, // 鎷栨嫿鍏冪礌璺濈洅瀛愰《璺濈
+ left: 100, // 鎷栨嫿鍏冪礌璺濈洅瀛愬乏渚ц窛绂�
+ vw: 100, // 缂╂斁鍏冪礌瀹藉害
+ vh: 100, // 缂╂斁鍏冪礌楂樺害
+ fontSize: 12, // 缂╂斁鍏冪礌瀛椾綋澶у皬
+ status: 1 // 璁惧鐘舵�� 0:寰呮満 1:鎶ヨ 2:鍏虫満 3:杩愯
},
{
equipmentId: '512346789561232',
equipmentImageUrl: require('@/assets/8.png'),
top: 500,
left: 753,
- vw: 175,
- vh: 135,
- fontSize: 20,
+ vw: 100,
+ vh: 100,
+ fontSize: 12,
status: 0
},
{
@@ -110,9 +86,9 @@
equipmentImageUrl: require('@/assets/8.png'),
top: 300,
left: 860,
- vw: 175,
- vh: 135,
- fontSize: 20,
+ vw: 100,
+ vh: 100,
+ fontSize: 12,
status: 2
},
{
@@ -120,9 +96,9 @@
equipmentImageUrl: require('@/assets/8.png'),
top: 100,
left: 380,
- vw: 175,
- vh: 135,
- fontSize: 20,
+ vw: 100,
+ vh: 100,
+ fontSize: 12,
status: 3
},
{
@@ -130,10 +106,33 @@
equipmentImageUrl: require('@/assets/8.png'),
top: 200,
left: 1500,
- vw: 175,
- vh: 135,
- fontSize: 20,
+ vw: 100,
+ vh: 100,
+ fontSize: 12,
status: 2
+ }
+ ],
+ // 璁惧鐘舵�佹寚绀虹伅鍒楄〃
+ deviceStatusList: [
+ {
+ label: '鍏虫満',
+ value: 2,
+ color: '#A8A8A8'
+ },
+ {
+ label: '寰呮満',
+ value: 0,
+ color: '#FFFF00'
+ },
+ {
+ label: '杩愯',
+ value: 3,
+ color: '#00EE00'
+ },
+ {
+ label: '鎶ヨ',
+ value: 1,
+ color: '#FF0000'
}
]
}
@@ -156,74 +155,16 @@
},
methods: {
/**
- * 閫氳繃杞﹂棿Id璋冪敤鎺ュ彛鑾峰彇璁惧鍒楄〃
+ * 閫氳繃杞﹂棿Id璋冪敤鎺ュ彛鑾峰彇璁惧淇℃伅鍒楄〃
* @param workshopId 杞﹂棿Id
*/
getDeviceListByApi(workshopId) {
console.log('杞﹂棿Id', workshopId)
},
/**
- * 鎷栨嫿瀵硅薄榧犳爣鎸夐敭鎸変笅浜嬩欢
- * @param event
+ * 鐐瑰嚮淇濆瓨鎸夐挳璋冪敤鎺ュ彛淇濆瓨鎷栨嫿鍚庣殑浣嶇疆涓庤澶囧浘鏍囧昂瀵�
*/
- handleMouseDown(event) {
- this.dragging = true
- this.mouseX = event.clientX
- this.mouseY = event.clientY
- this.elementId = event.currentTarget.id
- this.top = event.currentTarget.offsetTop
- this.left = event.currentTarget.offsetLeft
- document.addEventListener('mousemove', this.handleMouseMove)
- document.addEventListener('mouseup', this.handleMouseUp)
- this.elementWidth = +event.currentTarget.style.width.replace('px', '')
- this.elementHeight = +event.currentTarget.style.height.replace('px', '')
- },
- /**
- * 鏂囨。瀵硅薄榧犳爣绉诲姩浜嬩欢
- * @param event
- */
- handleMouseMove(event) {
- if (this.dragging) {
- // x鏂瑰悜榧犳爣鍋忕Щ閲�
- const deltaX = event.clientX - this.mouseX
- // y鏂瑰悜榧犳爣鍋忕Щ閲�
- const deltaY = event.clientY - this.mouseY
- this.left += deltaX
- this.top += deltaY
- this.deviceList.forEach(item => {
- if (item.equipmentId === this.elementId) {
- item.top = this.top
- item.left = this.left
- // 闄愬埗鎷栨嫿瓒呭嚭鍖哄煙(缂╂斁娴忚鍣ㄧ獥鍙ｅ悗璺濆洓鍛ㄨ窛绂诲嚭鐜伴棶棰�)
- if (item.top < 0) {
- item.top = 0
- } else if (item.top + this.elementHeight + 80 > window.innerHeight) {
- item.top = window.innerHeight - this.elementHeight
- }
- if (item.left < 0) {
- item.left = 0
- } else if (item.left + this.elementWidth > window.innerWidth) {
- item.left = window.innerWidth - this.elementWidth
- }
- }
- })
- this.mouseX = event.clientX
- this.mouseY = event.clientY
- }
- },
- /**
- * 鏂囨。瀵硅薄榧犳爣鎸夐敭寮硅捣浜嬩欢
- * @param event
- */
- handleMouseUp(event) {
- this.dragging = false
- document.removeEventListener('mousemove', this.handleMouseMove)
- document.removeEventListener('mouseup', this.handleMouseUp)
- },
- /**
- * 鐐瑰嚮淇濆瓨鎸夐挳璋冪敤鎺ュ彛淇濆瓨鎷栨嫿鍚庣殑浣嶇疆
- */
- saveDevicePositionByApi() {
+ saveDevicePositionAndSizeByApi() {
console.log('淇濆瓨浣嶇疆')
},
/**
@@ -233,15 +174,27 @@
*/
resize(newRect, index) {
console.log('newRect', newRect)
- if (newRect.width > 200) {
- this.deviceList[index].fontSize = newRect.width / 10
+ if (newRect.width > 100) {
+ if (newRect.width / newRect.height < 2) {
+ this.deviceList[index].fontSize = newRect.width / 10
+ } else {
+ this.deviceList[index].fontSize = newRect.height / 5
+ }
} else {
- this.deviceList[index].fontSize = 20
+ this.deviceList[index].fontSize = 12
}
- this.deviceList[index].top = newRect.top
- this.deviceList[index].left = newRect.left
this.deviceList[index].vw = newRect.width
this.deviceList[index].vh = newRect.height
+ this.deviceList[index].top = newRect.top
+ this.deviceList[index].left = newRect.left
+ },
+ /**
+ * 鏍规嵁璁惧鐘舵�佸�艰幏鍙栧搴旇澶囨暟閲�
+ * @param value 璁惧鐘舵�佸��
+ * @returns {number} 璁惧鏁伴噺
+ */
+ getDeviceNumberByStatus(value) {
+ return this.deviceList.filter(item => item.status === value).length
}
},
mounted() {
@@ -267,6 +220,7 @@
font-size: 50px;
text-align: center;
position: relative;
+
.header-right {
position: absolute;
right: 200px;
@@ -276,6 +230,31 @@
.content-container {
position: relative;
+
+ .device-status-info {
+ width: 400px;
+ position: absolute;
+ top: 5px;
+ right: 5px;
+ display: flex;
+ align-items: center;
+ justify-content: space-between;
+
+ .single-status-info {
+ width: 60px;
+ display: flex;
+ align-items: center;
+ justify-content: space-between;
+
+ .status-square {
+ width: 14px;
+ height: 14px;
+ border: 1px solid #fff;
+ border-radius: 2px;
+ }
+ }
+ }
+
.single-device {
position: absolute;
border: 1px solid transparent;
@@ -285,20 +264,24 @@
align-items: center;
justify-content: space-between;
cursor: default;
+
&:active {
border: 1px solid #1890ff;
}
+
.device-status {
width: 100%;
height: 100%;
display: flex;
justify-content: space-between;
+
.status-image {
background-size: 100% 100%;
background-repeat: no-repeat;
width: 45px;
margin-right: 10px;
}
+
.device-image {
background-size: 100% 100%;
background-repeat: no-repeat;
@@ -306,22 +289,8 @@
height: 100%;
}
}
- .device-id {
- /*font-size: 20px;*/
- }
- /*.device-info {*/
- /*width: 100%;*/
- /*display: flex;*/
- /*align-items: center;*/
- /*justify-content: space-between;*/
- /*.status-square {*/
- /*width: 14px;*/
- /*height: 14px;*/
- /*border: 1px solid #fff;*/
- /*border-radius: 2px;*/
- /*}*/
- /*}*/
}
+
}
}
</style>
\ No newline at end of file
diff --git a/src/views/mdc/base/modules/StatisticalAnalysis/StatisticalAnalysisMain.vue b/src/views/mdc/base/modules/StatisticalAnalysis/StatisticalAnalysisMain.vue
index 64d02ca..973e4df 100644
--- a/src/views/mdc/base/modules/StatisticalAnalysis/StatisticalAnalysisMain.vue
+++ b/src/views/mdc/base/modules/StatisticalAnalysis/StatisticalAnalysisMain.vue
@@ -384,7 +384,6 @@
name: '杩愯鏁堢巼',
type: 'pie',
radius: '70%',
- center: ['55%', '55%'],
itemStyle: {
normal: {
color: function (params) {
diff --git a/src/views/mdc/base/modules/alarmAnalysis/alarmAnalysisMain.vue b/src/views/mdc/base/modules/alarmAnalysis/alarmAnalysisMain.vue
index 4ff3ed5..e923eb5 100644
--- a/src/views/mdc/base/modules/alarmAnalysis/alarmAnalysisMain.vue
+++ b/src/views/mdc/base/modules/alarmAnalysis/alarmAnalysisMain.vue
@@ -369,7 +369,6 @@
series: [{
type: 'pie',
radius: '60%',
- center: ['55%', '55%'],
itemStyle: {
normal: {
/*color: function (params) {
diff --git a/src/views/mdc/base/modules/openRateFractionAnalysis/openRateFractionAnalysisMain.vue b/src/views/mdc/base/modules/openRateFractionAnalysis/openRateFractionAnalysisMain.vue
index 845ff29..c8900d9 100644
--- a/src/views/mdc/base/modules/openRateFractionAnalysis/openRateFractionAnalysisMain.vue
+++ b/src/views/mdc/base/modules/openRateFractionAnalysis/openRateFractionAnalysisMain.vue
@@ -326,7 +326,7 @@
let openRateTrendAnalysisChart = this.$echarts.init(document.getElementById('openRateTrendChart'), 'macarons')
let openRateTrendChartOptions = {
title: {
- text: '鍒╃敤鐜囪蛋鍔垮垎鏋�',
+ text: '鍒╃敤鐜囧垎娈靛垎鏋�',
x: 'center',
textStyle: {
fontSize: 18,
@@ -422,6 +422,7 @@
.dataContent .mathData td {
padding: 10px;
/*display: none;*/
+ cursor: pointer;
}
.dataContent .mathData:hover td {
diff --git a/src/views/mdc/base/modules/openRateTrendAnalysis/openRateTrendAnalysisMain.vue b/src/views/mdc/base/modules/openRateTrendAnalysis/openRateTrendAnalysisMain.vue
index 87af8d1..6056ac3 100644
--- a/src/views/mdc/base/modules/openRateTrendAnalysis/openRateTrendAnalysisMain.vue
+++ b/src/views/mdc/base/modules/openRateTrendAnalysis/openRateTrendAnalysisMain.vue
@@ -428,6 +428,7 @@
.dataContent .mathData td {
padding: 10px;
/*display: none;*/
+ cursor: pointer;
}
.dataContent .mathData:hover td {
diff --git a/src/views/system/WorkshopSignageManagement.vue b/src/views/system/WorkshopSignageManagement.vue
new file mode 100644
index 0000000..c07de6b
--- /dev/null
+++ b/src/views/system/WorkshopSignageManagement.vue
@@ -0,0 +1,495 @@
+<template>
+ <a-row :gutter="10">
+ <a-col :md="leftColMd" :sm="24" style="margin-bottom: 20px">
+ <a-card :bordered="false">
+ <!-- 鏌ヨ鍖哄煙 -->
+ <div class="table-page-search-wrapper">
+ <!-- 鎼滅储鍖哄煙 -->
+ <a-form layout="inline" @keyup.enter.native="searchQuery">
+ <a-row :gutter="24">
+ <a-col :md="12" :sm="8">
+ <a-form-item label="杞﹂棿鍚嶇О" :labelCol="{span: 5}" :wrapperCol="{span: 18, offset: 1}">
+ <a-input placeholder="" v-model="queryParam.roleName"></a-input>
+ </a-form-item>
+ </a-col>
+ <span style="float: left;overflow: hidden;" class="table-page-search-submitButtons">
+ <a-col :md="12" :sm="24">
+ <a-button type="primary" @click="searchQuery" icon="search" style="margin-left: 21px">鏌ヨ</a-button>
+ <a-button type="primary" @click="searchReset" icon="reload" style="margin-left: 8px">閲嶇疆</a-button>
+ </a-col>
+ </span>
+ </a-row>
+ </a-form>
+ </div>
+ <!-- 鎿嶄綔鎸夐挳鍖哄煙 -->
+ <div class="table-operator" style="margin: 5px 0 10px 2px">
+ <a-button @click="handleAdd" type="primary" icon="plus">鏂板缓杞﹂棿</a-button>
+ </div>
+
+ <div class="ant-alert ant-alert-info" style="margin-bottom: 16px;">
+ <i class="anticon anticon-info-circle ant-alert-icon">
+ </i> 宸查�夋嫨 <a><b>{{ selectedRowKeys1.length }}</b></a>椤�
+ <a style="margin-left: 24px" @click="onClearSelected1">娓呯┖</a>
+ </div>
+
+ <div style="margin-top: 15px">
+ <a-table
+ style="height:500px"
+ ref="table"
+ size="middle"
+ bordered
+ rowKey="id"
+ :columns="columns"
+ :dataSource="dataSource"
+ :pagination="ipagination"
+ :loading="loading"
+ :rowSelection="{selectedRowKeys: selectedRowKeys1, onChange: onSelectChange1, type:'radio'}"
+ @change="handleTableChange">
+ <template slot="backgroundImage" slot-scope="text,record">
+ <img :src="getImgView(record.backgroundImage)" width="50" height="50">
+ </template>
+ <span slot="action" slot-scope="text, record">
+ <a @click="handleOpen(record)">杞﹂棿</a>
+ <a-divider type="vertical"/>
+ <a-dropdown>
+ <a class="ant-dropdown-link">
+ 鏇村 <a-icon type="down"/>
+ </a>
+ <a-menu slot="overlay">
+ <a-menu-item>
+ <a @click="handleEdit(record)">缂栬緫</a>
+ </a-menu-item>
+ <a-menu-item>
+ <a-popconfirm title="纭畾鍒犻櫎鍚�?" @confirm="() => handleDelete1(record.id)">
+ <a>鍒犻櫎</a>
+ </a-popconfirm>
+ </a-menu-item>
+ </a-menu>
+ </a-dropdown>
+ </span>
+ </a-table>
+ </div>
+ </a-card>
+ </a-col>
+ <a-col :md="rightColMd" :sm="24" v-if="this.rightcolval == 1">
+ <a-card :bordered="false">
+ <div style="text-align: right;">
+ <a-icon type="close-circle" @click="hideUserList"/>
+ </div>
+ <!-- 鏌ヨ鍖哄煙 -->
+ <div class="table-page-search-wrapper">
+ <a-form layout="inline">
+ <a-row :gutter="24">
+
+ <a-col :md="12" :sm="12">
+ <a-form-item label="璁惧缂栫爜">
+ <a-input placeholder="" v-model="queryParam2.equipmentId"></a-input>
+ </a-form-item>
+ </a-col>
+ <span style="float: left;overflow: hidden;" class="table-page-search-submitButtons">
+ <a-col :md="9" :sm="24">
+ <a-button type="primary" @click="searchQuery2" icon="search" style="margin-left: 21px">鏌ヨ</a-button>
+ <a-button type="primary" @click="searchReset2" icon="reload" style="margin-left: 8px">閲嶇疆</a-button>
+
+ </a-col>
+ </span>
+ </a-row>
+ </a-form>
+ </div>
+ <!-- 鎿嶄綔鎸夐挳鍖哄煙 -->
+ <div class="table-operator" :md="24" :sm="24">
+ <a-button @click="handleAddDeviceInWorkshop" type="primary" icon="plus" style="margin-top: 16px">宸叉湁璁惧
+ </a-button>
+
+ <a-dropdown v-if="selectedRowKeys2.length > 0">
+ <a-menu slot="overlay">
+ <a-menu-item key="1" @click="batchDel2">
+ <a-icon type="delete"/>
+ 鍒犻櫎
+ </a-menu-item>
+ </a-menu>
+ <a-button style="margin-left: 8px"> 鎵归噺鎿嶄綔
+ <a-icon type="down"/>
+ </a-button>
+ </a-dropdown>
+ </div>
+ <!-- table鍖哄煙-begin -->
+ <div>
+ <div class="ant-alert ant-alert-info" style="margin-bottom: 16px;">
+ <i class="anticon anticon-info-circle ant-alert-icon"></i> 宸查�夋嫨 <a style="font-weight: 600">{{
+ selectedRowKeys2.length }}</a>椤�
+ <a style="margin-left: 24px" @click="onClearSelected2">娓呯┖</a>
+ </div>
+ <a-table
+ style="height:500px"
+ ref="table2"
+ bordered
+ size="middle"
+ rowKey="equipmentId"
+ :columns="columns2"
+ :dataSource="dataSource2"
+ :pagination="ipagination2"
+ :loading="loading2"
+ :rowSelection="{selectedRowKeys: selectedRowKeys2, onChange: onSelectChange2}"
+ @change="handleTableChange2">
+ <span slot="action" slot-scope="text, record">
+ <a-popconfirm title="纭畾鍒犻櫎鍚�?" @confirm="() => handleDelete2(record.equipmentId)">
+ <a>鍒犻櫎</a>
+ </a-popconfirm>
+ </span>
+ </a-table>
+ </div>
+ </a-card>
+ </a-col>
+ <!-- 琛ㄥ崟鍖哄煙 -->
+ <workshop-modal ref="modalForm" @ok="modalFormOk"></workshop-modal> <!--鏂板杞﹂棿-->
+ <select-device-modal ref="selectUserModal" @selectFinished="selectOK"></select-device-modal> <!--宸叉湁璁惧-->
+ </a-row>
+</template>
+<script>
+ import { JeecgListMixin } from '@/mixins/JeecgListMixin'
+ import { deleteAction, postAction, getAction } from '@/api/manage'
+ import SelectDeviceModal from './modules/SelectDeviceModal'
+ import WorkshopModal from './modules/WorkshopModal'
+ import { filterObj } from '@/utils/util'
+ import moment from 'moment'
+
+ export default {
+ name: 'WorkshopSignageManagement',
+ mixins: [JeecgListMixin],
+ components: {
+ SelectDeviceModal,
+ WorkshopModal,
+ moment
+ },
+ data() {
+ return {
+ model1: {},
+ model2: {},
+ currentRoleId: '',
+ currentWorkshopId: '',
+ queryParam1: {},
+ queryParam2: {},
+ dataSource1: [],
+ dataSource2: [],
+ ipagination1: {
+ current: 1,
+ pageSize: 10,
+ pageSizeOptions: ['10', '20', '30'],
+ showTotal: (total, range) => {
+ return range[0] + '-' + range[1] + ' 鍏�' + total + '鏉�'
+ },
+ showQuickJumper: true,
+ showSizeChanger: true,
+ total: 0
+ },
+ ipagination2: {
+ current: 1,
+ pageSize: 10,
+ pageSizeOptions: ['10', '20', '30'],
+ showTotal: (total, range) => {
+ return range[0] + '-' + range[1] + ' 鍏�' + total + '鏉�'
+ },
+ showQuickJumper: true,
+ showSizeChanger: true,
+ total: 0
+ },
+ isorter1: {
+ column: 'createTime',
+ order: 'desc'
+ },
+ isorter2: {
+ column: 'createTime',
+ order: 'desc'
+ },
+ filters1: {},
+ filters2: {},
+ loading1: false,
+ loading2: false,
+ selectedRowKeys1: [],
+ selectedRowKeys2: [],
+ selectionRows1: [],
+ selectionRows2: [],
+ test: {},
+ rightcolval: 0,
+ columns: [
+ {
+ title: '杞﹂棿鍚嶇О',
+ align: 'center',
+ dataIndex: 'workshopName'
+ },
+ {
+ title: '杞﹂棿鑳屾櫙鍥�',
+ dataIndex: 'backgroundImage',
+ align: 'center',
+ scopedSlots: { customRender: 'backgroundImage' }
+ },
+ {
+ title: '鎿嶄綔',
+ dataIndex: 'action',
+ align: 'center',
+ scopedSlots: { customRender: 'action' }
+ }
+ ],
+ columns2: [
+ {
+ title: '璁惧缂栫爜',
+ align: 'center',
+ dataIndex: 'equipmentId',
+ width: 120
+ },
+ {
+ title: '璁惧鍚嶇О',
+ align: 'center',
+ width: 100,
+ dataIndex: 'equipmentName'
+ },
+ {
+ title: '璁惧绫诲瀷',
+ align: 'center',
+ width: 80,
+ dataIndex: 'equipmentType'
+ },
+
+ {
+ title: '鎿嶄綔',
+ dataIndex: 'action',
+ scopedSlots: { customRender: 'action' },
+ align: 'center',
+ width: 120
+ }],
+ // 楂樼骇鏌ヨ鍙傛暟
+ superQueryParams2: '',
+ // 楂樼骇鏌ヨ鎷兼帴鏉′欢
+ superQueryMatchType2: 'and',
+ url: {
+ list: '/mdc/mdcWorkshopInfo/list',
+ delete: '/sys/role/delete',
+ list2: '/mdc/mdcWorkshopInfo/workshopEquipmentList',
+ addDeviceInWorkshop: '/mdc/mdcWorkshopInfo/addWorkshopEquipment',
+ delete2: '/mdc/mdcWorkshopInfo/deleteWorkshopEquipment',
+ deleteBatch2: '/mdc/mdcWorkshopInfo/deleteWorkshopEquipmentBatch'
+ }
+ }
+ },
+ computed: {
+ leftColMd() {
+ return this.selectedRowKeys1.length === 0 ? 24 : 12
+ },
+ rightColMd() {
+ return this.selectedRowKeys1.length === 0 ? 0 : 12
+ }
+ },
+ methods: {
+ onSelectChange2(selectedRowKeys, selectionRows) {
+ this.selectedRowKeys2 = selectedRowKeys
+ this.selectionRows2 = selectionRows
+ },
+ onClearSelected2() {
+ this.selectedRowKeys2 = []
+ this.selectionRows2 = []
+ },
+ onClearSelected1() {
+ this.selectedRowKeys1 = []
+ this.selectionRows1 = []
+ },
+ onSelectChange1(selectedRowKeys, selectionRows) {
+ this.rightcolval = 1
+ this.selectedRowKeys1 = selectedRowKeys
+ this.selectionRows1 = selectionRows
+ this.model1 = Object.assign({}, selectionRows[0])
+ this.currentWorkshopId = selectedRowKeys[0]
+ this.loadData2()
+ },
+ getQueryParams2() {
+ //鑾峰彇鏌ヨ鏉′欢
+ let sqp = {}
+ if (this.superQueryParams2) {
+ sqp['superQueryParams'] = encodeURI(this.superQueryParams2)
+ sqp['superQueryMatchType'] = this.superQueryMatchType2
+ }
+ var param = Object.assign(sqp, this.queryParam2, this.isorter2, this.filters2)
+ param.field = this.getQueryField2()
+ param.pageNo = this.ipagination2.current
+ param.pageSize = this.ipagination2.pageSize
+ return filterObj(param)
+ },
+ getQueryField2() {
+ //TODO 瀛楁鏉冮檺鎺у埗
+ var str = 'id,'
+ this.columns2.forEach(function(value) {
+ str += ',' + value.dataIndex
+ })
+ return str
+ },
+ modalFormOk2() {
+ // 鏂板/淇敼 鎴愬姛鏃讹紝閲嶈浇鍒楄〃
+ this.loadData2()
+ },
+ loadData2(arg) {
+ if (!this.url.list2) {
+ this.$message.error('璇疯缃畊rl.list2灞炴��!')
+ return
+ }
+ //鍔犺浇鏁版嵁 鑻ヤ紶鍏ュ弬鏁�1鍒欏姞杞界涓�椤电殑鍐呭
+ if (arg === 1) {
+ this.ipagination2.current = 1
+ }
+ if (this.currentWorkshopId === '') return
+ let params = this.getQueryParams2()//鏌ヨ鏉′欢
+ params.workshopId = this.currentWorkshopId
+ this.loading2 = true
+ getAction(this.url.list2, params).then((res) => {
+ if (res.success) {
+ this.dataSource2 = res.result.records
+ this.ipagination2.total = res.result.total
+ }
+ this.loading2 = false
+ })
+ },
+ handleDelete1: function(id) {
+ this.handleDelete(id)
+ this.dataSource2 = []
+ this.currentRoleId = ''
+ },
+
+ /**
+ * 鐐瑰嚮璁惧琛ㄦ牸涓殑鍒犻櫎鎸夐挳鍚庤Е鍙戝垹闄ゅ崟涓溅闂翠笌璁惧鐨勫叧绯�
+ * @param equipmentId 褰撳墠琛岀殑璁惧缂栧彿
+ */
+ handleDelete2: function(equipmentId) {
+ if (!this.url.delete2) {
+ this.$message.error('璇疯缃畊rl.delete2灞炴��!')
+ return
+ }
+ var that = this
+ deleteAction(that.url.delete2, { workshopId: this.currentWorkshopId, equipmentId }).then((res) => {
+ if (res.success) {
+ that.$message.success(res.message)
+ that.loadData2()
+ } else {
+ that.$message.warning(res.message)
+ }
+ })
+ },
+
+ /**
+ * 鎵归噺鍒犻櫎杞﹂棿涓庤澶囩殑鍏崇郴
+ */
+ batchDel2: function() {
+ if (!this.url.deleteBatch2) {
+ this.$message.error('璇疯缃畊rl.deleteBatch2灞炴��!')
+ return
+ }
+ if (this.selectedRowKeys2.length <= 0) {
+ // this.$message.warning('璇烽�夋嫨涓�鏉¤褰曪紒')
+ this.$notification.warning({
+ message: '娑堟伅',
+ description: '璇烽�夋嫨涓�鏉¤褰�'
+ })
+ return
+ } else {
+ var ids = ''
+ for (var a = 0; a < this.selectedRowKeys2.length; a++) {
+ ids += this.selectedRowKeys2[a] + ','
+ }
+ var that = this
+ this.$confirm({
+ title: '纭鍒犻櫎',
+ content: '鏄惁鍒犻櫎閫変腑鏁版嵁?',
+ onOk: function() {
+ deleteAction(that.url.deleteBatch2, {
+ workshopId: that.currentWorkshopId,
+ equipmentIds: ids
+ }).then((res) => {
+ if (res.success) {
+ that.$message.success(res.message)
+ that.loadData2()
+ that.onClearSelected()
+ } else {
+ that.$message.warning(res.message)
+ }
+ })
+ }
+ })
+ }
+ },
+
+ /**
+ * 閫夋嫨宸叉湁璁惧鍚庣偣鍑荤‘瀹氭椂瑙﹀彂
+ * @param data 宸查�夋嫨鐨勮澶�
+ */
+ selectOK(data) {
+ let params = {}
+ params.workshopId = this.currentWorkshopId
+ params.equipmentIdList = []
+ for (var a = 0; a < data.length; a++) {
+ params.equipmentIdList.push(data[a])
+ }
+ console.log(params)
+ postAction(this.url.addDeviceInWorkshop, params).then((res) => {
+ if (res.success) {
+ this.loadData2()
+ this.$message.success(res.message)
+ } else {
+ this.$message.warning(res.message)
+ }
+ })
+ },
+
+ /**
+ * 鐐瑰嚮宸叉湁璁惧鎸夐挳瑙﹀彂
+ */
+ handleAddDeviceInWorkshop() {
+ if (this.currentWorkshopId == '') {
+ this.$message.error('璇烽�夋嫨涓�涓溅闂�!')
+ } else {
+ this.$refs.selectUserModal.visible = true
+ this.$refs.selectUserModal.selectedRowKeys = []
+ this.$refs.selectUserModal.selectedRows = []
+ }
+ },
+
+ /**
+ * 鐐瑰嚮褰撳墠琛岃溅闂撮�夐」鍚庤Е鍙戜簨浠�
+ * @param record 褰撳墠琛屾暟鎹�
+ */
+ handleOpen(record) {
+ this.rightcolval = 1
+ this.selectedRowKeys1 = [record.id]
+ this.model1 = Object.assign({}, record)
+ this.currentWorkshopId = record.id
+ this.onClearSelected2()
+ this.loadData2()
+ },
+
+ searchQuery2() {
+ this.loadData2(1)
+ },
+ searchReset2() {
+ this.queryParam2 = {}
+ this.loadData2(1)
+ },
+ handleTableChange2(pagination, filters, sorter) {
+ //鍒嗛〉銆佹帓搴忋�佺瓫閫夊彉鍖栨椂瑙﹀彂
+ //TODO 绛涢��
+ if (Object.keys(sorter).length > 0) {
+ this.isorter2.column = sorter.field
+ this.isorter2.order = 'ascend' == sorter.order ? 'asc' : 'desc'
+ }
+ this.ipagination2 = pagination
+ this.loadData2()
+ },
+ hideUserList() {
+ //this.rightcolval = 0
+ this.selectedRowKeys1 = []
+ }
+ }
+ }
+</script>
+<style scoped>
+ /** Button鎸夐挳闂磋窛 */
+ .ant-btn {
+ margin-left: 8px
+ }
+</style>
\ No newline at end of file
diff --git a/src/views/system/modules/SelectDeviceModal.vue b/src/views/system/modules/SelectDeviceModal.vue
new file mode 100644
index 0000000..6d8ace1
--- /dev/null
+++ b/src/views/system/modules/SelectDeviceModal.vue
@@ -0,0 +1,256 @@
+<template>
+ <div>
+ <a-modal
+ centered
+ :title="title"
+ :width="1000"
+ :visible="visible"
+ @ok="handleOk"
+ @cancel="handleCancel"
+ cancelText="鍏抽棴">
+
+ <!-- 鏌ヨ鍖哄煙 -->
+ <div class="table-page-search-wrapper">
+ <a-form layout="inline" @keyup.enter.native="searchQuery">
+ <a-row :gutter="24">
+
+ <a-col :span="10">
+ <a-form-item label="璁惧鍚嶇О">
+ <a-input placeholder="璇疯緭鍏ヨ澶囧悕绉�" v-model="queryParam.equipmentName"></a-input>
+ </a-form-item>
+ </a-col>
+ <a-col :span="8">
+ <span style="float: left;overflow: hidden;" class="table-page-search-submitButtons">
+ <a-button type="primary" @click="searchQuery" icon="search">鏌ヨ</a-button>
+ <a-button type="primary" @click="searchReset" icon="reload" style="margin-left: 8px">閲嶇疆</a-button>
+ </span>
+ </a-col>
+
+ </a-row>
+ </a-form>
+ </div>
+ <!-- table鍖哄煙-begin -->
+ <div>
+ <a-table
+ size="small"
+ bordered
+ rowKey="equipmentId"
+ :columns="columns1"
+ :dataSource="dataSource1"
+ :pagination="ipagination"
+ :loading="loading"
+ :scroll="{ y: 240 }"
+ :rowSelection="{selectedRowKeys: selectedRowKeys,onSelectAll:onSelectAll,onSelect:onSelect,onChange: onSelectChange}"
+ @change="handleTableChange">
+ </a-table>
+ </div>
+ <!-- table鍖哄煙-end -->
+ </a-modal>
+ </div>
+</template>
+
+<script>
+ import { filterObj } from '@/utils/util'
+ import { getAction } from '@/api/manage'
+
+ export default {
+ name: 'SelectDeviceModal',
+ data() {
+ return {
+ title: '娣诲姞宸叉湁璁惧',
+ names: [],
+ visible: false,
+ placement: 'right',
+ description: '',
+ // 鏌ヨ鏉′欢
+ queryParam: {},
+ // 琛ㄥご
+ columns1: [
+ {
+ title: '#',
+ dataIndex: '',
+ key: 'rowIndex',
+ width: 50,
+ align: 'center',
+ customRender: function(t, r, index) {
+ return parseInt(index) + 1
+ }
+ },
+ {
+ title: '璁惧缂栧彿',
+ align: 'center',
+ width: 100,
+ dataIndex: 'equipmentId'
+ },
+ {
+ title: '璁惧鍚嶇О',
+ align: 'center',
+ width: 100,
+ dataIndex: 'equipmentName'
+ },
+ {
+ title: '璁惧绫诲瀷',
+ align: 'center',
+ width: 100,
+ dataIndex: 'equipmentType'
+ },
+ {
+ title: '椹卞姩绫诲瀷',
+ align: 'center',
+ width: 100,
+ dataIndex: 'driveType'
+ }
+ ],
+ //鏁版嵁闆�
+ dataSource1: [],
+ dataSource2: [],
+ // 鍒嗛〉鍙傛暟
+ ipagination: {
+ current: 1,
+ pageSize: 10,
+ pageSizeOptions: ['10', '20', '30'],
+ showTotal: (total, range) => {
+ return range[0] + '-' + range[1] + ' 鍏�' + total + '鏉�'
+ },
+ showQuickJumper: true,
+ showSizeChanger: true,
+ total: 0
+ },
+ loading: false,
+ selectedRowKeys: [],
+ selectedRows: [],
+ url: {
+ list: '/mdc/mdcEquipment/list'
+ }
+ }
+ },
+ created() {
+ this.loadData()
+ },
+ methods: {
+ searchQuery() {
+ this.loadData(1)
+ },
+ searchReset() {
+ this.queryParam = {}
+ this.loadData(1)
+ },
+ handleCancel() {
+ this.visible = false
+ },
+ handleOk() {
+ this.dataSource2 = this.selectedRowKeys
+ console.log('data---------' + this.dataSource2)
+ if (this.dataSource2.length > 0) {
+ this.$emit('selectFinished', this.dataSource2)
+ }
+ this.visible = false
+ },
+ add() {
+ this.visible = true
+ },
+ loadData(arg) {
+ //鍔犺浇鏁版嵁 鑻ヤ紶鍏ュ弬鏁�1鍒欏姞杞界涓�椤电殑鍐呭
+ if (arg === 1) {
+ this.ipagination.current = 1
+ }
+ var params = this.getQueryParams()//鏌ヨ鏉′欢
+ getAction(this.url.list, params).then((res) => {
+ if (res.success) {
+ this.dataSource1 = res.result.records
+ this.ipagination.total = res.result.total
+ }
+ })
+ },
+ getQueryParams() {
+ var param = Object.assign({}, this.queryParam, this.isorter)
+ param.field = this.getQueryField()
+ param.pageNo = this.ipagination.current
+ param.pageSize = this.ipagination.pageSize
+ return filterObj(param)
+ },
+ getQueryField() {
+ //TODO 瀛楁鏉冮檺鎺у埗
+ },
+ onSelectAll(selected, selectedRows, changeRows) {
+ if (selected === true) {
+ for (var a = 0; a < changeRows.length; a++) {
+ this.dataSource2.push(changeRows[a])
+ }
+ } else {
+ for (var b = 0; b < changeRows.length; b++) {
+ this.dataSource2.splice(this.dataSource2.indexOf(changeRows[b]), 1)
+ }
+ }
+ // console.log(selected, selectedRows, changeRows);
+ },
+ onSelect(record, selected) {
+ console.log(this.selectedRowKeys)
+ if (selected === true) {
+ this.dataSource2.push(record)
+ } else {
+ var index = this.dataSource2.indexOf(record)
+ //console.log();
+ if (index >= 0) {
+ this.dataSource2.splice(this.dataSource2.indexOf(record), 1)
+ }
+ }
+ },
+ onSelectChange(selectedRowKeys, selectedRows) {
+ console.log('selectedRowKeys', selectedRowKeys)
+ this.selectedRowKeys = selectedRowKeys
+ this.selectionRows = selectedRows
+ },
+ onClearSelected() {
+ this.selectedRowKeys = []
+ this.selectionRows = []
+ },
+ handleDelete: function(record) {
+ this.dataSource2.splice(this.dataSource2.indexOf(record), 1)
+ },
+ handleTableChange(pagination, filters, sorter) {
+ //鍒嗛〉銆佹帓搴忋�佺瓫閫夊彉鍖栨椂瑙﹀彂
+ console.log(sorter)
+ //TODO 绛涢��
+ if (Object.keys(sorter).length > 0) {
+ this.isorter.column = sorter.field
+ this.isorter.order = 'ascend' == sorter.order ? 'asc' : 'desc'
+ }
+ this.ipagination = pagination
+ this.loadData()
+ }
+ }
+ }
+</script>
+<style lang="less" scoped>
+ .ant-card-body .table-operator {
+ margin-bottom: 18px;
+ }
+
+ .ant-table-tbody .ant-table-row td {
+ padding-top: 15px;
+ padding-bottom: 15px;
+ }
+
+ .anty-row-operator button {
+ margin: 0 5px
+ }
+
+ .ant-btn-danger {
+ background-color: #ffffff
+ }
+
+ .ant-modal-cust-warp {
+ height: 100%
+ }
+
+ .ant-modal-cust-warp .ant-modal-body {
+ height: calc(100% - 110px) !important;
+ overflow-y: auto
+ }
+
+ .ant-modal-cust-warp .ant-modal-content {
+ height: 90% !important;
+ overflow-y: hidden
+ }
+</style>
\ No newline at end of file
diff --git a/src/views/system/modules/UserModal.vue b/src/views/system/modules/UserModal.vue
index ce46390..d46bccf 100644
--- a/src/views/system/modules/UserModal.vue
+++ b/src/views/system/modules/UserModal.vue
@@ -238,9 +238,9 @@
//鏍规嵁灞忓箷瀹藉害鑷�傚簲鎶藉眽瀹藉害
this.resetScreenSize();
that.userId = record.id;
+
that.model = Object.assign({},{selectedroles:'',selecteddeparts:''}, record);
that.model = Object.assign({},{selectedroles:'',selectedProduction:''}, record);
-
//韬唤涓轰笂绾ф樉绀鸿礋璐ｉ儴闂紝鍚﹀垯涓嶆樉绀�
if(this.model.userIdentity==2){
this.departIdShow=true;
@@ -252,7 +252,7 @@
that.getUserRoles(record.id);
that.getUserDeparts(record.id);
}
- console.log('that.model=',that.model)
+ console.log('that.model',that.model)
},
isDisabledAuth(code){
return disabledAuthFilter(code);
@@ -366,8 +366,6 @@
return c;
})
},
-
-
refresh () {
this.userId=""
diff --git a/src/views/system/modules/WorkshopModal.vue b/src/views/system/modules/WorkshopModal.vue
new file mode 100644
index 0000000..5c74232
--- /dev/null
+++ b/src/views/system/modules/WorkshopModal.vue
@@ -0,0 +1,134 @@
+<template>
+ <a-modal
+ :title="title"
+ :width="800"
+ :visible="visible"
+ :confirmLoading="confirmLoading"
+ @ok="handleOk"
+ @cancel="handleCancel"
+ cancelText="鍏抽棴"
+ wrapClassName="ant-modal-cust-warp"
+ style="top:5%;height: 85%;overflow-y: hidden">
+
+ <a-spin :spinning="confirmLoading">
+ <a-form-model ref="form" v-bind="layout" :model="model" :rules="validatorRules">
+ <a-form-model-item label="杞﹂棿缂栧彿" required prop="id">
+ <a-input v-model="model.id" :disabled="isEdit" placeholder="璇疯緭鍏ヨ溅闂寸紪鍙�"/>
+ </a-form-model-item>
+ <a-form-model-item label="杞﹂棿鍚嶇О" required prop="workshopName">
+ <a-input v-model="model.workshopName" placeholder="璇疯緭鍏ヨ溅闂村悕绉�"/>
+ </a-form-model-item>
+ <a-form-model-item label="杞﹂棿鑳屾櫙鍥�" required prop="backgroundImage">
+ <j-image-upload class="avatar-uploader" text="涓婁紶" v-model="model.backgroundImage"></j-image-upload>
+ </a-form-model-item>
+ </a-form-model>
+ </a-spin>
+ </a-modal>
+</template>
+
+<script>
+ import api from '@/api/mdc'
+
+ export default {
+ name: 'WorkshopModal',
+ data() {
+ return {
+ title: '鎿嶄綔',
+ visible: false,
+ isEdit: false,
+ model: {},
+ layout: {
+ labelCol: { span: 3 },
+ wrapperCol: { span: 14 }
+ },
+ confirmLoading: false,
+ validatorRules: {
+ workshopName: [
+ { required: true, message: '璇疯緭鍏ヨ溅闂村悕绉�!' },
+ { min: 2, max: 30, message: '闀垮害鍦� 2 鍒� 30 涓瓧绗�', trigger: 'blur' }
+ ],
+ id: [
+ { required: true, message: '璇疯緭鍏ヨ溅闂寸紪鍙�!' },
+ { min: 0, max: 64, message: '闀垮害涓嶈秴杩� 64 涓瓧绗�', trigger: 'blur' },
+ { validator: this.validateRoleCode }
+ ],
+ backgroundImage:[
+ { required: true, message: '璇蜂笂浼犺溅闂磋儗鏅浘!' }
+ ]
+ }
+ }
+ },
+ created() {
+ //澶囦唤model鍘熷鍊�
+ this.modelDefault = JSON.parse(JSON.stringify(this.model))
+ },
+ methods: {
+ add() {
+ this.edit(this.modelDefault)
+ },
+ edit(record) {
+ this.model = Object.assign({}, record)
+ this.visible = true
+ //缂栬緫椤甸潰绂佹淇敼瑙掕壊缂栫爜
+ if (this.model.id) {
+ this.isEdit = true
+ } else {
+ this.isEdit = false
+ }
+ },
+ close() {
+ this.$refs.form.clearValidate()
+ this.$emit('close')
+ this.visible = false
+ },
+ handleOk() {
+ const that = this
+ // 瑙﹀彂琛ㄥ崟楠岃瘉
+ this.$refs.form.validate(valid => {
+ if (valid) {
+ console.log('瑙﹀彂')
+ that.confirmLoading = true
+ let obj
+ if (!this.isEdit) {
+ console.log('瑙﹀彂鏂板')
+ obj = api.addWorkshopApi(this.model)
+ } else {
+ console.log('瑙﹀彂淇敼')
+ obj = api.editWorkshopApi(this.model)
+ }
+ obj.then((res) => {
+ if (res.success) {
+ that.$message.success(res.message)
+ that.$emit('ok')
+ } else {
+ that.$message.warning(res.message)
+ }
+ }).finally(() => {
+ that.confirmLoading = false
+ that.close()
+ })
+ } else {
+ return false
+ }
+ })
+ },
+ handleCancel() {
+ this.close()
+ },
+ validateRoleCode(rule, value, callback) {
+ if (/[\u4E00-\u9FA5]/g.test(value)) {
+ callback('杞﹂棿缂栧彿涓嶅彲杈撳叆姹夊瓧!')
+ } else {
+ callback()
+ }
+ }
+ }
+ }
+</script>
+
+<style scoped>
+ .avatar-uploader > .ant-upload {
+ width: 104px;
+ height: 104px;
+ }
+</style>
\ No newline at end of file
--
Gitblit v1.9.3