Merge pull request 'pc-master' (#248) from pc-master into portal
Reviewed-on: #248
812
package-lock.json
generated
@ -7,6 +7,7 @@
|
||||
"build": "vue-cli-service build"
|
||||
},
|
||||
"dependencies": {
|
||||
"@wangeditor/editor-for-vue": "^1.0.2",
|
||||
"axios": "^1.5.0",
|
||||
"core-js": "^3.8.3",
|
||||
"echarts": "^5.4.3",
|
||||
@ -21,8 +22,8 @@
|
||||
"vue": "^2.7.14",
|
||||
"vue-router": "^3.5.1",
|
||||
"vue-seamless-scroll": "^1.1.23",
|
||||
"vue-video-player": "^6.0.0",
|
||||
"vuex": "^3.6.2"
|
||||
"vuex": "^3.6.2",
|
||||
"wangeditor": "^4.7.15"
|
||||
},
|
||||
"devDependencies": {
|
||||
"@vue/cli-plugin-babel": "~5.0.0",
|
||||
|
@ -55,7 +55,7 @@ selectValue(e) {
|
||||
box-sizing: border-box;
|
||||
font-family: Microsoft YaHei;
|
||||
font-weight: 400;
|
||||
color: #fff;
|
||||
// color: #fff;
|
||||
}
|
||||
|
||||
input::-webkit-outer-spin-button,
|
||||
@ -124,7 +124,12 @@ input::-webkit-inner-spin-button {
|
||||
background: linear-gradient(180deg, rgba(6, 72, 167, 0.5) 0%, rgba(6, 72, 167, 0) 100%);
|
||||
|
||||
}
|
||||
|
||||
.el-table{
|
||||
.cell{
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
}
|
||||
.input-50 {
|
||||
.input-title {
|
||||
font-size: 16px;
|
||||
|
399
src/api/index.js
@ -1,29 +1,29 @@
|
||||
import axios from "axios";
|
||||
// import qs from 'qs'
|
||||
import router from '../router/index'
|
||||
// import qs from `qs`
|
||||
import router from "../router/index"
|
||||
|
||||
function sendGetRequest(url, data) {
|
||||
return new Promise(function (resolve, reject) {
|
||||
axios.get(url, {
|
||||
headers: { //头部参数
|
||||
// 'Content-Type': 'application/json; charset=utf-8',
|
||||
// "Access-Control-Allow-Origin": "*",
|
||||
// "Access-Control-Allow-Headers": "Origin, X-Requested-With, Content-Type, Accept",
|
||||
'token': (localStorage.getItem('token') ? localStorage.getItem('token') : '')
|
||||
// `Content-Type`: `application/json; charset=utf-8`,
|
||||
// `Access-Control-Allow-Origin`: `*`,
|
||||
// `Access-Control-Allow-Headers`: `Origin, X-Requested-With, Content-Type, Accept`,
|
||||
"token": (localStorage.getItem(`token`) ? localStorage.getItem(`token`) : ``)
|
||||
},
|
||||
params: data
|
||||
})
|
||||
.then(function (res) { //请求成功,response接收返回参数
|
||||
|
||||
if (res.data.code == 401) {
|
||||
localStorage.removeItem('token')
|
||||
if(router.currentRoute.name!='login'){
|
||||
localStorage.removeItem(`token`)
|
||||
if(router.currentRoute.name!=`login`){
|
||||
router.push({
|
||||
name: 'login'
|
||||
name: `login`
|
||||
})
|
||||
}
|
||||
// router.push({
|
||||
// name: 'login'
|
||||
// name: `login`
|
||||
// })
|
||||
}
|
||||
resolve(res);
|
||||
@ -34,6 +34,7 @@ function sendGetRequest(url, data) {
|
||||
})
|
||||
});
|
||||
}
|
||||
|
||||
function sendUploadRequest(url, data) {
|
||||
// 一个状态为resolve(包裹的是数据)
|
||||
// 或者状态为reject (包裹的是错误信息)
|
||||
@ -41,17 +42,17 @@ function sendUploadRequest(url, data) {
|
||||
return new Promise(function (resolve, reject) {
|
||||
axios.post(url, data, {
|
||||
headers: {
|
||||
'Content-Type': 'multipart/form-data',
|
||||
// 'Content-Type': 'application/json; charset=utf-8',
|
||||
'token': (localStorage.getItem('token') ? localStorage.getItem('token') : '')
|
||||
"Content-Type": `multipart/form-data`,
|
||||
// `Content-Type`: `application/json; charset=utf-8`,
|
||||
"token": (localStorage.getItem(`token`) ? localStorage.getItem(`token`) : ``)
|
||||
}
|
||||
}).then(
|
||||
(res) => {
|
||||
if (res.data.code == 401) {
|
||||
localStorage.removeItem('token')
|
||||
if(router.currentRoute.name!='login'){
|
||||
localStorage.removeItem(`token`)
|
||||
if(router.currentRoute.name!=`login`){
|
||||
router.push({
|
||||
name: 'login'
|
||||
name: `login`
|
||||
})
|
||||
}
|
||||
}
|
||||
@ -71,16 +72,16 @@ function sendPostRequest(url, data) {
|
||||
return new Promise(function (resolve, reject) {
|
||||
axios.post(url, data, {
|
||||
headers: {
|
||||
// 'Content-Type': 'application/json; charset=utf-8',
|
||||
'token': (localStorage.getItem('token') ? localStorage.getItem('token') : '')
|
||||
// `Content-Type`: `application/json; charset=utf-8`,
|
||||
"token": (localStorage.getItem(`token`) ? localStorage.getItem(`token`) : ``)
|
||||
}
|
||||
}).then(
|
||||
(res) => {
|
||||
if (res.data.code == 401) {
|
||||
localStorage.removeItem('token')
|
||||
if(router.currentRoute.name!='login'){
|
||||
localStorage.removeItem(`token`)
|
||||
if(router.currentRoute.name!=`login`){
|
||||
router.push({
|
||||
name: 'login'
|
||||
name: `login`
|
||||
})
|
||||
}
|
||||
}
|
||||
@ -100,19 +101,19 @@ function sendDelRequest(url, data) {
|
||||
return new Promise(function (resolve, reject) {
|
||||
axios.delete(url, {
|
||||
headers: { //头部参数
|
||||
// 'Content-Type': 'application/json; charset=utf-8',
|
||||
// "Access-Control-Allow-Origin": "*",
|
||||
// "Access-Control-Allow-Headers": "Origin, X-Requested-With, Content-Type, Accept",
|
||||
'token': (localStorage.getItem('token') ? localStorage.getItem('token') : '')
|
||||
// `Content-Type`: `application/json; charset=utf-8`,
|
||||
// `Access-Control-Allow-Origin`: `*`,
|
||||
// `Access-Control-Allow-Headers`: `Origin, X-Requested-With, Content-Type, Accept`,
|
||||
"token": (localStorage.getItem(`token`) ? localStorage.getItem(`token`) : ``)
|
||||
},
|
||||
params: data
|
||||
}).then(
|
||||
(res) => {
|
||||
if (res.data.code == 401) {
|
||||
localStorage.removeItem('token')
|
||||
if(router.currentRoute.name!='login'){
|
||||
localStorage.removeItem(`token`)
|
||||
if(router.currentRoute.name!=`login`){
|
||||
router.push({
|
||||
name: 'login'
|
||||
name: `login`
|
||||
})
|
||||
}
|
||||
}
|
||||
@ -131,16 +132,16 @@ function sendPutRequest(url, data) {
|
||||
return new Promise(function (resolve, reject) {
|
||||
axios.put(url, data, {
|
||||
headers: {
|
||||
// 'Content-Type': 'application/json; charset=utf-8',
|
||||
'token': (localStorage.getItem('token') ? localStorage.getItem('token') : '')
|
||||
// `Content-Type`: `application/json; charset=utf-8`,
|
||||
"token": (localStorage.getItem(`token`) ? localStorage.getItem(`token`) : ``)
|
||||
}
|
||||
}).then(
|
||||
(res) => {
|
||||
if (res.data.code == 401) {
|
||||
localStorage.removeItem('token')
|
||||
if(router.currentRoute.name!='login'){
|
||||
localStorage.removeItem(`token`)
|
||||
if(router.currentRoute.name!=`login`){
|
||||
router.push({
|
||||
name: 'login'
|
||||
name: `login`
|
||||
})
|
||||
}
|
||||
}
|
||||
@ -153,7 +154,7 @@ function sendPutRequest(url, data) {
|
||||
});
|
||||
}
|
||||
//总接口域名
|
||||
axios.defaults.baseURL = "/api";
|
||||
// axios.defaults.baseURL = `/jiaxing`;
|
||||
axios.defaults.timeout = 30000; // 设置全局默认请求超时时间为10秒
|
||||
|
||||
|
||||
@ -162,520 +163,520 @@ axios.defaults.timeout = 30000; // 设置全局默认请求超时时间为10秒
|
||||
export default {
|
||||
//防止没有一个post/get会报错 写一个默认的
|
||||
get(data) {
|
||||
return sendGetRequest("", data);
|
||||
return sendGetRequest(`/jiaxing`, data);
|
||||
},
|
||||
post(data) {
|
||||
return sendPostRequest("", data);
|
||||
return sendPostRequest(`/jiaxing`, data);
|
||||
},
|
||||
delete(data) {
|
||||
return sendDelRequest("", data);
|
||||
return sendDelRequest(`/jiaxing`, data);
|
||||
},
|
||||
|
||||
put(data) {
|
||||
return sendPutRequest("", data);
|
||||
return sendPutRequest(`/jiaxing`, data);
|
||||
},
|
||||
|
||||
|
||||
//接口开始()
|
||||
//登录
|
||||
login(data) {
|
||||
return sendPostRequest("/user/login", data);
|
||||
return sendPostRequest(`/jiaxing/user/login`, data);
|
||||
},
|
||||
loginOut(data) {
|
||||
return sendGetRequest("/user/logout", data);
|
||||
return sendGetRequest(`/jiaxing/user/logout`, data);
|
||||
},
|
||||
|
||||
//管理员根据设备id查询设备信息
|
||||
getSeldevicebyid(data) {
|
||||
return sendGetRequest("/admin/seldevicebyid", data);
|
||||
return sendGetRequest(`/jiaxing/admin/seldevicebyid`, data);
|
||||
},
|
||||
//根据用户id查询对应的设备数据
|
||||
getEqbyid(data) {
|
||||
return sendGetRequest("/sel/eqbyid/" + data, '');
|
||||
return sendGetRequest(`/jiaxing/sel/eqbyid/` + data, ``);
|
||||
},
|
||||
//气象站显示
|
||||
geteqetdata(data) {
|
||||
return sendGetRequest(`/getcontrol/geteqetdata?userId=`+data ,"")
|
||||
return sendGetRequest(`/jiaxing/getcontrol/geteqetdata?userId=`+data ,``)
|
||||
},
|
||||
// 数据采集器的实时数据
|
||||
getdataRtdata(data) {
|
||||
return sendGetRequest(`/getdata/rtdata?deviceId=` + data, '')
|
||||
return sendGetRequest(`/jiaxing/getdata/rtdata?deviceId=` + data, ``)
|
||||
},
|
||||
//测试施肥机读取设备状态信息 //读取数据 根据文档编号读取 所有数据展示都出自这个接口
|
||||
postReg(data) {
|
||||
return sendPostRequest("/readFs/reg", data);
|
||||
return sendPostRequest(`/jiaxing/readFs/reg`, data);
|
||||
},
|
||||
//测试施肥机读取设备状态信息 //读取数据 根据文档编号读取 所有数据展示都出自这个接口
|
||||
postState(data) {
|
||||
return sendPostRequest("/readFs/state", data);
|
||||
return sendPostRequest(`/jiaxing/readFs/state`, data);
|
||||
},
|
||||
//测试施肥机写入数据信息 //修改数据 根据文档编号修改 所有数据修改都出自这个接口
|
||||
postWriteFs(data) {
|
||||
return sendPostRequest("/writeFs", data);
|
||||
return sendPostRequest(`/jiaxing/writeFs`, data);
|
||||
},
|
||||
getByid(data) {
|
||||
return sendGetRequest("/readFs/byid", data);
|
||||
return sendGetRequest(`/jiaxing/readFs/byid`, data);
|
||||
},
|
||||
//获取实时数据
|
||||
postRtdata(data) {
|
||||
return sendPostRequest("/getFs/rtdata?equipmentId=" + data, '');
|
||||
return sendPostRequest(`/jiaxing/getFs/rtdata?equipmentId=` + data, ``);
|
||||
},
|
||||
//获取实时数据
|
||||
postFsdata(data) {
|
||||
return sendPostRequest("/chart/fsdata?equipmentId=" + data, '');
|
||||
return sendPostRequest(`/jiaxing/chart/fsdata?equipmentId=` + data, ``);
|
||||
},
|
||||
//获取监控地址
|
||||
getGethls(data) {
|
||||
return sendGetRequest("/camera/gethls", data);
|
||||
return sendGetRequest(`/jiaxing/camera/gethls`, data);
|
||||
},
|
||||
//根据ID查询用户信息
|
||||
getUser(data) {
|
||||
return sendGetRequest('/api/sel/user', data)
|
||||
return sendGetRequest(`/jiaxing/api/sel/user`, data)
|
||||
},
|
||||
|
||||
|
||||
//控制器接口
|
||||
//控制器实时数据
|
||||
getControlRtdata(data) {
|
||||
return sendPostRequest("/getcontrol/rtdata?equipmentId=" + data, '');
|
||||
return sendPostRequest(`/jiaxing/getcontrol/rtdata?equipmentId=` + data, ``);
|
||||
},
|
||||
//控制器实时数据折线图
|
||||
getControlFsdata(data) {
|
||||
return sendPostRequest("/getcontrol/fsdata?equipmentId=" + data, '');
|
||||
return sendPostRequest(`/jiaxing/getcontrol/fsdata?equipmentId=` + data, ``);
|
||||
},
|
||||
//控制器数据上传数据获取
|
||||
getControldataUpload(data) {
|
||||
return sendGetRequest('/readControl/dataUpload', data)
|
||||
return sendGetRequest(`/jiaxing/readControl/dataUpload`, data)
|
||||
},
|
||||
//控制器写入数据
|
||||
postControlWrite(data) {
|
||||
return sendPostRequest("/writeJinHuaControl/write", data);
|
||||
return sendPostRequest(`/jiaxing/writeJinHuaControl/write`, data);
|
||||
},
|
||||
//控制器传感器通道
|
||||
getReadControlSensorChannel(data) {
|
||||
return sendGetRequest('/readControl/sensorChannel', data)
|
||||
return sendGetRequest(`/jiaxing/readControl/sensorChannel`, data)
|
||||
},
|
||||
//控制器 顶模和风机
|
||||
getReadControlliShuiControl(data) {
|
||||
return sendGetRequest('/readControl/liShuiControl', data)
|
||||
return sendGetRequest(`/jiaxing/readControl/liShuiControl`, data)
|
||||
},
|
||||
//控制器 传感器输入合成
|
||||
getReadControlSensorInputSynthesis(data) {
|
||||
return sendGetRequest('/readControl/sensorInputSynthesis', data)
|
||||
return sendGetRequest(`/jiaxing/readControl/sensorInputSynthesis`, data)
|
||||
},
|
||||
//控制器 主页查看控制器气象站实时数据
|
||||
getControlRtDatastation(data) {
|
||||
return sendGetRequest('/getcontrol/rtDatastation', data)
|
||||
return sendGetRequest(`/jiaxing/getcontrol/rtDatastation`, data)
|
||||
},
|
||||
//控制器 设备运行状态
|
||||
getControlGetState(data) {
|
||||
return sendGetRequest('/readControl/getState', data)
|
||||
return sendGetRequest(`/jiaxing/readControl/getState`, data)
|
||||
},
|
||||
//控制器 气象站实时数据折线图
|
||||
getControlChartdata(data) {
|
||||
return sendPostRequest('/equip/chartdata?equipmentId=' + data, '')
|
||||
return sendPostRequest(`/jiaxing/equip/chartdata?equipmentId=` + data, ``)
|
||||
},
|
||||
//首页历史数据/数据分析弹窗
|
||||
selFsAvgdata(data) {
|
||||
return sendPostRequest('/selFs/avgdata',data)
|
||||
return sendPostRequest(`/jiaxing/selFs/avgdata`,data)
|
||||
},
|
||||
//首页历史数据/数据分析弹窗下载数据
|
||||
selFsAvgdatadownload(data) {
|
||||
return sendPostRequest('/selFs/avgdatadownload',data)
|
||||
return sendPostRequest(`/jiaxing/selFs/avgdatadownload`,data)
|
||||
},
|
||||
|
||||
|
||||
|
||||
// 根据用户id查询对应的设备大数据信息
|
||||
Bigdata_getAllControl(userid, data) {
|
||||
return sendGetRequest(`/Bigdata/getAllControl?userid=${userid}`, data);
|
||||
return sendGetRequest(`/jiaxing/Bigdata/getAllControl?userid=${userid}`, data);
|
||||
},
|
||||
|
||||
// 获取设备当天的温度
|
||||
Bigdata_getTemperature(deviceid, data) {
|
||||
return sendGetRequest(`/Bigdata/getTemperature?deviceid=${deviceid}`, data);
|
||||
return sendGetRequest(`/jiaxing/Bigdata/getTemperature?deviceid=${deviceid}`, data);
|
||||
},
|
||||
|
||||
// 获取设备一周的温度
|
||||
Bigdata_getWeekTemperature(deviceid, data) {
|
||||
return sendGetRequest(`/Bigdata/getWeekTemperature?deviceid=${deviceid}`, data);
|
||||
return sendGetRequest(`/jiaxing/Bigdata/getWeekTemperature?deviceid=${deviceid}`, data);
|
||||
},
|
||||
|
||||
// 主页查看控制器实时数据
|
||||
getcontrol_rtdata(equipmentId, data) {
|
||||
return sendPostRequest(`/getcontrol/rtdata?equipmentId=${equipmentId}`, data);
|
||||
return sendPostRequest(`/jiaxing/getcontrol/rtdata?equipmentId=${equipmentId}`, data);
|
||||
},
|
||||
|
||||
// 获取摄像头得地址 Copy
|
||||
camera_gethls(cameraid, channelid, data) {
|
||||
return sendGetRequest(`/camera/gethls?cameraid=${cameraid}&channelid=${channelid}`, data);
|
||||
return sendGetRequest(`/jiaxing/camera/gethls?cameraid=${cameraid}&channelid=${channelid}`, data);
|
||||
},
|
||||
|
||||
// 根据用户id查询对应的设备数据 Copy
|
||||
sel_eqbyid(userId, data) {
|
||||
return sendGetRequest(`/sel/eqbyid/${userId}`, data);
|
||||
return sendGetRequest(`/jiaxing/sel/eqbyid/${userId}`, data);
|
||||
},
|
||||
|
||||
// 控制器状态值获取 Copy
|
||||
readControl_getState(deviceId, data) {
|
||||
return sendGetRequest(`/readControl/getState?deviceId=${deviceId}`, data);
|
||||
return sendGetRequest(`/jiaxing/readControl/getState?deviceId=${deviceId}`, data);
|
||||
},
|
||||
|
||||
getcontrol_rtDatastation(equipmentId, data) {
|
||||
return sendGetRequest(`/getcontrol/rtDatastation?equipmentId=${equipmentId}`, data)
|
||||
return sendGetRequest(`/jiaxing/getcontrol/rtDatastation?equipmentId=${equipmentId}`, data)
|
||||
},
|
||||
//控制器根据设备查看权限
|
||||
getcontrol_cpermission(equipmentId, data) {
|
||||
return sendPostRequest(`/getcontrol/cpermission?deviceId=${equipmentId}`, data)
|
||||
return sendPostRequest(`/jiaxing/getcontrol/cpermission?deviceId=${equipmentId}`, data)
|
||||
},
|
||||
//控制器五防接口
|
||||
readControl_fiveControl(data) {
|
||||
return sendGetRequest(`/readControl/fiveControl`, data);
|
||||
return sendGetRequest(`/jiaxing/readControl/fiveControl`, data);
|
||||
},
|
||||
|
||||
// 查看用户额外权限
|
||||
user_getjurisdiction(userId, data) {
|
||||
return sendGetRequest(`/user/getjurisdiction?userId=${userId}`, data)
|
||||
return sendGetRequest(`/jiaxing/user/getjurisdiction?userId=${userId}`, data)
|
||||
},
|
||||
|
||||
|
||||
//实时数据页面状态值(查看全部设备)
|
||||
getStatePermissionStatus(data) {
|
||||
return sendGetRequest(`/getcontrol/getStatePermissionStatus`, data)
|
||||
return sendGetRequest(`/jiaxing/getcontrol/getStatePermissionStatus`, data)
|
||||
},
|
||||
//获取当前权限能看到的设备
|
||||
getPermissionStatus(data) {
|
||||
return sendGetRequest(`/getcontrol/getPermissionStatus`, data)
|
||||
return sendGetRequest(`/jiaxing/getcontrol/getPermissionStatus`, data)
|
||||
},
|
||||
//根据id删除status设备
|
||||
delPermissionStatus(id1, id2) {
|
||||
return sendPostRequest(`/getcontrol/delPermissionStatus?deviceId=${id1}&permissionid=${id2}`, '')
|
||||
return sendPostRequest(`/jiaxing/getcontrol/delPermissionStatus?deviceId=${id1}&permissionid=${id2}`, ``)
|
||||
},
|
||||
//根据id添加status设备
|
||||
addPermissionStatus(id1, id2) {
|
||||
return sendPostRequest(`/getcontrol/addStatepermission?deviceId=${id1}&Permissionid=${id2}`, '')
|
||||
return sendPostRequest(`/jiaxing/getcontrol/addStatepermission?deviceId=${id1}&Permissionid=${id2}`, ``)
|
||||
},
|
||||
|
||||
//添加短信报警
|
||||
addWarnMessage(data) {
|
||||
return sendPostRequest(`/shortMessage/setMessage`, data)
|
||||
return sendPostRequest(`/jiaxing/shortMessage/setMessage`, data)
|
||||
},
|
||||
//短信报警填写条件
|
||||
selnowmes(data) {
|
||||
return sendGetRequest(`/shortMessage/selnowmes`, data)
|
||||
return sendGetRequest(`/jiaxing/shortMessage/selnowmes`, data)
|
||||
},
|
||||
//根据设备id查看短信报警
|
||||
messageList(data) {
|
||||
return sendGetRequest(`/shortMessage/selMesById`, data)
|
||||
return sendGetRequest(`/jiaxing/shortMessage/selMesById`, data)
|
||||
},
|
||||
|
||||
//根据id删除短信报警
|
||||
delMessage(data) {
|
||||
return sendDelRequest(`/shortMessage/delmesbyid`, data)
|
||||
return sendDelRequest(`/jiaxing/shortMessage/delmesbyid`, data)
|
||||
},
|
||||
//控制器新页面接口
|
||||
//目标值 目标温度/湿度/co2
|
||||
targetValue(data) {
|
||||
return sendGetRequest(`/readControl/targetValue`, data)
|
||||
return sendGetRequest(`/jiaxing/readControl/targetValue`, data)
|
||||
},
|
||||
//电磁阀1
|
||||
solenoidValve1(data) {
|
||||
return sendGetRequest(`/readControl/solenoidValve1`, data)
|
||||
return sendGetRequest(`/jiaxing/readControl/solenoidValve1`, data)
|
||||
},
|
||||
//电磁阀2
|
||||
solenoidValve2(data) {
|
||||
return sendGetRequest(`/readControl/solenoidValve2`, data)
|
||||
return sendGetRequest(`/jiaxing/readControl/solenoidValve2`, data)
|
||||
},
|
||||
//电磁阀3
|
||||
solenoidValve3(data) {
|
||||
return sendGetRequest(`/readControl/solenoidValve3`, data)
|
||||
return sendGetRequest(`/jiaxing/readControl/solenoidValve3`, data)
|
||||
},
|
||||
//电磁阀4
|
||||
solenoidValve4(data) {
|
||||
return sendGetRequest(`/readControl/solenoidValve4`, data)
|
||||
return sendGetRequest(`/jiaxing/readControl/solenoidValve4`, data)
|
||||
},
|
||||
//电磁阀5
|
||||
solenoidValve5(data) {
|
||||
return sendGetRequest(`/readControl/solenoidValve5`, data)
|
||||
return sendGetRequest(`/jiaxing/readControl/solenoidValve5`, data)
|
||||
},
|
||||
//电磁阀6
|
||||
solenoidValve6(data) {
|
||||
return sendGetRequest(`/readControl/solenoidValve6`, data)
|
||||
return sendGetRequest(`/jiaxing/readControl/solenoidValve6`, data)
|
||||
},
|
||||
//电磁阀7
|
||||
solenoidValve7(data) {
|
||||
return sendGetRequest(`/readControl/solenoidValve7`, data)
|
||||
return sendGetRequest(`/jiaxing/readControl/solenoidValve7`, data)
|
||||
},
|
||||
//电磁阀8
|
||||
solenoidValve8(data) {
|
||||
return sendGetRequest(`/readControl/solenoidValve8`, data)
|
||||
return sendGetRequest(`/jiaxing/readControl/solenoidValve8`, data)
|
||||
},
|
||||
//强制通道输出
|
||||
forceChannelOutput(data) {
|
||||
return sendGetRequest(`/readControl/forceChannelOutput`, data)
|
||||
return sendGetRequest(`/jiaxing/readControl/forceChannelOutput`, data)
|
||||
},
|
||||
//天窗
|
||||
readskylight(data) {
|
||||
return sendGetRequest(`/readControl/readskylight`, data)
|
||||
return sendGetRequest(`/jiaxing/readControl/readskylight`, data)
|
||||
},
|
||||
//空调
|
||||
airconditioner(data) {
|
||||
return sendGetRequest(`/readControl/airconditioner`, data)
|
||||
return sendGetRequest(`/jiaxing/readControl/airconditioner`, data)
|
||||
},
|
||||
|
||||
//固有参数
|
||||
intrinsicParameter(data) {
|
||||
return sendGetRequest(`/readControl/intrinsicParameter`, data)
|
||||
return sendGetRequest(`/jiaxing/readControl/intrinsicParameter`, data)
|
||||
},
|
||||
//厂家内部参数
|
||||
manufacturerparameter(data) {
|
||||
return sendGetRequest(`/readControl/manufacturerparameter`, data)
|
||||
return sendGetRequest(`/jiaxing/readControl/manufacturerparameter`, data)
|
||||
},
|
||||
//高压微雾
|
||||
highpressuremist(data) {
|
||||
return sendGetRequest(`/readControl/highpressuremist`, data)
|
||||
return sendGetRequest(`/jiaxing/readControl/highpressuremist`, data)
|
||||
},
|
||||
//内遮阳
|
||||
innercurtain(data) {
|
||||
return sendGetRequest(`/readControl/innercurtain`, data)
|
||||
return sendGetRequest(`/jiaxing/readControl/innercurtain`, data)
|
||||
},
|
||||
//外遮阳
|
||||
externalsunshade(data) {
|
||||
return sendGetRequest(`/readControl/externalsunshade`, data)
|
||||
return sendGetRequest(`/jiaxing/readControl/externalsunshade`, data)
|
||||
},
|
||||
//风机湿帘
|
||||
fanwetcurtain(data) {
|
||||
return sendGetRequest(`/readControl/fanwetcurtain`, data)
|
||||
return sendGetRequest(`/jiaxing/readControl/fanwetcurtain`, data)
|
||||
},
|
||||
//补光灯
|
||||
readfilllight(data) {
|
||||
return sendGetRequest(`/readControl/readfilllight`, data)
|
||||
return sendGetRequest(`/jiaxing/readControl/readfilllight`, data)
|
||||
},
|
||||
//CO2补气
|
||||
co2replenishment(data) {
|
||||
return sendGetRequest(`/readControl/co2replenishment`, data)
|
||||
return sendGetRequest(`/jiaxing/readControl/co2replenishment`, data)
|
||||
},
|
||||
//冷暖风机
|
||||
heatfan(data) {
|
||||
return sendGetRequest(`/readControl/heatfan`, data)
|
||||
return sendGetRequest(`/jiaxing/readControl/heatfan`, data)
|
||||
},
|
||||
//内保温
|
||||
interiorthermalinsulation(data) {
|
||||
return sendGetRequest(`/readControl/interiorthermalinsulation`, data)
|
||||
return sendGetRequest(`/jiaxing/readControl/interiorthermalinsulation`, data)
|
||||
},
|
||||
//立面保温
|
||||
facadeinsulation(data) {
|
||||
return sendGetRequest(`/readControl/facadeinsulation`, data)
|
||||
return sendGetRequest(`/jiaxing/readControl/facadeinsulation`, data)
|
||||
},
|
||||
//环流风扇
|
||||
readcirculationfan(data) {
|
||||
return sendGetRequest(`/readControl/readcirculationfan`, data)
|
||||
return sendGetRequest(`/jiaxing/readControl/readcirculationfan`, data)
|
||||
},
|
||||
//报警设置
|
||||
readalarmSetting(data) {
|
||||
return sendGetRequest(`/readControl/alarmSetting`, data)
|
||||
return sendGetRequest(`/jiaxing/readControl/alarmSetting`, data)
|
||||
},
|
||||
|
||||
//报警设置
|
||||
readalarmSetting(data) {
|
||||
return sendGetRequest(`/readControl/alarmSetting`, data)
|
||||
return sendGetRequest(`/jiaxing/readControl/alarmSetting`, data)
|
||||
},
|
||||
//主页查看施肥机历史数据
|
||||
selFsTime(data) {
|
||||
return sendPostRequest(`/selFs/time`, data)
|
||||
return sendPostRequest(`/jiaxing/selFs/time`, data)
|
||||
},
|
||||
//主页查看施肥机历史数据
|
||||
loadHistorydata(data) {
|
||||
return sendPostRequest(`/load/historydata`, data)
|
||||
return sendPostRequest(`/jiaxing/load/historydata`, data)
|
||||
},
|
||||
//查看抓取图片历史数据
|
||||
imageReadtoday(data) {
|
||||
return sendPostRequest(`/image/readtoday`, data)
|
||||
return sendPostRequest(`/jiaxing/image/readtoday`, data)
|
||||
},
|
||||
//下载图片
|
||||
imageUploadImage(data) {
|
||||
return sendPostRequest(`/image/uploadImage`, data)
|
||||
return sendPostRequest(`/jiaxing/image/uploadImage`, data)
|
||||
},
|
||||
|
||||
//摄像头操作开始
|
||||
cameraStart(cameraSerialNumber,cameraChannelNumber,num) {
|
||||
return sendPostRequest(`/camera/start?cameraid=${cameraSerialNumber}&channelid=${cameraChannelNumber}&direction=${num}`)
|
||||
return sendPostRequest(`/jiaxing/camera/start?cameraid=${cameraSerialNumber}&channelid=${cameraChannelNumber}&direction=${num}`)
|
||||
},
|
||||
//摄像头操作结束
|
||||
cameraStop(cameraSerialNumber,cameraChannelNumber,num) {
|
||||
return sendPostRequest(`/camera/stop?cameraid=${cameraSerialNumber}&channelid=${cameraChannelNumber}&direction=${num}`)
|
||||
return sendPostRequest(`/jiaxing/camera/stop?cameraid=${cameraSerialNumber}&channelid=${cameraChannelNumber}&direction=${num}`)
|
||||
},
|
||||
|
||||
|
||||
//管理模块
|
||||
//根据用户ID获取账户设备
|
||||
selUserbyid(data){
|
||||
return sendGetRequest(`/sel/userbyid/`+data, '')
|
||||
return sendGetRequest(`/jiaxing/sel/userbyid/`+data, ``)
|
||||
},
|
||||
//根据设备ID获取设备状态值
|
||||
selControlPermissions(data){
|
||||
return sendGetRequest(`/getcontrol/selControlPermissions`, data)
|
||||
return sendGetRequest(`/jiaxing/getcontrol/selControlPermissions`, data)
|
||||
},
|
||||
//根据设备ID修改设备状态值
|
||||
putpermission(data){
|
||||
return sendPutRequest(`/getcontrol/putpermission`, data)
|
||||
return sendPutRequest(`/jiaxing/getcontrol/putpermission`, data)
|
||||
},
|
||||
//根据权限id修改权限显示或者隐藏
|
||||
updatePermissionState(data){
|
||||
return sendPutRequest(`/getcontrol/updatePermissionState`, data)
|
||||
return sendPutRequest(`/jiaxing/getcontrol/updatePermissionState`, data)
|
||||
},
|
||||
|
||||
//根据设备ID获取设备控制值
|
||||
selpermission(data){
|
||||
return sendGetRequest(`/getcontrol/selpermission`, data)
|
||||
return sendGetRequest(`/jiaxing/getcontrol/selpermission`, data)
|
||||
},
|
||||
//根据设备ID修改设备控制值
|
||||
putControlpermission(data){
|
||||
return sendPutRequest(`/getcontrol/putControlpermission`, data)
|
||||
return sendPutRequest(`/jiaxing/getcontrol/putControlpermission`, data)
|
||||
},
|
||||
//根据ID修改施肥机数据
|
||||
updatedevice(data){
|
||||
return sendPutRequest(`/device/updatedevice`, data)
|
||||
return sendPutRequest(`/jiaxing/device/updatedevice`, data)
|
||||
},
|
||||
|
||||
//根据ID修改施肥机名字
|
||||
updateFsname(data){
|
||||
return sendPutRequest(`/update/fsname`, data)
|
||||
return sendPutRequest(`/jiaxing/update/fsname`, data)
|
||||
},
|
||||
//根据用户ID添加小程序气象站
|
||||
addphoneeqData(data) {
|
||||
return sendPostRequest(`/getcontrol/addphoneeqData`, data)
|
||||
return sendPostRequest(`/jiaxing/getcontrol/addphoneeqData`, data)
|
||||
},
|
||||
//根据用户ID删除小程序气象站
|
||||
delphoneeqData(data) {
|
||||
return sendDelRequest(`/getcontrol/delphoneeqData`, data)
|
||||
return sendDelRequest(`/jiaxing/getcontrol/delphoneeqData`, data)
|
||||
},
|
||||
|
||||
//根据用户ID修改小程序气象站
|
||||
updatephoneeqData(data) {
|
||||
return sendPutRequest(`/getcontrol/updatephoneeqData`, data)
|
||||
return sendPutRequest(`/jiaxing/getcontrol/updatephoneeqData`, data)
|
||||
},
|
||||
//修改大数据信息
|
||||
updateDataDevice(data) {
|
||||
return sendPutRequest(`/getcontrol/updateBigData`, data)
|
||||
return sendPutRequest(`/jiaxing/getcontrol/updateBigData`, data)
|
||||
},
|
||||
|
||||
//小程序手机控制权限模块查询
|
||||
wxgetpermission(data) {
|
||||
return sendGetRequest(`/getcontrol/wxgetpermission`, data)
|
||||
return sendGetRequest(`/jiaxing/getcontrol/wxgetpermission`, data)
|
||||
},
|
||||
//查询所有用户
|
||||
adminAll(data){
|
||||
return sendGetRequest(`/admin/all`, data)
|
||||
return sendGetRequest(`/jiaxing/admin/all`, data)
|
||||
},
|
||||
//更新用户信息
|
||||
updateUser(data){
|
||||
return sendPutRequest(`/admin/add/userEquipment`, data)
|
||||
return sendPutRequest(`/jiaxing/admin/add/userEquipment`, data)
|
||||
},
|
||||
//添加用户信息
|
||||
addUser(data){
|
||||
return sendPostRequest(`/admin/user`, data)
|
||||
return sendPostRequest(`/jiaxing/admin/user`, data)
|
||||
},
|
||||
|
||||
//修改密码
|
||||
updatePwd(data){
|
||||
return sendPutRequest(`/user/update/pwd`, data)
|
||||
return sendPutRequest(`/jiaxing/user/update/pwd`, data)
|
||||
},
|
||||
//设备查询
|
||||
seldevice(data){
|
||||
return sendGetRequest(`/admin/seldevice`, data)
|
||||
return sendGetRequest(`/jiaxing/admin/seldevice`, data)
|
||||
},
|
||||
//删除设备信息
|
||||
deldevice(data){
|
||||
return sendDelRequest(`/admin/deldevice`, data)
|
||||
return sendDelRequest(`/jiaxing/admin/deldevice`, data)
|
||||
},
|
||||
//修改手机控制名称
|
||||
updatewxgetpermission(data){
|
||||
return sendPutRequest(`/getcontrol/updatewxgetpermission`, data)
|
||||
return sendPutRequest(`/jiaxing/getcontrol/updatewxgetpermission`, data)
|
||||
},
|
||||
//管理员/用户页面删除关联设备信息
|
||||
delUserByid(data){
|
||||
return sendDelRequest(`/admin/delUserByid`, data)
|
||||
return sendDelRequest(`/jiaxing/admin/delUserByid`, data)
|
||||
},
|
||||
//管理员/用户页面添加关联设备信息
|
||||
addUserByid(data){
|
||||
return sendPostRequest(`/admin/addUserByid`, data)
|
||||
return sendPostRequest(`/jiaxing/admin/addUserByid`, data)
|
||||
},
|
||||
//查询控制器权限
|
||||
selectallPermissions(data){
|
||||
return sendGetRequest(`/getcontrol/selectallPermissions`, data)
|
||||
return sendGetRequest(`/jiaxing/getcontrol/selectallPermissions`, data)
|
||||
},
|
||||
//新增标准控制器权限
|
||||
addpermissionall(equipmentId, data) {
|
||||
return sendPostRequest(`/getcontrol/addpermissionall?deviceId=${equipmentId}`, data)
|
||||
return sendPostRequest(`/jiaxing/getcontrol/addpermissionall?deviceId=${equipmentId}`, data)
|
||||
},
|
||||
//管理控制器权限删除
|
||||
delpermission(id1, id2) {
|
||||
return sendDelRequest(`/getcontrol/delpermission?deviceId=${id1}&permissionid=${id2}`, '')
|
||||
return sendDelRequest(`/jiaxing/getcontrol/delpermission?deviceId=${id1}&permissionid=${id2}`, ``)
|
||||
},
|
||||
//管理控制器权限添加
|
||||
addpermission(id1, id2) {
|
||||
return sendPostRequest(`/getcontrol/addpermission?deviceId=${id1}&permissionid=${id2}`, '')
|
||||
return sendPostRequest(`/jiaxing/getcontrol/addpermission?deviceId=${id1}&permissionid=${id2}`, ``)
|
||||
},
|
||||
//管理 设备管理添加设备
|
||||
addDevice(data){
|
||||
return sendPostRequest(`/admin/addDevice`, data)
|
||||
return sendPostRequest(`/jiaxing/admin/addDevice`, data)
|
||||
},
|
||||
//查询施肥级ICCID
|
||||
getFsIccid(data){
|
||||
return sendGetRequest(`/readControl/getFsIccid`, data)
|
||||
return sendGetRequest(`/jiaxing/readControl/getFsIccid`, data)
|
||||
},
|
||||
//查询控制器权限
|
||||
getIccid(data){
|
||||
return sendGetRequest(`/readControl/getIccid`, data)
|
||||
return sendGetRequest(`/jiaxing/readControl/getIccid`, data)
|
||||
},
|
||||
//二维码溯源
|
||||
//查看农事作物信息
|
||||
getAgriculturalInformation(data) {
|
||||
return sendGetRequest(`/code/getAgriculturalInformation`, data)
|
||||
return sendGetRequest(`/jiaxing/code/getAgriculturalInformation`, data)
|
||||
},
|
||||
//查看种植计划
|
||||
getplant(data) {
|
||||
return sendGetRequest(`/code/getplant`, data)
|
||||
return sendGetRequest(`/jiaxing/code/getplant`, data)
|
||||
},
|
||||
//查看农场信息管理
|
||||
getcodeFarmInformationManagement(data) {
|
||||
return sendGetRequest(`/code/getcodeFarmInformationManagement`, data)
|
||||
return sendGetRequest(`/jiaxing/code/getcodeFarmInformationManagement`, data)
|
||||
},
|
||||
|
||||
//上传图片
|
||||
uploadImage(data) {
|
||||
return sendPostRequest(`/code/uploadImage`, data)
|
||||
return sendPostRequest(`/jiaxing/code/uploadImage`, data)
|
||||
},
|
||||
//管理页面上传图片
|
||||
manageUploadImage(data) {
|
||||
return sendUploadRequest(`/user/upload`, data)
|
||||
return sendUploadRequest(`/jiaxing/user/upload`, data)
|
||||
},
|
||||
//施肥机系统导入txt的
|
||||
upLoadFsdataWriteValue(data) {
|
||||
return sendUploadRequest(`/Fsdata/write/value`, data)
|
||||
return sendUploadRequest(`/jiaxing/Fsdata/write/value`, data)
|
||||
},
|
||||
//施肥机系统下载txt
|
||||
FsdataReadValuedownload(data) {
|
||||
return sendPostRequest(`/Fsdata/read/value?devicecode=${data}`,'')
|
||||
return sendPostRequest(`/jiaxing/Fsdata/read/value?devicecode=${data}`,``)
|
||||
},
|
||||
//控制器系统导入
|
||||
upLoadControlWriteValue(data) {
|
||||
return sendUploadRequest(`/control/write/value`, data)
|
||||
return sendUploadRequest(`/jiaxing/control/write/value`, data)
|
||||
},
|
||||
//控制器系统下载txt
|
||||
controlReadValuedownload(data) {
|
||||
return sendPostRequest(`/control/read/value?devicecode=${data}`,'')
|
||||
return sendPostRequest(`/jiaxing/control/read/value?devicecode=${data}`,``)
|
||||
},
|
||||
|
||||
// 智能灌注
|
||||
//主页查看智能灌溉控制器
|
||||
getFi_rtdata(data) {
|
||||
return sendGetRequest(`/getFi/rtdata`, data)
|
||||
return sendGetRequest(`/jiaxing/getFi/rtdata`, data)
|
||||
},
|
||||
//当天折线图
|
||||
chart_fidata(data) {
|
||||
return sendPostRequest(`/chart/fidata?equipmentId=${data}`,'')
|
||||
return sendPostRequest(`/jiaxing/chart/fidata?equipmentId=${data}`,``)
|
||||
},
|
||||
//智能灌溉1
|
||||
readFi_irrigate(url,data) {
|
||||
@ -683,57 +684,57 @@ getIccid(data){
|
||||
},
|
||||
//智能灌溉写入
|
||||
postwriteFi_write(data) {
|
||||
return sendPostRequest("/writeFi/write", data);
|
||||
return sendPostRequest(`/jiaxing/writeFi/write`, data);
|
||||
},
|
||||
//智能灌溉状态值
|
||||
getFI_getState(data) {
|
||||
return sendGetRequest("/getFI/getState", data);
|
||||
return sendGetRequest(`/jiaxing/getFI/getState`, data);
|
||||
},
|
||||
|
||||
//智能灌溉系统参数
|
||||
readControl_getFIIccid(data) {
|
||||
return sendGetRequest("/readControl/getFIIccid", data);
|
||||
return sendGetRequest(`/jiaxing/readControl/getFIIccid`, data);
|
||||
},
|
||||
|
||||
//智能灌溉系统导入txt的
|
||||
upLoadFIwritevalue(data) {
|
||||
return sendUploadRequest(`/FI/write/value`, data)
|
||||
return sendUploadRequest(`/jiaxing/FI/write/value`, data)
|
||||
},
|
||||
//智能灌溉系统导出下载txt
|
||||
FIreadvaluedownload(data) {
|
||||
return sendPostRequest(`/FI/read/value?devicecode=${data}`,'')
|
||||
return sendPostRequest(`/jiaxing/FI/read/value?devicecode=${data}`,``)
|
||||
},
|
||||
//智能灌溉系统数据上传
|
||||
readFi_datauploadfi(data) {
|
||||
return sendGetRequest("/readFi/datauploadfi", data);
|
||||
return sendGetRequest(`/jiaxing/readFi/datauploadfi`, data);
|
||||
},
|
||||
//智能灌溉固有参数
|
||||
readFi_intrinsicparameterfi(data) {
|
||||
return sendGetRequest("/readFi/intrinsicparameterfi", data);
|
||||
return sendGetRequest(`/jiaxing/readFi/intrinsicparameterfi`, data);
|
||||
},
|
||||
//智能灌溉传感器通道
|
||||
readFi_sensorchannelfi(data) {
|
||||
return sendGetRequest("/readFi/sensorchannelfi", data);
|
||||
return sendGetRequest(`/jiaxing/readFi/sensorchannelfi`, data);
|
||||
},
|
||||
//智能灌溉的名称
|
||||
getFi_getName(data) {
|
||||
return sendGetRequest("/getFi/getName", data);
|
||||
return sendGetRequest(`/jiaxing/getFi/getName`, data);
|
||||
},
|
||||
//修改智能灌溉名称
|
||||
getFi_updateName(data){
|
||||
return sendPutRequest(`/getFi/updateName`, data)
|
||||
return sendPutRequest(`/jiaxing/getFi/updateName`, data)
|
||||
},
|
||||
//系统页面备忘录获取
|
||||
readControl_getMemo(data){
|
||||
return sendGetRequest(`/readControl/getMemo`, data)
|
||||
return sendGetRequest(`/jiaxing/readControl/getMemo`, data)
|
||||
},
|
||||
//系统页面备忘录修改
|
||||
readControl_setMemo(data){
|
||||
return sendPostRequest(`/readControl/setMemo`, data)
|
||||
return sendPostRequest(`/jiaxing/readControl/setMemo`, data)
|
||||
},
|
||||
//根据设备id查询控制器权限
|
||||
getcontrol_cpermission(data){
|
||||
return sendPostRequest(`/getcontrol/cpermission?deviceId=${data}`, '')
|
||||
return sendPostRequest(`/jiaxing/getcontrol/cpermission?deviceId=${data}`, ``)
|
||||
},
|
||||
|
||||
|
||||
@ -741,6 +742,66 @@ getIccid(data){
|
||||
//二维码溯源部分
|
||||
//种植计划
|
||||
code_getplant(data){
|
||||
return sendGetRequest(`/code/getplant`, data)
|
||||
return sendGetRequest(`/jiaxing/code/getplant`, data)
|
||||
},
|
||||
|
||||
//官网接口
|
||||
// 轮播图
|
||||
website_getows(data){
|
||||
return sendGetRequest(`/jiaxing/website/getowsManagement`, data)
|
||||
},
|
||||
website_addows(data){
|
||||
return sendPostRequest(`/jiaxing/website/addows`, data)
|
||||
},
|
||||
website_updateows(data){
|
||||
return sendPutRequest(`/jiaxing/website/updateows`, data)
|
||||
},
|
||||
website_delows(data){
|
||||
return sendDelRequest(`/jiaxing/website/delows`, data)
|
||||
},
|
||||
|
||||
//产品展示
|
||||
website_getowp(data){
|
||||
return sendGetRequest(`/jiaxing/website/getowp`, data)
|
||||
},
|
||||
website_getowpManagement(data){
|
||||
return sendGetRequest(`/jiaxing/website/getowpManagement`, data)
|
||||
},
|
||||
website_addowp(data){
|
||||
return sendPostRequest(`/jiaxing/website/addowp`, data)
|
||||
},
|
||||
website_updateowp(data){
|
||||
return sendPutRequest(`/jiaxing/website/updateowp`, data)
|
||||
},
|
||||
website_delowp(data){
|
||||
return sendDelRequest(`/jiaxing/website/delowp`, data)
|
||||
},
|
||||
// 综合 产品/案例/新闻列表
|
||||
website_getowpabyowpidMan(data){
|
||||
return sendGetRequest(`/jiaxing/website/getowpabyowpidMan`, data)
|
||||
},
|
||||
website_addops(data){
|
||||
return sendPostRequest(`/jiaxing/website/addops`, data)
|
||||
},
|
||||
website_updateops(data){
|
||||
return sendPutRequest(`/jiaxing/website/updateops`, data)
|
||||
},
|
||||
website_delops(data){
|
||||
return sendDelRequest(`/jiaxing/website/delops`, data)
|
||||
},
|
||||
|
||||
//案例介绍
|
||||
website_getcaseintroduction(data){
|
||||
return sendGetRequest(`/jiaxing/website/getcaseintroduction`, data)
|
||||
},
|
||||
//管理官网页面上传图片
|
||||
websiteUploadImage(data) {
|
||||
return sendUploadRequest(`/jiaxing/website/uploadows`, data)
|
||||
},
|
||||
|
||||
|
||||
//虫情
|
||||
bugzhaodi_login(data){
|
||||
return sendGetRequest(`/jiaxing/bugzhaodi/login`, data)
|
||||
},
|
||||
};
|
||||
|
@ -1,37 +1,41 @@
|
||||
@charset "UTF-8";
|
||||
.scroll, .el-dropdown-menu, .index .index-content > .left, .index .index-content > .right.right-page .page-content, .formula .page-content, .realTime, .realTime .page-content .realTime-bottom.weather .left-view-new, .history .page-content .el-table--scrollable-x .el-table__body-wrapper, .vrcode-model .el-dialog, .el-table .el-table__body-wrapper {
|
||||
.scroll, .el-dropdown-menu, .index .index-content > .left, .index .index-content > .right.right-page .page-content, .formula .page-content, .realTime, .realTime .page-content .realTime-bottom.weather .left-view-new, .history .page-content .el-table--scrollable-x .el-table__body-wrapper, .vrcode-model .el-dialog, .el-table .el-table__body-wrapper, .insectPestDetail .detail-data .image-list {
|
||||
overflow-y: auto;
|
||||
}
|
||||
|
||||
.scroll::-webkit-scrollbar, .el-dropdown-menu::-webkit-scrollbar, .index .index-content > .left::-webkit-scrollbar, .index .index-content > .right.right-page .page-content::-webkit-scrollbar, .formula .page-content::-webkit-scrollbar, .realTime::-webkit-scrollbar, .realTime .page-content .realTime-bottom.weather .left-view-new::-webkit-scrollbar, .history .page-content .el-table--scrollable-x .el-table__body-wrapper::-webkit-scrollbar, .vrcode-model .el-dialog::-webkit-scrollbar, .el-table .el-table__body-wrapper::-webkit-scrollbar {
|
||||
.scroll::-webkit-scrollbar, .el-dropdown-menu::-webkit-scrollbar, .index .index-content > .left::-webkit-scrollbar, .index .index-content > .right.right-page .page-content::-webkit-scrollbar, .formula .page-content::-webkit-scrollbar, .realTime::-webkit-scrollbar, .realTime .page-content .realTime-bottom.weather .left-view-new::-webkit-scrollbar, .history .page-content .el-table--scrollable-x .el-table__body-wrapper::-webkit-scrollbar, .vrcode-model .el-dialog::-webkit-scrollbar, .el-table .el-table__body-wrapper::-webkit-scrollbar, .insectPestDetail .detail-data .image-list::-webkit-scrollbar {
|
||||
/*滚动条整体*/
|
||||
width: 10px;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.scroll::-webkit-scrollbar-track, .el-dropdown-menu::-webkit-scrollbar-track, .index .index-content > .left::-webkit-scrollbar-track, .index .index-content > .right.right-page .page-content::-webkit-scrollbar-track, .formula .page-content::-webkit-scrollbar-track, .realTime::-webkit-scrollbar-track, .realTime .page-content .realTime-bottom.weather .left-view-new::-webkit-scrollbar-track, .history .page-content .el-table--scrollable-x .el-table__body-wrapper::-webkit-scrollbar-track, .vrcode-model .el-dialog::-webkit-scrollbar-track, .el-table .el-table__body-wrapper::-webkit-scrollbar-track {
|
||||
.scroll::-webkit-scrollbar-track, .el-dropdown-menu::-webkit-scrollbar-track, .index .index-content > .left::-webkit-scrollbar-track, .index .index-content > .right.right-page .page-content::-webkit-scrollbar-track, .formula .page-content::-webkit-scrollbar-track, .realTime::-webkit-scrollbar-track, .realTime .page-content .realTime-bottom.weather .left-view-new::-webkit-scrollbar-track, .history .page-content .el-table--scrollable-x .el-table__body-wrapper::-webkit-scrollbar-track, .vrcode-model .el-dialog::-webkit-scrollbar-track, .el-table .el-table__body-wrapper::-webkit-scrollbar-track, .insectPestDetail .detail-data .image-list::-webkit-scrollbar-track {
|
||||
/*滚动条轨道*/
|
||||
background: #013769;
|
||||
}
|
||||
|
||||
.scroll::-webkit-scrollbar-thumb, .el-dropdown-menu::-webkit-scrollbar-thumb, .index .index-content > .left::-webkit-scrollbar-thumb, .index .index-content > .right.right-page .page-content::-webkit-scrollbar-thumb, .formula .page-content::-webkit-scrollbar-thumb, .realTime::-webkit-scrollbar-thumb, .realTime .page-content .realTime-bottom.weather .left-view-new::-webkit-scrollbar-thumb, .history .page-content .el-table--scrollable-x .el-table__body-wrapper::-webkit-scrollbar-thumb, .vrcode-model .el-dialog::-webkit-scrollbar-thumb, .el-table .el-table__body-wrapper::-webkit-scrollbar-thumb {
|
||||
.scroll::-webkit-scrollbar-thumb, .el-dropdown-menu::-webkit-scrollbar-thumb, .index .index-content > .left::-webkit-scrollbar-thumb, .index .index-content > .right.right-page .page-content::-webkit-scrollbar-thumb, .formula .page-content::-webkit-scrollbar-thumb, .realTime::-webkit-scrollbar-thumb, .realTime .page-content .realTime-bottom.weather .left-view-new::-webkit-scrollbar-thumb, .history .page-content .el-table--scrollable-x .el-table__body-wrapper::-webkit-scrollbar-thumb, .vrcode-model .el-dialog::-webkit-scrollbar-thumb, .el-table .el-table__body-wrapper::-webkit-scrollbar-thumb, .insectPestDetail .detail-data .image-list::-webkit-scrollbar-thumb {
|
||||
/*滚动条里面的滑块*/
|
||||
width: 4px;
|
||||
cursor: pointer;
|
||||
background: #0294E2;
|
||||
border: 3px solid #013769;
|
||||
color: #0077b1;
|
||||
}
|
||||
|
||||
.scroll::-webkit-scrollbar-thumb:hover, .el-dropdown-menu::-webkit-scrollbar-thumb:hover, .index .index-content > .left::-webkit-scrollbar-thumb:hover, .index .index-content > .right.right-page .page-content::-webkit-scrollbar-thumb:hover, .formula .page-content::-webkit-scrollbar-thumb:hover, .realTime::-webkit-scrollbar-thumb:hover, .realTime .page-content .realTime-bottom.weather .left-view-new::-webkit-scrollbar-thumb:hover, .history .page-content .el-table--scrollable-x .el-table__body-wrapper::-webkit-scrollbar-thumb:hover, .vrcode-model .el-dialog::-webkit-scrollbar-thumb:hover, .el-table .el-table__body-wrapper::-webkit-scrollbar-thumb:hover {
|
||||
.scroll::-webkit-scrollbar-thumb:hover, .el-dropdown-menu::-webkit-scrollbar-thumb:hover, .index .index-content > .left::-webkit-scrollbar-thumb:hover, .index .index-content > .right.right-page .page-content::-webkit-scrollbar-thumb:hover, .formula .page-content::-webkit-scrollbar-thumb:hover, .realTime::-webkit-scrollbar-thumb:hover, .realTime .page-content .realTime-bottom.weather .left-view-new::-webkit-scrollbar-thumb:hover, .history .page-content .el-table--scrollable-x .el-table__body-wrapper::-webkit-scrollbar-thumb:hover, .vrcode-model .el-dialog::-webkit-scrollbar-thumb:hover, .el-table .el-table__body-wrapper::-webkit-scrollbar-thumb:hover, .insectPestDetail .detail-data .image-list::-webkit-scrollbar-thumb:hover {
|
||||
/*滚动条鼠标事件,鼠标放上去出现的事件*/
|
||||
}
|
||||
|
||||
.scroll::-webkit-scrollbar-corner, .el-dropdown-menu::-webkit-scrollbar-corner, .index .index-content > .left::-webkit-scrollbar-corner, .index .index-content > .right.right-page .page-content::-webkit-scrollbar-corner, .formula .page-content::-webkit-scrollbar-corner, .realTime::-webkit-scrollbar-corner, .realTime .page-content .realTime-bottom.weather .left-view-new::-webkit-scrollbar-corner, .history .page-content .el-table--scrollable-x .el-table__body-wrapper::-webkit-scrollbar-corner, .vrcode-model .el-dialog::-webkit-scrollbar-corner, .el-table .el-table__body-wrapper::-webkit-scrollbar-corner {
|
||||
.scroll::-webkit-scrollbar-corner, .el-dropdown-menu::-webkit-scrollbar-corner, .index .index-content > .left::-webkit-scrollbar-corner, .index .index-content > .right.right-page .page-content::-webkit-scrollbar-corner, .formula .page-content::-webkit-scrollbar-corner, .realTime::-webkit-scrollbar-corner, .realTime .page-content .realTime-bottom.weather .left-view-new::-webkit-scrollbar-corner, .history .page-content .el-table--scrollable-x .el-table__body-wrapper::-webkit-scrollbar-corner, .vrcode-model .el-dialog::-webkit-scrollbar-corner, .el-table .el-table__body-wrapper::-webkit-scrollbar-corner, .insectPestDetail .detail-data .image-list::-webkit-scrollbar-corner {
|
||||
/*滚动条边角*/
|
||||
}
|
||||
|
||||
.tips-model {
|
||||
padding: 10px;
|
||||
color: #ff7f00;
|
||||
color: #ff7f00;
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
.tips-model .tips-model-title {
|
||||
@ -49,7 +53,8 @@
|
||||
border: 1px solid #eee;
|
||||
}
|
||||
|
||||
.tips-model .tips-model-th, .tips-model .tips-model-tr {
|
||||
.tips-model .tips-model-th,
|
||||
.tips-model .tips-model-tr {
|
||||
width: 500px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
@ -57,7 +62,8 @@
|
||||
height: 20px;
|
||||
}
|
||||
|
||||
.tips-model .tips-model-th > div, .tips-model .tips-model-tr > div {
|
||||
.tips-model .tips-model-th > div,
|
||||
.tips-model .tips-model-tr > div {
|
||||
width: 20%;
|
||||
height: 100%;
|
||||
display: flex;
|
||||
@ -294,6 +300,7 @@ textarea {
|
||||
.warning-btn {
|
||||
justify-content: flex-end;
|
||||
margin-top: -70px;
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
.warning-btn .btn.green {
|
||||
@ -302,6 +309,7 @@ textarea {
|
||||
|
||||
.warning-model {
|
||||
padding: 0 30px 25px;
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
.warning-model .input-main {
|
||||
@ -330,6 +338,7 @@ textarea {
|
||||
|
||||
.warning-sel {
|
||||
width: 200px !important;
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
.table-title {
|
||||
@ -384,6 +393,7 @@ textarea {
|
||||
background: url(../image/index-background.png) no-repeat;
|
||||
background-size: cover;
|
||||
background-position: center top;
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
.index .no-list {
|
||||
@ -437,6 +447,7 @@ textarea {
|
||||
position: relative;
|
||||
z-index: 2;
|
||||
font-size: 35px;
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
.index .header .header-center {
|
||||
@ -607,6 +618,7 @@ textarea {
|
||||
align-items: center;
|
||||
flex-wrap: wrap;
|
||||
margin-top: 15px;
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
.input-view > div {
|
||||
@ -621,6 +633,10 @@ textarea {
|
||||
padding: 0 8px;
|
||||
}
|
||||
|
||||
.input-sel {
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
.input-sel > span {
|
||||
padding: 0 10px;
|
||||
}
|
||||
@ -696,6 +712,10 @@ textarea {
|
||||
width: 200px !important;
|
||||
}
|
||||
|
||||
.input-main {
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
.input-main span {
|
||||
padding: 0 10px;
|
||||
}
|
||||
@ -747,6 +767,7 @@ textarea {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
margin: 0 15px 0 0 !important;
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
.number-view > div {
|
||||
@ -772,6 +793,7 @@ textarea {
|
||||
flex-wrap: wrap;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
.input-main-60.table-input {
|
||||
@ -825,6 +847,7 @@ textarea {
|
||||
flex-wrap: wrap;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
.input-main-one.table-input {
|
||||
@ -870,6 +893,7 @@ textarea {
|
||||
width: 300px;
|
||||
border: none;
|
||||
background-color: #014781;
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
.el-dropdown-menu.input-menu-180 {
|
||||
@ -950,6 +974,7 @@ textarea {
|
||||
}
|
||||
|
||||
.formula {
|
||||
color: #fff;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
padding: 20px;
|
||||
@ -969,6 +994,7 @@ textarea {
|
||||
.table-view {
|
||||
background: transparent;
|
||||
margin-top: 30px;
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
.table-view .cell {
|
||||
@ -1180,6 +1206,7 @@ textarea {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
flex-wrap: wrap;
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
.flex-view > div {
|
||||
@ -1338,6 +1365,10 @@ textarea {
|
||||
border-color: #0294E2;
|
||||
}
|
||||
|
||||
.PIDSet {
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
.PIDSet .flex-view {
|
||||
border-bottom: none;
|
||||
}
|
||||
@ -1441,6 +1472,10 @@ textarea {
|
||||
min-height: 101px;
|
||||
}
|
||||
|
||||
.upload {
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
.upload .upload-view {
|
||||
width: 520px;
|
||||
height: 520px;
|
||||
@ -1492,6 +1527,7 @@ textarea {
|
||||
|
||||
.sensorSet {
|
||||
height: 100%;
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
.sensorSet .sensor-view {
|
||||
@ -1663,6 +1699,10 @@ textarea {
|
||||
padding: 0 20px;
|
||||
}
|
||||
|
||||
.el-dialog__wrapper {
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
.el-dialog__wrapper .el-dialog {
|
||||
background: rgba(0, 59, 114, 0.8);
|
||||
border: 2px solid rgba(0, 186, 255, 0.35);
|
||||
@ -1750,6 +1790,7 @@ textarea {
|
||||
|
||||
.el-dialog__wrapper .el-dialog .el-dialog__body .model1-top .model-right > div .input-main-60 {
|
||||
width: auto;
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
.el-dialog__wrapper .el-dialog .el-dialog__body .model1-bottom {
|
||||
@ -1800,6 +1841,10 @@ textarea {
|
||||
flex-shrink: 0;
|
||||
}
|
||||
|
||||
.login {
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
.login .login-header {
|
||||
position: relative;
|
||||
width: 100%;
|
||||
@ -1945,6 +1990,7 @@ textarea {
|
||||
|
||||
.dataModel {
|
||||
height: 650px;
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
.dataModel .view-new {
|
||||
@ -2003,6 +2049,7 @@ textarea {
|
||||
padding: 20px;
|
||||
flex-direction: column;
|
||||
justify-content: unset;
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
.realTime .new-data {
|
||||
@ -2883,6 +2930,10 @@ textarea {
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
|
||||
.synthesis-con {
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
.synthesis-con .synthesis-content {
|
||||
width: 100%;
|
||||
display: flex;
|
||||
@ -2987,6 +3038,12 @@ textarea {
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.flex-between {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.vrcode .el-menu,
|
||||
.el-submenu__title:hover,
|
||||
.el-menu-item:hover,
|
||||
@ -3041,6 +3098,7 @@ textarea {
|
||||
.vrcode .el-menu-item {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
.vrcode .el-submenu__title .img,
|
||||
@ -3277,7 +3335,8 @@ textarea {
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
|
||||
.manage-input input {
|
||||
.manage-input input,
|
||||
.manage-input .input {
|
||||
width: 240px;
|
||||
height: 44px;
|
||||
background: rgba(0, 186, 255, 0.15);
|
||||
@ -3286,12 +3345,42 @@ textarea {
|
||||
font-family: Microsoft YaHei;
|
||||
font-weight: 400;
|
||||
color: #FFFFFF;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.manage-input input::placeholder {
|
||||
.manage-input input::placeholder,
|
||||
.manage-input .input::placeholder {
|
||||
color: #92B1D0;
|
||||
}
|
||||
|
||||
.m-t-34 {
|
||||
margin-top: 34px;
|
||||
}
|
||||
|
||||
.manage-textarea {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.manage-textarea .input-title {
|
||||
font-family: Microsoft YaHei;
|
||||
font-weight: 400;
|
||||
font-size: 16px;
|
||||
color: #FFFFFF;
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
|
||||
.manage-textarea textarea {
|
||||
width: 100%;
|
||||
padding: 10px;
|
||||
height: 110px;
|
||||
background: rgba(0, 186, 255, 0.15);
|
||||
border: 2px solid rgba(0, 186, 255, 0.4);
|
||||
padding-left: 15px;
|
||||
font-family: Microsoft YaHei;
|
||||
font-weight: 400;
|
||||
color: #FFFFFF;
|
||||
}
|
||||
|
||||
.vrcode-input-sel {
|
||||
margin-right: 30px;
|
||||
margin-bottom: 15px;
|
||||
@ -3455,6 +3544,10 @@ textarea {
|
||||
transform: translateY(-50%);
|
||||
}
|
||||
|
||||
.vrcode-model {
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
.vrcode-model.manage-model .el-dialog {
|
||||
background: rgba(0, 59, 114, 0.8);
|
||||
border: 2px solid rgba(0, 186, 255, 0.35);
|
||||
@ -3468,6 +3561,14 @@ textarea {
|
||||
grid-column-gap: 20px;
|
||||
}
|
||||
|
||||
.vrcode-model.manage-model .el-dialog__body .vrcode-content.grid-3 {
|
||||
grid-template-columns: repeat(3, 1fr);
|
||||
}
|
||||
|
||||
.vrcode-model.manage-model .el-dialog__body .vrcode-content.flex-no {
|
||||
display: block;
|
||||
}
|
||||
|
||||
.vrcode-model.manage-model .el-dialog__footer {
|
||||
padding: 15px 22px;
|
||||
border-top: 1px solid rgba(0, 180, 255, 0.35);
|
||||
@ -3477,21 +3578,34 @@ textarea {
|
||||
justify-content: flex-start;
|
||||
}
|
||||
|
||||
.vrcode-model.manage-model .manage-right .manage-img {
|
||||
.vrcode-model.manage-model .manage-img {
|
||||
width: 380px;
|
||||
position: relative;
|
||||
background: rgba(0, 132, 255, 0.15);
|
||||
border: 2px solid rgba(0, 132, 255, 0.35);
|
||||
min-height: 200px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
padding: 10px;
|
||||
}
|
||||
|
||||
.vrcode-model.manage-model .manage-right .manage-img img {
|
||||
.vrcode-model.manage-model .manage-img img {
|
||||
width: 360px;
|
||||
height: auto;
|
||||
min-height: 200px;
|
||||
max-height: 360px;
|
||||
}
|
||||
|
||||
.vrcode-model.manage-model .manage-right .manage-img #sel-img {
|
||||
.vrcode-model.manage-model .manage-img .upload-img {
|
||||
width: 100px;
|
||||
height: 100px;
|
||||
min-height: unset;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.vrcode-model.manage-model .manage-img #sel-img,
|
||||
.vrcode-model.manage-model .manage-img #sel-img1 {
|
||||
width: 0;
|
||||
height: 0;
|
||||
position: absolute;
|
||||
@ -3557,6 +3671,7 @@ textarea {
|
||||
position: relative;
|
||||
font-weight: bold;
|
||||
text-align: left;
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
.vrcode-model .vrcode-model-title.vrcode-model-title-282 {
|
||||
@ -3894,6 +4009,7 @@ textarea {
|
||||
max-height: 700px;
|
||||
overflow: auto;
|
||||
padding: 0 30px;
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
.model-sel > div {
|
||||
@ -3911,6 +4027,7 @@ textarea {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
.setsuyuan .setsuyuan-page {
|
||||
@ -4140,6 +4257,30 @@ textarea {
|
||||
color: #606266;
|
||||
}
|
||||
|
||||
.historyData.insectPestImage {
|
||||
padding: 20px;
|
||||
background: rgba(0, 132, 255, 0.15);
|
||||
border: 2px solid rgba(0, 186, 255, 0.35);
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
.historyData.insectPestImage .table-view .image-list > div {
|
||||
width: 320px;
|
||||
}
|
||||
|
||||
.historyData.insectPestImage .return-detail {
|
||||
cursor: pointer;
|
||||
background: #0294E2;
|
||||
height: 35px;
|
||||
border-radius: 4px;
|
||||
padding: 0 10px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
margin-left: 30px;
|
||||
}
|
||||
|
||||
.historyData .table-view .el-table th.el-table__cell.is-leaf .cell {
|
||||
font-size: 14px !important;
|
||||
}
|
||||
@ -4213,7 +4354,7 @@ textarea {
|
||||
border: 2px solid rgba(0, 186, 255, 0.2);
|
||||
}
|
||||
|
||||
.manage-page .scroll, .manage-page .el-dropdown-menu, .manage-page .index .index-content > .left, .index .manage-page .index-content > .left, .manage-page .index .index-content > .right.right-page .page-content, .index .index-content > .right.right-page .manage-page .page-content, .manage-page .formula .page-content, .formula .manage-page .page-content, .manage-page .realTime, .manage-page .realTime .page-content .realTime-bottom.weather .left-view-new, .realTime .page-content .realTime-bottom.weather .manage-page .left-view-new, .manage-page .history .page-content .el-table--scrollable-x .el-table__body-wrapper, .history .page-content .el-table--scrollable-x .manage-page .el-table__body-wrapper, .manage-page .vrcode-model .el-dialog, .vrcode-model .manage-page .el-dialog, .manage-page .el-table .el-table__body-wrapper, .el-table .manage-page .el-table__body-wrapper {
|
||||
.manage-page .scroll, .manage-page .el-dropdown-menu, .manage-page .index .index-content > .left, .index .manage-page .index-content > .left, .manage-page .index .index-content > .right.right-page .page-content, .index .index-content > .right.right-page .manage-page .page-content, .manage-page .formula .page-content, .formula .manage-page .page-content, .manage-page .realTime, .manage-page .realTime .page-content .realTime-bottom.weather .left-view-new, .realTime .page-content .realTime-bottom.weather .manage-page .left-view-new, .manage-page .history .page-content .el-table--scrollable-x .el-table__body-wrapper, .history .page-content .el-table--scrollable-x .manage-page .el-table__body-wrapper, .manage-page .vrcode-model .el-dialog, .vrcode-model .manage-page .el-dialog, .manage-page .el-table .el-table__body-wrapper, .el-table .manage-page .el-table__body-wrapper, .manage-page .insectPestDetail .detail-data .image-list, .insectPestDetail .detail-data .manage-page .image-list {
|
||||
flex-wrap: nowrap !important;
|
||||
}
|
||||
|
||||
@ -4346,3 +4487,120 @@ textarea {
|
||||
width: 6px;
|
||||
height: 4px;
|
||||
}
|
||||
|
||||
.insectPestDetail {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
flex-direction: column;
|
||||
}
|
||||
|
||||
.insectPestDetail .look-all {
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.insectPestDetail .detail-info {
|
||||
width: 100%;
|
||||
height: 49%;
|
||||
background: rgba(0, 92, 178, 0.15);
|
||||
border: 2px solid rgba(0, 186, 255, 0.2);
|
||||
padding: 20px 30px 0;
|
||||
}
|
||||
|
||||
.insectPestDetail .detail-info .detail-div {
|
||||
height: calc(100% - 37px);
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.insectPestDetail .detail-info .detail-div .detail-img {
|
||||
width: 200px;
|
||||
height: 90%;
|
||||
}
|
||||
|
||||
.insectPestDetail .detail-info .detail-div .detail-img > img {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
object-fit: cover;
|
||||
}
|
||||
|
||||
.insectPestDetail .detail-info .detail-div .detail-detail {
|
||||
width: calc(100%);
|
||||
min-height: 50%;
|
||||
display: grid;
|
||||
grid-template-columns: repeat(4, minmax(240px, 1fr));
|
||||
grid-row-gap: 10px;
|
||||
grid-column-gap: 10px;
|
||||
}
|
||||
|
||||
.insectPestDetail .detail-info .detail-div .detail-detail .detail-detail-div {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
.insectPestDetail .detail-info .detail-div .detail-detail .detail-detail-div .title {
|
||||
font-weight: bold;
|
||||
margin-bottom: 5px;
|
||||
font-size: 22px;
|
||||
}
|
||||
|
||||
.insectPestDetail .detail-info .detail-div .detail-detail .detail-detail-div.to-more {
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.insectPestDetail .detail-info .detail-div .detail-detail .detail-detail-div .text {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
font-size: 22px;
|
||||
}
|
||||
|
||||
.insectPestDetail .detail-info .detail-div .detail-detail .detail-detail-div .text img {
|
||||
width: 20px;
|
||||
height: 20px;
|
||||
margin-right: 5px;
|
||||
}
|
||||
|
||||
.insectPestDetail .detail-data {
|
||||
width: 100%;
|
||||
height: 49%;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
}
|
||||
|
||||
.insectPestDetail .detail-data > div {
|
||||
width: 49%;
|
||||
background: rgba(0, 92, 178, 0.15);
|
||||
border: 2px solid rgba(0, 186, 255, 0.2);
|
||||
padding: 20px 30px 0;
|
||||
}
|
||||
|
||||
.insectPestDetail .detail-data .charts {
|
||||
width: 100%;
|
||||
height: calc(100% - 37px);
|
||||
}
|
||||
|
||||
.insectPestDetail .detail-data .detail-image {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
flex-direction: column;
|
||||
}
|
||||
|
||||
.insectPestDetail .detail-data .image-list {
|
||||
display: grid;
|
||||
grid-template-columns: repeat(3, 1fr);
|
||||
grid-row-gap: 10px;
|
||||
grid-column-gap: 10px;
|
||||
height: calc(100% - 47px);
|
||||
}
|
||||
|
||||
.insectPestDetail .detail-data .image-list .image-div {
|
||||
max-width: 300px;
|
||||
}
|
||||
|
||||
.insectPestDetail .detail-data .image-list .image-time {
|
||||
text-align: center;
|
||||
width: 100%;
|
||||
}
|
||||
|
@ -21,6 +21,7 @@
|
||||
cursor: pointer;
|
||||
background: #0294E2;
|
||||
border: 3px solid #013769;
|
||||
color: #0077b1;
|
||||
}
|
||||
|
||||
&::-webkit-scrollbar-thumb:hover {
|
||||
@ -32,27 +33,37 @@
|
||||
}
|
||||
|
||||
}
|
||||
.tips-model{
|
||||
|
||||
.tips-model {
|
||||
padding: 10px;
|
||||
.tips-model-title{
|
||||
color: #ff7f00;
|
||||
color: #ff7f00;
|
||||
color: #fff;
|
||||
|
||||
.tips-model-title {
|
||||
font-size: 18px;
|
||||
font-weight: bold;
|
||||
}
|
||||
.tips-model-text{
|
||||
font-size:14px;
|
||||
|
||||
.tips-model-text {
|
||||
font-size: 14px;
|
||||
padding: 5px 20px;
|
||||
}
|
||||
.tips-model-table{
|
||||
|
||||
.tips-model-table {
|
||||
width: 500px;
|
||||
border: 1px solid #eee;
|
||||
}
|
||||
.tips-model-th,.tips-model-tr{
|
||||
|
||||
.tips-model-th,
|
||||
.tips-model-tr {
|
||||
width: 500px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
height: 20px;
|
||||
>div{
|
||||
|
||||
>div {
|
||||
width: 20%;
|
||||
height: 100%;
|
||||
display: flex;
|
||||
@ -62,6 +73,7 @@
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.mobile-scroll {
|
||||
overflow-y: auto;
|
||||
|
||||
@ -118,34 +130,41 @@
|
||||
max-height: 300px;
|
||||
@extend .scroll;
|
||||
}
|
||||
textarea{
|
||||
resize: none;
|
||||
|
||||
textarea {
|
||||
resize: none;
|
||||
}
|
||||
|
||||
.border-none {
|
||||
border: none !important;
|
||||
}
|
||||
.formula .page-content{
|
||||
|
||||
.formula .page-content {
|
||||
position: relative;
|
||||
.export{
|
||||
|
||||
.export {
|
||||
position: absolute;
|
||||
right: 30px;
|
||||
top: 20px;
|
||||
top: 20px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
.export-btn{
|
||||
|
||||
.export-btn {
|
||||
height: 44px;
|
||||
background: rgba(0, 186, 255, 0.15);
|
||||
border: 2px solid rgba(0, 186, 255, 0.4);
|
||||
line-height: 42px;
|
||||
margin-left: 20px;
|
||||
padding: 0 10px;
|
||||
cursor: pointer;
|
||||
}
|
||||
border: 2px solid rgba(0, 186, 255, 0.4);
|
||||
line-height: 42px;
|
||||
margin-left: 20px;
|
||||
padding: 0 10px;
|
||||
cursor: pointer;
|
||||
}
|
||||
}
|
||||
}
|
||||
.el-collapse-item__header{
|
||||
|
||||
.el-collapse-item__header {
|
||||
line-height: unset;
|
||||
}
|
||||
|
||||
.collapse {
|
||||
.el-collapse {
|
||||
border: none;
|
||||
@ -310,6 +329,8 @@ textarea{
|
||||
justify-content: flex-end;
|
||||
margin-top: -70px;
|
||||
|
||||
color: #fff;
|
||||
|
||||
.btn.green {
|
||||
opacity: 1;
|
||||
}
|
||||
@ -318,6 +339,8 @@ textarea{
|
||||
.warning-model {
|
||||
padding: 0 30px 25px;
|
||||
|
||||
color: #fff;
|
||||
|
||||
.input-main {
|
||||
margin: 0;
|
||||
|
||||
@ -345,6 +368,7 @@ textarea{
|
||||
|
||||
.warning-sel {
|
||||
width: 200px !important;
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
.table-title {
|
||||
@ -401,6 +425,8 @@ textarea{
|
||||
background-size: cover;
|
||||
background-position: center top;
|
||||
|
||||
color: #fff;
|
||||
|
||||
.no-list {
|
||||
color: #fff;
|
||||
display: flex;
|
||||
@ -429,11 +455,13 @@ textarea{
|
||||
display: flex;
|
||||
align-items: center;
|
||||
padding: 10px;
|
||||
.logo-img{
|
||||
|
||||
.logo-img {
|
||||
position: relative;
|
||||
z-index: 2;
|
||||
margin-right: 10px;
|
||||
}
|
||||
|
||||
.logo-bg {
|
||||
width: 373px;
|
||||
height: 99px;
|
||||
@ -443,9 +471,12 @@ textarea{
|
||||
top: 0;
|
||||
z-index: 1;
|
||||
}
|
||||
.logo-title{
|
||||
position: relative;z-index: 2;
|
||||
|
||||
.logo-title {
|
||||
position: relative;
|
||||
z-index: 2;
|
||||
font-size: 35px;
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
}
|
||||
@ -625,6 +656,8 @@ textarea{
|
||||
flex-wrap: wrap;
|
||||
margin-top: 15px;
|
||||
|
||||
color: #fff;
|
||||
|
||||
>div {
|
||||
flex-shrink: 0;
|
||||
margin-right: 20px;
|
||||
@ -640,6 +673,8 @@ textarea{
|
||||
}
|
||||
|
||||
.input-sel {
|
||||
color: #fff;
|
||||
|
||||
>span {
|
||||
padding: 0 10px;
|
||||
}
|
||||
@ -716,12 +751,17 @@ textarea{
|
||||
.border-right {
|
||||
border-right: 1px solid rgba(2, 148, 226, 0.5);
|
||||
}
|
||||
.input-main-200{
|
||||
input{
|
||||
width: 200px!important;
|
||||
|
||||
.input-main-200 {
|
||||
input {
|
||||
width: 200px !important;
|
||||
}
|
||||
}
|
||||
|
||||
.input-main {
|
||||
|
||||
color: #fff;
|
||||
|
||||
span {
|
||||
padding: 0 10px;
|
||||
}
|
||||
@ -729,7 +769,7 @@ textarea{
|
||||
div {
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
|
||||
|
||||
input {
|
||||
width: 134px;
|
||||
height: 44px;
|
||||
@ -785,6 +825,8 @@ textarea{
|
||||
align-items: center;
|
||||
margin: 0 15px 0 0 !important;
|
||||
|
||||
color: #fff;
|
||||
|
||||
>div {
|
||||
width: 30px;
|
||||
height: 30px;
|
||||
@ -810,6 +852,7 @@ textarea{
|
||||
flex-wrap: wrap;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
color: #fff;
|
||||
|
||||
&.table-input {
|
||||
justify-content: center;
|
||||
@ -821,21 +864,25 @@ textarea{
|
||||
|
||||
span {
|
||||
padding: 0 10px;
|
||||
&.tips{
|
||||
|
||||
&.tips {
|
||||
color: rgba(255, 255, 255, 0.7);
|
||||
font-size: 14px;
|
||||
}
|
||||
}
|
||||
&.h-44{
|
||||
input{
|
||||
height: 44px;
|
||||
|
||||
&.h-44 {
|
||||
input {
|
||||
height: 44px;
|
||||
}
|
||||
}
|
||||
}
|
||||
&.input-main-100{
|
||||
input{
|
||||
width: 100px;
|
||||
|
||||
&.input-main-100 {
|
||||
input {
|
||||
width: 100px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
input {
|
||||
width: 60px;
|
||||
height: 34px;
|
||||
@ -852,7 +899,8 @@ textarea{
|
||||
&::placeholder {
|
||||
color: #859BB6;
|
||||
}
|
||||
&.w-100{
|
||||
|
||||
&.w-100 {
|
||||
width: 100px;
|
||||
}
|
||||
}
|
||||
@ -864,6 +912,8 @@ textarea{
|
||||
display: flex;
|
||||
align-items: center;
|
||||
|
||||
color: #fff;
|
||||
|
||||
&.table-input {
|
||||
justify-content: center;
|
||||
|
||||
@ -900,8 +950,9 @@ textarea{
|
||||
font-weight: bold;
|
||||
font-size: 24px;
|
||||
}
|
||||
|
||||
.popper__arrow {
|
||||
display: none!important;
|
||||
display: none !important;
|
||||
}
|
||||
|
||||
.el-dropdown-menu {
|
||||
@ -909,6 +960,8 @@ textarea{
|
||||
border: none;
|
||||
background-color: #014781;
|
||||
|
||||
color: #fff;
|
||||
|
||||
&.input-menu-180 {
|
||||
width: 180px;
|
||||
}
|
||||
@ -979,15 +1032,17 @@ textarea{
|
||||
background-position: left center;
|
||||
min-width: 302px;
|
||||
}
|
||||
|
||||
&.title-402 {
|
||||
background: url(../image/title-302.png) no-repeat center;
|
||||
background-size: 402px 43px;
|
||||
background-position: left center;
|
||||
min-width:402px;
|
||||
min-width: 402px;
|
||||
}
|
||||
}
|
||||
|
||||
.formula {
|
||||
color: #fff;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
padding: 20px;
|
||||
@ -1011,6 +1066,8 @@ textarea{
|
||||
background: transparent;
|
||||
margin-top: 30px;
|
||||
|
||||
color: #fff;
|
||||
|
||||
.cell {
|
||||
text-align: center;
|
||||
}
|
||||
@ -1207,7 +1264,8 @@ textarea{
|
||||
margin-top: 20px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
>img{
|
||||
|
||||
>img {
|
||||
width: 40px;
|
||||
height: 40px;
|
||||
}
|
||||
@ -1224,6 +1282,7 @@ textarea{
|
||||
display: flex;
|
||||
align-items: center;
|
||||
flex-wrap: wrap;
|
||||
color: #fff;
|
||||
|
||||
>div {
|
||||
flex-shrink: 0;
|
||||
@ -1370,9 +1429,11 @@ textarea{
|
||||
color: #00C8FF;
|
||||
margin: 7.5px 10px;
|
||||
cursor: pointer;
|
||||
&.w-250{
|
||||
|
||||
&.w-250 {
|
||||
width: 250px;
|
||||
}
|
||||
|
||||
>img {
|
||||
margin-right: 10px;
|
||||
}
|
||||
@ -1387,6 +1448,8 @@ textarea{
|
||||
}
|
||||
|
||||
.PIDSet {
|
||||
color: #fff;
|
||||
|
||||
.flex-view {
|
||||
border-bottom: none;
|
||||
}
|
||||
@ -1486,7 +1549,8 @@ textarea{
|
||||
font-family: Microsoft YaHei;
|
||||
font-weight: 400;
|
||||
color: #A8B6C8;
|
||||
&.system-textarea{
|
||||
|
||||
&.system-textarea {
|
||||
padding: 10px;
|
||||
height: auto;
|
||||
min-height: 101px;
|
||||
@ -1494,6 +1558,8 @@ textarea{
|
||||
}
|
||||
|
||||
.upload {
|
||||
color: #fff;
|
||||
|
||||
.upload-view {
|
||||
width: 520px;
|
||||
height: 520px;
|
||||
@ -1552,6 +1618,8 @@ textarea{
|
||||
.sensorSet {
|
||||
height: 100%;
|
||||
|
||||
color: #fff;
|
||||
|
||||
.sensor-view {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
@ -1739,6 +1807,8 @@ textarea{
|
||||
}
|
||||
|
||||
.el-dialog__wrapper {
|
||||
color: #fff;
|
||||
|
||||
.el-dialog {
|
||||
background: rgba(0, 59, 114, 0.8);
|
||||
border: 2px solid rgba(0, 186, 255, 0.35);
|
||||
@ -1828,6 +1898,7 @@ textarea{
|
||||
|
||||
.input-main-60 {
|
||||
width: auto;
|
||||
color: #fff;
|
||||
}
|
||||
}
|
||||
}
|
||||
@ -1896,6 +1967,8 @@ textarea{
|
||||
|
||||
|
||||
.login {
|
||||
color: #fff;
|
||||
|
||||
.login-header {
|
||||
position: relative;
|
||||
width: 100%;
|
||||
@ -2045,6 +2118,8 @@ textarea{
|
||||
|
||||
.dataModel {
|
||||
height: 650px;
|
||||
color: #fff;
|
||||
|
||||
.view-new {
|
||||
width: 100%;
|
||||
display: flex;
|
||||
@ -2052,9 +2127,10 @@ textarea{
|
||||
flex-wrap: wrap;
|
||||
padding: 20px 30px 0;
|
||||
|
||||
&.border{
|
||||
&.border {
|
||||
border-bottom: 1px solid rgba(0, 186, 255, 0.2);
|
||||
}
|
||||
|
||||
.list-view {
|
||||
flex-shrink: 0;
|
||||
display: flex;
|
||||
@ -2063,6 +2139,7 @@ textarea{
|
||||
margin-right: 20px;
|
||||
margin-bottom: 20px;
|
||||
min-width: 160px;
|
||||
|
||||
img {
|
||||
width: 60px;
|
||||
height: 60px;
|
||||
@ -2102,6 +2179,7 @@ textarea{
|
||||
padding: 20px;
|
||||
flex-direction: column;
|
||||
justify-content: unset;
|
||||
color: #fff;
|
||||
@extend .scroll;
|
||||
|
||||
.new-data {
|
||||
@ -2582,12 +2660,14 @@ textarea{
|
||||
justify-content: space-between;
|
||||
width: 100%;
|
||||
padding: 0 50px;
|
||||
&.text-blue{
|
||||
>div{
|
||||
|
||||
&.text-blue {
|
||||
>div {
|
||||
font-size: 18px;
|
||||
color: #00C0F7;
|
||||
color: #00C0F7;
|
||||
}
|
||||
}
|
||||
|
||||
>div {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
@ -3054,6 +3134,8 @@ textarea{
|
||||
}
|
||||
|
||||
.synthesis-con {
|
||||
color: #fff;
|
||||
|
||||
.synthesis-content {
|
||||
width: 100%;
|
||||
display: flex;
|
||||
@ -3159,11 +3241,18 @@ textarea{
|
||||
align-items: center;
|
||||
|
||||
}
|
||||
|
||||
.flex-start {
|
||||
display: flex;
|
||||
justify-content: flex-start;
|
||||
align-items: center;
|
||||
|
||||
}
|
||||
.flex-between {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
|
||||
}
|
||||
.vrcode .el-menu,
|
||||
.el-submenu__title:hover,
|
||||
@ -3222,6 +3311,7 @@ textarea{
|
||||
.el-menu-item {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
color: #fff;
|
||||
|
||||
.img {
|
||||
width: 16px;
|
||||
@ -3478,7 +3568,8 @@ textarea{
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
|
||||
input {
|
||||
input,
|
||||
.input {
|
||||
width: 240px;
|
||||
height: 44px;
|
||||
background: rgba(0, 186, 255, 0.15);
|
||||
@ -3487,6 +3578,7 @@ textarea{
|
||||
font-family: Microsoft YaHei;
|
||||
font-weight: 400;
|
||||
color: #FFFFFF;
|
||||
cursor: pointer;
|
||||
|
||||
&::placeholder {
|
||||
color: #92B1D0;
|
||||
@ -3494,18 +3586,50 @@ textarea{
|
||||
}
|
||||
}
|
||||
|
||||
.m-t-34 {
|
||||
margin-top: 34px;
|
||||
}
|
||||
|
||||
.manage-textarea {
|
||||
width: 100%;
|
||||
|
||||
.input-title {
|
||||
font-family: Microsoft YaHei;
|
||||
font-weight: 400;
|
||||
font-size: 16px;
|
||||
color: #FFFFFF;
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
|
||||
textarea {
|
||||
width: 100%;
|
||||
padding: 10px;
|
||||
height: 110px;
|
||||
background: rgba(0, 186, 255, 0.15);
|
||||
border: 2px solid rgba(0, 186, 255, 0.4);
|
||||
padding-left: 15px;
|
||||
font-family: Microsoft YaHei;
|
||||
font-weight: 400;
|
||||
color: #FFFFFF;
|
||||
}
|
||||
}
|
||||
|
||||
.vrcode-input-sel {
|
||||
margin-right: 30px;
|
||||
margin-bottom: 15px;
|
||||
&.w-100{
|
||||
|
||||
&.w-100 {
|
||||
width: calc(100% - 30px);
|
||||
.el-dropdown{
|
||||
|
||||
.el-dropdown {
|
||||
width: 100%;
|
||||
}
|
||||
.el-dropdown-link{
|
||||
|
||||
.el-dropdown-link {
|
||||
width: 100%;
|
||||
}
|
||||
}
|
||||
|
||||
>.title {
|
||||
margin-bottom: 7px;
|
||||
}
|
||||
@ -3515,7 +3639,7 @@ textarea{
|
||||
height: 44px;
|
||||
cursor: pointer;
|
||||
position: relative;
|
||||
|
||||
|
||||
input {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
@ -3548,7 +3672,8 @@ textarea{
|
||||
>img {
|
||||
width: 6px;
|
||||
height: 4px;
|
||||
&.search{
|
||||
|
||||
&.search {
|
||||
width: 16px;
|
||||
height: 16px;
|
||||
}
|
||||
@ -3613,20 +3738,25 @@ textarea{
|
||||
}
|
||||
}
|
||||
}
|
||||
.flex-view{
|
||||
.vrcode-input-sel .el-dropdown-link{
|
||||
|
||||
.flex-view {
|
||||
.vrcode-input-sel .el-dropdown-link {
|
||||
height: 40px;
|
||||
}
|
||||
.vrcode-input-sel{
|
||||
|
||||
.vrcode-input-sel {
|
||||
margin-right: 10px;
|
||||
}
|
||||
.vrcode-input{
|
||||
|
||||
.vrcode-input {
|
||||
margin-right: 10px;
|
||||
}
|
||||
.vrcode-selimage{
|
||||
|
||||
.vrcode-selimage {
|
||||
width: auto;
|
||||
}
|
||||
}
|
||||
|
||||
.vrcode-title {
|
||||
width: 100%;
|
||||
margin-bottom: 15px;
|
||||
@ -3649,10 +3779,14 @@ textarea{
|
||||
transform: translateY(-50%);
|
||||
}
|
||||
}
|
||||
|
||||
.vrcode-model {
|
||||
color: #fff;
|
||||
|
||||
&.manage-model {
|
||||
.el-dialog {
|
||||
background: rgba(0, 59, 114, 0.8);
|
||||
|
||||
border: 2px solid rgba(0, 186, 255, 0.35);
|
||||
}
|
||||
|
||||
@ -3663,6 +3797,14 @@ textarea{
|
||||
grid-template-columns: repeat(2, 1fr);
|
||||
grid-row-gap: 0px; //纵向间隔
|
||||
grid-column-gap: 20px; //横向间隔
|
||||
|
||||
&.grid-3 {
|
||||
grid-template-columns: repeat(3, 1fr);
|
||||
}
|
||||
|
||||
&.flex-no {
|
||||
display: block;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@ -3675,32 +3817,45 @@ textarea{
|
||||
justify-content: flex-start;
|
||||
}
|
||||
|
||||
.manage-right {
|
||||
.manage-img {
|
||||
width: 380px;
|
||||
position: relative;
|
||||
// height: 290px;
|
||||
background: rgba(0, 132, 255, 0.15);
|
||||
border: 2px solid rgba(0, 132, 255, 0.35);
|
||||
.manage-img {
|
||||
width: 380px;
|
||||
position: relative;
|
||||
// height: 290px;
|
||||
background: rgba(0, 132, 255, 0.15);
|
||||
border: 2px solid rgba(0, 132, 255, 0.35);
|
||||
min-height: 200px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
|
||||
img {
|
||||
width: 360px;
|
||||
height: auto;
|
||||
min-height: 200px;
|
||||
}
|
||||
img {
|
||||
width: 360px;
|
||||
height: auto;
|
||||
min-height: 200px;
|
||||
max-height: 360px;
|
||||
}
|
||||
|
||||
padding: 10px;
|
||||
.upload-img {
|
||||
width: 100px;
|
||||
height: 100px;
|
||||
min-height: unset;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
#sel-img {
|
||||
width: 0;
|
||||
height: 0;
|
||||
position: absolute;
|
||||
left: 0;
|
||||
top: 0;
|
||||
}
|
||||
padding: 10px;
|
||||
|
||||
#sel-img,
|
||||
#sel-img1 {
|
||||
width: 0;
|
||||
height: 0;
|
||||
position: absolute;
|
||||
left: 0;
|
||||
top: 0;
|
||||
}
|
||||
}
|
||||
|
||||
.manage-right {}
|
||||
|
||||
.manage-text {
|
||||
width: 240px;
|
||||
height: 160px;
|
||||
@ -3761,6 +3916,7 @@ textarea{
|
||||
position: relative;
|
||||
font-weight: bold;
|
||||
text-align: left;
|
||||
color: #fff;
|
||||
|
||||
&.vrcode-model-title-282 {
|
||||
background: url(../img/vrcode-title-282.png) no-repeat;
|
||||
@ -3802,7 +3958,7 @@ textarea{
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
&.confirm-psw {
|
||||
.el-dialog__body {
|
||||
@ -3823,7 +3979,7 @@ textarea{
|
||||
height: calc(100% - 43px);
|
||||
padding: 0 30px;
|
||||
|
||||
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
@ -3836,6 +3992,7 @@ textarea{
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
.vrcode-view {
|
||||
width: 100%;
|
||||
padding: 20px 0 15px 0;
|
||||
@ -3848,16 +4005,20 @@ textarea{
|
||||
flex-shrink: 0;
|
||||
}
|
||||
}
|
||||
|
||||
.vrcode-input {
|
||||
width: 300px;
|
||||
margin-right: 30px;
|
||||
margin-bottom: 15px;
|
||||
&.w-100{
|
||||
|
||||
&.w-100 {
|
||||
width: calc(100% - 30px);
|
||||
}
|
||||
&.w-50{
|
||||
|
||||
&.w-50 {
|
||||
width: calc(50% - 30px);
|
||||
}
|
||||
|
||||
.input-title {
|
||||
font-size: 16px;
|
||||
font-family: Microsoft YaHei;
|
||||
@ -3867,7 +4028,7 @@ textarea{
|
||||
}
|
||||
|
||||
input {
|
||||
width:100%;
|
||||
width: 100%;
|
||||
height: 44px;
|
||||
background: rgba(90, 210, 255, 0.25);
|
||||
border: 2px solid rgba(86, 209, 255, 0.5);
|
||||
@ -3889,10 +4050,12 @@ textarea{
|
||||
>.title {
|
||||
margin-bottom: 7px;
|
||||
}
|
||||
.tips{
|
||||
|
||||
.tips {
|
||||
font-size: 16px;
|
||||
color: #FF9999;
|
||||
color: #FF9999;
|
||||
}
|
||||
|
||||
.sel-image-view {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
@ -4111,6 +4274,7 @@ color: #FF9999;
|
||||
max-height: 700px;
|
||||
overflow: auto;
|
||||
padding: 0 30px;
|
||||
color: #fff;
|
||||
|
||||
>div {
|
||||
width: 33%;
|
||||
@ -4130,6 +4294,7 @@ color: #FF9999;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
color: #fff;
|
||||
|
||||
.setsuyuan-page {
|
||||
width: 375px;
|
||||
@ -4373,6 +4538,36 @@ color: #FF9999;
|
||||
}
|
||||
|
||||
.historyData {
|
||||
&.insectPestImage{
|
||||
padding: 20px;
|
||||
background: rgba(0, 132, 255, 0.15);
|
||||
border: 2px solid rgba(0, 186, 255, 0.35);
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
.table-view{
|
||||
.image-list{
|
||||
>div{
|
||||
width: 320px;
|
||||
}
|
||||
.image-time{
|
||||
|
||||
}
|
||||
}
|
||||
}
|
||||
.return-detail{
|
||||
cursor: pointer;
|
||||
background: #0294E2;
|
||||
|
||||
height: 35px;
|
||||
border-radius: 4px;
|
||||
padding: 0 10px ;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
margin-left: 30px;
|
||||
}
|
||||
|
||||
}
|
||||
.table-view {
|
||||
.el-table th.el-table__cell.is-leaf .cell {
|
||||
font-size: 14px !important;
|
||||
@ -4599,7 +4794,114 @@ color: #FF9999;
|
||||
>img {
|
||||
width: 6px;
|
||||
height: 4px;
|
||||
|
||||
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
.insectPestDetail {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
flex-direction: column;
|
||||
.look-all{
|
||||
cursor: pointer;
|
||||
}
|
||||
.detail-info {
|
||||
width: 100%;
|
||||
height: 49%;
|
||||
background: rgba(0, 92, 178, 0.15);
|
||||
border: 2px solid rgba(0, 186, 255, 0.2);
|
||||
padding: 20px 30px 0;
|
||||
.detail-div{
|
||||
height: calc(100% - 37px);
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
.detail-img{
|
||||
width: 200px;
|
||||
height: 90%;
|
||||
>img{
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
object-fit: cover;
|
||||
}
|
||||
}
|
||||
.detail-detail{
|
||||
width: calc(100% );
|
||||
min-height: 50%;
|
||||
display: grid;
|
||||
grid-template-columns: repeat(4, minmax(240px, 1fr));
|
||||
grid-row-gap: 10px; //纵向间隔
|
||||
grid-column-gap: 10px; //横向间隔
|
||||
.detail-detail-div{display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
|
||||
.title{
|
||||
font-weight: bold;
|
||||
margin-bottom: 5px;
|
||||
font-size: 22px;
|
||||
}
|
||||
&.to-more{
|
||||
cursor: pointer;
|
||||
}
|
||||
.text{
|
||||
display: flex;
|
||||
align-items: center;
|
||||
|
||||
font-size: 22px;
|
||||
img{
|
||||
width: 20px;
|
||||
height: 20px;
|
||||
margin-right: 5px;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.detail-data {
|
||||
width: 100%;
|
||||
height: 49%;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
|
||||
>div {
|
||||
width: 49%;
|
||||
background: rgba(0, 92, 178, 0.15);
|
||||
border: 2px solid rgba(0, 186, 255, 0.2);
|
||||
padding: 20px 30px 0;
|
||||
}
|
||||
|
||||
.charts {
|
||||
width: 100%;
|
||||
height: calc(100% - 37px);
|
||||
}
|
||||
.detail-image{
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
flex-direction: column;
|
||||
}
|
||||
.image-list {
|
||||
display: grid;
|
||||
grid-template-columns: repeat(3, 1fr);
|
||||
grid-row-gap: 10px; //纵向间隔
|
||||
grid-column-gap: 10px; //横向间隔
|
||||
height: calc(100% - 47px);
|
||||
@extend .scroll;
|
||||
|
||||
.image-div {
|
||||
max-width: 300px;
|
||||
}
|
||||
|
||||
.image-time {
|
||||
text-align: center;
|
||||
width: 100%;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
Before Width: | Height: | Size: 616 KiB After Width: | Height: | Size: 56 KiB |
Before Width: | Height: | Size: 1.4 MiB After Width: | Height: | Size: 624 KiB |
Before Width: | Height: | Size: 1.9 MiB After Width: | Height: | Size: 848 KiB |
BIN
src/assets/image/index-icon1.png
Normal file
After Width: | Height: | Size: 335 B |
Before Width: | Height: | Size: 1.4 MiB After Width: | Height: | Size: 604 KiB |
BIN
src/assets/image/more.png
Normal file
After Width: | Height: | Size: 879 B |
BIN
src/assets/image/pest.png
Normal file
After Width: | Height: | Size: 343 KiB |
BIN
src/assets/img/map9.jpg
Normal file
After Width: | Height: | Size: 2.0 MiB |
BIN
src/assets/img/upload-img.png
Normal file
After Width: | Height: | Size: 1.8 KiB |
@ -1,177 +1,177 @@
|
||||
import * as echarts from "echarts";
|
||||
import store from '../../store/index'
|
||||
const colorList = [new echarts.graphic.LinearGradient(
|
||||
0,
|
||||
0,
|
||||
0,
|
||||
1,
|
||||
[
|
||||
{
|
||||
offset: 0,
|
||||
color: "rgba(0, 187, 136, 0.50)",
|
||||
},
|
||||
{
|
||||
offset: 0.8,
|
||||
color: "rgba(0, 187, 136, 0)",
|
||||
},
|
||||
],
|
||||
false
|
||||
),
|
||||
new echarts.graphic.LinearGradient(
|
||||
0,
|
||||
0,
|
||||
0,
|
||||
1,
|
||||
[
|
||||
{
|
||||
offset: 0,
|
||||
color: "rgba(252, 125, 106, 0.50)",
|
||||
},
|
||||
{
|
||||
offset: 0.8,
|
||||
color: "rgba(252, 125, 106, 0)",
|
||||
},
|
||||
],
|
||||
false
|
||||
), new echarts.graphic.LinearGradient(
|
||||
0,
|
||||
0,
|
||||
0,
|
||||
1,
|
||||
[
|
||||
{
|
||||
offset: 0,
|
||||
color: "rgba(252, 223, 39, 0.50)",
|
||||
},
|
||||
{
|
||||
offset: 0.8,
|
||||
color: "rgba(252, 223, 39, 0)",
|
||||
},
|
||||
],
|
||||
false
|
||||
), new echarts.graphic.LinearGradient(
|
||||
0,
|
||||
0,
|
||||
0,
|
||||
1,
|
||||
[
|
||||
{
|
||||
offset: 0,
|
||||
color: "rgba(68, 214, 232, 0.50)",
|
||||
},
|
||||
{
|
||||
offset: 0.8,
|
||||
color: "rgba(68, 214, 232, 0)",
|
||||
},
|
||||
],
|
||||
false
|
||||
), new echarts.graphic.LinearGradient(
|
||||
0,
|
||||
0,
|
||||
0,
|
||||
1,
|
||||
[
|
||||
{
|
||||
offset: 0,
|
||||
color: "rgba(69, 224, 155, 0.50)",
|
||||
},
|
||||
{
|
||||
offset: 0.8,
|
||||
color: "rgba(69, 224, 155, 0)",
|
||||
},
|
||||
],
|
||||
false
|
||||
), new echarts.graphic.LinearGradient(
|
||||
0,
|
||||
0,
|
||||
0,
|
||||
1,
|
||||
[
|
||||
{
|
||||
offset: 0,
|
||||
color: "rgba(82, 188, 255, 0.50)",
|
||||
},
|
||||
{
|
||||
offset: 0.8,
|
||||
color: "rgba(82, 188, 255, 0)",
|
||||
},
|
||||
],
|
||||
false
|
||||
), new echarts.graphic.LinearGradient(
|
||||
0,
|
||||
0,
|
||||
0,
|
||||
1,
|
||||
[
|
||||
{
|
||||
offset: 0,
|
||||
color: "rgba(214, 162, 255, 0.50)",
|
||||
},
|
||||
{
|
||||
offset: 0.8,
|
||||
color: "rgba(214, 162, 255, 0)",
|
||||
},
|
||||
],
|
||||
false
|
||||
), new echarts.graphic.LinearGradient(
|
||||
0,
|
||||
0,
|
||||
0,
|
||||
1,
|
||||
[
|
||||
{
|
||||
offset: 0,
|
||||
color: "rgba(255, 192, 111, 0.50)",
|
||||
},
|
||||
{
|
||||
offset: 0.8,
|
||||
color: "rgba(255, 192, 111, 0)",
|
||||
},
|
||||
],
|
||||
false
|
||||
), new echarts.graphic.LinearGradient(
|
||||
0,
|
||||
0,
|
||||
0,
|
||||
1,
|
||||
[
|
||||
{
|
||||
offset: 0,
|
||||
color: "rgba(255, 156, 154, 0.50)",
|
||||
},
|
||||
{
|
||||
offset: 0.8,
|
||||
color: "rgba(255, 156, 154, 0)",
|
||||
},
|
||||
],
|
||||
false
|
||||
), new echarts.graphic.LinearGradient(
|
||||
0,
|
||||
0,
|
||||
0,
|
||||
1,
|
||||
[
|
||||
{
|
||||
offset: 0,
|
||||
color: "rgba(255, 156, 154, 0.50)",
|
||||
},
|
||||
{
|
||||
offset: 0.8,
|
||||
color: "rgba(255, 156, 154, 0)",
|
||||
},
|
||||
],
|
||||
false
|
||||
),
|
||||
]
|
||||
const colorList1 = ['rgba(0, 187, 136, 1)', 'rgba(252, 125, 106, 1)', 'rgba(252, 223, 39, 1)', 'rgba(68, 214, 232, 1)',
|
||||
'rgba(69, 224, 155, 1)', 'rgba(82, 188, 255, 1)', 'rgba(214, 162, 255, 1)', 'rgba(255, 192, 111, 1)', 'rgba(255, 156, 154, 1)', 'rgba(255, 156, 154, 1)']
|
||||
|
||||
export function realTimeLine(id, data,pageId) {
|
||||
var chartDom = document.getElementById(id);
|
||||
var myChart = echarts.init(chartDom);
|
||||
chartDom.removeAttribute('_echarts_instance_')//解决切换页面echarts不显示的问题
|
||||
var Xdata = []
|
||||
var colorList1 = ['rgba(0, 187, 136, 1)', 'rgba(252, 125, 106, 1)', 'rgba(252, 223, 39, 1)', 'rgba(68, 214, 232, 1)',
|
||||
'rgba(69, 224, 155, 1)', 'rgba(82, 188, 255, 1)', 'rgba(214, 162, 255, 1)', 'rgba(255, 192, 111, 1)', 'rgba(255, 156, 154, 1)', 'rgba(255, 156, 154, 1)']
|
||||
var colorList = [new echarts.graphic.LinearGradient(
|
||||
0,
|
||||
0,
|
||||
0,
|
||||
1,
|
||||
[
|
||||
{
|
||||
offset: 0,
|
||||
color: "rgba(0, 187, 136, 0.50)",
|
||||
},
|
||||
{
|
||||
offset: 0.8,
|
||||
color: "rgba(0, 187, 136, 0)",
|
||||
},
|
||||
],
|
||||
false
|
||||
),
|
||||
new echarts.graphic.LinearGradient(
|
||||
0,
|
||||
0,
|
||||
0,
|
||||
1,
|
||||
[
|
||||
{
|
||||
offset: 0,
|
||||
color: "rgba(252, 125, 106, 0.50)",
|
||||
},
|
||||
{
|
||||
offset: 0.8,
|
||||
color: "rgba(252, 125, 106, 0)",
|
||||
},
|
||||
],
|
||||
false
|
||||
), new echarts.graphic.LinearGradient(
|
||||
0,
|
||||
0,
|
||||
0,
|
||||
1,
|
||||
[
|
||||
{
|
||||
offset: 0,
|
||||
color: "rgba(252, 223, 39, 0.50)",
|
||||
},
|
||||
{
|
||||
offset: 0.8,
|
||||
color: "rgba(252, 223, 39, 0)",
|
||||
},
|
||||
],
|
||||
false
|
||||
), new echarts.graphic.LinearGradient(
|
||||
0,
|
||||
0,
|
||||
0,
|
||||
1,
|
||||
[
|
||||
{
|
||||
offset: 0,
|
||||
color: "rgba(68, 214, 232, 0.50)",
|
||||
},
|
||||
{
|
||||
offset: 0.8,
|
||||
color: "rgba(68, 214, 232, 0)",
|
||||
},
|
||||
],
|
||||
false
|
||||
), new echarts.graphic.LinearGradient(
|
||||
0,
|
||||
0,
|
||||
0,
|
||||
1,
|
||||
[
|
||||
{
|
||||
offset: 0,
|
||||
color: "rgba(69, 224, 155, 0.50)",
|
||||
},
|
||||
{
|
||||
offset: 0.8,
|
||||
color: "rgba(69, 224, 155, 0)",
|
||||
},
|
||||
],
|
||||
false
|
||||
), new echarts.graphic.LinearGradient(
|
||||
0,
|
||||
0,
|
||||
0,
|
||||
1,
|
||||
[
|
||||
{
|
||||
offset: 0,
|
||||
color: "rgba(82, 188, 255, 0.50)",
|
||||
},
|
||||
{
|
||||
offset: 0.8,
|
||||
color: "rgba(82, 188, 255, 0)",
|
||||
},
|
||||
],
|
||||
false
|
||||
), new echarts.graphic.LinearGradient(
|
||||
0,
|
||||
0,
|
||||
0,
|
||||
1,
|
||||
[
|
||||
{
|
||||
offset: 0,
|
||||
color: "rgba(214, 162, 255, 0.50)",
|
||||
},
|
||||
{
|
||||
offset: 0.8,
|
||||
color: "rgba(214, 162, 255, 0)",
|
||||
},
|
||||
],
|
||||
false
|
||||
), new echarts.graphic.LinearGradient(
|
||||
0,
|
||||
0,
|
||||
0,
|
||||
1,
|
||||
[
|
||||
{
|
||||
offset: 0,
|
||||
color: "rgba(255, 192, 111, 0.50)",
|
||||
},
|
||||
{
|
||||
offset: 0.8,
|
||||
color: "rgba(255, 192, 111, 0)",
|
||||
},
|
||||
],
|
||||
false
|
||||
), new echarts.graphic.LinearGradient(
|
||||
0,
|
||||
0,
|
||||
0,
|
||||
1,
|
||||
[
|
||||
{
|
||||
offset: 0,
|
||||
color: "rgba(255, 156, 154, 0.50)",
|
||||
},
|
||||
{
|
||||
offset: 0.8,
|
||||
color: "rgba(255, 156, 154, 0)",
|
||||
},
|
||||
],
|
||||
false
|
||||
), new echarts.graphic.LinearGradient(
|
||||
0,
|
||||
0,
|
||||
0,
|
||||
1,
|
||||
[
|
||||
{
|
||||
offset: 0,
|
||||
color: "rgba(255, 156, 154, 0.50)",
|
||||
},
|
||||
{
|
||||
offset: 0.8,
|
||||
color: "rgba(255, 156, 154, 0)",
|
||||
},
|
||||
],
|
||||
false
|
||||
),
|
||||
|
||||
]
|
||||
|
||||
// var equipmentList=store.state.equipmentSelList
|
||||
var equipmentList=JSON.parse(localStorage.getItem('equipmentSelList'))
|
||||
|
||||
@ -374,172 +374,7 @@ export function realTimeLine1(id, data,pageId) {
|
||||
var myChart = echarts.init(chartDom);
|
||||
chartDom.removeAttribute('_echarts_instance_')//解决切换页面echarts不显示的问题
|
||||
var Xdata = []
|
||||
var colorList1 = ['rgba(0, 187, 136, 1)', 'rgba(252, 125, 106, 1)', 'rgba(252, 223, 39, 1)', 'rgba(68, 214, 232, 1)',
|
||||
'rgba(69, 224, 155, 1)', 'rgba(82, 188, 255, 1)', 'rgba(214, 162, 255, 1)', 'rgba(255, 192, 111, 1)', 'rgba(255, 156, 154, 1)', 'rgba(255, 156, 154, 1)']
|
||||
var colorList = [new echarts.graphic.LinearGradient(
|
||||
0,
|
||||
0,
|
||||
0,
|
||||
1,
|
||||
[
|
||||
{
|
||||
offset: 0,
|
||||
color: "rgba(0, 187, 136, 0.50)",
|
||||
},
|
||||
{
|
||||
offset: 0.8,
|
||||
color: "rgba(0, 187, 136, 0)",
|
||||
},
|
||||
],
|
||||
false
|
||||
),
|
||||
new echarts.graphic.LinearGradient(
|
||||
0,
|
||||
0,
|
||||
0,
|
||||
1,
|
||||
[
|
||||
{
|
||||
offset: 0,
|
||||
color: "rgba(252, 125, 106, 0.50)",
|
||||
},
|
||||
{
|
||||
offset: 0.8,
|
||||
color: "rgba(252, 125, 106, 0)",
|
||||
},
|
||||
],
|
||||
false
|
||||
), new echarts.graphic.LinearGradient(
|
||||
0,
|
||||
0,
|
||||
0,
|
||||
1,
|
||||
[
|
||||
{
|
||||
offset: 0,
|
||||
color: "rgba(252, 223, 39, 0.50)",
|
||||
},
|
||||
{
|
||||
offset: 0.8,
|
||||
color: "rgba(252, 223, 39, 0)",
|
||||
},
|
||||
],
|
||||
false
|
||||
), new echarts.graphic.LinearGradient(
|
||||
0,
|
||||
0,
|
||||
0,
|
||||
1,
|
||||
[
|
||||
{
|
||||
offset: 0,
|
||||
color: "rgba(68, 214, 232, 0.50)",
|
||||
},
|
||||
{
|
||||
offset: 0.8,
|
||||
color: "rgba(68, 214, 232, 0)",
|
||||
},
|
||||
],
|
||||
false
|
||||
), new echarts.graphic.LinearGradient(
|
||||
0,
|
||||
0,
|
||||
0,
|
||||
1,
|
||||
[
|
||||
{
|
||||
offset: 0,
|
||||
color: "rgba(69, 224, 155, 0.50)",
|
||||
},
|
||||
{
|
||||
offset: 0.8,
|
||||
color: "rgba(69, 224, 155, 0)",
|
||||
},
|
||||
],
|
||||
false
|
||||
), new echarts.graphic.LinearGradient(
|
||||
0,
|
||||
0,
|
||||
0,
|
||||
1,
|
||||
[
|
||||
{
|
||||
offset: 0,
|
||||
color: "rgba(82, 188, 255, 0.50)",
|
||||
},
|
||||
{
|
||||
offset: 0.8,
|
||||
color: "rgba(82, 188, 255, 0)",
|
||||
},
|
||||
],
|
||||
false
|
||||
), new echarts.graphic.LinearGradient(
|
||||
0,
|
||||
0,
|
||||
0,
|
||||
1,
|
||||
[
|
||||
{
|
||||
offset: 0,
|
||||
color: "rgba(214, 162, 255, 0.50)",
|
||||
},
|
||||
{
|
||||
offset: 0.8,
|
||||
color: "rgba(214, 162, 255, 0)",
|
||||
},
|
||||
],
|
||||
false
|
||||
), new echarts.graphic.LinearGradient(
|
||||
0,
|
||||
0,
|
||||
0,
|
||||
1,
|
||||
[
|
||||
{
|
||||
offset: 0,
|
||||
color: "rgba(255, 192, 111, 0.50)",
|
||||
},
|
||||
{
|
||||
offset: 0.8,
|
||||
color: "rgba(255, 192, 111, 0)",
|
||||
},
|
||||
],
|
||||
false
|
||||
), new echarts.graphic.LinearGradient(
|
||||
0,
|
||||
0,
|
||||
0,
|
||||
1,
|
||||
[
|
||||
{
|
||||
offset: 0,
|
||||
color: "rgba(255, 156, 154, 0.50)",
|
||||
},
|
||||
{
|
||||
offset: 0.8,
|
||||
color: "rgba(255, 156, 154, 0)",
|
||||
},
|
||||
],
|
||||
false
|
||||
), new echarts.graphic.LinearGradient(
|
||||
0,
|
||||
0,
|
||||
0,
|
||||
1,
|
||||
[
|
||||
{
|
||||
offset: 0,
|
||||
color: "rgba(255, 156, 154, 0.50)",
|
||||
},
|
||||
{
|
||||
offset: 0.8,
|
||||
color: "rgba(255, 156, 154, 0)",
|
||||
},
|
||||
],
|
||||
false
|
||||
),
|
||||
|
||||
]
|
||||
|
||||
// var equipmentList=store.state.equipmentSelList
|
||||
var equipmentList=JSON.parse(localStorage.getItem('equipmentSelList'))
|
||||
|
||||
@ -742,172 +577,7 @@ export function realTimeLine2(id, data,pageId) {
|
||||
var myChart = echarts.init(chartDom);
|
||||
chartDom.removeAttribute('_echarts_instance_')//解决切换页面echarts不显示的问题
|
||||
var Xdata = []
|
||||
var colorList1 = ['rgba(0, 187, 136, 1)', 'rgba(252, 125, 106, 1)', 'rgba(252, 223, 39, 1)', 'rgba(68, 214, 232, 1)',
|
||||
'rgba(69, 224, 155, 1)', 'rgba(82, 188, 255, 1)', 'rgba(214, 162, 255, 1)', 'rgba(255, 192, 111, 1)', 'rgba(255, 156, 154, 1)', 'rgba(255, 156, 154, 1)']
|
||||
var colorList = [new echarts.graphic.LinearGradient(
|
||||
0,
|
||||
0,
|
||||
0,
|
||||
1,
|
||||
[
|
||||
{
|
||||
offset: 0,
|
||||
color: "rgba(0, 187, 136, 0.50)",
|
||||
},
|
||||
{
|
||||
offset: 0.8,
|
||||
color: "rgba(0, 187, 136, 0)",
|
||||
},
|
||||
],
|
||||
false
|
||||
),
|
||||
new echarts.graphic.LinearGradient(
|
||||
0,
|
||||
0,
|
||||
0,
|
||||
1,
|
||||
[
|
||||
{
|
||||
offset: 0,
|
||||
color: "rgba(252, 125, 106, 0.50)",
|
||||
},
|
||||
{
|
||||
offset: 0.8,
|
||||
color: "rgba(252, 125, 106, 0)",
|
||||
},
|
||||
],
|
||||
false
|
||||
), new echarts.graphic.LinearGradient(
|
||||
0,
|
||||
0,
|
||||
0,
|
||||
1,
|
||||
[
|
||||
{
|
||||
offset: 0,
|
||||
color: "rgba(252, 223, 39, 0.50)",
|
||||
},
|
||||
{
|
||||
offset: 0.8,
|
||||
color: "rgba(252, 223, 39, 0)",
|
||||
},
|
||||
],
|
||||
false
|
||||
), new echarts.graphic.LinearGradient(
|
||||
0,
|
||||
0,
|
||||
0,
|
||||
1,
|
||||
[
|
||||
{
|
||||
offset: 0,
|
||||
color: "rgba(68, 214, 232, 0.50)",
|
||||
},
|
||||
{
|
||||
offset: 0.8,
|
||||
color: "rgba(68, 214, 232, 0)",
|
||||
},
|
||||
],
|
||||
false
|
||||
), new echarts.graphic.LinearGradient(
|
||||
0,
|
||||
0,
|
||||
0,
|
||||
1,
|
||||
[
|
||||
{
|
||||
offset: 0,
|
||||
color: "rgba(69, 224, 155, 0.50)",
|
||||
},
|
||||
{
|
||||
offset: 0.8,
|
||||
color: "rgba(69, 224, 155, 0)",
|
||||
},
|
||||
],
|
||||
false
|
||||
), new echarts.graphic.LinearGradient(
|
||||
0,
|
||||
0,
|
||||
0,
|
||||
1,
|
||||
[
|
||||
{
|
||||
offset: 0,
|
||||
color: "rgba(82, 188, 255, 0.50)",
|
||||
},
|
||||
{
|
||||
offset: 0.8,
|
||||
color: "rgba(82, 188, 255, 0)",
|
||||
},
|
||||
],
|
||||
false
|
||||
), new echarts.graphic.LinearGradient(
|
||||
0,
|
||||
0,
|
||||
0,
|
||||
1,
|
||||
[
|
||||
{
|
||||
offset: 0,
|
||||
color: "rgba(214, 162, 255, 0.50)",
|
||||
},
|
||||
{
|
||||
offset: 0.8,
|
||||
color: "rgba(214, 162, 255, 0)",
|
||||
},
|
||||
],
|
||||
false
|
||||
), new echarts.graphic.LinearGradient(
|
||||
0,
|
||||
0,
|
||||
0,
|
||||
1,
|
||||
[
|
||||
{
|
||||
offset: 0,
|
||||
color: "rgba(255, 192, 111, 0.50)",
|
||||
},
|
||||
{
|
||||
offset: 0.8,
|
||||
color: "rgba(255, 192, 111, 0)",
|
||||
},
|
||||
],
|
||||
false
|
||||
), new echarts.graphic.LinearGradient(
|
||||
0,
|
||||
0,
|
||||
0,
|
||||
1,
|
||||
[
|
||||
{
|
||||
offset: 0,
|
||||
color: "rgba(255, 156, 154, 0.50)",
|
||||
},
|
||||
{
|
||||
offset: 0.8,
|
||||
color: "rgba(255, 156, 154, 0)",
|
||||
},
|
||||
],
|
||||
false
|
||||
), new echarts.graphic.LinearGradient(
|
||||
0,
|
||||
0,
|
||||
0,
|
||||
1,
|
||||
[
|
||||
{
|
||||
offset: 0,
|
||||
color: "rgba(255, 156, 154, 0.50)",
|
||||
},
|
||||
{
|
||||
offset: 0.8,
|
||||
color: "rgba(255, 156, 154, 0)",
|
||||
},
|
||||
],
|
||||
false
|
||||
),
|
||||
|
||||
]
|
||||
|
||||
// var equipmentList=store.state.equipmentSelList
|
||||
var equipmentList=JSON.parse(localStorage.getItem('equipmentSelList'))
|
||||
|
||||
@ -1080,6 +750,147 @@ export function realTimeLine2(id, data,pageId) {
|
||||
myChart.resize();
|
||||
});
|
||||
}
|
||||
// 虫情页面charts
|
||||
export function pestLine(id, data) {
|
||||
var chartDom = document.getElementById(id);
|
||||
var myChart = echarts.init(chartDom);
|
||||
chartDom.removeAttribute('_echarts_instance_')//解决切换页面echarts不显示的问题
|
||||
|
||||
var Xdata = data.data.list.map(item => item.datetime);
|
||||
var selList=Object.keys(data.header)
|
||||
var list = selList.map((type,index) => {
|
||||
return {
|
||||
name: data.header[type],
|
||||
data: data.data.list.map(item => parseInt(item[type] || 0)),
|
||||
type: "line",
|
||||
symbol: "circle",
|
||||
smooth: true,
|
||||
symbolSize: 5,
|
||||
showSymbol: false,
|
||||
lineStyle: {
|
||||
normal: {
|
||||
width: 2,
|
||||
},
|
||||
},
|
||||
areaStyle: {
|
||||
normal: {
|
||||
color: colorList[index],
|
||||
},
|
||||
},
|
||||
itemStyle: {
|
||||
normal: {
|
||||
color: colorList1[index],
|
||||
borderColor: colorList1[index],
|
||||
borderWidth: 1,
|
||||
},
|
||||
},
|
||||
}
|
||||
});
|
||||
|
||||
|
||||
var option = {
|
||||
tooltip: {
|
||||
trigger: "axis",
|
||||
axisPointer: {
|
||||
lineStyle: {
|
||||
color: "#57617B",
|
||||
},
|
||||
},
|
||||
extraCssText: 'z-index: 9999;', // 设置 z-index
|
||||
},
|
||||
legend: {
|
||||
icon: "circle",
|
||||
itemWidth: 10,
|
||||
itemHeight: 10,
|
||||
type: 'scroll', // 启用翻页
|
||||
data: list,
|
||||
selected: selList,
|
||||
right: "center",
|
||||
top:10,
|
||||
itemGap: 10,
|
||||
width:'90%',
|
||||
height:20,
|
||||
textStyle: {
|
||||
fontSize: 12,
|
||||
color: "#fff",
|
||||
lineHeight: 30,
|
||||
},
|
||||
pageTextStyle: {
|
||||
color: '#fff', // 设置翻页文字颜色
|
||||
},
|
||||
pageIconColor: '#fff', // 设置翻页按钮颜色
|
||||
},
|
||||
|
||||
grid: {
|
||||
left: "3%",
|
||||
right: "10%",
|
||||
bottom: "5%",
|
||||
containLabel: true,
|
||||
},
|
||||
xAxis: [
|
||||
{
|
||||
type: "category",
|
||||
boundaryGap: false,
|
||||
axisTick: {
|
||||
show: false,
|
||||
},
|
||||
axisLine: {
|
||||
|
||||
lineStyle: {
|
||||
color: "#fff",
|
||||
type: 'dashed'
|
||||
},
|
||||
},
|
||||
data: Xdata,
|
||||
},
|
||||
|
||||
],
|
||||
yAxis: [
|
||||
{
|
||||
type: "value",
|
||||
name: "",
|
||||
axisTick: {
|
||||
show: false,
|
||||
},
|
||||
axisLine: {
|
||||
lineStyle: {
|
||||
color: "#fff",
|
||||
type: 'dashed'
|
||||
},
|
||||
},
|
||||
axisLabel: {
|
||||
margin: 10,
|
||||
textStyle: {
|
||||
fontSize: 14,
|
||||
},
|
||||
},
|
||||
splitLine: {
|
||||
lineStyle: {
|
||||
color: "rgba(104, 168, 205, 1)",
|
||||
type: 'dashed'
|
||||
},
|
||||
},
|
||||
},
|
||||
],
|
||||
series: list,
|
||||
};
|
||||
option && myChart.setOption(option);
|
||||
myChart.resize();
|
||||
|
||||
// myChart.on('legendselectchanged', function (params) {
|
||||
// equipmentList.forEach((obj,index) => {
|
||||
// if (obj.deviceId== pageId) {
|
||||
// // 在找到的对象中添加参数
|
||||
// obj.selList=params.selected
|
||||
|
||||
// }
|
||||
// });
|
||||
// localStorage.setItem('equipmentSelList', JSON.stringify(equipmentList))
|
||||
// });
|
||||
window.addEventListener("resize", function () {
|
||||
myChart.resize();
|
||||
});
|
||||
}
|
||||
export function statusCharts(id, data) {
|
||||
var chartDom = document.getElementById(id);
|
||||
|
||||
|
@ -39,6 +39,12 @@ const routes = [
|
||||
name: 'largeScreen1',
|
||||
component: () => import('../views/page/largeScreen1.vue')
|
||||
},
|
||||
// 虫情查看的
|
||||
{
|
||||
path: '/imageViewer',
|
||||
name: 'imageViewer',
|
||||
component: () => import('../views/insectPest/imageViewer.vue'),
|
||||
},
|
||||
{
|
||||
path: '/index',
|
||||
name: 'index',
|
||||
@ -96,7 +102,7 @@ const routes = [
|
||||
path: '/systemManage',
|
||||
name: 'systemManage',
|
||||
component: () => import('../views/page/systemManage.vue')
|
||||
},{
|
||||
},{//管理页面
|
||||
path: '/manage',
|
||||
name: 'manage',
|
||||
component: () => import('../views/manage/index.vue'),
|
||||
@ -137,8 +143,49 @@ const routes = [
|
||||
path: '/videoManage',
|
||||
name: 'videoManage',
|
||||
component: () => import('../views/manage/videoManage.vue')
|
||||
},]
|
||||
},
|
||||
// 官网修改
|
||||
{
|
||||
path: '/officialWebsiteBanner',
|
||||
name: 'officialWebsiteBanner',
|
||||
component: () => import('../views/officialWebsite/banner.vue')
|
||||
},
|
||||
{
|
||||
path: '/officialWebsiteCase',
|
||||
name: 'officialWebsiteCase',
|
||||
component: () => import('../views/officialWebsite/case.vue')
|
||||
}, {
|
||||
path: '/officialWebsiteNews',
|
||||
name: 'officialWebsiteNews',
|
||||
component: () => import('../views/officialWebsite/new.vue')
|
||||
}, {
|
||||
path: '/officialWebsiteProduct',
|
||||
name: 'officialWebsiteProduct',
|
||||
component: () => import('../views/officialWebsite/product.vue')
|
||||
}, {
|
||||
path: '/officialWebsiteDetail',
|
||||
name: 'officialWebsiteDetail',
|
||||
component: () => import('../views/officialWebsite/detail.vue')
|
||||
},
|
||||
{
|
||||
path: '/insectPest',
|
||||
name: 'insectPest',
|
||||
component: () => import('../views/insectPest.vue'),
|
||||
redirect: '/insectPestDetail',
|
||||
children: [{
|
||||
path: '/insectPestDetail',
|
||||
name: 'insectPestDetail',
|
||||
component: () => import('../views/insectPest/detail.vue')
|
||||
},{
|
||||
path: '/insectPestImageList',
|
||||
name: 'insectPestImageList',
|
||||
component: () => import('../views/insectPest/imageList.vue')
|
||||
},
|
||||
]
|
||||
},
|
||||
]
|
||||
},
|
||||
|
||||
{
|
||||
path: '/control',
|
||||
name: 'control',
|
||||
@ -309,7 +356,7 @@ const routes = [
|
||||
},]
|
||||
},]
|
||||
},
|
||||
|
||||
|
||||
{
|
||||
path: '/vrcode',
|
||||
name: 'vrcode',
|
||||
|
@ -86,6 +86,7 @@
|
||||
|
||||
<script>
|
||||
import { getnowtime } from '../assets/js/nowTime'
|
||||
import axios from "axios";
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
@ -104,7 +105,7 @@ export default {
|
||||
// { name: '设备菜单', router: '', routerList: [], img: require('../assets/image/header-img5.png') },
|
||||
//systemManage systemManage
|
||||
// manage
|
||||
{ name: '管理', router: 'manage', routerList: ['manage','dataDevice','deviceStatusSet','deviceSet','deviceInfoManage','weatherData','mobileControl','userInfoControl','deviceManage','videoManage'], img: require('../assets/image/header-img6.png') },
|
||||
{ name: '管理', router: 'manage', routerList: ['manage','dataDevice','deviceStatusSet','officialWebsiteBanner','officialWebsiteProduct','officialWebsiteCase','officialWebsiteDetail','officialWebsiteNews','deviceSet','deviceInfoManage','weatherData','mobileControl','userInfoControl','deviceManage','videoManage'], img: require('../assets/image/header-img6.png') },
|
||||
|
||||
{ name: '大数据', router: 'largeScreen', routerList: ['largeScreen'], img: require('../assets/image/header-img8.png') }
|
||||
],
|
||||
@ -118,7 +119,8 @@ export default {
|
||||
{ name: '智能灌溉', routerList: ['realTime', 'dataAnalysis', 'historyData','irrigateSet-soil', 'videoMonitoring','imageData','PIDSet-soil', 'systemSet-soil', 'upload-soil', 'sensorSet-soil', 'realTime', 'history', 'dataAnalysis'], img: require('../assets/image/irrigateSet-icon1-act.png'), list: [] },
|
||||
{ name: '数据采集器', routerList: ['realTime', 'historyData', 'exitSettings', 'skylight', 'control', 'systemSet-con','imageData', 'fan', 'upload-con', 'sensorSet-con', 'synthesis-con', 'alarmSettings', 'waterPump', 'geothermalFan', 'uptake', 'downtake', 'rollByRoll', 'snowRemoval', "targetTemperature", "targetHumidity", "targetCo2", "sunroofControl", "outsizeSunshade", "insizeSunshade", "wetFan", "LED", 'electromagneticControl', "coercionMist", "circulationCan", "internalInsulation", "forceOutput", "intrinsicParameter", "parameterSet"], img: require('../assets/image/left-img3.png'), list: [] },
|
||||
{ name: '生态气象站', routerList: ['realTime', 'historyData', 'exitSettings', 'skylight', 'control', 'systemSet-con','imageData', 'fan', 'upload-con', 'sensorSet-con', 'synthesis-con', 'alarmSettings', 'waterPump', 'geothermalFan', 'uptake', 'downtake', 'rollByRoll', 'snowRemoval', "targetTemperature", "targetHumidity", "targetCo2", "sunroofControl", "outsizeSunshade", "insizeSunshade", "wetFan", "LED", 'electromagneticControl', "coercionMist", "circulationCan", "internalInsulation", "forceOutput", "intrinsicParameter", "parameterSet"], img: require('../assets/image/left-img3.png'), list: [] },
|
||||
],
|
||||
{ name: '虫情', routerList: ['insectPestDetail'], img: require('../assets/image/index-icon1.png'), list: [] },
|
||||
],
|
||||
leftList1: [
|
||||
{ name: '管理', img: require('../assets/image/index-icon.png'), list: [], router: 'manage', isRouter: true, },
|
||||
{ name: '用户管理', routerList: [''], img: require('../assets/image/left-img0.png'), list: [
|
||||
@ -137,6 +139,11 @@ export default {
|
||||
'dataDevice',
|
||||
'mobileControl',
|
||||
'userInfoControl',
|
||||
'officialWebsiteCase',
|
||||
'officialWebsiteNews',
|
||||
'officialWebsiteDetail',
|
||||
'officialWebsiteProduct',
|
||||
'officialWebsiteBanner',
|
||||
'deviceManage',
|
||||
'videoManage',],
|
||||
activeNames1: [3,2],
|
||||
@ -228,12 +235,50 @@ export default {
|
||||
this.headerList.splice(foundName, 1)
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
// 是长兴前卫柑桔新优品种扩繁基地 有虫情页面
|
||||
const foundObject13 = this.limitUserId.find(item => item.id == 13);
|
||||
if (foundObject13) {
|
||||
this.getbugzhaodi_login()
|
||||
}
|
||||
}
|
||||
})
|
||||
},
|
||||
// 虫情登录
|
||||
getbugzhaodi_login(){
|
||||
var userInfo = localStorage.getItem('userInfo') ? JSON.parse(localStorage.getItem('userInfo')) : { userid: -1 }
|
||||
this.api.bugzhaodi_login().then(res=>{
|
||||
if(res.data.data.code==200&&res.data){
|
||||
localStorage.setItem("CQtoken", res.data.data.data.token);
|
||||
localStorage.setItem("CQuserName", JSON.stringify(res.data.data.data.userName));
|
||||
var data={"pageNum": 1,
|
||||
"pageSize": 10,
|
||||
"imei":""}
|
||||
axios.post(`/api1/api/v1/getDeviceList`,data, {
|
||||
headers: { //头部参数
|
||||
'Authorization': (localStorage.getItem('CQtoken') ? localStorage.getItem('CQtoken') : '')
|
||||
},
|
||||
}).then(res1=>{
|
||||
if(res1.data.code==200){
|
||||
var list= res1.data.data.list.map(item => {
|
||||
return {
|
||||
...item,
|
||||
deviceId: item.id,
|
||||
userId: userInfo.userid,
|
||||
deviceTypeName: item.deviceName,
|
||||
index: 99,
|
||||
router: 'insectPest',
|
||||
deviceName: '99',
|
||||
deviceState:item.isOnline,
|
||||
isRouter:true
|
||||
};
|
||||
})
|
||||
|
||||
this.leftList[6].list =list
|
||||
}
|
||||
})
|
||||
}
|
||||
})
|
||||
},
|
||||
|
||||
//获取设备名称/配方名称
|
||||
getByid() {
|
||||
@ -404,6 +449,11 @@ export default {
|
||||
{ name: '管理员管理', routerList: [''], img: require('../assets/image/left-img0.png'), list: [
|
||||
{deviceTypeName:'用户信息管理',router:'userInfoControl',index:6},
|
||||
{deviceTypeName:'设备管理',router:'deviceManage',index:7},
|
||||
{deviceTypeName:'官网顶部轮播图管理',router:'officialWebsiteBanner',index:8},
|
||||
{deviceTypeName:'官网产品管理',router:'officialWebsiteProduct',index:11},
|
||||
{deviceTypeName:'官网案例管理',router:'officialWebsiteCase',index:9},
|
||||
{deviceTypeName:'官网公司简介',router:'officialWebsiteDetail',index:12},
|
||||
{deviceTypeName:'官网新闻管理',router:'officialWebsiteNews',index:10},
|
||||
// {deviceTypeName:'摄像头信息管理',router:'videoManage',index:8},
|
||||
] },
|
||||
]
|
||||
@ -459,6 +509,11 @@ export default {
|
||||
},
|
||||
toRouter(item) {
|
||||
if (item.router) {
|
||||
// 是虫情
|
||||
if(this.routerNow == 'insectPestDetail'||this.routerNow == 'insectPestImageList'){
|
||||
this.$message('虫情设备无该页面');
|
||||
return
|
||||
}
|
||||
if (item.http) {
|
||||
window.location.href = item.http;
|
||||
} else if (item.router == 'formula' && this.$route.query.index != item.index) {
|
||||
@ -489,7 +544,7 @@ export default {
|
||||
}
|
||||
|
||||
} else if (item.router == 'realTime') {
|
||||
|
||||
|
||||
this.$router.push({ path: `/realTime` })
|
||||
|
||||
} else if (item.router == 'videoMonitoring') {
|
||||
@ -508,7 +563,7 @@ export default {
|
||||
// item.id == 1 丽水;
|
||||
// item.id == 5 石门;
|
||||
// 进入大屏的权限目前是写死的 等于几能进 反之显示没权限
|
||||
const foundObject = this.limitUserId.find(item => item.id == 2 || item.id == 1 || item.id == 5|| item.id == 7|| item.id == 8|| item.id == 9|| item.id == 10|| item.id == 11 || item.id == 12);
|
||||
const foundObject = this.limitUserId.find(item => item.id == 2 || item.id == 1 || item.id == 5|| item.id == 7|| item.id == 8|| item.id == 9|| item.id == 10|| item.id == 11 || item.id == 12|| item.id == 13);
|
||||
if (!foundObject) {
|
||||
this.$message('您当前没有权限查看!')
|
||||
return
|
||||
@ -529,7 +584,14 @@ export default {
|
||||
if (item.http) {
|
||||
window.location.href = item.http;
|
||||
}else if(item.isRouter){
|
||||
this.$router.push({ path: item.router })
|
||||
// 虫情页面逻辑
|
||||
if(item.deviceName=='99'){
|
||||
this.$router.push({ path: item.router,query:{id:item.deviceId} })
|
||||
|
||||
}else{
|
||||
this.$router.push({ path: item.router })
|
||||
}
|
||||
|
||||
} else if ( this.$route.query.index != item.index) {
|
||||
if (this.routerNow == 'realTime'||item.router=='realTime') {
|
||||
this.$store.state.equipmentIndex = item.index
|
||||
|
21
src/views/insectPest.vue
Normal file
@ -0,0 +1,21 @@
|
||||
<template>
|
||||
<div class="insectPest">
|
||||
<router-view></router-view>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
export default {
|
||||
data(){
|
||||
return {}
|
||||
},
|
||||
mounted(){},
|
||||
methods:{},
|
||||
|
||||
}
|
||||
</script>
|
||||
<style lang="scss">
|
||||
.insectPest{
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
</style>
|
237
src/views/insectPest/InsectDetectionCanvas.vue
Normal file
@ -0,0 +1,237 @@
|
||||
<template>
|
||||
<div class="container">
|
||||
<div class="canvas-wrapper">
|
||||
<canvas
|
||||
ref="canvas"
|
||||
@mousedown="startDrag"
|
||||
@mousemove="drag"
|
||||
@mouseup="endDrag"
|
||||
@mouseleave="endDrag"
|
||||
></canvas>
|
||||
</div>
|
||||
|
||||
<div class="legend" v-if="legendItems.length">
|
||||
<div class="flex-end"><el-button @click="returnImageList">返回列表</el-button></div>
|
||||
<h3>昆虫图例</h3>
|
||||
<div
|
||||
v-for="(item, index) in legendItems"
|
||||
:key="index"
|
||||
class="legend-item"
|
||||
>
|
||||
<span
|
||||
class="color-box"
|
||||
:style="{ backgroundColor: item.color }"
|
||||
></span>
|
||||
<span>{{ item.name }} ({{ item.count }})</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
name: 'InsectDetectionCanvas',
|
||||
props: {
|
||||
imagePath: String,
|
||||
resultList: Array
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
canvas: null,
|
||||
ctx: null,
|
||||
img: null,
|
||||
scale: 0.1, // 固定缩放比例0.5
|
||||
offsetX: 42, // 固定起始位置x
|
||||
offsetY: 42, // 固定起始位置y
|
||||
isDragging: false,
|
||||
lastX: 0,
|
||||
lastY: 0,
|
||||
colors: ['#FF0000', '#00FF00', '#0000FF', '#FFFF00', '#FF00FF', '#00FFFF'],
|
||||
legendItems: [] // 图例数据
|
||||
}
|
||||
},
|
||||
watch: {
|
||||
imagePath: {
|
||||
immediate: true,
|
||||
handler(newVal) {
|
||||
if (newVal) {
|
||||
this.loadImage(newVal);
|
||||
}
|
||||
}
|
||||
},
|
||||
resultList: {
|
||||
deep: true,
|
||||
handler(newVal) {
|
||||
this.updateLegend()
|
||||
this.drawCanvas();
|
||||
}
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
this.canvas = this.$refs.canvas;
|
||||
this.ctx = this.canvas.getContext('2d');
|
||||
window.addEventListener('resize', this.handleResize);
|
||||
this.handleResize();
|
||||
this.updateLegend()
|
||||
},
|
||||
beforeDestroy() {
|
||||
window.removeEventListener('resize', this.handleResize);
|
||||
},
|
||||
methods: {
|
||||
handleResize() {
|
||||
const container = this.$el.querySelector('.canvas-wrapper');
|
||||
this.canvas.width = container.clientWidth;
|
||||
this.canvas.height = container.clientHeight;
|
||||
this.drawCanvas();
|
||||
},
|
||||
loadImage(imagePath) {
|
||||
this.img = new Image();
|
||||
this.img.crossOrigin = 'Anonymous';
|
||||
this.img.onload = () => {
|
||||
this.drawCanvas();
|
||||
};
|
||||
this.img.src = imagePath;
|
||||
},
|
||||
returnImageList(){
|
||||
this.$router.push({ path:'insectPestImageList',query:{id:613} })
|
||||
},
|
||||
updateLegend() {
|
||||
if (!this.resultList) return;
|
||||
|
||||
// 统计每种昆虫的数量
|
||||
const insectMap = {};
|
||||
this.resultList.forEach(item => {
|
||||
if (!insectMap[item.title]) {
|
||||
insectMap[item.title] = 0;
|
||||
}
|
||||
insectMap[item.title]++;
|
||||
});
|
||||
|
||||
// 生成图例数据
|
||||
this.legendItems = Object.keys(insectMap).map((name, index) => ({
|
||||
name,
|
||||
count: insectMap[name],
|
||||
color: this.colors[index % this.colors.length]
|
||||
}));
|
||||
console.log(this.legendItems);
|
||||
},
|
||||
drawCanvas() {
|
||||
if (!this.img) return;
|
||||
|
||||
this.ctx.clearRect(0, 0, this.canvas.width, this.canvas.height);
|
||||
|
||||
// 绘制图片
|
||||
this.ctx.drawImage(
|
||||
this.img,
|
||||
0, 0, this.img.width, this.img.height,
|
||||
this.offsetX, this.offsetY,
|
||||
800, 600
|
||||
);
|
||||
|
||||
// 绘制方框
|
||||
if (this.resultList && this.resultList.length) {
|
||||
this.resultList.forEach((item) => {
|
||||
if (item.xmax && item.xmin && item.ymax && item.ymin) {
|
||||
// 根据昆虫名称获取颜色
|
||||
const legendItem = this.legendItems.find(i => i.name === item.title);
|
||||
const color = legendItem ? legendItem.color : '#000000';
|
||||
|
||||
this.drawBoundingBox(item, color);
|
||||
this.drawLabel(item, color, item.title);
|
||||
}
|
||||
});
|
||||
}
|
||||
},
|
||||
drawBoundingBox(item, color) {
|
||||
const x = this.offsetX + item.xmin * this.scale;
|
||||
const y = this.offsetY + item.ymin * this.scale;
|
||||
const width = (item.xmax - item.xmin) * this.scale;
|
||||
const height = (item.ymax - item.ymin) * this.scale;
|
||||
|
||||
this.ctx.strokeStyle = color;
|
||||
this.ctx.lineWidth = 2;
|
||||
this.ctx.strokeRect(x, y, width, height);
|
||||
},
|
||||
drawLabel(item, color, text) {
|
||||
const x = this.offsetX + item.xmin * this.scale;
|
||||
const y = this.offsetY + item.ymin * this.scale - 5;
|
||||
|
||||
this.ctx.fillStyle = color;
|
||||
this.ctx.font = '14px Arial';
|
||||
this.ctx.fillText(text, x, y);
|
||||
},
|
||||
startDrag(e) {
|
||||
this.isDragging = true;
|
||||
this.lastX = e.clientX;
|
||||
this.lastY = e.clientY;
|
||||
},
|
||||
drag(e) {
|
||||
if (!this.isDragging) return;
|
||||
|
||||
const dx = e.clientX - this.lastX;
|
||||
const dy = e.clientY - this.lastY;
|
||||
|
||||
this.offsetX += dx;
|
||||
this.offsetY += dy;
|
||||
|
||||
this.lastX = e.clientX;
|
||||
this.lastY = e.clientY;
|
||||
|
||||
this.drawCanvas();
|
||||
},
|
||||
endDrag() {
|
||||
this.isDragging = false;
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.container {
|
||||
display: flex;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
.canvas-wrapper {
|
||||
flex: 1;
|
||||
position: relative;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
canvas {
|
||||
background-color: #f0f0f0;
|
||||
display: block;
|
||||
cursor: move;
|
||||
}
|
||||
|
||||
.legend {
|
||||
width: 300px;
|
||||
padding: 15px;
|
||||
background: #f8f8f8;
|
||||
border-left: 1px solid #e0e0e0;
|
||||
overflow-y: auto;
|
||||
}
|
||||
|
||||
.legend h3 {
|
||||
margin-top: 0;
|
||||
margin-bottom: 15px;
|
||||
font-size: 16px;
|
||||
}
|
||||
|
||||
.legend-item {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
margin-bottom: 8px;
|
||||
padding: 5px;
|
||||
border: 1px solid #d3dce6;
|
||||
}
|
||||
|
||||
.color-box {
|
||||
display: inline-block;
|
||||
width: 20px;
|
||||
height: 20px;
|
||||
margin-right: 10px;
|
||||
border: 1px solid #ddd;
|
||||
}
|
||||
</style>
|
181
src/views/insectPest/detail.vue
Normal file
@ -0,0 +1,181 @@
|
||||
<template>
|
||||
<div class="insectPestDetail">
|
||||
<div class="detail-info">
|
||||
<div class="table-title" style="font-size:50px">设备详情</div>
|
||||
<div class="detail-div">
|
||||
<!-- <div class="detail-img">
|
||||
<img src="../../assets/image/pest.png" alt="" />
|
||||
</div> -->
|
||||
<div class="detail-detail" v-if="detail">
|
||||
<div class="detail-detail-div">
|
||||
<div class="title">设备名称:</div>
|
||||
<div class="text">{{detail.deviceName}}</div>
|
||||
</div>
|
||||
<div class="detail-detail-div">
|
||||
<div class="title">设备地址码:</div>
|
||||
<div class="text">{{detail.imei}}</div>
|
||||
</div>
|
||||
<div class="detail-detail-div">
|
||||
<div class="title">创建时间:</div>
|
||||
<div class="text">{{detail.createTime}}</div>
|
||||
</div>
|
||||
<div class="detail-detail-div">
|
||||
<div class="title">经纬度:</div>
|
||||
<div class="text">{{detail.lonLat}}</div>
|
||||
</div>
|
||||
<div class="detail-detail-div">
|
||||
<div class="title">安装地址:</div>
|
||||
<div class="text">{{detail.installAddress}}</div>
|
||||
</div>
|
||||
<div class="detail-detail-div">
|
||||
<div class="title">质保日期:</div>
|
||||
<div class="text">{{detail.warrantyDate}}</div>
|
||||
</div>
|
||||
<div class="detail-detail-div">
|
||||
<div class="title">设备所属sim卡:</div>
|
||||
<div class="text">{{detail.simCardNo}}</div>
|
||||
</div>
|
||||
<div @click="toMore" class="detail-detail-div to-more">
|
||||
<div class="text"> <img src="../../assets/image/more.png" alt="" />更多操作</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="detail-data">
|
||||
<div class="detail-image">
|
||||
<div class="table-title flex-between">虫情图片 <div class="look-all" @click="toImageList">查看全部></div></div>
|
||||
<div class="image-list">
|
||||
<div
|
||||
class="image-div"
|
||||
v-for="(item, index) in imageList"
|
||||
:key="index"
|
||||
>
|
||||
<el-image :src="item.thumbnailUrl" :preview-src-list="srcList">
|
||||
<div slot="error" class="image-slot">
|
||||
<i class="el-icon-picture-outline"></i>
|
||||
</div>
|
||||
</el-image>
|
||||
<div class="image-time">{{ item.shootTime }}</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="detail-charts">
|
||||
<div class="table-title">虫情趋势图</div>
|
||||
<div class="charts" id="pest-charts"></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
import axios from "axios";
|
||||
|
||||
import { pestLine } from "@/assets/js/charts";
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
id: 613,
|
||||
detail: null,
|
||||
imageList: [],
|
||||
chartsData: null,
|
||||
srcList: [],
|
||||
};
|
||||
},
|
||||
mounted() {
|
||||
this.id = this.$route.query.id ? this.$route.query.id : 613;
|
||||
this.dataInit(this.id);
|
||||
},
|
||||
methods: {
|
||||
dataInit() {
|
||||
this.getDetail();
|
||||
this.getImage();
|
||||
this.getCharts();
|
||||
},
|
||||
toImageList(){
|
||||
this.$router.push({ path:'insectPestImageList',query:{id:this.id} })
|
||||
},
|
||||
// 获取设备详情
|
||||
getDetail() {
|
||||
var data = { deviceId: this.id };
|
||||
axios
|
||||
.post(`/api1/api/v1/getDeviceDetailById`, data, {
|
||||
headers: {
|
||||
//头部参数
|
||||
Authorization: localStorage.getItem("CQtoken")
|
||||
? localStorage.getItem("CQtoken")
|
||||
: "",
|
||||
},
|
||||
})
|
||||
.then((res) => {
|
||||
if (res.data.code == 200) {
|
||||
this.detail = res.data.data;
|
||||
}
|
||||
});
|
||||
},
|
||||
toMore(){
|
||||
window.open('https://zdny.zznongyeyiqi.com/index', '_blank');
|
||||
|
||||
},
|
||||
getTimeNew() {
|
||||
// 获取当前日期(格式:YYYY-MM-DD)
|
||||
const today = new Date().toISOString().split("T")[0];
|
||||
|
||||
return today;
|
||||
},
|
||||
getTime7() {
|
||||
// 获取一周前的日期(格式:YYYY-MM-DD)
|
||||
const oneWeekAgo = new Date();
|
||||
oneWeekAgo.setDate(oneWeekAgo.getDate() - 7);
|
||||
const formattedOneWeekAgo = oneWeekAgo.toISOString().split("T")[0];
|
||||
return formattedOneWeekAgo;
|
||||
},
|
||||
// 获取图片列表
|
||||
getImage() {
|
||||
var data = {
|
||||
beginTime: this.getTime7(),
|
||||
endTime: this.getTimeNew(),
|
||||
deviceId: this.id,
|
||||
pageNum: 1,
|
||||
pageSize: 6,
|
||||
};
|
||||
axios.post(`/api1/api/v1/getDeviceImages`, data, {
|
||||
headers: {
|
||||
//头部参数
|
||||
Authorization: localStorage.getItem("CQtoken")
|
||||
? localStorage.getItem("CQtoken")
|
||||
: "",
|
||||
},
|
||||
})
|
||||
.then((res) => {
|
||||
if (res.data.code == 200) {
|
||||
this.imageList = res.data.data.list;
|
||||
this.srcList = this.imageList.map((item) => item.imageUrl);
|
||||
}
|
||||
});
|
||||
},
|
||||
// 左下角虫情趋势图
|
||||
getCharts() {
|
||||
var data = {
|
||||
beginTime: this.getTime7(),
|
||||
endTime: this.getTimeNew(),
|
||||
deviceId: this.id,
|
||||
};
|
||||
axios.post(`/api1/api/v1/getInsectChartData`, data, {
|
||||
headers: {
|
||||
//头部参数
|
||||
Authorization: localStorage.getItem("CQtoken")
|
||||
? localStorage.getItem("CQtoken")
|
||||
: "",
|
||||
},
|
||||
})
|
||||
.then((res) => {
|
||||
if (res.data.code == 200) {
|
||||
this.chartsData = res.data;
|
||||
pestLine("pest-charts", this.chartsData);
|
||||
}
|
||||
});
|
||||
},
|
||||
},
|
||||
};
|
||||
</script>
|
||||
<style lang="scss">
|
||||
</style>
|
182
src/views/insectPest/imageList.vue
Normal file
@ -0,0 +1,182 @@
|
||||
<template>
|
||||
<div class="historyData insectPestImage">
|
||||
<div class="page-content">
|
||||
<div class="table-title">
|
||||
<img src="../../assets/image/real-time.png" alt="" />
|
||||
虫情图片
|
||||
<div class="return-detail" @click="returnDetail">返回详情</div>
|
||||
</div>
|
||||
<div class="flex-view">
|
||||
|
||||
<div class="input-sel-time">
|
||||
<span>时间段</span>
|
||||
<el-date-picker v-model="dateRange" type="daterange" range-separator="至"
|
||||
start-placeholder="开始日期" end-placeholder="结束日期">
|
||||
</el-date-picker>
|
||||
</div>
|
||||
<div class="input-btn ">
|
||||
<div class="btn blue" @click="search">
|
||||
查询
|
||||
</div>
|
||||
<!-- <div class="btn blue">
|
||||
数据统计
|
||||
</div>
|
||||
<div class="btn blue">
|
||||
日/夜平均时间范围设置
|
||||
</div> -->
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="table-view">
|
||||
<!-- <div class="table-title">
|
||||
<div>{{ deviceName }}</div>
|
||||
<span>共有{{ total }}张图片</span>
|
||||
</div> -->
|
||||
<div class="image-list">
|
||||
<div v-for="item, index in tableData" :key="index">
|
||||
<el-image :src="item.thumbnailUrl" :preview-src-list="srcList">
|
||||
<div slot="error" class="image-slot">
|
||||
<i class="el-icon-picture-outline"></i>
|
||||
</div>
|
||||
</el-image>
|
||||
<div class="image-time flex-between">{{ item.shootTime }} <el-link @click="toImageViewer(item)" type="success" :underline="false"><i class="el-icon-view el-icon--right"></i>虫情标注</el-link></div>
|
||||
</div>
|
||||
</div>
|
||||
<el-pagination @size-change="handleSizeChange" @current-change="handleCurrentChange"
|
||||
:current-page="currentPage" :page-sizes="[12, 20, 28, 36]" :page-size="pageSize"
|
||||
layout="->,total, sizes, prev, pager, next, jumper" :total="total">
|
||||
</el-pagination>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
import axios from "axios";
|
||||
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
id: 613,
|
||||
dateRange: ['',''],
|
||||
tableData: [],
|
||||
currentPage: 1,
|
||||
pageSize: 12,
|
||||
total: 0,
|
||||
loading: null,
|
||||
srcList: [],
|
||||
}
|
||||
},
|
||||
watch: {
|
||||
|
||||
},
|
||||
|
||||
mounted() {
|
||||
|
||||
this.id = this.$route.query.id ? this.$route.query.id : 613;
|
||||
this.dataInit(this.id)
|
||||
},
|
||||
methods: {
|
||||
getTime(time) {
|
||||
// 中国标准时间
|
||||
var chinaTime = new Date(time);
|
||||
|
||||
// 将中国标准时间转换为UTC时间
|
||||
var utcTime = new Date(chinaTime.getTime() - chinaTime.getTimezoneOffset() * 60000);
|
||||
|
||||
// 将UTC时间转换为2024-02-17 00:00:00格式
|
||||
var formattedTime = utcTime.toISOString().slice(0, 19).replace('T', ' ');
|
||||
return formattedTime
|
||||
},
|
||||
returnDetail(){
|
||||
this.$router.push({ path:'insectPestDetail',query:{id:this.id} })
|
||||
},
|
||||
dataInit(id) {
|
||||
this.getTime7()
|
||||
this.pageSize = 12
|
||||
this.currentPage = 1
|
||||
setTimeout(() => {
|
||||
this.getImage()
|
||||
}, 0);
|
||||
},
|
||||
getTime7() {
|
||||
// 获取当前日期
|
||||
var today = new Date();
|
||||
|
||||
// 获取昨天的日期
|
||||
var yesterday = new Date(today);
|
||||
yesterday.setDate(today.getDate() - 7);
|
||||
|
||||
|
||||
this.dateRange = [yesterday, today]
|
||||
},
|
||||
toImageViewer(item){
|
||||
const routeData = this.$router.resolve({
|
||||
path: 'imageViewer',
|
||||
query: { id:item.id,url:item.imageUrl }
|
||||
});
|
||||
window.open(routeData.href, '_blank');
|
||||
// this.$router.push({ path:'imageViewer',query:{id:item.id,url:item.imageUrl} })
|
||||
},
|
||||
// 获取图片列表
|
||||
getImage() {
|
||||
this.loading = this.$loading({
|
||||
lock: true,
|
||||
text: '加载中',
|
||||
spinner: 'el-icon-loading',
|
||||
background: 'rgba(0, 0, 0, 0.7)'
|
||||
});
|
||||
var data = {
|
||||
beginTime: this.getTime(this.dateRange[0]),
|
||||
endTime: this.getTime(this.dateRange[1]),
|
||||
deviceId: this.id,
|
||||
pageNum: this.currentPage,
|
||||
pageSize: this.pageSize,
|
||||
};
|
||||
axios
|
||||
.post(`/api1/api/v1/getDeviceImages`, data, {
|
||||
headers: {
|
||||
//头部参数
|
||||
Authorization: localStorage.getItem("CQtoken")
|
||||
? localStorage.getItem("CQtoken")
|
||||
: "",
|
||||
},
|
||||
})
|
||||
.then((res) => {
|
||||
this.loading.close()
|
||||
if (res.data.code == 200) {
|
||||
this.tableData = res.data.data.list;
|
||||
this.srcList = this.tableData.map((item) => item.imageUrl);
|
||||
this.total=res.data.data.total
|
||||
}
|
||||
}).catch(err=>{
|
||||
this.loading.close()
|
||||
});
|
||||
},
|
||||
search() {
|
||||
this.getImage()
|
||||
},
|
||||
handleSizeChange(val) {
|
||||
this.pageSize = val
|
||||
setTimeout(() => {
|
||||
this.getImage()
|
||||
}, 0);
|
||||
},
|
||||
handleCurrentChange(val) {
|
||||
this.currentPage = val
|
||||
setTimeout(() => {
|
||||
this.getImage()
|
||||
}, 0);
|
||||
},
|
||||
tableRowClassName({ row, rowIndex }) {
|
||||
if (rowIndex % 2 == 1) {
|
||||
return 'warning-row';
|
||||
} else if (rowIndex % 2 == 0) {
|
||||
return 'success-row';
|
||||
}
|
||||
return '';
|
||||
}
|
||||
},
|
||||
|
||||
}
|
||||
</script>
|
||||
<style lang="scss"></style>
|
62
src/views/insectPest/imageViewer.vue
Normal file
@ -0,0 +1,62 @@
|
||||
<template>
|
||||
<div class="container">
|
||||
<InsectDetectionCanvas
|
||||
:imagePath="apiData.imagePath"
|
||||
:resultList="apiData.resultList"
|
||||
/>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import InsectDetectionCanvas from './InsectDetectionCanvas.vue';
|
||||
import axios from "axios";
|
||||
export default {
|
||||
components: {
|
||||
InsectDetectionCanvas
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
apiData: {
|
||||
// 这里放你的API返回数据
|
||||
"imagePath": "",
|
||||
"resultList": [
|
||||
|
||||
]
|
||||
}
|
||||
}
|
||||
},
|
||||
created() {
|
||||
this.apiData.imagePath=this.$route.query.url ? this.$route.query.url : ''
|
||||
this.id = this.$route.query.id ? this.$route.query.id : 613;
|
||||
this.fetchData();
|
||||
},
|
||||
methods: {
|
||||
fetchData() {
|
||||
var data = {
|
||||
imageId: this.id,
|
||||
};
|
||||
axios.post(`/api1/api/v1/getDeviceImagesDetailById`, data, {
|
||||
headers: {
|
||||
//头部参数
|
||||
Authorization: localStorage.getItem("CQtoken")
|
||||
? localStorage.getItem("CQtoken")
|
||||
: "",
|
||||
},
|
||||
})
|
||||
.then((res) => {
|
||||
if (res.data.code == 200) {
|
||||
this.apiData.resultList=res.data.data.list[0]
|
||||
}
|
||||
});
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style>
|
||||
.container {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
margin: 0 auto;
|
||||
}
|
||||
</style>
|
309
src/views/officialWebsite/banner.vue
Normal file
@ -0,0 +1,309 @@
|
||||
<template>
|
||||
<div class="videoManage manage-page">
|
||||
<div class="flex-view flex-title">
|
||||
<div class="table-title">官网顶部轮播图</div>
|
||||
<div class="table-title-btn blue" @click="openModel({}, 0)">
|
||||
<img src="../../assets/manageImg/add-btn.png" alt="" />添加
|
||||
</div>
|
||||
</div>
|
||||
<div class="table-view">
|
||||
<el-table
|
||||
:data="tableData"
|
||||
:row-class-name="tableRowClassName"
|
||||
height="620"
|
||||
style="width: 100%"
|
||||
>
|
||||
<el-table-column prop="homepageSort" label="排序">
|
||||
</el-table-column>
|
||||
<el-table-column prop="homepageName" label="轮播图名字">
|
||||
</el-table-column>
|
||||
<el-table-column prop="homepageEnname" label="轮播图英文名字">
|
||||
</el-table-column>
|
||||
<el-table-column label="操作">
|
||||
<template slot-scope="scope">
|
||||
<div class="table-flex">
|
||||
<div class="table-operate blue" @click="openModel(scope.row, 1)">
|
||||
<img src="../../assets/manageImg/table-edit.png" alt="" />编辑
|
||||
</div>
|
||||
<el-popconfirm
|
||||
@confirm="confirmDel(scope.row)"
|
||||
title="这一段内容确定删除吗?"
|
||||
icon-color="red"
|
||||
>
|
||||
<div class="table-operate red" slot="reference">
|
||||
<img
|
||||
src="../../assets/manageImg/table-delete.png"
|
||||
alt=""
|
||||
/>删除
|
||||
</div>
|
||||
</el-popconfirm>
|
||||
</div>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
</div>
|
||||
<el-dialog
|
||||
:close-on-click-modal="false"
|
||||
title="提示"
|
||||
top="10vh"
|
||||
:visible.sync="addModel"
|
||||
width="700px"
|
||||
class="vrcode-model manage-model"
|
||||
:append-to-body="true"
|
||||
>
|
||||
<div class="vrcode-model-title">
|
||||
{{ modelName }}
|
||||
</div>
|
||||
<div class="vrcode-content" v-if="nowData">
|
||||
<div class="manage-left">
|
||||
<div class="manage-input">
|
||||
<div class="input-title">轮播图名字</div>
|
||||
<input
|
||||
type="text"
|
||||
v-model="nowData.homepageName"
|
||||
placeholder="请输入轮播图名字"
|
||||
/>
|
||||
</div>
|
||||
<div class="manage-input">
|
||||
<div class="input-title">轮播图文字字号大小</div>
|
||||
<input
|
||||
type="text"
|
||||
v-model="nowData.homepageNameSize"
|
||||
placeholder="请输入轮播图文字字号大小"
|
||||
/>
|
||||
</div>
|
||||
<div class="manage-input">
|
||||
<div class="input-title">轮播图英文名字</div>
|
||||
<input
|
||||
type="text"
|
||||
v-model="nowData.homepageEnname"
|
||||
placeholder="请输入轮播图英文名字"
|
||||
/>
|
||||
</div>
|
||||
<div class="manage-input">
|
||||
<div class="input-title">轮播图英文文字字号大小</div>
|
||||
<input
|
||||
type="text"
|
||||
v-model="nowData.homepageEnnameSize"
|
||||
placeholder="请输入轮播图英文文字字号大小"
|
||||
/>
|
||||
</div>
|
||||
<div class="manage-input">
|
||||
<div class="input-title">轮播图间隔时间(毫秒)</div>
|
||||
<input
|
||||
type="number"
|
||||
v-model="nowData.homepageTime"
|
||||
placeholder="请输入轮播图间隔时间(默认3000毫秒)"
|
||||
/>
|
||||
</div>
|
||||
<div class="manage-input">
|
||||
<div class="input-title">排序</div>
|
||||
<input
|
||||
type="number"
|
||||
v-model="nowData.homepageSort"
|
||||
placeholder="请输入排序"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
<div class="manage-right">
|
||||
<div class="manage-input">
|
||||
<div class="input-title">轮播图图片(图片大小不能超过2MB)</div>
|
||||
</div>
|
||||
<div class="manage-img" v-loading="loading">
|
||||
<label for="sel-img">
|
||||
<img
|
||||
v-show="nowData.homepaeImage"
|
||||
class=""
|
||||
:src="nowData.homepaeImage"
|
||||
alt="轮播图图片"
|
||||
/>
|
||||
<img
|
||||
class="upload-img"
|
||||
v-show="!nowData.homepaeImage"
|
||||
src="../../assets/img/upload-img.png"
|
||||
alt=""
|
||||
/>
|
||||
</label>
|
||||
<input
|
||||
ref="fileInput"
|
||||
type="file"
|
||||
:multiple="false"
|
||||
id="sel-img"
|
||||
accept="image/*"
|
||||
@change="handleImageChange($event, 0)"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<span slot="footer" class="dialog-footer">
|
||||
<div class="vrcode-btn blue-btn w-100" @click="changeAddModel">
|
||||
确定
|
||||
</div>
|
||||
<div class="vrcode-btn cancle-btn w-100" @click="addModel = false">
|
||||
取消
|
||||
</div>
|
||||
</span>
|
||||
</el-dialog>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
tableData: [],
|
||||
addModel: false,
|
||||
nowData: {
|
||||
homepaeImage: "",
|
||||
homepageEnname: "",
|
||||
homepageEnnameSize: 0,
|
||||
homepageName: "",
|
||||
homepageNameSize: 0,
|
||||
homepageSort: "",
|
||||
homepageTime: 3000,
|
||||
},
|
||||
modelName: "添加",
|
||||
typeSelList: [],
|
||||
TypeSel: "",
|
||||
selId: "",
|
||||
loading: false,
|
||||
};
|
||||
},
|
||||
mounted() {
|
||||
this.dataInit();
|
||||
},
|
||||
methods: {
|
||||
dataInit() {
|
||||
this.api.website_getows().then((res) => {
|
||||
if (res.data.code == 200) {
|
||||
this.tableData = res.data.data;
|
||||
}
|
||||
});
|
||||
},
|
||||
openModel(item, type) {
|
||||
if (type == 0) {
|
||||
this.modelName = "添加";
|
||||
this.addModel = true;
|
||||
this.nowData = {
|
||||
homepaeImage: "",
|
||||
homepageEnname: "",
|
||||
homepageEnnameSize: 0,
|
||||
homepageName: "",
|
||||
homepageNameSize: 0,
|
||||
homepageSort: "",
|
||||
homepageTime: 3000,
|
||||
};
|
||||
} else {
|
||||
this.modelName = "编辑";
|
||||
this.nowData = JSON.parse(JSON.stringify(item));
|
||||
this.addModel = true;
|
||||
}
|
||||
},
|
||||
changeAddModel() {
|
||||
if(this.loading){
|
||||
this.$message.error("图片还未上传成功,请耐心等待。");
|
||||
return
|
||||
}
|
||||
if(!this.nowData.homepaeImage){
|
||||
this.$message.error("图片还未上传。");
|
||||
return
|
||||
}
|
||||
this.Addloading = this.$loading({
|
||||
lock: true,
|
||||
text: "加载中",
|
||||
spinner: "el-icon-loading",
|
||||
background: "rgba(0, 0, 0, 0.7)",
|
||||
});
|
||||
if (this.modelName == "编辑") {
|
||||
var data = { ...this.nowData,id:this.nowData.id.toString() };
|
||||
this.api.website_updateows(data).then((res) => {
|
||||
this.Addloading.close();
|
||||
if (res.data.code == 200) {
|
||||
this.$message.success(res.data.msg);
|
||||
this.dataInit();
|
||||
this.addModel = false;
|
||||
} else {
|
||||
this.$message.error(res.data.msg);
|
||||
this.addModel = false;
|
||||
}
|
||||
});
|
||||
} else {
|
||||
var data = { ...this.nowData};
|
||||
|
||||
this.api.website_addows(data).then((res) => {
|
||||
this.Addloading.close();
|
||||
if (res.data.code == 200) {
|
||||
this.$message.success(res.data.msg);
|
||||
this.dataInit();
|
||||
this.addModel = false;
|
||||
} else {
|
||||
this.$message.error(res.data.msg);
|
||||
this.addModel = false;
|
||||
}
|
||||
});
|
||||
}
|
||||
},
|
||||
handleImageChange(event, type) {
|
||||
this.loading = true;
|
||||
if (event.target.files.length === 0) {
|
||||
// 用户点击了取消
|
||||
this.loading = false;
|
||||
return;
|
||||
}
|
||||
const file = event.target.files[0];
|
||||
|
||||
const reader = new FileReader();
|
||||
const maxSize = 2 * 1024 * 1024; // 2MB in bytes
|
||||
if (file.size > maxSize) {
|
||||
this.$message.error("图片大小不能超过2MB");
|
||||
this.$refs.fileInput.value = "";
|
||||
this.loading = false;
|
||||
return;
|
||||
}
|
||||
|
||||
reader.onload = (e) => {
|
||||
const imageData = e.target.result;
|
||||
const convertedFile = new File([imageData], file.name, {
|
||||
type: file.type,
|
||||
});
|
||||
// 处理转换后的文件...
|
||||
|
||||
var data = { file: convertedFile };
|
||||
this.api.websiteUploadImage(data).then((res) => {
|
||||
this.loading = false;
|
||||
if (res.data.code == 200) {
|
||||
this.nowData.homepaeImage = res.data.msg;
|
||||
this.$refs.fileInput.value = "";
|
||||
} else {
|
||||
this.$message.error(res.data.msg);
|
||||
}
|
||||
}).catch((err) => {
|
||||
this.loading = false;
|
||||
this.$message.error("插入图片失败");
|
||||
});
|
||||
};
|
||||
reader.readAsArrayBuffer(file);
|
||||
},
|
||||
|
||||
confirmDel(item) {
|
||||
var data = { id: item.id.toString() };
|
||||
this.api.website_delows(data).then((res) => {
|
||||
if (res.data.code == 200) {
|
||||
this.dataInit();
|
||||
this.$message.success(res.data.msg);
|
||||
} else {
|
||||
this.$message.error(res.data.msg);
|
||||
}
|
||||
});
|
||||
},
|
||||
tableRowClassName({ row, rowIndex }) {
|
||||
if (rowIndex % 2 == 1) {
|
||||
return "warning-row";
|
||||
} else if (rowIndex % 2 == 0) {
|
||||
return "success-row";
|
||||
}
|
||||
return "";
|
||||
},
|
||||
},
|
||||
};
|
||||
</script>
|
||||
<style lang="scss"></style>
|
321
src/views/officialWebsite/case.vue
Normal file
@ -0,0 +1,321 @@
|
||||
<template>
|
||||
<div class="videoManage manage-page">
|
||||
<div class="flex-view flex-title">
|
||||
<div class="table-title">官网案例管理</div>
|
||||
<div class="table-title-btn blue" @click="openModel({}, 0)">
|
||||
<img src="../../assets/manageImg/add-btn.png" alt="" />添加
|
||||
</div>
|
||||
</div>
|
||||
<div class="table-view">
|
||||
<el-table
|
||||
:data="tableData"
|
||||
:row-class-name="tableRowClassName"
|
||||
height="620"
|
||||
style="width: 100%"
|
||||
>
|
||||
<el-table-column prop="detailedIntroductionSort" label="排序">
|
||||
</el-table-column>
|
||||
<el-table-column prop="detailedIntroductionName" label="案例名字">
|
||||
</el-table-column>
|
||||
<el-table-column prop="detailedIntroductionEnName" label="案例英文名字">
|
||||
</el-table-column>
|
||||
<el-table-column label="操作">
|
||||
<template slot-scope="scope">
|
||||
<div class="table-flex">
|
||||
<div class="table-operate blue" @click="openModel(scope.row, 1)">
|
||||
<img src="../../assets/manageImg/table-edit.png" alt="" />编辑
|
||||
</div>
|
||||
<el-popconfirm
|
||||
@confirm="confirmDel(scope.row)"
|
||||
title="这一段内容确定删除吗?"
|
||||
icon-color="red"
|
||||
>
|
||||
<div class="table-operate red" slot="reference">
|
||||
<img
|
||||
src="../../assets/manageImg/table-delete.png"
|
||||
alt=""
|
||||
/>删除
|
||||
</div>
|
||||
</el-popconfirm>
|
||||
</div>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
</div>
|
||||
<el-dialog
|
||||
:close-on-click-modal="false"
|
||||
title="提示"
|
||||
top="5vh"
|
||||
:visible.sync="addModel"
|
||||
width="1000px"
|
||||
class="vrcode-model manage-model"
|
||||
:append-to-body="true"
|
||||
>
|
||||
<div class="vrcode-model-title">
|
||||
{{ modelName }}
|
||||
</div>
|
||||
<div class="vrcode-content grid-3" v-if="nowData">
|
||||
<div class="manage-left">
|
||||
<div class="manage-input">
|
||||
<div class="input-title">案例名字</div>
|
||||
<input
|
||||
type="text"
|
||||
v-model="nowData.detailedIntroductionName"
|
||||
placeholder="请输入案例名字"
|
||||
/>
|
||||
</div>
|
||||
<div class="manage-input">
|
||||
<div class="input-title">案例英文名字</div>
|
||||
<input
|
||||
type="text"
|
||||
v-model="nowData.detailedIntroductionEnName"
|
||||
placeholder="请输入案例英文名字"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div class="manage-input">
|
||||
<div class="input-title">排序</div>
|
||||
<input
|
||||
type="number"
|
||||
v-model="nowData.detailedIntroductionSort"
|
||||
placeholder="请输入排序"
|
||||
/>
|
||||
</div>
|
||||
<div class="manage-input">
|
||||
<div class="input-title">案例小标题</div>
|
||||
<input
|
||||
type="text"
|
||||
v-model="nowData.detailedIntroductionTextTitle"
|
||||
placeholder="请输入产品详情小标题"
|
||||
/>
|
||||
</div>
|
||||
<div class="manage-input">
|
||||
<div class="input-title">案例小标题英文</div>
|
||||
<input
|
||||
type="text"
|
||||
v-model="nowData.detailedIntroductionTextEnTitle"
|
||||
placeholder="请输入产品详情小标题英文"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
<div class="manage-left">
|
||||
<div class="manage-textarea">
|
||||
<div class="input-title">案例中文特点(以回车键换行)</div>
|
||||
<textarea v-model="nowData.detailedIntroductionText" name="" id="" cols="30" rows="10"></textarea>
|
||||
</div>
|
||||
<div class="manage-textarea">
|
||||
<div class="input-title">案例英文特点(以回车键换行)</div>
|
||||
<textarea v-model="nowData.detailedIntroductionEnText" name="" id="" cols="30" rows="10"></textarea>
|
||||
</div>
|
||||
</div>
|
||||
<div class="manage-right">
|
||||
<div class="manage-input">
|
||||
<div class="input-title">案例图片(图片大小不能超过2MB)</div>
|
||||
</div>
|
||||
<div class="manage-img" v-loading="loading">
|
||||
<label for="sel-img">
|
||||
<img
|
||||
v-show="nowData.detailedIntroductionImage"
|
||||
class=""
|
||||
:src="nowData.detailedIntroductionImage"
|
||||
alt="案例图片"
|
||||
/>
|
||||
<img
|
||||
class="upload-img"
|
||||
v-show="!nowData.detailedIntroductionImage"
|
||||
src="../../assets/img/upload-img.png"
|
||||
alt=""
|
||||
/>
|
||||
</label>
|
||||
<input
|
||||
ref="fileInput"
|
||||
type="file"
|
||||
:multiple="false"
|
||||
id="sel-img"
|
||||
accept="image/*"
|
||||
@change="handleImageChange($event, 0)"
|
||||
/>
|
||||
</div>
|
||||
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<span slot="footer" class="dialog-footer">
|
||||
<div class="vrcode-btn blue-btn w-100" @click="changeAddModel">
|
||||
确定
|
||||
</div>
|
||||
<div class="vrcode-btn cancle-btn w-100" @click="addModel = false">
|
||||
取消
|
||||
</div>
|
||||
</span>
|
||||
</el-dialog>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
tableData: [],
|
||||
addModel: false,
|
||||
nowData: {
|
||||
detailedIntroductionImage: "",
|
||||
detailedIntroductionEnName: "",
|
||||
detailedIntroductionEnText: "",
|
||||
detailedIntroductionText: "",
|
||||
detailedIntroductionName: "",
|
||||
detailedIntroductionSort: "",
|
||||
detailedIntroductionTextTitle:'',
|
||||
detailedIntroductionTextEnTitle:'',
|
||||
type:2,
|
||||
},
|
||||
modelName: "添加",
|
||||
typeSelList: [],
|
||||
TypeSel: "",
|
||||
selId: "",
|
||||
loading: false,
|
||||
};
|
||||
},
|
||||
mounted() {
|
||||
this.dataInit();
|
||||
},
|
||||
methods: {
|
||||
dataInit() {
|
||||
this.api.website_getowpabyowpidMan().then((res) => {
|
||||
if (res.data.code == 200) {
|
||||
this.tableData = res.data.data.filter(item => item && item.type === 2);
|
||||
}
|
||||
});
|
||||
},
|
||||
openModel(item, type) {
|
||||
if (type == 0) {
|
||||
this.modelName = "添加";
|
||||
this.addModel = true;
|
||||
this.nowData = {
|
||||
detailedIntroductionImage: "",
|
||||
detailedIntroductionEnName: "",
|
||||
detailedIntroductionEnText: "",
|
||||
detailedIntroductionText: "",
|
||||
detailedIntroductionName: "",
|
||||
detailedIntroductionSort: "",
|
||||
detailedIntroductionTextTitle:'',
|
||||
detailedIntroductionTextEnTitle:'',
|
||||
type:2,
|
||||
};
|
||||
} else {
|
||||
this.modelName = "编辑";
|
||||
this.nowData = JSON.parse(JSON.stringify(item));
|
||||
this.addModel = true;
|
||||
}
|
||||
},
|
||||
changeAddModel() {
|
||||
|
||||
if(this.loading){
|
||||
this.$message.error("图片还未上传成功,请耐心等待。");
|
||||
return
|
||||
}
|
||||
if(!this.nowData.detailedIntroductionImage){
|
||||
this.$message.error("图片还未上传。");
|
||||
return
|
||||
}
|
||||
this.Addloading = this.$loading({
|
||||
lock: true,
|
||||
text: "加载中",
|
||||
spinner: "el-icon-loading",
|
||||
background: "rgba(0, 0, 0, 0.7)",
|
||||
});
|
||||
if (this.modelName == "编辑") {
|
||||
var data = { ...this.nowData,id:this.nowData.id.toString() };
|
||||
|
||||
|
||||
this.api.website_updateops(data).then((res) => {
|
||||
this.Addloading.close();
|
||||
if (res.data.code == 200) {
|
||||
this.$message.success(res.data.msg);
|
||||
this.dataInit();
|
||||
this.addModel = false;
|
||||
} else {
|
||||
this.$message.error(res.data.msg);
|
||||
this.addModel = false;
|
||||
}
|
||||
});
|
||||
} else {
|
||||
var data = { ...this.nowData };
|
||||
this.api.website_addops(data).then((res) => {
|
||||
this.Addloading.close();
|
||||
if (res.data.code == 200) {
|
||||
this.$message.success(res.data.msg);
|
||||
this.dataInit();
|
||||
this.addModel = false;
|
||||
} else {
|
||||
this.$message.error(res.data.msg);
|
||||
this.addModel = false;
|
||||
}
|
||||
});
|
||||
}
|
||||
},
|
||||
handleImageChange(event, type) {
|
||||
this.loading = true;
|
||||
if (event.target.files.length === 0) {
|
||||
// 用户点击了取消
|
||||
this.loading = false;
|
||||
return;
|
||||
}
|
||||
const file = event.target.files[0];
|
||||
|
||||
const reader = new FileReader();
|
||||
const maxSize = 2 * 1024 * 1024; // 2MB in bytes
|
||||
if (file.size > maxSize) {
|
||||
this.$message.error("图片大小不能超过2MB");
|
||||
this.$refs.fileInput.value = "";
|
||||
this.loading = false;
|
||||
return;
|
||||
}
|
||||
|
||||
reader.onload = (e) => {
|
||||
const imageData = e.target.result;
|
||||
const convertedFile = new File([imageData], file.name, {
|
||||
type: file.type,
|
||||
});
|
||||
// 处理转换后的文件...
|
||||
|
||||
var data = { file: convertedFile };
|
||||
this.api.websiteUploadImage(data).then((res) => {
|
||||
this.loading = false;
|
||||
if (res.data.code == 200) {
|
||||
this.nowData.detailedIntroductionImage = res.data.msg;
|
||||
this.$refs.fileInput.value = "";
|
||||
} else {
|
||||
this.$message.error(res.data.msg);
|
||||
}
|
||||
}).catch((err) => {
|
||||
this.loading = false;
|
||||
this.$message.error("插入图片失败");
|
||||
});
|
||||
};
|
||||
reader.readAsArrayBuffer(file);
|
||||
},
|
||||
|
||||
confirmDel(item) {
|
||||
var data = { id: item.id.toString() };
|
||||
this.api.website_delops(data).then((res) => {
|
||||
if (res.data.code == 200) {
|
||||
this.dataInit();
|
||||
this.$message.success(res.data.msg);
|
||||
} else {
|
||||
this.$message.error(res.data.msg);
|
||||
}
|
||||
});
|
||||
},
|
||||
tableRowClassName({ row, rowIndex }) {
|
||||
if (rowIndex % 2 == 1) {
|
||||
return "warning-row";
|
||||
} else if (rowIndex % 2 == 0) {
|
||||
return "success-row";
|
||||
}
|
||||
return "";
|
||||
},
|
||||
},
|
||||
};
|
||||
</script>
|
||||
<style lang="scss"></style>
|
299
src/views/officialWebsite/detail.vue
Normal file
@ -0,0 +1,299 @@
|
||||
<template>
|
||||
<div class="videoManage manage-page">
|
||||
<div class="flex-view flex-title">
|
||||
<div class="table-title">官网公司简介</div>
|
||||
<div class="table-title-btn blue" @click="openModel({}, 0)">
|
||||
<img src="../../assets/manageImg/add-btn.png" alt="" />添加
|
||||
</div>
|
||||
</div>
|
||||
<div class="table-view">
|
||||
<el-table
|
||||
:data="tableData"
|
||||
:row-class-name="tableRowClassName"
|
||||
height="620"
|
||||
style="width: 100%"
|
||||
>
|
||||
<el-table-column prop="detailedIntroductionSort" label="排序">
|
||||
</el-table-column>
|
||||
<el-table-column prop="detailedIntroductionName" label="公司名称">
|
||||
</el-table-column>
|
||||
<el-table-column prop="detailedIntroductionEnName" label="公司英文名称">
|
||||
</el-table-column>
|
||||
<el-table-column label="操作">
|
||||
<template slot-scope="scope">
|
||||
<div class="table-flex">
|
||||
<div class="table-operate blue" @click="openModel(scope.row, 1)">
|
||||
<img src="../../assets/manageImg/table-edit.png" alt="" />编辑
|
||||
</div>
|
||||
<el-popconfirm
|
||||
@confirm="confirmDel(scope.row)"
|
||||
title="这一段内容确定删除吗?"
|
||||
icon-color="red"
|
||||
>
|
||||
<div class="table-operate red" slot="reference">
|
||||
<img
|
||||
src="../../assets/manageImg/table-delete.png"
|
||||
alt=""
|
||||
/>删除
|
||||
</div>
|
||||
</el-popconfirm>
|
||||
</div>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
</div>
|
||||
<el-dialog
|
||||
:close-on-click-modal="false"
|
||||
title="提示"
|
||||
top="5vh"
|
||||
:visible.sync="addModel"
|
||||
width="700px"
|
||||
class="vrcode-model manage-model"
|
||||
:append-to-body="true"
|
||||
>
|
||||
<div class="vrcode-model-title">
|
||||
{{ modelName }}
|
||||
</div>
|
||||
<div class="vrcode-content " v-if="nowData">
|
||||
<div class="manage-left">
|
||||
<div class="manage-input">
|
||||
<div class="input-title">公司名称</div>
|
||||
<input
|
||||
type="text"
|
||||
v-model="nowData.detailedIntroductionName"
|
||||
placeholder="请输入公司名称"
|
||||
/>
|
||||
</div>
|
||||
<div class="manage-input">
|
||||
<div class="input-title">公司英文名称</div>
|
||||
<input
|
||||
type="text"
|
||||
v-model="nowData.detailedIntroductionEnName"
|
||||
placeholder="请输入公司英文名称"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div class="manage-input">
|
||||
<div class="input-title">排序</div>
|
||||
<input
|
||||
type="number"
|
||||
v-model="nowData.detailedIntroductionSort"
|
||||
placeholder="请输入排序"
|
||||
/>
|
||||
<div class="manage-textarea">
|
||||
<div class="input-title">公司中文简介(以回车键换行)</div>
|
||||
<textarea v-model="nowData.detailedIntroductionText" name="" id="" cols="30" rows="10"></textarea>
|
||||
</div>
|
||||
<div class="manage-textarea">
|
||||
<div class="input-title">公司英文简介(以回车键换行)</div>
|
||||
<textarea v-model="nowData.detailedIntroductionEnText" name="" id="" cols="30" rows="10"></textarea>
|
||||
</div>
|
||||
</div></div>
|
||||
<div class="manage-right">
|
||||
<div class="manage-input">
|
||||
<div class="input-title">公司图片(图片大小不能超过2MB)</div>
|
||||
</div>
|
||||
<div class="manage-img" v-loading="loading">
|
||||
<label for="sel-img">
|
||||
<img
|
||||
v-show="nowData.detailedIntroductionImage"
|
||||
class=""
|
||||
:src="nowData.detailedIntroductionImage"
|
||||
alt="案例图片"
|
||||
/>
|
||||
<img
|
||||
class="upload-img"
|
||||
v-show="!nowData.detailedIntroductionImage"
|
||||
src="../../assets/img/upload-img.png"
|
||||
alt=""
|
||||
/>
|
||||
</label>
|
||||
<input
|
||||
ref="fileInput"
|
||||
type="file"
|
||||
:multiple="false"
|
||||
id="sel-img"
|
||||
accept="image/*"
|
||||
@change="handleImageChange($event, 0)"
|
||||
/>
|
||||
</div>
|
||||
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<span slot="footer" class="dialog-footer">
|
||||
<div class="vrcode-btn blue-btn w-100" @click="changeAddModel">
|
||||
确定
|
||||
</div>
|
||||
<div class="vrcode-btn cancle-btn w-100" @click="addModel = false">
|
||||
取消
|
||||
</div>
|
||||
</span>
|
||||
</el-dialog>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
tableData: [],
|
||||
addModel: false,
|
||||
nowData: {
|
||||
detailedIntroductionImage: "",
|
||||
detailedIntroductionEnName: "",
|
||||
detailedIntroductionEnText: "",
|
||||
detailedIntroductionText: "",
|
||||
detailedIntroductionName: "",
|
||||
detailedIntroductionSort: "",
|
||||
detailedIntroductionTextTitle:'',
|
||||
detailedIntroductionTextEnTitle:'',
|
||||
type:4,
|
||||
},
|
||||
modelName: "添加",
|
||||
typeSelList: [],
|
||||
TypeSel: "",
|
||||
selId: "",
|
||||
loading: false,
|
||||
};
|
||||
},
|
||||
mounted() {
|
||||
this.dataInit();
|
||||
},
|
||||
methods: {
|
||||
dataInit() {
|
||||
this.api.website_getowpabyowpidMan().then((res) => {
|
||||
if (res.data.code == 200) {
|
||||
this.tableData = res.data.data.filter(item => item && item.type === 4);
|
||||
}
|
||||
});
|
||||
},
|
||||
openModel(item, type) {
|
||||
if (type == 0) {
|
||||
this.modelName = "添加";
|
||||
this.addModel = true;
|
||||
this.nowData = {
|
||||
detailedIntroductionImage: "",
|
||||
detailedIntroductionEnName: "",
|
||||
detailedIntroductionEnText: "",
|
||||
detailedIntroductionText: "",
|
||||
detailedIntroductionName: "",
|
||||
detailedIntroductionSort: "",
|
||||
detailedIntroductionTextTitle:'',
|
||||
detailedIntroductionTextEnTitle:'',
|
||||
type:4,
|
||||
};
|
||||
} else {
|
||||
this.modelName = "编辑";
|
||||
this.nowData = JSON.parse(JSON.stringify(item));
|
||||
this.addModel = true;
|
||||
}
|
||||
},
|
||||
changeAddModel() {
|
||||
if(this.loading){
|
||||
this.$message.error("图片还未上传成功,请耐心等待。");
|
||||
return
|
||||
}
|
||||
if(!this.nowData.detailedIntroductionImage){
|
||||
this.$message.error("图片还未上传。");
|
||||
return
|
||||
}
|
||||
this.Addloading = this.$loading({
|
||||
lock: true,
|
||||
text: "加载中",
|
||||
spinner: "el-icon-loading",
|
||||
background: "rgba(0, 0, 0, 0.7)",
|
||||
});
|
||||
if (this.modelName == "编辑") {
|
||||
var data = { ...this.nowData,id:this.nowData.id.toString() };
|
||||
this.api.website_updateops(data).then((res) => {
|
||||
this.Addloading.close();
|
||||
if (res.data.code == 200) {
|
||||
this.$message.success(res.data.msg);
|
||||
this.dataInit();
|
||||
this.addModel = false;
|
||||
} else {
|
||||
this.$message.error(res.data.msg);
|
||||
this.addModel = false;
|
||||
}
|
||||
});
|
||||
} else {
|
||||
var data = { ...this.nowData };
|
||||
this.api.website_addops(data).then((res) => {
|
||||
this.Addloading.close();
|
||||
if (res.data.code == 200) {
|
||||
this.$message.success(res.data.msg);
|
||||
this.dataInit();
|
||||
this.addModel = false;
|
||||
} else {
|
||||
this.$message.error(res.data.msg);
|
||||
this.addModel = false;
|
||||
}
|
||||
});
|
||||
}
|
||||
},
|
||||
handleImageChange(event, type) {
|
||||
this.loading = true;
|
||||
if (event.target.files.length === 0) {
|
||||
// 用户点击了取消
|
||||
this.loading = false;
|
||||
return;
|
||||
}
|
||||
const file = event.target.files[0];
|
||||
|
||||
const reader = new FileReader();
|
||||
const maxSize = 2 * 1024 * 1024; // 2MB in bytes
|
||||
if (file.size > maxSize) {
|
||||
this.$message.error("图片大小不能超过2MB");
|
||||
this.$refs.fileInput.value = "";
|
||||
this.loading = false;
|
||||
return;
|
||||
}
|
||||
|
||||
reader.onload = (e) => {
|
||||
const imageData = e.target.result;
|
||||
const convertedFile = new File([imageData], file.name, {
|
||||
type: file.type,
|
||||
});
|
||||
// 处理转换后的文件...
|
||||
|
||||
var data = { file: convertedFile };
|
||||
this.api.websiteUploadImage(data).then((res) => {
|
||||
this.loading = false;
|
||||
if (res.data.code == 200) {
|
||||
this.nowData.detailedIntroductionImage = res.data.msg;
|
||||
this.$refs.fileInput.value = "";
|
||||
} else {
|
||||
this.$message.error(res.data.msg);
|
||||
}
|
||||
}).catch((err) => {
|
||||
this.loading = false;
|
||||
this.$message.error("插入图片失败");
|
||||
});
|
||||
};
|
||||
reader.readAsArrayBuffer(file);
|
||||
},
|
||||
|
||||
confirmDel(item) {
|
||||
var data = { id: item.id.toString() };
|
||||
this.api.website_delops(data).then((res) => {
|
||||
if (res.data.code == 200) {
|
||||
this.dataInit();
|
||||
this.$message.success(res.data.msg);
|
||||
} else {
|
||||
this.$message.error(res.data.msg);
|
||||
}
|
||||
});
|
||||
},
|
||||
tableRowClassName({ row, rowIndex }) {
|
||||
if (rowIndex % 2 == 1) {
|
||||
return "warning-row";
|
||||
} else if (rowIndex % 2 == 0) {
|
||||
return "success-row";
|
||||
}
|
||||
return "";
|
||||
},
|
||||
},
|
||||
};
|
||||
</script>
|
||||
<style lang="scss"></style>
|
489
src/views/officialWebsite/new.vue
Normal file
@ -0,0 +1,489 @@
|
||||
<template>
|
||||
<div class="videoManage manage-page">
|
||||
<div class="flex-view flex-title">
|
||||
<div class="table-title">官网新闻管理</div>
|
||||
<div class="table-title-btn blue" @click="openModel({}, 0)">
|
||||
<img src="../../assets/manageImg/add-btn.png" alt="" />添加
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="table-view">
|
||||
<el-table
|
||||
:data="tableData"
|
||||
:row-class-name="tableRowClassName"
|
||||
height="620"
|
||||
style="width: 100%"
|
||||
>
|
||||
<el-table-column prop="detailedIntroductionSort" label="排序">
|
||||
</el-table-column>
|
||||
<el-table-column prop="detailedIntroductionName" label="新闻标题">
|
||||
</el-table-column>
|
||||
<el-table-column prop="detailedIntroductionEnName" label="新闻英文标题">
|
||||
</el-table-column>
|
||||
<el-table-column prop="newsTime" label="日期">
|
||||
<template slot-scope="scope">
|
||||
<div class="table-flex">
|
||||
<div>{{ scope.row.newsTime | formatDate }}</div>
|
||||
</div>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="操作">
|
||||
<template slot-scope="scope">
|
||||
<div class="table-flex">
|
||||
<div class="table-operate blue" @click="openModel(scope.row, 1)">
|
||||
<img src="../../assets/manageImg/table-edit.png" alt="" />编辑
|
||||
</div>
|
||||
<el-popconfirm
|
||||
@confirm="confirmDel(scope.row)"
|
||||
title="这一段内容确定删除吗?"
|
||||
icon-color="red"
|
||||
>
|
||||
<div class="table-operate red" slot="reference">
|
||||
<img
|
||||
src="../../assets/manageImg/table-delete.png"
|
||||
alt=""
|
||||
/>删除
|
||||
</div>
|
||||
</el-popconfirm>
|
||||
</div>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
</div>
|
||||
<el-dialog
|
||||
:close-on-click-modal="false"
|
||||
title="提示"
|
||||
top="10vh"
|
||||
:visible.sync="addModel"
|
||||
width="700px"
|
||||
class="vrcode-model manage-model"
|
||||
:append-to-body="true"
|
||||
>
|
||||
<div class="vrcode-model-title">
|
||||
{{ modelName }}
|
||||
</div>
|
||||
|
||||
<div class="vrcode-content" v-if="nowData">
|
||||
<div class="manage-left">
|
||||
<div class="manage-input">
|
||||
<div class="input-title">新闻标题</div>
|
||||
<input
|
||||
type="text"
|
||||
v-model="nowData.detailedIntroductionName"
|
||||
placeholder="请输入新闻标题"
|
||||
/>
|
||||
</div>
|
||||
<div class="manage-input">
|
||||
<div class="input-title">新闻英文标题</div>
|
||||
<input
|
||||
type="text"
|
||||
v-model="nowData.detailedIntroductionEnName"
|
||||
placeholder="请输入新闻英文标题"
|
||||
/>
|
||||
</div>
|
||||
<div class="manage-input">
|
||||
<div class="input-title">排序</div>
|
||||
<input
|
||||
type="number"
|
||||
v-model="nowData.detailedIntroductionSort"
|
||||
placeholder="请输入排序"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div class="manage-input">
|
||||
<div class="input-title">新闻日期选择</div>
|
||||
<el-date-picker
|
||||
v-model="nowData.newsTime"
|
||||
type="date"
|
||||
placeholder="选择日期"
|
||||
>
|
||||
</el-date-picker>
|
||||
</div>
|
||||
<div class="manage-input">
|
||||
<div class="input-title">新闻内容编写</div>
|
||||
<div></div>
|
||||
<input
|
||||
@click="openNewsModel(0)"
|
||||
type="text"
|
||||
v-model="nowData.detailedIntroductionText"
|
||||
placeholder="点击进行编写内容"
|
||||
/>
|
||||
</div>
|
||||
<div class="manage-input">
|
||||
<div class="input-title">新闻英文内容编写</div>
|
||||
<input
|
||||
@click="openNewsModel(1)"
|
||||
type="text"
|
||||
v-model="nowData.detailedIntroductionEnText"
|
||||
placeholder="点击进行编写内容"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="manage-right">
|
||||
<div class="manage-input">
|
||||
<div class="input-title">新闻展示图片(图片大小不能超过2MB)</div>
|
||||
</div>
|
||||
<div class="manage-img" v-loading="loading">
|
||||
<label for="sel-img">
|
||||
<img
|
||||
v-show="nowData.detailedIntroductionImage"
|
||||
class=""
|
||||
:src="nowData.detailedIntroductionImage"
|
||||
alt="案例图片"
|
||||
/>
|
||||
<img
|
||||
class="upload-img"
|
||||
v-show="!nowData.detailedIntroductionImage"
|
||||
src="../../assets/img/upload-img.png"
|
||||
alt=""
|
||||
/>
|
||||
</label>
|
||||
<input
|
||||
ref="fileInput"
|
||||
type="file"
|
||||
:multiple="false"
|
||||
id="sel-img"
|
||||
accept="image/*"
|
||||
@change="handleImageChange($event, 0)"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<span slot="footer" class="dialog-footer">
|
||||
<div class="vrcode-btn blue-btn w-100" @click="changeAddModel">
|
||||
确定
|
||||
</div>
|
||||
<div class="vrcode-btn cancle-btn w-100" @click="addModel = false">
|
||||
取消
|
||||
</div>
|
||||
</span>
|
||||
</el-dialog>
|
||||
|
||||
<el-dialog
|
||||
:close-on-click-modal="false"
|
||||
title="新闻内容编写"
|
||||
top="10vh"
|
||||
:visible.sync="newsModel"
|
||||
width="1000px"
|
||||
class="vrcode-model manage-model"
|
||||
:append-to-body="true"
|
||||
>
|
||||
<div class="vrcode-model-title">
|
||||
新闻{{ newsEdit == 1 ? "英文" : "中文" }}内容编写
|
||||
</div>
|
||||
|
||||
<div class="vrcode-content flex-no">
|
||||
<div style="border: 1px solid #ccc; width: 100%" v-loading="upLoading">
|
||||
<Toolbar
|
||||
style="border-bottom: 1px solid #ccc"
|
||||
:editor="editor"
|
||||
:defaultConfig="toolbarConfig"
|
||||
:mode="mode"
|
||||
/>
|
||||
<Editor
|
||||
style="height: 500px; overflow-y: hidden"
|
||||
v-model="html"
|
||||
:defaultConfig="editorConfig"
|
||||
:mode="mode"
|
||||
@onCreated="handleCreated"
|
||||
@onChange="handleChange"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
<span slot="footer" class="dialog-footer">
|
||||
<div class="vrcode-btn blue-btn w-100" @click="changeNewModel">
|
||||
确定
|
||||
</div>
|
||||
<div class="vrcode-btn cancle-btn w-100" @click="closeNewsModel">
|
||||
取消
|
||||
</div>
|
||||
</span>
|
||||
</el-dialog>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
import { Editor, Toolbar } from "@wangeditor/editor-for-vue";
|
||||
import { DomEditor } from "@wangeditor/editor";
|
||||
export default {
|
||||
components: {
|
||||
Editor,
|
||||
Toolbar,
|
||||
},
|
||||
|
||||
data() {
|
||||
return {
|
||||
newsModel: false,
|
||||
newsEdit: 0, //编辑/添加的是中文还是英文 0是中文1是英文
|
||||
tableData: [],
|
||||
addModel: false,
|
||||
nowData: {
|
||||
detailedIntroductionImage: "",
|
||||
detailedIntroductionEnName: "",
|
||||
detailedIntroductionEnText: "",
|
||||
detailedIntroductionText: "",
|
||||
detailedIntroductionName: "",
|
||||
detailedIntroductionSort: "",
|
||||
newsTime: "",
|
||||
type: 3,
|
||||
},
|
||||
modelName: "添加",
|
||||
typeSelList: [],
|
||||
TypeSel: "",
|
||||
selId: "",
|
||||
loading: false,
|
||||
|
||||
//
|
||||
upLoading: false,
|
||||
editor: null,
|
||||
html: "",
|
||||
mode: "default",
|
||||
editorConfig: {
|
||||
placeholder: "请编写新闻内容...",
|
||||
backColor: "red", // 背景颜色
|
||||
MENU_CONF: {
|
||||
uploadImage: {
|
||||
customUpload: this.uploaadImg,
|
||||
},
|
||||
uploadVideo: {
|
||||
customUpload: this.uploaadVideo,
|
||||
},
|
||||
},
|
||||
},
|
||||
toolbarConfig: {},
|
||||
};
|
||||
},
|
||||
filters: {
|
||||
formatDate: function (value) {
|
||||
if (!value) return "";
|
||||
const date = new Date(value);
|
||||
|
||||
// 处理时区问题,转换为本地时间
|
||||
const year = date.getFullYear();
|
||||
const month = String(date.getMonth() + 1).padStart(2, "0");
|
||||
const day = String(date.getDate()).padStart(2, "0");
|
||||
|
||||
return `${year}-${month}-${day}`;
|
||||
},
|
||||
},
|
||||
mounted() {
|
||||
this.dataInit();
|
||||
},
|
||||
beforeDestroy() {
|
||||
const editor = this.editor;
|
||||
if (editor == null) return;
|
||||
editor.destroy(); // 销毁编辑器
|
||||
},
|
||||
methods: {
|
||||
dataInit() {
|
||||
this.api.website_getowpabyowpidMan().then((res) => {
|
||||
if (res.data.code == 200) {
|
||||
this.tableData = res.data.data.filter(
|
||||
(item) => item && item.type === 3
|
||||
);
|
||||
}
|
||||
});
|
||||
},
|
||||
handleCreated(editor) {
|
||||
this.editor = Object.seal(editor); // 一定要用 Object.seal() ,否则会报错
|
||||
// 设置工具栏详情
|
||||
this.toolbarConfig = {
|
||||
excludeKeys: [
|
||||
"insertVideo",
|
||||
"uploadVideo",
|
||||
"group-video",
|
||||
"fullScreen",
|
||||
],
|
||||
};
|
||||
},
|
||||
closeNewsModel() {
|
||||
if (this.upLoading) {
|
||||
this.$message("请等待图片上传完成");
|
||||
return;
|
||||
}
|
||||
this.html = "";
|
||||
this.newsModel = false;
|
||||
},
|
||||
// 新闻弹窗点击确定
|
||||
changeNewModel() {
|
||||
if (this.newsEdit == 0) {
|
||||
this.nowData.detailedIntroductionText = this.html;
|
||||
} else {
|
||||
this.nowData.detailedIntroductionEnText = this.html;
|
||||
}
|
||||
this.newsModel = false;
|
||||
this.newsEdit = 0;
|
||||
},
|
||||
// 打开新闻页面 0是中文编辑 1是英文
|
||||
openNewsModel(type) {
|
||||
if (type == 0) {
|
||||
this.html = this.nowData.detailedIntroductionText
|
||||
? this.nowData.detailedIntroductionText
|
||||
: "";
|
||||
} else {
|
||||
this.html = this.nowData.detailedIntroductionEnText
|
||||
? this.nowData.detailedIntroductionEnText
|
||||
: "";
|
||||
}
|
||||
this.newsEdit = type;
|
||||
this.newsModel = true;
|
||||
},
|
||||
handleChange(content) {
|
||||
const toolbar = DomEditor.getToolbar(content);
|
||||
// 查看工具栏列表toolbar.getConfig().toolbarKeys
|
||||
},
|
||||
// 上传图片到线上 并且插入到富文本编辑器中
|
||||
async uploaadImg(file, insertFn) {
|
||||
// 处理入参
|
||||
this.upLoading = true;
|
||||
var data = { file: file };
|
||||
await this.api
|
||||
.websiteUploadImage(data)
|
||||
.then((res) => {
|
||||
this.upLoading = false;
|
||||
if (res.data.code == 200) {
|
||||
this.$message.success("插入图片成功");
|
||||
insertFn(res.data.msg); // 页面插入图片
|
||||
} else {
|
||||
this.$message.error(res.data.msg);
|
||||
}
|
||||
})
|
||||
.catch((err) => {
|
||||
this.upLoading = false;
|
||||
this.$message.error("插入图片失败");
|
||||
});
|
||||
},
|
||||
uploaadVideo(file, insertFn) {
|
||||
this.$emit("uploadVideo", file, insertFn);
|
||||
},
|
||||
|
||||
openModel(item, type) {
|
||||
if (type == 0) {
|
||||
this.modelName = "添加";
|
||||
this.addModel = true;
|
||||
this.nowData = {
|
||||
detailedIntroductionImage: "",
|
||||
detailedIntroductionEnName: "",
|
||||
detailedIntroductionEnText: "",
|
||||
detailedIntroductionText: "",
|
||||
detailedIntroductionName: "",
|
||||
detailedIntroductionSort: "",
|
||||
type: 3,
|
||||
};
|
||||
} else {
|
||||
this.modelName = "编辑";
|
||||
this.nowData = JSON.parse(JSON.stringify(item));
|
||||
this.addModel = true;
|
||||
}
|
||||
},
|
||||
|
||||
changeAddModel() {
|
||||
if(this.loading){
|
||||
this.$message.error("图片还未上传成功,请耐心等待。");
|
||||
return
|
||||
}
|
||||
if(!this.nowData.detailedIntroductionImage){
|
||||
this.$message.error("图片还未上传。");
|
||||
return
|
||||
}
|
||||
this.Addloading = this.$loading({
|
||||
lock: true,
|
||||
text: "加载中",
|
||||
spinner: "el-icon-loading",
|
||||
background: "rgba(0, 0, 0, 0.7)",
|
||||
});
|
||||
if (this.modelName == "编辑") {
|
||||
var data = { ...this.nowData, id: this.nowData.id.toString() };
|
||||
this.api.website_updateops(data).then((res) => {
|
||||
this.Addloading.close();
|
||||
if (res.data.code == 200) {
|
||||
this.$message.success(res.data.msg);
|
||||
this.dataInit();
|
||||
this.addModel = false;
|
||||
} else {
|
||||
this.$message.error(res.data.msg);
|
||||
this.addModel = false;
|
||||
}
|
||||
});
|
||||
} else {
|
||||
var data = { ...this.nowData };
|
||||
this.api.website_addops(data).then((res) => {
|
||||
this.Addloading.close();
|
||||
if (res.data.code == 200) {
|
||||
this.$message.success(res.data.msg);
|
||||
this.dataInit();
|
||||
this.addModel = false;
|
||||
} else {
|
||||
this.$message.error(res.data.msg);
|
||||
this.addModel = false;
|
||||
}
|
||||
});
|
||||
}
|
||||
},
|
||||
handleImageChange(event, type) {
|
||||
this.loading = true;
|
||||
if (event.target.files.length === 0) {
|
||||
// 用户点击了取消
|
||||
this.loading = false;
|
||||
return;
|
||||
}
|
||||
const file = event.target.files[0];
|
||||
|
||||
const reader = new FileReader();
|
||||
const maxSize = 2 * 1024 * 1024; // 2MB in bytes
|
||||
if (file.size > maxSize) {
|
||||
this.$message.error("图片大小不能超过2MB");
|
||||
this.$refs.fileInput.value = "";
|
||||
this.loading = false;
|
||||
return;
|
||||
}
|
||||
|
||||
reader.onload = (e) => {
|
||||
const imageData = e.target.result;
|
||||
const convertedFile = new File([imageData], file.name, {
|
||||
type: file.type,
|
||||
});
|
||||
// 处理转换后的文件...
|
||||
|
||||
var data = { file: convertedFile };
|
||||
this.api.websiteUploadImage(data).then((res) => {
|
||||
this.loading = false;
|
||||
if (res.data.code == 200) {
|
||||
this.nowData.detailedIntroductionImage = res.data.msg;
|
||||
this.$refs.fileInput.value = "";
|
||||
} else {
|
||||
this.$message.error(res.data.msg);
|
||||
}
|
||||
}).catch((err) => {
|
||||
this.loading = false;
|
||||
this.$message.error("插入图片失败");
|
||||
});
|
||||
};
|
||||
reader.readAsArrayBuffer(file);
|
||||
},
|
||||
|
||||
confirmDel(item) {
|
||||
var data = { id: item.id.toString() };
|
||||
this.api.website_delops(data).then((res) => {
|
||||
if (res.data.code == 200) {
|
||||
this.dataInit();
|
||||
this.$message.success(res.data.msg);
|
||||
} else {
|
||||
this.$message.error(res.data.msg);
|
||||
}
|
||||
});
|
||||
},
|
||||
tableRowClassName({ row, rowIndex }) {
|
||||
if (rowIndex % 2 == 1) {
|
||||
return "warning-row";
|
||||
} else if (rowIndex % 2 == 0) {
|
||||
return "success-row";
|
||||
}
|
||||
return "";
|
||||
},
|
||||
},
|
||||
};
|
||||
</script>
|
||||
|
||||
<style src="@wangeditor/editor/dist/css/style.css"></style>
|
||||
<style lang="scss"></style>
|
636
src/views/officialWebsite/product.vue
Normal file
@ -0,0 +1,636 @@
|
||||
<template>
|
||||
<div class="videoManage manage-page">
|
||||
<div class="flex-view flex-title">
|
||||
<div class="table-title">官网产品列表管理</div>
|
||||
<div class="table-title-btn blue" @click="openModel1({}, 0)">
|
||||
<img src="../../assets/manageImg/add-btn.png" alt="" />添加
|
||||
</div>
|
||||
</div>
|
||||
<div class="table-view">
|
||||
<el-table
|
||||
:data="tableData1"
|
||||
:row-class-name="tableRowClassName"
|
||||
height="320"
|
||||
style="width: 100%"
|
||||
>
|
||||
<el-table-column prop="productDisplaySort" label="排序">
|
||||
</el-table-column>
|
||||
<el-table-column prop="productDisplayName" label="产品列表名称">
|
||||
</el-table-column>
|
||||
<el-table-column prop="productDisplayEnName" label="产品列表英文名称">
|
||||
</el-table-column>
|
||||
<el-table-column label="操作">
|
||||
<template slot-scope="scope">
|
||||
<div class="table-flex">
|
||||
<div class="table-operate blue" @click="openModel1(scope.row, 1)">
|
||||
<img src="../../assets/manageImg/table-edit.png" alt="" />编辑
|
||||
</div>
|
||||
<el-popconfirm
|
||||
@confirm="confirmDel1(scope.row)"
|
||||
title="这一段内容确定删除吗?"
|
||||
icon-color="red"
|
||||
>
|
||||
<div class="table-operate red" slot="reference">
|
||||
<img
|
||||
src="../../assets/manageImg/table-delete.png"
|
||||
alt=""
|
||||
/>删除
|
||||
</div>
|
||||
</el-popconfirm>
|
||||
</div>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
</div>
|
||||
<div class="flex-view"></div>
|
||||
<div class="flex-view flex-title">
|
||||
<div class="table-title">官网产品管理</div>
|
||||
<div class="table-title-btn blue" @click="openModel({}, 0)">
|
||||
<img src="../../assets/manageImg/add-btn.png" alt="" />添加
|
||||
</div>
|
||||
</div>
|
||||
<div class="table-view">
|
||||
<el-table
|
||||
:data="tableData"
|
||||
:row-class-name="tableRowClassName"
|
||||
height="320"
|
||||
style="width: 100%"
|
||||
>
|
||||
<el-table-column prop="detailedIntroductionSort" label="排序">
|
||||
</el-table-column>
|
||||
<el-table-column prop="detailedIntroductionName" label="产品名字">
|
||||
</el-table-column>
|
||||
<el-table-column prop="detailedIntroductionEnName" label="产品英文名字">
|
||||
</el-table-column>
|
||||
<el-table-column label="操作">
|
||||
<template slot-scope="scope">
|
||||
<div class="table-flex">
|
||||
<div class="table-operate blue" @click="openModel(scope.row, 1)">
|
||||
<img src="../../assets/manageImg/table-edit.png" alt="" />编辑
|
||||
</div>
|
||||
<el-popconfirm
|
||||
@confirm="confirmDel(scope.row)"
|
||||
title="这一段内容确定删除吗?"
|
||||
icon-color="red"
|
||||
>
|
||||
<div class="table-operate red" slot="reference">
|
||||
<img
|
||||
src="../../assets/manageImg/table-delete.png"
|
||||
alt=""
|
||||
/>删除
|
||||
</div>
|
||||
</el-popconfirm>
|
||||
</div>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
</div>
|
||||
<!-- 产品列表弹窗 -->
|
||||
<el-dialog
|
||||
:close-on-click-modal="false"
|
||||
title="提示"
|
||||
top="10vh"
|
||||
:visible.sync="addModel1"
|
||||
width="700px"
|
||||
class="vrcode-model manage-model"
|
||||
:append-to-body="true"
|
||||
>
|
||||
<div class="vrcode-model-title">
|
||||
{{ modelName1 }}
|
||||
</div>
|
||||
<div class="vrcode-content" v-if="nowData1">
|
||||
<div class="manage-left">
|
||||
<div class="manage-input">
|
||||
<div class="input-title">产品列表名字</div>
|
||||
<input
|
||||
type="text"
|
||||
v-model="nowData1.productDisplayName"
|
||||
placeholder="请输入产品列表名字"
|
||||
/>
|
||||
</div>
|
||||
<div class="manage-input">
|
||||
<div class="input-title">产品列表英文名字</div>
|
||||
<input
|
||||
type="text"
|
||||
v-model="nowData1.productDisplayEnName"
|
||||
placeholder="请输入产品列表英文名字"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div class="manage-input">
|
||||
<div class="input-title">排序</div>
|
||||
<input
|
||||
type="number"
|
||||
v-model="nowData1.productDisplaySort"
|
||||
placeholder="请输入排序"
|
||||
/>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
<div class="manage-right">
|
||||
<div class="manage-input">
|
||||
<div class="input-title">产品列表图片(图片大小不能超过2MB)</div>
|
||||
</div>
|
||||
<div class="manage-img" v-loading="loading">
|
||||
<label for="sel-img1">
|
||||
<img
|
||||
v-show="nowData1.productDisplayImages"
|
||||
class=""
|
||||
:src="nowData1.productDisplayImages"
|
||||
alt="产品列表图片"
|
||||
/>
|
||||
<img
|
||||
class="upload-img"
|
||||
v-show="!nowData1.productDisplayImages"
|
||||
src="../../assets/img/upload-img.png"
|
||||
alt=""
|
||||
/>
|
||||
</label>
|
||||
<input
|
||||
ref="fileInput1"
|
||||
type="file"
|
||||
:multiple="false"
|
||||
id="sel-img1"
|
||||
accept="image/*"
|
||||
@change="handleImageChange1($event, 0)"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<span slot="footer" class="dialog-footer">
|
||||
<div class="vrcode-btn blue-btn w-100" @click="changeAddModel1">
|
||||
确定
|
||||
</div>
|
||||
<div class="vrcode-btn cancle-btn w-100" @click="addModel1 = false">
|
||||
取消
|
||||
</div>
|
||||
</span>
|
||||
</el-dialog>
|
||||
<!-- 产品详情弹窗 -->
|
||||
<el-dialog
|
||||
:close-on-click-modal="false"
|
||||
title="提示"
|
||||
top="10vh"
|
||||
:visible.sync="addModel"
|
||||
width="1050px"
|
||||
class="vrcode-model manage-model"
|
||||
:append-to-body="true"
|
||||
>
|
||||
<div class="vrcode-model-title">
|
||||
{{ modelName }}
|
||||
</div>
|
||||
<div class="vrcode-content grid-3" v-if="nowData">
|
||||
<div class="manage-left">
|
||||
<div class="manage-input">
|
||||
<div class="input-title">所属产品列表</div>
|
||||
<el-select v-model="nowData.productId" placeholder="请选择">
|
||||
<el-option
|
||||
v-for="item in tableData1"
|
||||
:key="item.id"
|
||||
:label="item.productDisplayName"
|
||||
:value="item.id">
|
||||
</el-option>
|
||||
</el-select>
|
||||
</div>
|
||||
<div class="manage-input">
|
||||
<div class="input-title">产品名称</div>
|
||||
<input
|
||||
type="text"
|
||||
v-model="nowData.detailedIntroductionName"
|
||||
placeholder="请输入产品名称"
|
||||
/>
|
||||
</div>
|
||||
<div class="manage-input">
|
||||
<div class="input-title">产品英文名称</div>
|
||||
<input
|
||||
type="text"
|
||||
v-model="nowData.detailedIntroductionEnName"
|
||||
placeholder="请输入产品英文名称"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div class="manage-input">
|
||||
<div class="input-title">排序</div>
|
||||
<input
|
||||
type="number"
|
||||
v-model="nowData.detailedIntroductionSort"
|
||||
placeholder="请输入排序"
|
||||
/>
|
||||
</div>
|
||||
<div class="manage-input">
|
||||
<div class="input-title">产品详情小标题</div>
|
||||
<input
|
||||
type="text"
|
||||
v-model="nowData.detailedIntroductionTextTitle"
|
||||
placeholder="请输入产品详情小标题"
|
||||
/>
|
||||
</div>
|
||||
<div class="manage-input">
|
||||
<div class="input-title">产品详情小标题英文</div>
|
||||
<input
|
||||
type="text"
|
||||
v-model="nowData.detailedIntroductionTextEnTitle"
|
||||
placeholder="请输入产品详情小标题英文"
|
||||
/>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
<div class="manage-right">
|
||||
<div class="manage-textarea">
|
||||
<div class="input-title">产品中文内容(以回车键换行)</div>
|
||||
<textarea
|
||||
v-model="nowData.detailedIntroductionTextContent"
|
||||
name=""
|
||||
id=""
|
||||
cols="30"
|
||||
rows="10"
|
||||
></textarea>
|
||||
</div>
|
||||
<div class="manage-textarea">
|
||||
<div class="input-title">产品英文内容(以回车键换行)</div>
|
||||
<textarea
|
||||
v-model="nowData.detailedIntroductionTextEnContent"
|
||||
name=""
|
||||
id=""
|
||||
cols="30"
|
||||
rows="10"
|
||||
></textarea>
|
||||
</div>
|
||||
<div class="manage-textarea">
|
||||
<div class="input-title">产品中文讲解(以回车键换行)</div>
|
||||
<textarea
|
||||
v-model="nowData.detailedIntroductionText"
|
||||
name=""
|
||||
id=""
|
||||
cols="30"
|
||||
rows="10"
|
||||
></textarea>
|
||||
</div>
|
||||
<div class="manage-textarea">
|
||||
<div class="input-title">产品英文讲解(以回车键换行)</div>
|
||||
<textarea
|
||||
v-model="nowData.detailedIntroductionEnText"
|
||||
name=""
|
||||
id=""
|
||||
cols="30"
|
||||
rows="10"
|
||||
></textarea>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
<div class="manage-right">
|
||||
<div class="manage-input">
|
||||
<div class="input-title">产品详情图片(图片大小不能超过2MB)</div>
|
||||
</div>
|
||||
<div class="manage-img" v-loading="loading">
|
||||
<label for="sel-img">
|
||||
<img
|
||||
v-show="nowData.detailedIntroductionImage"
|
||||
class=""
|
||||
:src="nowData.detailedIntroductionImage"
|
||||
alt="案例图片"
|
||||
/>
|
||||
<img
|
||||
class="upload-img"
|
||||
v-show="!nowData.detailedIntroductionImage"
|
||||
src="../../assets/img/upload-img.png"
|
||||
alt=""
|
||||
/>
|
||||
</label>
|
||||
<input
|
||||
ref="fileInput"
|
||||
type="file"
|
||||
:multiple="false"
|
||||
id="sel-img"
|
||||
accept="image/*"
|
||||
@change="handleImageChange($event, 0)"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<span slot="footer" class="dialog-footer">
|
||||
<div class="vrcode-btn blue-btn w-100" @click="changeAddModel">
|
||||
确定
|
||||
</div>
|
||||
<div class="vrcode-btn cancle-btn w-100" @click="addModel = false">
|
||||
取消
|
||||
</div>
|
||||
</span>
|
||||
</el-dialog>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
// 产品列表
|
||||
tableData1: [],
|
||||
addModel1: false,
|
||||
nowData1: {
|
||||
productDisplayEnName: "",
|
||||
productDisplayImages: "",
|
||||
productDisplayName: "",
|
||||
productDisplaySort: "",
|
||||
},
|
||||
modelName1: "添加",
|
||||
typeSelList: [],
|
||||
TypeSel: "",
|
||||
selId: "",
|
||||
|
||||
// 产品信息
|
||||
tableData: [],
|
||||
addModel: false,
|
||||
nowData: {
|
||||
detailedIntroductionEnName: "",
|
||||
detailedIntroductionEnText: '',
|
||||
detailedIntroductionImage: '',
|
||||
detailedIntroductionName: "",
|
||||
detailedIntroductionSort:'',
|
||||
detailedIntroductionText: '',
|
||||
detailedIntroductionTextContent: '',
|
||||
detailedIntroductionTextEnContent: '',
|
||||
detailedIntroductionTextEnTitle:'',
|
||||
detailedIntroductionTextTitle:'',
|
||||
productId: "",
|
||||
type: 1,
|
||||
},
|
||||
modelName: "添加",
|
||||
selId: "",
|
||||
|
||||
loading: false,
|
||||
};
|
||||
},
|
||||
mounted() {
|
||||
this.dataInit();
|
||||
},
|
||||
methods: {
|
||||
dataInit() {
|
||||
this.getProduct()
|
||||
this.getProductList()
|
||||
},
|
||||
getProduct(){
|
||||
this.api.website_getowpabyowpidMan().then((res) => {
|
||||
if (res.data.code == 200) {
|
||||
this.tableData = res.data.data.filter(
|
||||
(item) => item && item.type === 1
|
||||
);
|
||||
}
|
||||
});
|
||||
},
|
||||
getProductList(){
|
||||
this.api.website_getowpManagement().then((res) => {
|
||||
if (res.data.code == 200) {
|
||||
this.tableData1 = res.data.data;
|
||||
}
|
||||
});
|
||||
},
|
||||
// 产品详情
|
||||
openModel(item, type) {
|
||||
if (type == 0) {
|
||||
this.modelName = "添加";
|
||||
this.addModel = true;
|
||||
this.nowData = {
|
||||
detailedIntroductionEnName: "",
|
||||
detailedIntroductionEnText: '',
|
||||
detailedIntroductionImage: '',
|
||||
detailedIntroductionName: "",
|
||||
detailedIntroductionSort:'',
|
||||
detailedIntroductionText: '',
|
||||
detailedIntroductionTextContent: '',
|
||||
detailedIntroductionTextEnContent: '',
|
||||
detailedIntroductionTextEnTitle:'',
|
||||
detailedIntroductionTextTitle:'',
|
||||
productId: "",
|
||||
type: 1,
|
||||
};
|
||||
} else {
|
||||
this.modelName = "编辑";
|
||||
this.nowData = JSON.parse(JSON.stringify(item));
|
||||
this.addModel = true;
|
||||
}
|
||||
},
|
||||
// 产品列表
|
||||
openModel1(item, type) {
|
||||
if (type == 0) {
|
||||
this.modelName1 = "添加";
|
||||
this.addModel1 = true;
|
||||
this.nowData1 = {
|
||||
productDisplayEnName: "",
|
||||
productDisplayImages: "",
|
||||
productDisplayName: "",
|
||||
productDisplaySort: "",
|
||||
};
|
||||
} else {
|
||||
this.modelName1 = "编辑";
|
||||
this.nowData1 = JSON.parse(JSON.stringify(item));
|
||||
this.addModel1 = true;
|
||||
}
|
||||
},
|
||||
// 产品详情
|
||||
changeAddModel() {
|
||||
if(this.loading){
|
||||
this.$message.error("图片还未上传成功,请耐心等待。");
|
||||
return
|
||||
}
|
||||
if(!this.nowData.detailedIntroductionImage){
|
||||
this.$message.error("图片还未上传。");
|
||||
return
|
||||
}
|
||||
this.Addloading = this.$loading({
|
||||
lock: true,
|
||||
text: "加载中",
|
||||
spinner: "el-icon-loading",
|
||||
background: "rgba(0, 0, 0, 0.7)",
|
||||
});
|
||||
if (this.modelName == "编辑") {
|
||||
var data = { ...this.nowData, id: this.nowData.id.toString() };
|
||||
this.api.website_updateops(data).then((res) => {
|
||||
this.Addloading.close();
|
||||
if (res.data.code == 200) {
|
||||
this.$message.success(res.data.msg);
|
||||
this.getProduct()
|
||||
this.addModel = false;
|
||||
} else {
|
||||
this.$message.error(res.data.msg);
|
||||
this.addModel = false;
|
||||
}
|
||||
});
|
||||
} else {
|
||||
var data = { ...this.nowData };
|
||||
this.api.website_addops(data).then((res) => {
|
||||
this.Addloading.close();
|
||||
if (res.data.code == 200) {
|
||||
this.$message.success(res.data.msg);
|
||||
this.getProduct()
|
||||
this.addModel = false;
|
||||
} else {
|
||||
this.$message.error(res.data.msg);
|
||||
this.addModel = false;
|
||||
}
|
||||
});
|
||||
}
|
||||
},
|
||||
// 产品列表
|
||||
changeAddModel1() {
|
||||
if(this.loading){
|
||||
this.$message.error("图片还未上传成功,请耐心等待。");
|
||||
return
|
||||
}
|
||||
if(!this.nowData1.detailedIntroductionImage){
|
||||
this.$message.error("图片还未上传。");
|
||||
return
|
||||
}
|
||||
this.Addloading = this.$loading({
|
||||
lock: true,
|
||||
text: "加载中",
|
||||
spinner: "el-icon-loading",
|
||||
background: "rgba(0, 0, 0, 0.7)",
|
||||
});
|
||||
if (this.modelName1 == "编辑") {
|
||||
var data = { ...this.nowData1, id: this.nowData1.id.toString() };
|
||||
this.api.website_updateowp(data).then((res) => {
|
||||
this.Addloading.close();
|
||||
if (res.data.code == 200) {
|
||||
this.$message.success(res.data.msg);
|
||||
this.getProductList()
|
||||
this.addModel1 = false;
|
||||
} else {
|
||||
this.$message.error(res.data.msg);
|
||||
this.addModel1 = false;
|
||||
}
|
||||
});
|
||||
} else {
|
||||
var data = { ...this.nowData1 };
|
||||
this.api.website_addowp(data).then((res) => {
|
||||
this.Addloading.close();
|
||||
if (res.data.code == 200) {
|
||||
this.$message.success(res.data.msg);
|
||||
this.getProductList()
|
||||
this.addModel1 = false;
|
||||
} else {
|
||||
this.$message.error(res.data.msg);
|
||||
this.addModel1 = false;
|
||||
}
|
||||
});
|
||||
}
|
||||
},
|
||||
// 产品详情
|
||||
handleImageChange(event, type) {
|
||||
this.loading = true;
|
||||
if (event.target.files.length === 0) {
|
||||
// 用户点击了取消
|
||||
this.loading = false;
|
||||
return;
|
||||
}
|
||||
const file = event.target.files[0];
|
||||
|
||||
const reader = new FileReader();
|
||||
const maxSize = 2 * 1024 * 1024; // 2MB in bytes
|
||||
if (file.size > maxSize) {
|
||||
this.$message.error("图片大小不能超过2MB");
|
||||
this.$refs.fileInput.value = "";
|
||||
this.loading = false
|
||||
return;
|
||||
}
|
||||
|
||||
reader.onload = (e) => {
|
||||
const imageData = e.target.result;
|
||||
const convertedFile = new File([imageData], file.name, {
|
||||
type: file.type,
|
||||
});
|
||||
// 处理转换后的文件...
|
||||
|
||||
var data = { file: convertedFile };
|
||||
this.api.websiteUploadImage(data).then((res) => {
|
||||
this.loading = false;
|
||||
if (res.data.code == 200) {
|
||||
this.nowData.detailedIntroductionImage = res.data.msg;
|
||||
this.$refs.fileInput.value = "";
|
||||
} else {
|
||||
this.$message.error(res.data.msg);
|
||||
}
|
||||
}).catch((err) => {
|
||||
this.loading = false;
|
||||
this.$message.error("插入图片失败");
|
||||
});
|
||||
};
|
||||
reader.readAsArrayBuffer(file);
|
||||
},
|
||||
// 产品列表
|
||||
handleImageChange1(event, type) {
|
||||
this.loading = true;
|
||||
if (event.target.files.length === 0) {
|
||||
// 用户点击了取消
|
||||
this.loading = false;
|
||||
return;
|
||||
}
|
||||
const file = event.target.files[0];
|
||||
|
||||
const reader = new FileReader();
|
||||
const maxSize = 2 * 1024 * 1024; // 2MB in bytes
|
||||
if (file.size > maxSize) {
|
||||
this.$message.error("图片大小不能超过2MB");
|
||||
this.$refs.fileInput1.value = "";
|
||||
this.loading = false;
|
||||
return;
|
||||
}
|
||||
|
||||
reader.onload = (e) => {
|
||||
const imageData = e.target.result;
|
||||
const convertedFile = new File([imageData], file.name, {
|
||||
type: file.type,
|
||||
});
|
||||
// 处理转换后的文件...
|
||||
|
||||
var data = { file: convertedFile };
|
||||
this.api.websiteUploadImage(data).then((res) => {
|
||||
this.loading = false;
|
||||
if (res.data.code == 200) {
|
||||
this.nowData1.productDisplayImages = res.data.msg;
|
||||
this.$refs.fileInput1.value = "";
|
||||
} else {
|
||||
this.$message.error(res.data.msg);
|
||||
}
|
||||
}).catch((err) => {
|
||||
this.loading = false;
|
||||
this.$message.error("插入图片失败");
|
||||
});
|
||||
};
|
||||
reader.readAsArrayBuffer(file);
|
||||
},
|
||||
// 产品详情
|
||||
confirmDel(item) {
|
||||
var data = { id: item.id.toString() };
|
||||
this.api.website_delops(data).then((res) => {
|
||||
if (res.data.code == 200) {
|
||||
this.getProduct()
|
||||
this.$message.success(res.data.msg);
|
||||
} else {
|
||||
this.$message.error(res.data.msg);
|
||||
}
|
||||
});
|
||||
},
|
||||
// 产品列表
|
||||
confirmDel1(item) {
|
||||
var data = { id: item.id.toString() };
|
||||
this.api.website_delowp(data).then((res) => {
|
||||
if (res.data.code == 200) {
|
||||
this.getProductList()
|
||||
this.$message.success(res.data.msg);
|
||||
} else {
|
||||
this.$message.error(res.data.msg);
|
||||
}
|
||||
});
|
||||
},
|
||||
tableRowClassName({ row, rowIndex }) {
|
||||
if (rowIndex % 2 == 1) {
|
||||
return "warning-row";
|
||||
} else if (rowIndex % 2 == 0) {
|
||||
return "success-row";
|
||||
}
|
||||
return "";
|
||||
},
|
||||
},
|
||||
};
|
||||
</script>
|
||||
<style lang="scss"></style>
|
@ -206,10 +206,47 @@
|
||||
<img class="axis_shimen1" src="../../assets/img/axis1.png" alt="" @click="handlerAxis_5" />
|
||||
<img class="axis_shimen2" src="../../assets/img/axis1.png" alt="" @click="handlerAxis_5" />
|
||||
</div>
|
||||
<!-- 长兴前卫柑桔新优品种扩繁基地 -->
|
||||
<div class="drag_box13" ref="drag_box13" v-show="limitUserId == 13">
|
||||
<img class="drag_img" src="../../assets/img/map9.jpg" alt="" />
|
||||
<img class="axis_shimen" src="../../assets/img/axis1.png" alt="" @click="handlerAxis_5" />
|
||||
<img class="axis_shimen1" src="../../assets/img/axis1.png" alt="" @click="handlerAxis_5" />
|
||||
<img class="axis_shimen2" src="../../assets/img/axis1.png" alt="" @click="handlerAxis_5" />
|
||||
<img class="axis_shimen3" src="../../assets/img/axis1.png" alt="" @click="handlerAxis_5" />
|
||||
<img class="axis_shimen4" src="../../assets/img/axis1.png" alt="" @click="handlerAxis_5" />
|
||||
<img class="axis_shimen5" src="../../assets/img/axis1.png" alt="" @click="handlerAxis_5" />
|
||||
<img class="axis_shimen6" src="../../assets/img/axis1.png" alt="" @click="handlerAxis_5" />
|
||||
<img class="axis_shimen7" src="../../assets/img/axis1.png" alt="" @click="handlerAxis_5" />
|
||||
<img class="axis_shimen8" src="../../assets/img/axis1.png" alt="" @click="handlerAxis_5" />
|
||||
<img class="axis_shimen9" src="../../assets/img/axis1.png" alt="" @click="handlerAxis_5" />
|
||||
<img class="axis_shimen10" src="../../assets/img/axis1.png" alt="" @click="handlerAxis_5" />
|
||||
<img class="axis_shimen11" src="../../assets/img/axis1.png" alt="" @click="handlerAxis_5" />
|
||||
<img class="axis_shimen12" src="../../assets/img/axis1.png" alt="" @click="handlerAxis_5" />
|
||||
<img class="axis_shimen13" src="../../assets/img/axis1.png" alt="" @click="handlerAxis_5" />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="right">
|
||||
<div class="right" v-if="limitUserId == 13">
|
||||
<div class="e_title">虫情图片</div>
|
||||
<div class="right-image-list">
|
||||
<div
|
||||
class="image-div"
|
||||
v-for="(item, index) in imageList"
|
||||
:key="index"
|
||||
>
|
||||
<el-image :src="item.thumbnailUrl" :preview-src-list="srcList">
|
||||
<div slot="error" class="image-slot">
|
||||
<i class="el-icon-picture-outline"></i>
|
||||
</div>
|
||||
</el-image>
|
||||
<div class="image-time">{{ item.shootTime }}</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="e_title">虫情趋势图</div>
|
||||
<div class="right-charts" id="pest-charts"></div>
|
||||
</div>
|
||||
<div class="right" v-else>
|
||||
<div class="liveVideo"></div>
|
||||
|
||||
<div class="liveVideo_content" v-show="limitUserId != 12">
|
||||
@ -383,7 +420,7 @@
|
||||
</div>
|
||||
<!-- 大冶鑫 -->
|
||||
<div class="content_item"
|
||||
v-if="limitUserId == 7 || limitUserId == 9 || limitUserId == 10 || limitUserId == 11 || limitUserId == 12">
|
||||
v-if="limitUserId == 7 || limitUserId == 9 || limitUserId == 10 || limitUserId == 11 || limitUserId == 12|| limitUserId == 13">
|
||||
<div v-for="(item, index) in fiveControlList" :key="index" style="margin-bottom: 0.15rem">
|
||||
<div class="i_title" v-if="item.controlState != 0">
|
||||
<img src="../../assets/img/i_title_img.png" alt="" />
|
||||
@ -427,6 +464,10 @@ import EZUIKit from "ezuikit-js";
|
||||
import videojs from "video.js";
|
||||
import video_zhCN from "video.js/dist/lang/zh-CN.json";
|
||||
import vueSeamless from "vue-seamless-scroll";
|
||||
|
||||
import axios from "axios";
|
||||
|
||||
import { pestLine } from "@/assets/js/charts";
|
||||
export default {
|
||||
name: "largeScreen",
|
||||
components: { vueSeamless },
|
||||
@ -556,8 +597,12 @@ export default {
|
||||
},
|
||||
],
|
||||
|
||||
// 金山吕港草莓数据
|
||||
// 金山吕港草莓数据id12
|
||||
imgUrl: '',
|
||||
//长兴前卫柑桔新优品种扩繁基地id13单独虫情接口数据
|
||||
imageList: [],
|
||||
chartsData: null,
|
||||
srcList: [],
|
||||
};
|
||||
},
|
||||
beforeMount() {
|
||||
@ -653,7 +698,17 @@ export default {
|
||||
this.get_environmentData(2023120613270120);
|
||||
this.get_readControl_getState(2023120613270120);
|
||||
this.getWeatherData(2023120613270120);
|
||||
} else if (limitUserId == 8 || limitUserId == 10 || limitUserId == 11|| limitUserId == 12) {
|
||||
} else if (limitUserId == 9) {
|
||||
|
||||
// 左侧上部气象站charts
|
||||
this.get_weather_echart_data(2023120613270131);
|
||||
this.get_thisWeekTemperature_echart_data(2023120613270131);
|
||||
this.get_environmentData(2024070113400048);
|
||||
this.get_readControl_getState(2024070113400048);
|
||||
// 左侧上部气象站
|
||||
this.getWeatherData(2023120613270131);
|
||||
}else {
|
||||
// 其他非指定id都默认第一个
|
||||
// 获取控制器第一个Id
|
||||
const list = []
|
||||
this.$store.state.equipmentList.forEach((el, index) => {
|
||||
@ -685,22 +740,78 @@ export default {
|
||||
}
|
||||
})
|
||||
}
|
||||
// 长兴前卫柑桔新优品种扩繁基地 id为13 有单独的虫情接口
|
||||
if(limitUserId == 13){
|
||||
this.getImage();
|
||||
this.getCharts();
|
||||
}
|
||||
|
||||
|
||||
} else if (limitUserId == 9) {
|
||||
|
||||
// 左侧上部气象站charts
|
||||
this.get_weather_echart_data(2023120613270131);
|
||||
this.get_thisWeekTemperature_echart_data(2023120613270131);
|
||||
this.get_environmentData(2024070113400048);
|
||||
this.get_readControl_getState(2024070113400048);
|
||||
// 左侧上部气象站
|
||||
this.getWeatherData(2023120613270131);
|
||||
}
|
||||
}
|
||||
}
|
||||
});
|
||||
},
|
||||
getTimeNew() {
|
||||
// 获取当前日期(格式:YYYY-MM-DD)
|
||||
const today = new Date().toISOString().split("T")[0];
|
||||
|
||||
return today;
|
||||
},
|
||||
getTime7() {
|
||||
// 获取一周前的日期(格式:YYYY-MM-DD)
|
||||
const oneWeekAgo = new Date();
|
||||
oneWeekAgo.setDate(oneWeekAgo.getDate() - 7);
|
||||
const formattedOneWeekAgo = oneWeekAgo.toISOString().split("T")[0];
|
||||
return formattedOneWeekAgo;
|
||||
},
|
||||
// 获取图片列表
|
||||
getImage() {
|
||||
var data = {
|
||||
beginTime: this.getTime7(),
|
||||
endTime: this.getTimeNew(),
|
||||
deviceId: 613,
|
||||
pageNum: 1,
|
||||
pageSize: 4,
|
||||
};
|
||||
axios
|
||||
.post(`/api1/api/v1/getDeviceImages`, data, {
|
||||
headers: {
|
||||
//头部参数
|
||||
Authorization: localStorage.getItem("CQtoken")
|
||||
? localStorage.getItem("CQtoken")
|
||||
: "",
|
||||
},
|
||||
})
|
||||
.then((res) => {
|
||||
if (res.data.code == 200) {
|
||||
this.imageList = res.data.data.list;
|
||||
this.srcList = this.imageList.map((item) => item.imageUrl);
|
||||
}
|
||||
});
|
||||
},
|
||||
// 左下角虫情趋势图
|
||||
getCharts() {
|
||||
var data = {
|
||||
beginTime: this.getTime7(),
|
||||
endTime: this.getTimeNew(),
|
||||
deviceId: 613,
|
||||
};
|
||||
axios
|
||||
.post(`/api1/api/v1/getInsectChartData`, data, {
|
||||
headers: {
|
||||
//头部参数
|
||||
Authorization: localStorage.getItem("CQtoken")
|
||||
? localStorage.getItem("CQtoken")
|
||||
: "",
|
||||
},
|
||||
})
|
||||
.then((res) => {
|
||||
if (res.data.code == 200) {
|
||||
this.chartsData = res.data;
|
||||
pestLine("pest-charts", this.chartsData);
|
||||
}
|
||||
});
|
||||
},
|
||||
// 获取设备当天的温度
|
||||
get_weather_echart_data(deviceId) {
|
||||
this.api.Bigdata_getTemperature(deviceId).then((res1) => {
|
||||
@ -961,7 +1072,7 @@ export default {
|
||||
// id == 1 丽水;
|
||||
// id == 5 石门;
|
||||
// id == 5 大冶鑫;
|
||||
this.limitUserId = (res.data.data.filter(el => el.id == 2 || el.id == 1 || el.id == 5 || el.id == 7 || el.id == 8 || el.id == 9 || el.id == 10 || el.id == 11|| el.id == 12))[0].id;
|
||||
this.limitUserId = (res.data.data.filter(el => el.id == 2 || el.id == 1 || el.id == 5 || el.id == 7 || el.id == 8 || el.id == 9 || el.id == 10 || el.id == 11|| el.id == 12|| el.id == 13))[0].id;
|
||||
if (this.limitUserId == 1) {
|
||||
this.drag_boxHandler();
|
||||
this.dataInit(userId, this.limitUserId);
|
||||
@ -989,6 +1100,9 @@ export default {
|
||||
}else if (this.limitUserId == 12) {
|
||||
this.drag_boxHandler12();
|
||||
this.dataInit(userId, this.limitUserId);
|
||||
}else if (this.limitUserId == 13) {
|
||||
this.drag_boxHandler13();
|
||||
this.dataInit(userId, this.limitUserId);
|
||||
}
|
||||
|
||||
}
|
||||
@ -1086,7 +1200,7 @@ export default {
|
||||
this.get_readControl_getState(2023042214250070);
|
||||
} else if (this.limitUserId == 7) {
|
||||
this.get_readControl_getState(2023120613270120);
|
||||
} else if (this.limitUserId == 8 || this.limitUserId == 9 || this.limitUserId == 10 || this.limitUserId == 11|| this.limitUserId == 12) {
|
||||
} else if (this.limitUserId == 8 || this.limitUserId == 9 || this.limitUserId == 10 || this.limitUserId == 11|| this.limitUserId == 12|| this.limitUserId == 13) {
|
||||
this.get_readControl_getState(list[0].deviceId);
|
||||
}
|
||||
|
||||
@ -1226,6 +1340,63 @@ export default {
|
||||
// console.log(scale);
|
||||
}
|
||||
};
|
||||
},
|
||||
drag_boxHandler13() {
|
||||
let demo = this.$refs.drag_box13;
|
||||
demo = document.querySelector(".drag_box13"); //待拖拽元素
|
||||
let canMove = false; //拖拽状态
|
||||
let x = 0,
|
||||
y = 0; //鼠标位置
|
||||
//监听按下鼠标事件
|
||||
demo.onmousedown = function (e) {
|
||||
x = e.pageX - demo.offsetLeft;
|
||||
y = e.pageY - demo.offsetTop;
|
||||
canMove = true; //激活拖拽状态
|
||||
};
|
||||
//监听右击鼠标事件
|
||||
demo.oncontextmenu = function (e) {
|
||||
e.preventDefault(); //阻止默认行为
|
||||
};
|
||||
//监听鼠标抬起事件
|
||||
window.onmouseup = function () {
|
||||
canMove = false; //关闭拖拽状态
|
||||
};
|
||||
|
||||
window.onblur = function () {
|
||||
//窗口失去焦点事件
|
||||
canMove = false; //关闭拖拽状态
|
||||
};
|
||||
|
||||
//监听鼠标移动事件
|
||||
window.onmousemove = function (e) {
|
||||
e.preventDefault(); //阻止默认行为(字不能拖走)
|
||||
if (canMove) {
|
||||
//对范围判断
|
||||
let left = e.pageX - x;
|
||||
let top = e.pageY - y;
|
||||
|
||||
demo.style.left = left + "px";
|
||||
demo.style.top = top + "px";
|
||||
}
|
||||
};
|
||||
let scale = 1;
|
||||
demo.onwheel = function (e) {
|
||||
if (e.wheelDelta > 0) {
|
||||
scale += 0.05;
|
||||
if (scale > 4) {
|
||||
scale = 4;
|
||||
}
|
||||
demo.style.transform = `scale(${scale})`;
|
||||
// console.log(scale);
|
||||
} else {
|
||||
scale -= 0.05;
|
||||
if (scale < 1) {
|
||||
scale = 1;
|
||||
}
|
||||
demo.style.transform = `scale(${scale})`;
|
||||
// console.log(scale);
|
||||
}
|
||||
};
|
||||
},
|
||||
drag_boxHandler12() {
|
||||
let demo = this.$refs.drag_box12;
|
||||
@ -1883,6 +2054,20 @@ export default {
|
||||
justify-content: space-between;
|
||||
box-sizing: border-box;
|
||||
padding: 0 0.66rem;
|
||||
|
||||
.e_title {
|
||||
width: 3.98rem;
|
||||
height: 0.19rem;
|
||||
background: url("../../assets/img/environmentData_bg.png") center no-repeat;
|
||||
background-size: 100% 100%;
|
||||
font-size: 0.18rem;
|
||||
font-family: AlibabaPuHuiTiM;
|
||||
font-weight: 500;
|
||||
color: #83ccff;
|
||||
box-sizing: border-box;
|
||||
padding-left: 0.32rem;
|
||||
line-height: 0.19rem;
|
||||
}
|
||||
|
||||
.left {
|
||||
width: 4rem;
|
||||
@ -1962,20 +2147,6 @@ export default {
|
||||
height: calc((100% - 4.04rem) / 2);
|
||||
}
|
||||
|
||||
.e_title {
|
||||
width: 3.98rem;
|
||||
height: 0.19rem;
|
||||
background: url("../../assets/img/environmentData_bg.png") center no-repeat;
|
||||
background-size: 100% 100%;
|
||||
font-size: 0.18rem;
|
||||
font-family: AlibabaPuHuiTiM;
|
||||
font-weight: 500;
|
||||
color: #83ccff;
|
||||
box-sizing: border-box;
|
||||
padding-left: 0.32rem;
|
||||
line-height: 0.19rem;
|
||||
}
|
||||
|
||||
.environmentData {
|
||||
width: 3.98rem;
|
||||
height: 3.27rem;
|
||||
@ -2283,6 +2454,154 @@ export default {
|
||||
cursor: pointer;
|
||||
}
|
||||
}
|
||||
.drag_box13{
|
||||
width: 100%;
|
||||
height: auto;
|
||||
position: absolute;
|
||||
// top: 0.3rem;
|
||||
// left: 0.5rem;
|
||||
z-index: 10;
|
||||
top: -64px;
|
||||
-webkit-mask-image: linear-gradient(90deg,
|
||||
transparent 0%,
|
||||
blue 2%,
|
||||
blue 97%,
|
||||
transparent 99%);
|
||||
.drag_img {
|
||||
width: 100%;
|
||||
height: auto;
|
||||
-webkit-mask-image: linear-gradient(transparent 0%,
|
||||
blue 13%,
|
||||
blue 73%,
|
||||
transparent 97%);
|
||||
}
|
||||
.axis_shimen {
|
||||
width: 0.3rem;
|
||||
height: auto;
|
||||
position: absolute;
|
||||
top: 13%;
|
||||
left:43.5%;
|
||||
z-index: 99;
|
||||
cursor: pointer;
|
||||
}
|
||||
.axis_shimen1 {
|
||||
width: 0.3rem;
|
||||
height: auto;
|
||||
position: absolute;
|
||||
top: 15%;
|
||||
left:34.5%;
|
||||
z-index: 99;
|
||||
cursor: pointer;
|
||||
}
|
||||
.axis_shimen2 {
|
||||
width: 0.3rem;
|
||||
height: auto;
|
||||
position: absolute;
|
||||
top: 16%;
|
||||
left:26%;
|
||||
z-index: 99;
|
||||
cursor: pointer;
|
||||
}
|
||||
.axis_shimen3 {
|
||||
width: 0.3rem;
|
||||
height: auto;
|
||||
position: absolute;
|
||||
top: 28%;
|
||||
left:35%;
|
||||
z-index: 99;
|
||||
cursor: pointer;
|
||||
}
|
||||
.axis_shimen4 {
|
||||
width: 0.3rem;
|
||||
height: auto;
|
||||
position: absolute;
|
||||
top: 29%;
|
||||
left:27%;
|
||||
z-index: 99;
|
||||
cursor: pointer;
|
||||
}
|
||||
.axis_shimen5 {
|
||||
width: 0.3rem;
|
||||
height: auto;
|
||||
position: absolute;
|
||||
top: 43%;
|
||||
left:38.5%;
|
||||
z-index: 99;
|
||||
cursor: pointer;
|
||||
}
|
||||
.axis_shimen6 {
|
||||
width: 0.3rem;
|
||||
height: auto;
|
||||
position: absolute;
|
||||
top: 44%;
|
||||
left:30.5%;
|
||||
z-index: 99;
|
||||
cursor: pointer;
|
||||
}
|
||||
.axis_shimen7 {
|
||||
width: 0.3rem;
|
||||
height: auto;
|
||||
position: absolute;
|
||||
top: 56%;
|
||||
left:57%;
|
||||
z-index: 99;
|
||||
cursor: pointer;
|
||||
}
|
||||
.axis_shimen8 {
|
||||
width: 0.3rem;
|
||||
height: auto;
|
||||
position: absolute;
|
||||
top: 49%;
|
||||
left:58%;
|
||||
z-index: 99;
|
||||
cursor: pointer;
|
||||
}
|
||||
.axis_shimen9 {
|
||||
width: 0.3rem;
|
||||
height: auto;
|
||||
position: absolute;
|
||||
top: 42%;
|
||||
left:59%;
|
||||
z-index: 99;
|
||||
cursor: pointer;
|
||||
}
|
||||
.axis_shimen10 {
|
||||
width: 0.3rem;
|
||||
height: auto;
|
||||
position: absolute;
|
||||
top: 35%;
|
||||
left:60%;
|
||||
z-index: 99;
|
||||
cursor: pointer;
|
||||
}
|
||||
.axis_shimen11 {
|
||||
width: 0.3rem;
|
||||
height: auto;
|
||||
position: absolute;
|
||||
top: 27%;
|
||||
left:61%;
|
||||
z-index: 99;
|
||||
cursor: pointer;
|
||||
}
|
||||
.axis_shimen12 {
|
||||
width: 0.3rem;
|
||||
height: auto;
|
||||
position: absolute;
|
||||
top: 69%;
|
||||
left:70%;
|
||||
z-index: 99;
|
||||
cursor: pointer;
|
||||
}
|
||||
.axis_shimen13 {
|
||||
width: 0.3rem;
|
||||
height: auto;
|
||||
position: absolute;
|
||||
top: 77%;
|
||||
left:70%;
|
||||
z-index: 99;
|
||||
cursor: pointer;
|
||||
}
|
||||
}
|
||||
.drag_box12 {
|
||||
width: 100%;
|
||||
height: auto;
|
||||
@ -2800,7 +3119,21 @@ export default {
|
||||
top: 0.56rem;
|
||||
right: 0.66rem;
|
||||
z-index: 999;
|
||||
|
||||
.right-image-list{
|
||||
padding: 20px 0;
|
||||
display: grid;
|
||||
grid-template-columns: repeat(2, 1fr);
|
||||
grid-row-gap: 10px; //纵向间隔
|
||||
grid-column-gap: 10px; //横向间隔
|
||||
.image-time{
|
||||
text-align: center;
|
||||
color: #fff;
|
||||
}
|
||||
}
|
||||
.right-image-list,.right-charts{
|
||||
width: 100%;
|
||||
height: calc((100% - .38rem) / 2);
|
||||
}
|
||||
.liveVideo {
|
||||
width: 4rem;
|
||||
height: 0.43rem;
|
||||
|
@ -40,12 +40,21 @@ module.exports = {
|
||||
devServer: {
|
||||
// https:true,
|
||||
proxy: {
|
||||
"/api": {
|
||||
"/jiaxing": {
|
||||
target: 'https://api.lihe-control.com', //地址
|
||||
// target: 'http://jiaxingtest.a1.luyouxia.net:21114', //地址
|
||||
//target: 'http://jiaxingtest.a1.luyouxia.net:25762', //地址
|
||||
|
||||
changeOrigin: true,
|
||||
pathRewrite: {
|
||||
"^/api": "",
|
||||
"^/jiaxing": "",
|
||||
},
|
||||
},
|
||||
"/api1": {
|
||||
target: 'https://zdny.zznongyeyiqi.com', //地址
|
||||
changeOrigin: true,
|
||||
pathRewrite: {
|
||||
"^/api1": "",
|
||||
},
|
||||
},
|
||||
},
|
||||
|