xiaomeng/wszhyWx
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

pc-master #248

Merged
xiaomeng merged 13 commits from pc-master into portal 2025-06-05 06:15:28 +00:00
Conversation 0 Commits 13 Files Changed 31 +5502 -1369
31 changed files with 5502 additions and 1369 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

812
package-lock.json generated
View File

File diff suppressed because it is too large Load Diff

5
package.json
View File

@ -7,6 +7,7 @@
"build": "vue-cli-service build" "build": "vue-cli-service build"
}, },
"dependencies": { "dependencies": {
"@wangeditor/editor-for-vue": "^1.0.2",
"axios": "^1.5.0", "axios": "^1.5.0",
"core-js": "^3.8.3", "core-js": "^3.8.3",
"echarts": "^5.4.3", "echarts": "^5.4.3",
@ -21,8 +22,8 @@
"vue": "^2.7.14", "vue": "^2.7.14",
"vue-router": "^3.5.1", "vue-router": "^3.5.1",
"vue-seamless-scroll": "^1.1.23", "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": { "devDependencies": {
"@vue/cli-plugin-babel": "~5.0.0", "@vue/cli-plugin-babel": "~5.0.0",

9
src/App.vue
View File

@ -55,7 +55,7 @@ selectValue(e) {
box-sizing: border-box; box-sizing: border-box;
font-family: Microsoft YaHei; font-family: Microsoft YaHei;
font-weight: 400; font-weight: 400;
color: #fff; // color: #fff;
} }
input::-webkit-outer-spin-button, 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%); 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-50 {
.input-title { .input-title {
font-size: 16px; font-size: 16px;

399
src/api/index.js
View File

@ -1,29 +1,29 @@
import axios from "axios"; import axios from "axios";
// import qs from 'qs' // import qs from `qs`
import router from '../router/index' import router from "../router/index"
function sendGetRequest(url, data) { function sendGetRequest(url, data) {
return new Promise(function (resolve, reject) { return new Promise(function (resolve, reject) {
axios.get(url, { axios.get(url, {
headers: { //头部参数 headers: { //头部参数
// 'Content-Type': 'application/json; charset=utf-8', // `Content-Type`: `application/json; charset=utf-8`,
// "Access-Control-Allow-Origin": "*", // `Access-Control-Allow-Origin`: `*`,
// "Access-Control-Allow-Headers": "Origin, X-Requested-With, Content-Type, Accept", // `Access-Control-Allow-Headers`: `Origin, X-Requested-With, Content-Type, Accept`,
'token': (localStorage.getItem('token') ? localStorage.getItem('token') : '') "token": (localStorage.getItem(`token`) ? localStorage.getItem(`token`) : ``)
}, },
params: data params: data
}) })
.then(function (res) { //请求成功，response接收返回参数 .then(function (res) { //请求成功，response接收返回参数
if (res.data.code == 401) { if (res.data.code == 401) {
localStorage.removeItem('token') localStorage.removeItem(`token`)
if(router.currentRoute.name!='login'){ if(router.currentRoute.name!=`login`){
router.push({ router.push({
name: 'login' name: `login`
}) })
} }
// router.push({ // router.push({
// name: 'login' // name: `login`
// }) // })
} }
resolve(res); resolve(res);
@ -34,6 +34,7 @@ function sendGetRequest(url, data) {
}) })
}); });
} }
function sendUploadRequest(url, data) { function sendUploadRequest(url, data) {
// 一个状态为resolve（包裹的是数据） // 一个状态为resolve（包裹的是数据）
// 或者状态为reject （包裹的是错误信息） // 或者状态为reject （包裹的是错误信息）
@ -41,17 +42,17 @@ function sendUploadRequest(url, data) {
return new Promise(function (resolve, reject) { return new Promise(function (resolve, reject) {
axios.post(url, data, { axios.post(url, data, {
headers: { headers: {
'Content-Type': 'multipart/form-data', "Content-Type": `multipart/form-data`,
// 'Content-Type': 'application/json; charset=utf-8', // `Content-Type`: `application/json; charset=utf-8`,
'token': (localStorage.getItem('token') ? localStorage.getItem('token') : '') "token": (localStorage.getItem(`token`) ? localStorage.getItem(`token`) : ``)
} }
}).then( }).then(
(res) => { (res) => {
if (res.data.code == 401) { if (res.data.code == 401) {
localStorage.removeItem('token') localStorage.removeItem(`token`)
if(router.currentRoute.name!='login'){ if(router.currentRoute.name!=`login`){
router.push({ router.push({
name: 'login' name: `login`
}) })
} }
} }
@ -71,16 +72,16 @@ function sendPostRequest(url, data) {
return new Promise(function (resolve, reject) { return new Promise(function (resolve, reject) {
axios.post(url, data, { axios.post(url, data, {
headers: { headers: {
// 'Content-Type': 'application/json; charset=utf-8', // `Content-Type`: `application/json; charset=utf-8`,
'token': (localStorage.getItem('token') ? localStorage.getItem('token') : '') "token": (localStorage.getItem(`token`) ? localStorage.getItem(`token`) : ``)
} }
}).then( }).then(
(res) => { (res) => {
if (res.data.code == 401) { if (res.data.code == 401) {
localStorage.removeItem('token') localStorage.removeItem(`token`)
if(router.currentRoute.name!='login'){ if(router.currentRoute.name!=`login`){
router.push({ router.push({
name: 'login' name: `login`
}) })
} }
} }
@ -100,19 +101,19 @@ function sendDelRequest(url, data) {
return new Promise(function (resolve, reject) { return new Promise(function (resolve, reject) {
axios.delete(url, { axios.delete(url, {
headers: { //头部参数 headers: { //头部参数
// 'Content-Type': 'application/json; charset=utf-8', // `Content-Type`: `application/json; charset=utf-8`,
// "Access-Control-Allow-Origin": "*", // `Access-Control-Allow-Origin`: `*`,
// "Access-Control-Allow-Headers": "Origin, X-Requested-With, Content-Type, Accept", // `Access-Control-Allow-Headers`: `Origin, X-Requested-With, Content-Type, Accept`,
'token': (localStorage.getItem('token') ? localStorage.getItem('token') : '') "token": (localStorage.getItem(`token`) ? localStorage.getItem(`token`) : ``)
}, },
params: data params: data
}).then( }).then(
(res) => { (res) => {
if (res.data.code == 401) { if (res.data.code == 401) {
localStorage.removeItem('token') localStorage.removeItem(`token`)
if(router.currentRoute.name!='login'){ if(router.currentRoute.name!=`login`){
router.push({ router.push({
name: 'login' name: `login`
}) })
} }
} }
@ -131,16 +132,16 @@ function sendPutRequest(url, data) {
return new Promise(function (resolve, reject) { return new Promise(function (resolve, reject) {
axios.put(url, data, { axios.put(url, data, {
headers: { headers: {
// 'Content-Type': 'application/json; charset=utf-8', // `Content-Type`: `application/json; charset=utf-8`,
'token': (localStorage.getItem('token') ? localStorage.getItem('token') : '') "token": (localStorage.getItem(`token`) ? localStorage.getItem(`token`) : ``)
} }
}).then( }).then(
(res) => { (res) => {
if (res.data.code == 401) { if (res.data.code == 401) {
localStorage.removeItem('token') localStorage.removeItem(`token`)
if(router.currentRoute.name!='login'){ if(router.currentRoute.name!=`login`){
router.push({ 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秒 axios.defaults.timeout = 30000; // 设置全局默认请求超时时间为10秒
@ -162,520 +163,520 @@ axios.defaults.timeout = 30000; // 设置全局默认请求超时时间为10秒
export default { export default {
//防止没有一个post/get会报错 写一个默认的 //防止没有一个post/get会报错 写一个默认的
get(data) { get(data) {
return sendGetRequest("", data); return sendGetRequest(`/jiaxing`, data);
}, },
post(data) { post(data) {
return sendPostRequest("", data); return sendPostRequest(`/jiaxing`, data);
}, },
delete(data) { delete(data) {
return sendDelRequest("", data); return sendDelRequest(`/jiaxing`, data);
}, },
put(data) { put(data) {
return sendPutRequest("", data); return sendPutRequest(`/jiaxing`, data);
}, },
//接口开始() //接口开始()
//登录 //登录
login(data) { login(data) {
return sendPostRequest("/user/login", data); return sendPostRequest(`/jiaxing/user/login`, data);
}, },
loginOut(data) { loginOut(data) {
return sendGetRequest("/user/logout", data); return sendGetRequest(`/jiaxing/user/logout`, data);
}, },
//管理员根据设备id查询设备信息 //管理员根据设备id查询设备信息
getSeldevicebyid(data) { getSeldevicebyid(data) {
return sendGetRequest("/admin/seldevicebyid", data); return sendGetRequest(`/jiaxing/admin/seldevicebyid`, data);
}, },
//根据用户id查询对应的设备数据 //根据用户id查询对应的设备数据
getEqbyid(data) { getEqbyid(data) {
return sendGetRequest("/sel/eqbyid/" + data, ''); return sendGetRequest(`/jiaxing/sel/eqbyid/` + data, ``);
}, },
//气象站显示 //气象站显示
geteqetdata(data) { geteqetdata(data) {
return sendGetRequest(`/getcontrol/geteqetdata?userId=`+data ,"") return sendGetRequest(`/jiaxing/getcontrol/geteqetdata?userId=`+data ,``)
}, },
// 数据采集器的实时数据 // 数据采集器的实时数据
getdataRtdata(data) { getdataRtdata(data) {
return sendGetRequest(`/getdata/rtdata?deviceId=` + data, '') return sendGetRequest(`/jiaxing/getdata/rtdata?deviceId=` + data, ``)
}, },
//测试施肥机读取设备状态信息 //读取数据 根据文档编号读取 所有数据展示都出自这个接口 //测试施肥机读取设备状态信息 //读取数据 根据文档编号读取 所有数据展示都出自这个接口
postReg(data) { postReg(data) {
return sendPostRequest("/readFs/reg", data); return sendPostRequest(`/jiaxing/readFs/reg`, data);
}, },
//测试施肥机读取设备状态信息 //读取数据 根据文档编号读取 所有数据展示都出自这个接口 //测试施肥机读取设备状态信息 //读取数据 根据文档编号读取 所有数据展示都出自这个接口
postState(data) { postState(data) {
return sendPostRequest("/readFs/state", data); return sendPostRequest(`/jiaxing/readFs/state`, data);
}, },
//测试施肥机写入数据信息 //修改数据 根据文档编号修改 所有数据修改都出自这个接口 //测试施肥机写入数据信息 //修改数据 根据文档编号修改 所有数据修改都出自这个接口
postWriteFs(data) { postWriteFs(data) {
return sendPostRequest("/writeFs", data); return sendPostRequest(`/jiaxing/writeFs`, data);
}, },
getByid(data) { getByid(data) {
return sendGetRequest("/readFs/byid", data); return sendGetRequest(`/jiaxing/readFs/byid`, data);
}, },
//获取实时数据 //获取实时数据
postRtdata(data) { postRtdata(data) {
return sendPostRequest("/getFs/rtdata?equipmentId=" + data, ''); return sendPostRequest(`/jiaxing/getFs/rtdata?equipmentId=` + data, ``);
}, },
//获取实时数据 //获取实时数据
postFsdata(data) { postFsdata(data) {
return sendPostRequest("/chart/fsdata?equipmentId=" + data, ''); return sendPostRequest(`/jiaxing/chart/fsdata?equipmentId=` + data, ``);
}, },
//获取监控地址 //获取监控地址
getGethls(data) { getGethls(data) {
return sendGetRequest("/camera/gethls", data); return sendGetRequest(`/jiaxing/camera/gethls`, data);
}, },
//根据ID查询用户信息 //根据ID查询用户信息
getUser(data) { getUser(data) {
return sendGetRequest('/api/sel/user', data) return sendGetRequest(`/jiaxing/api/sel/user`, data)
}, },
//控制器接口 //控制器接口
//控制器实时数据 //控制器实时数据
getControlRtdata(data) { getControlRtdata(data) {
return sendPostRequest("/getcontrol/rtdata?equipmentId=" + data, ''); return sendPostRequest(`/jiaxing/getcontrol/rtdata?equipmentId=` + data, ``);
}, },
//控制器实时数据折线图 //控制器实时数据折线图
getControlFsdata(data) { getControlFsdata(data) {
return sendPostRequest("/getcontrol/fsdata?equipmentId=" + data, ''); return sendPostRequest(`/jiaxing/getcontrol/fsdata?equipmentId=` + data, ``);
}, },
//控制器数据上传数据获取 //控制器数据上传数据获取
getControldataUpload(data) { getControldataUpload(data) {
return sendGetRequest('/readControl/dataUpload', data) return sendGetRequest(`/jiaxing/readControl/dataUpload`, data)
}, },
//控制器写入数据 //控制器写入数据
postControlWrite(data) { postControlWrite(data) {
return sendPostRequest("/writeJinHuaControl/write", data); return sendPostRequest(`/jiaxing/writeJinHuaControl/write`, data);
}, },
//控制器传感器通道 //控制器传感器通道
getReadControlSensorChannel(data) { getReadControlSensorChannel(data) {
return sendGetRequest('/readControl/sensorChannel', data) return sendGetRequest(`/jiaxing/readControl/sensorChannel`, data)
}, },
//控制器 顶模和风机 //控制器 顶模和风机
getReadControlliShuiControl(data) { getReadControlliShuiControl(data) {
return sendGetRequest('/readControl/liShuiControl', data) return sendGetRequest(`/jiaxing/readControl/liShuiControl`, data)
}, },
//控制器 传感器输入合成 //控制器 传感器输入合成
getReadControlSensorInputSynthesis(data) { getReadControlSensorInputSynthesis(data) {
return sendGetRequest('/readControl/sensorInputSynthesis', data) return sendGetRequest(`/jiaxing/readControl/sensorInputSynthesis`, data)
}, },
//控制器 主页查看控制器气象站实时数据 //控制器 主页查看控制器气象站实时数据
getControlRtDatastation(data) { getControlRtDatastation(data) {
return sendGetRequest('/getcontrol/rtDatastation', data) return sendGetRequest(`/jiaxing/getcontrol/rtDatastation`, data)
}, },
//控制器 设备运行状态 //控制器 设备运行状态
getControlGetState(data) { getControlGetState(data) {
return sendGetRequest('/readControl/getState', data) return sendGetRequest(`/jiaxing/readControl/getState`, data)
}, },
//控制器 气象站实时数据折线图 //控制器 气象站实时数据折线图
getControlChartdata(data) { getControlChartdata(data) {
return sendPostRequest('/equip/chartdata?equipmentId=' + data, '') return sendPostRequest(`/jiaxing/equip/chartdata?equipmentId=` + data, ``)
}, },
//首页历史数据/数据分析弹窗 //首页历史数据/数据分析弹窗
selFsAvgdata(data) { selFsAvgdata(data) {
return sendPostRequest('/selFs/avgdata',data) return sendPostRequest(`/jiaxing/selFs/avgdata`,data)
}, },
//首页历史数据/数据分析弹窗下载数据 //首页历史数据/数据分析弹窗下载数据
selFsAvgdatadownload(data) { selFsAvgdatadownload(data) {
return sendPostRequest('/selFs/avgdatadownload',data) return sendPostRequest(`/jiaxing/selFs/avgdatadownload`,data)
}, },
// 根据用户id查询对应的设备大数据信息 // 根据用户id查询对应的设备大数据信息
Bigdata_getAllControl(userid, data) { Bigdata_getAllControl(userid, data) {
return sendGetRequest(`/Bigdata/getAllControl?userid=${userid}`, data); return sendGetRequest(`/jiaxing/Bigdata/getAllControl?userid=${userid}`, data);
}, },
// 获取设备当天的温度 // 获取设备当天的温度
Bigdata_getTemperature(deviceid, data) { Bigdata_getTemperature(deviceid, data) {
return sendGetRequest(`/Bigdata/getTemperature?deviceid=${deviceid}`, data); return sendGetRequest(`/jiaxing/Bigdata/getTemperature?deviceid=${deviceid}`, data);
}, },
// 获取设备一周的温度 // 获取设备一周的温度
Bigdata_getWeekTemperature(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) { getcontrol_rtdata(equipmentId, data) {
return sendPostRequest(`/getcontrol/rtdata?equipmentId=${equipmentId}`, data); return sendPostRequest(`/jiaxing/getcontrol/rtdata?equipmentId=${equipmentId}`, data);
}, },
// 获取摄像头得地址 Copy // 获取摄像头得地址 Copy
camera_gethls(cameraid, channelid, data) { 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 // 根据用户id查询对应的设备数据 Copy
sel_eqbyid(userId, data) { sel_eqbyid(userId, data) {
return sendGetRequest(`/sel/eqbyid/${userId}`, data); return sendGetRequest(`/jiaxing/sel/eqbyid/${userId}`, data);
}, },
// 控制器状态值获取 Copy // 控制器状态值获取 Copy
readControl_getState(deviceId, data) { readControl_getState(deviceId, data) {
return sendGetRequest(`/readControl/getState?deviceId=${deviceId}`, data); return sendGetRequest(`/jiaxing/readControl/getState?deviceId=${deviceId}`, data);
}, },
getcontrol_rtDatastation(equipmentId, data) { getcontrol_rtDatastation(equipmentId, data) {
return sendGetRequest(`/getcontrol/rtDatastation?equipmentId=${equipmentId}`, data) return sendGetRequest(`/jiaxing/getcontrol/rtDatastation?equipmentId=${equipmentId}`, data)
}, },
//控制器根据设备查看权限 //控制器根据设备查看权限
getcontrol_cpermission(equipmentId, data) { getcontrol_cpermission(equipmentId, data) {
return sendPostRequest(`/getcontrol/cpermission?deviceId=${equipmentId}`, data) return sendPostRequest(`/jiaxing/getcontrol/cpermission?deviceId=${equipmentId}`, data)
}, },
//控制器五防接口 //控制器五防接口
readControl_fiveControl(data) { readControl_fiveControl(data) {
return sendGetRequest(`/readControl/fiveControl`, data); return sendGetRequest(`/jiaxing/readControl/fiveControl`, data);
}, },
// 查看用户额外权限 // 查看用户额外权限
user_getjurisdiction(userId, data) { user_getjurisdiction(userId, data) {
return sendGetRequest(`/user/getjurisdiction?userId=${userId}`, data) return sendGetRequest(`/jiaxing/user/getjurisdiction?userId=${userId}`, data)
}, },
//实时数据页面状态值(查看全部设备) //实时数据页面状态值(查看全部设备)
getStatePermissionStatus(data) { getStatePermissionStatus(data) {
return sendGetRequest(`/getcontrol/getStatePermissionStatus`, data) return sendGetRequest(`/jiaxing/getcontrol/getStatePermissionStatus`, data)
}, },
//获取当前权限能看到的设备 //获取当前权限能看到的设备
getPermissionStatus(data) { getPermissionStatus(data) {
return sendGetRequest(`/getcontrol/getPermissionStatus`, data) return sendGetRequest(`/jiaxing/getcontrol/getPermissionStatus`, data)
}, },
//根据id删除status设备 //根据id删除status设备
delPermissionStatus(id1, id2) { delPermissionStatus(id1, id2) {
return sendPostRequest(`/getcontrol/delPermissionStatus?deviceId=${id1}&permissionid=${id2}`, '') return sendPostRequest(`/jiaxing/getcontrol/delPermissionStatus?deviceId=${id1}&permissionid=${id2}`, ``)
}, },
//根据id添加status设备 //根据id添加status设备
addPermissionStatus(id1, id2) { addPermissionStatus(id1, id2) {
return sendPostRequest(`/getcontrol/addStatepermission?deviceId=${id1}&Permissionid=${id2}`, '') return sendPostRequest(`/jiaxing/getcontrol/addStatepermission?deviceId=${id1}&Permissionid=${id2}`, ``)
}, },
//添加短信报警 //添加短信报警
addWarnMessage(data) { addWarnMessage(data) {
return sendPostRequest(`/shortMessage/setMessage`, data) return sendPostRequest(`/jiaxing/shortMessage/setMessage`, data)
}, },
//短信报警填写条件 //短信报警填写条件
selnowmes(data) { selnowmes(data) {
return sendGetRequest(`/shortMessage/selnowmes`, data) return sendGetRequest(`/jiaxing/shortMessage/selnowmes`, data)
}, },
//根据设备id查看短信报警 //根据设备id查看短信报警
messageList(data) { messageList(data) {
return sendGetRequest(`/shortMessage/selMesById`, data) return sendGetRequest(`/jiaxing/shortMessage/selMesById`, data)
}, },
//根据id删除短信报警 //根据id删除短信报警
delMessage(data) { delMessage(data) {
return sendDelRequest(`/shortMessage/delmesbyid`, data) return sendDelRequest(`/jiaxing/shortMessage/delmesbyid`, data)
}, },
//控制器新页面接口 //控制器新页面接口
//目标值 目标温度/湿度/co2 //目标值 目标温度/湿度/co2
targetValue(data) { targetValue(data) {
return sendGetRequest(`/readControl/targetValue`, data) return sendGetRequest(`/jiaxing/readControl/targetValue`, data)
}, },
//电磁阀1 //电磁阀1
solenoidValve1(data) { solenoidValve1(data) {
return sendGetRequest(`/readControl/solenoidValve1`, data) return sendGetRequest(`/jiaxing/readControl/solenoidValve1`, data)
}, },
//电磁阀2 //电磁阀2
solenoidValve2(data) { solenoidValve2(data) {
return sendGetRequest(`/readControl/solenoidValve2`, data) return sendGetRequest(`/jiaxing/readControl/solenoidValve2`, data)
}, },
//电磁阀3 //电磁阀3
solenoidValve3(data) { solenoidValve3(data) {
return sendGetRequest(`/readControl/solenoidValve3`, data) return sendGetRequest(`/jiaxing/readControl/solenoidValve3`, data)
}, },
//电磁阀4 //电磁阀4
solenoidValve4(data) { solenoidValve4(data) {
return sendGetRequest(`/readControl/solenoidValve4`, data) return sendGetRequest(`/jiaxing/readControl/solenoidValve4`, data)
}, },
//电磁阀5 //电磁阀5
solenoidValve5(data) { solenoidValve5(data) {
return sendGetRequest(`/readControl/solenoidValve5`, data) return sendGetRequest(`/jiaxing/readControl/solenoidValve5`, data)
}, },
//电磁阀6 //电磁阀6
solenoidValve6(data) { solenoidValve6(data) {
return sendGetRequest(`/readControl/solenoidValve6`, data) return sendGetRequest(`/jiaxing/readControl/solenoidValve6`, data)
}, },
//电磁阀7 //电磁阀7
solenoidValve7(data) { solenoidValve7(data) {
return sendGetRequest(`/readControl/solenoidValve7`, data) return sendGetRequest(`/jiaxing/readControl/solenoidValve7`, data)
}, },
//电磁阀8 //电磁阀8
solenoidValve8(data) { solenoidValve8(data) {
return sendGetRequest(`/readControl/solenoidValve8`, data) return sendGetRequest(`/jiaxing/readControl/solenoidValve8`, data)
}, },
//强制通道输出 //强制通道输出
forceChannelOutput(data) { forceChannelOutput(data) {
return sendGetRequest(`/readControl/forceChannelOutput`, data) return sendGetRequest(`/jiaxing/readControl/forceChannelOutput`, data)
}, },
//天窗 //天窗
readskylight(data) { readskylight(data) {
return sendGetRequest(`/readControl/readskylight`, data) return sendGetRequest(`/jiaxing/readControl/readskylight`, data)
}, },
//空调 //空调
airconditioner(data) { airconditioner(data) {
return sendGetRequest(`/readControl/airconditioner`, data) return sendGetRequest(`/jiaxing/readControl/airconditioner`, data)
}, },
//固有参数 //固有参数
intrinsicParameter(data) { intrinsicParameter(data) {
return sendGetRequest(`/readControl/intrinsicParameter`, data) return sendGetRequest(`/jiaxing/readControl/intrinsicParameter`, data)
}, },
//厂家内部参数 //厂家内部参数
manufacturerparameter(data) { manufacturerparameter(data) {
return sendGetRequest(`/readControl/manufacturerparameter`, data) return sendGetRequest(`/jiaxing/readControl/manufacturerparameter`, data)
}, },
//高压微雾 //高压微雾
highpressuremist(data) { highpressuremist(data) {
return sendGetRequest(`/readControl/highpressuremist`, data) return sendGetRequest(`/jiaxing/readControl/highpressuremist`, data)
}, },
//内遮阳 //内遮阳
innercurtain(data) { innercurtain(data) {
return sendGetRequest(`/readControl/innercurtain`, data) return sendGetRequest(`/jiaxing/readControl/innercurtain`, data)
}, },
//外遮阳 //外遮阳
externalsunshade(data) { externalsunshade(data) {
return sendGetRequest(`/readControl/externalsunshade`, data) return sendGetRequest(`/jiaxing/readControl/externalsunshade`, data)
}, },
//风机湿帘 //风机湿帘
fanwetcurtain(data) { fanwetcurtain(data) {
return sendGetRequest(`/readControl/fanwetcurtain`, data) return sendGetRequest(`/jiaxing/readControl/fanwetcurtain`, data)
}, },
//补光灯 //补光灯
readfilllight(data) { readfilllight(data) {
return sendGetRequest(`/readControl/readfilllight`, data) return sendGetRequest(`/jiaxing/readControl/readfilllight`, data)
}, },
//CO2补气 //CO2补气
co2replenishment(data) { co2replenishment(data) {
return sendGetRequest(`/readControl/co2replenishment`, data) return sendGetRequest(`/jiaxing/readControl/co2replenishment`, data)
}, },
//冷暖风机 //冷暖风机
heatfan(data) { heatfan(data) {
return sendGetRequest(`/readControl/heatfan`, data) return sendGetRequest(`/jiaxing/readControl/heatfan`, data)
}, },
//内保温 //内保温
interiorthermalinsulation(data) { interiorthermalinsulation(data) {
return sendGetRequest(`/readControl/interiorthermalinsulation`, data) return sendGetRequest(`/jiaxing/readControl/interiorthermalinsulation`, data)
}, },
//立面保温 //立面保温
facadeinsulation(data) { facadeinsulation(data) {
return sendGetRequest(`/readControl/facadeinsulation`, data) return sendGetRequest(`/jiaxing/readControl/facadeinsulation`, data)
}, },
//环流风扇 //环流风扇
readcirculationfan(data) { readcirculationfan(data) {
return sendGetRequest(`/readControl/readcirculationfan`, data) return sendGetRequest(`/jiaxing/readControl/readcirculationfan`, data)
}, },
//报警设置 //报警设置
readalarmSetting(data) { readalarmSetting(data) {
return sendGetRequest(`/readControl/alarmSetting`, data) return sendGetRequest(`/jiaxing/readControl/alarmSetting`, data)
}, },
//报警设置 //报警设置
readalarmSetting(data) { readalarmSetting(data) {
return sendGetRequest(`/readControl/alarmSetting`, data) return sendGetRequest(`/jiaxing/readControl/alarmSetting`, data)
}, },
//主页查看施肥机历史数据 //主页查看施肥机历史数据
selFsTime(data) { selFsTime(data) {
return sendPostRequest(`/selFs/time`, data) return sendPostRequest(`/jiaxing/selFs/time`, data)
}, },
//主页查看施肥机历史数据 //主页查看施肥机历史数据
loadHistorydata(data) { loadHistorydata(data) {
return sendPostRequest(`/load/historydata`, data) return sendPostRequest(`/jiaxing/load/historydata`, data)
}, },
//查看抓取图片历史数据 //查看抓取图片历史数据
imageReadtoday(data) { imageReadtoday(data) {
return sendPostRequest(`/image/readtoday`, data) return sendPostRequest(`/jiaxing/image/readtoday`, data)
}, },
//下载图片 //下载图片
imageUploadImage(data) { imageUploadImage(data) {
return sendPostRequest(`/image/uploadImage`, data) return sendPostRequest(`/jiaxing/image/uploadImage`, data)
}, },
//摄像头操作开始 //摄像头操作开始
cameraStart(cameraSerialNumber,cameraChannelNumber,num) { 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) { 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获取账户设备 //根据用户ID获取账户设备
selUserbyid(data){ selUserbyid(data){
return sendGetRequest(`/sel/userbyid/`+data, '') return sendGetRequest(`/jiaxing/sel/userbyid/`+data, ``)
}, },
//根据设备ID获取设备状态值 //根据设备ID获取设备状态值
selControlPermissions(data){ selControlPermissions(data){
return sendGetRequest(`/getcontrol/selControlPermissions`, data) return sendGetRequest(`/jiaxing/getcontrol/selControlPermissions`, data)
}, },
//根据设备ID修改设备状态值 //根据设备ID修改设备状态值
putpermission(data){ putpermission(data){
return sendPutRequest(`/getcontrol/putpermission`, data) return sendPutRequest(`/jiaxing/getcontrol/putpermission`, data)
}, },
//根据权限id修改权限显示或者隐藏 //根据权限id修改权限显示或者隐藏
updatePermissionState(data){ updatePermissionState(data){
return sendPutRequest(`/getcontrol/updatePermissionState`, data) return sendPutRequest(`/jiaxing/getcontrol/updatePermissionState`, data)
}, },
//根据设备ID获取设备控制值 //根据设备ID获取设备控制值
selpermission(data){ selpermission(data){
return sendGetRequest(`/getcontrol/selpermission`, data) return sendGetRequest(`/jiaxing/getcontrol/selpermission`, data)
}, },
//根据设备ID修改设备控制值 //根据设备ID修改设备控制值
putControlpermission(data){ putControlpermission(data){
return sendPutRequest(`/getcontrol/putControlpermission`, data) return sendPutRequest(`/jiaxing/getcontrol/putControlpermission`, data)
}, },
//根据ID修改施肥机数据 //根据ID修改施肥机数据
updatedevice(data){ updatedevice(data){
return sendPutRequest(`/device/updatedevice`, data) return sendPutRequest(`/jiaxing/device/updatedevice`, data)
}, },
//根据ID修改施肥机名字 //根据ID修改施肥机名字
updateFsname(data){ updateFsname(data){
return sendPutRequest(`/update/fsname`, data) return sendPutRequest(`/jiaxing/update/fsname`, data)
}, },
//根据用户ID添加小程序气象站 //根据用户ID添加小程序气象站
addphoneeqData(data) { addphoneeqData(data) {
return sendPostRequest(`/getcontrol/addphoneeqData`, data) return sendPostRequest(`/jiaxing/getcontrol/addphoneeqData`, data)
}, },
//根据用户ID删除小程序气象站 //根据用户ID删除小程序气象站
delphoneeqData(data) { delphoneeqData(data) {
return sendDelRequest(`/getcontrol/delphoneeqData`, data) return sendDelRequest(`/jiaxing/getcontrol/delphoneeqData`, data)
}, },
//根据用户ID修改小程序气象站 //根据用户ID修改小程序气象站
updatephoneeqData(data) { updatephoneeqData(data) {
return sendPutRequest(`/getcontrol/updatephoneeqData`, data) return sendPutRequest(`/jiaxing/getcontrol/updatephoneeqData`, data)
}, },
//修改大数据信息 //修改大数据信息
updateDataDevice(data) { updateDataDevice(data) {
return sendPutRequest(`/getcontrol/updateBigData`, data) return sendPutRequest(`/jiaxing/getcontrol/updateBigData`, data)
}, },
//小程序手机控制权限模块查询 //小程序手机控制权限模块查询
wxgetpermission(data) { wxgetpermission(data) {
return sendGetRequest(`/getcontrol/wxgetpermission`, data) return sendGetRequest(`/jiaxing/getcontrol/wxgetpermission`, data)
}, },
//查询所有用户 //查询所有用户
adminAll(data){ adminAll(data){
return sendGetRequest(`/admin/all`, data) return sendGetRequest(`/jiaxing/admin/all`, data)
}, },
//更新用户信息 //更新用户信息
updateUser(data){ updateUser(data){
return sendPutRequest(`/admin/add/userEquipment`, data) return sendPutRequest(`/jiaxing/admin/add/userEquipment`, data)
}, },
//添加用户信息 //添加用户信息
addUser(data){ addUser(data){
return sendPostRequest(`/admin/user`, data) return sendPostRequest(`/jiaxing/admin/user`, data)
}, },
//修改密码 //修改密码
updatePwd(data){ updatePwd(data){
return sendPutRequest(`/user/update/pwd`, data) return sendPutRequest(`/jiaxing/user/update/pwd`, data)
}, },
//设备查询 //设备查询
seldevice(data){ seldevice(data){
return sendGetRequest(`/admin/seldevice`, data) return sendGetRequest(`/jiaxing/admin/seldevice`, data)
}, },
//删除设备信息 //删除设备信息
deldevice(data){ deldevice(data){
return sendDelRequest(`/admin/deldevice`, data) return sendDelRequest(`/jiaxing/admin/deldevice`, data)
}, },
//修改手机控制名称 //修改手机控制名称
updatewxgetpermission(data){ updatewxgetpermission(data){
return sendPutRequest(`/getcontrol/updatewxgetpermission`, data) return sendPutRequest(`/jiaxing/getcontrol/updatewxgetpermission`, data)
}, },
//管理员/用户页面删除关联设备信息 //管理员/用户页面删除关联设备信息
delUserByid(data){ delUserByid(data){
return sendDelRequest(`/admin/delUserByid`, data) return sendDelRequest(`/jiaxing/admin/delUserByid`, data)
}, },
//管理员/用户页面添加关联设备信息 //管理员/用户页面添加关联设备信息
addUserByid(data){ addUserByid(data){
return sendPostRequest(`/admin/addUserByid`, data) return sendPostRequest(`/jiaxing/admin/addUserByid`, data)
}, },
//查询控制器权限 //查询控制器权限
selectallPermissions(data){ selectallPermissions(data){
return sendGetRequest(`/getcontrol/selectallPermissions`, data) return sendGetRequest(`/jiaxing/getcontrol/selectallPermissions`, data)
}, },
//新增标准控制器权限 //新增标准控制器权限
addpermissionall(equipmentId, data) { addpermissionall(equipmentId, data) {
return sendPostRequest(`/getcontrol/addpermissionall?deviceId=${equipmentId}`, data) return sendPostRequest(`/jiaxing/getcontrol/addpermissionall?deviceId=${equipmentId}`, data)
}, },
//管理控制器权限删除 //管理控制器权限删除
delpermission(id1, id2) { delpermission(id1, id2) {
return sendDelRequest(`/getcontrol/delpermission?deviceId=${id1}&permissionid=${id2}`, '') return sendDelRequest(`/jiaxing/getcontrol/delpermission?deviceId=${id1}&permissionid=${id2}`, ``)
}, },
//管理控制器权限添加 //管理控制器权限添加
addpermission(id1, id2) { addpermission(id1, id2) {
return sendPostRequest(`/getcontrol/addpermission?deviceId=${id1}&permissionid=${id2}`, '') return sendPostRequest(`/jiaxing/getcontrol/addpermission?deviceId=${id1}&permissionid=${id2}`, ``)
}, },
//管理 设备管理添加设备 //管理 设备管理添加设备
addDevice(data){ addDevice(data){
return sendPostRequest(`/admin/addDevice`, data) return sendPostRequest(`/jiaxing/admin/addDevice`, data)
}, },
//查询施肥级ICCID //查询施肥级ICCID
getFsIccid(data){ getFsIccid(data){
return sendGetRequest(`/readControl/getFsIccid`, data) return sendGetRequest(`/jiaxing/readControl/getFsIccid`, data)
}, },
//查询控制器权限 //查询控制器权限
getIccid(data){ getIccid(data){
return sendGetRequest(`/readControl/getIccid`, data) return sendGetRequest(`/jiaxing/readControl/getIccid`, data)
}, },
//二维码溯源 //二维码溯源
//查看农事作物信息 //查看农事作物信息
getAgriculturalInformation(data) { getAgriculturalInformation(data) {
return sendGetRequest(`/code/getAgriculturalInformation`, data) return sendGetRequest(`/jiaxing/code/getAgriculturalInformation`, data)
}, },
//查看种植计划 //查看种植计划
getplant(data) { getplant(data) {
return sendGetRequest(`/code/getplant`, data) return sendGetRequest(`/jiaxing/code/getplant`, data)
}, },
//查看农场信息管理 //查看农场信息管理
getcodeFarmInformationManagement(data) { getcodeFarmInformationManagement(data) {
return sendGetRequest(`/code/getcodeFarmInformationManagement`, data) return sendGetRequest(`/jiaxing/code/getcodeFarmInformationManagement`, data)
}, },
//上传图片 //上传图片
uploadImage(data) { uploadImage(data) {
return sendPostRequest(`/code/uploadImage`, data) return sendPostRequest(`/jiaxing/code/uploadImage`, data)
}, },
//管理页面上传图片 //管理页面上传图片
manageUploadImage(data) { manageUploadImage(data) {
return sendUploadRequest(`/user/upload`, data) return sendUploadRequest(`/jiaxing/user/upload`, data)
}, },
//施肥机系统导入txt的 //施肥机系统导入txt的
upLoadFsdataWriteValue(data) { upLoadFsdataWriteValue(data) {
return sendUploadRequest(`/Fsdata/write/value`, data) return sendUploadRequest(`/jiaxing/Fsdata/write/value`, data)
}, },
//施肥机系统下载txt //施肥机系统下载txt
FsdataReadValuedownload(data) { FsdataReadValuedownload(data) {
return sendPostRequest(`/Fsdata/read/value?devicecode=${data}`,'') return sendPostRequest(`/jiaxing/Fsdata/read/value?devicecode=${data}`,``)
}, },
//控制器系统导入 //控制器系统导入
upLoadControlWriteValue(data) { upLoadControlWriteValue(data) {
return sendUploadRequest(`/control/write/value`, data) return sendUploadRequest(`/jiaxing/control/write/value`, data)
}, },
//控制器系统下载txt //控制器系统下载txt
controlReadValuedownload(data) { controlReadValuedownload(data) {
return sendPostRequest(`/control/read/value?devicecode=${data}`,'') return sendPostRequest(`/jiaxing/control/read/value?devicecode=${data}`,``)
}, },
// 智能灌注 // 智能灌注
//主页查看智能灌溉控制器 //主页查看智能灌溉控制器
getFi_rtdata(data) { getFi_rtdata(data) {
return sendGetRequest(`/getFi/rtdata`, data) return sendGetRequest(`/jiaxing/getFi/rtdata`, data)
}, },
//当天折线图 //当天折线图
chart_fidata(data) { chart_fidata(data) {
return sendPostRequest(`/chart/fidata?equipmentId=${data}`,'') return sendPostRequest(`/jiaxing/chart/fidata?equipmentId=${data}`,``)
}, },
//智能灌溉1 //智能灌溉1
readFi_irrigate(url,data) { readFi_irrigate(url,data) {
@ -683,57 +684,57 @@ getIccid(data){
}, },
//智能灌溉写入 //智能灌溉写入
postwriteFi_write(data) { postwriteFi_write(data) {
return sendPostRequest("/writeFi/write", data); return sendPostRequest(`/jiaxing/writeFi/write`, data);
}, },
//智能灌溉状态值 //智能灌溉状态值
getFI_getState(data) { getFI_getState(data) {
return sendGetRequest("/getFI/getState", data); return sendGetRequest(`/jiaxing/getFI/getState`, data);
}, },
//智能灌溉系统参数 //智能灌溉系统参数
readControl_getFIIccid(data) { readControl_getFIIccid(data) {
return sendGetRequest("/readControl/getFIIccid", data); return sendGetRequest(`/jiaxing/readControl/getFIIccid`, data);
}, },
//智能灌溉系统导入txt的 //智能灌溉系统导入txt的
upLoadFIwritevalue(data) { upLoadFIwritevalue(data) {
return sendUploadRequest(`/FI/write/value`, data) return sendUploadRequest(`/jiaxing/FI/write/value`, data)
}, },
//智能灌溉系统导出下载txt //智能灌溉系统导出下载txt
FIreadvaluedownload(data) { FIreadvaluedownload(data) {
return sendPostRequest(`/FI/read/value?devicecode=${data}`,'') return sendPostRequest(`/jiaxing/FI/read/value?devicecode=${data}`,``)
}, },
//智能灌溉系统数据上传 //智能灌溉系统数据上传
readFi_datauploadfi(data) { readFi_datauploadfi(data) {
return sendGetRequest("/readFi/datauploadfi", data); return sendGetRequest(`/jiaxing/readFi/datauploadfi`, data);
}, },
//智能灌溉固有参数 //智能灌溉固有参数
readFi_intrinsicparameterfi(data) { readFi_intrinsicparameterfi(data) {
return sendGetRequest("/readFi/intrinsicparameterfi", data); return sendGetRequest(`/jiaxing/readFi/intrinsicparameterfi`, data);
}, },
//智能灌溉传感器通道 //智能灌溉传感器通道
readFi_sensorchannelfi(data) { readFi_sensorchannelfi(data) {
return sendGetRequest("/readFi/sensorchannelfi", data); return sendGetRequest(`/jiaxing/readFi/sensorchannelfi`, data);
}, },
//智能灌溉的名称 //智能灌溉的名称
getFi_getName(data) { getFi_getName(data) {
return sendGetRequest("/getFi/getName", data); return sendGetRequest(`/jiaxing/getFi/getName`, data);
}, },
//修改智能灌溉名称 //修改智能灌溉名称
getFi_updateName(data){ getFi_updateName(data){
return sendPutRequest(`/getFi/updateName`, data) return sendPutRequest(`/jiaxing/getFi/updateName`, data)
}, },
//系统页面备忘录获取 //系统页面备忘录获取
readControl_getMemo(data){ readControl_getMemo(data){
return sendGetRequest(`/readControl/getMemo`, data) return sendGetRequest(`/jiaxing/readControl/getMemo`, data)
}, },
//系统页面备忘录修改 //系统页面备忘录修改
readControl_setMemo(data){ readControl_setMemo(data){
return sendPostRequest(`/readControl/setMemo`, data) return sendPostRequest(`/jiaxing/readControl/setMemo`, data)
}, },
//根据设备id查询控制器权限 //根据设备id查询控制器权限
getcontrol_cpermission(data){ 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){ 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)
},
}; };

286
src/assets/css/main.css
View File

@ -1,37 +1,41 @@
@charset "UTF-8"; @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; 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; width: 10px;
cursor: pointer; 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; 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; width: 4px;
cursor: pointer; cursor: pointer;
background: #0294E2; background: #0294E2;
border: 3px solid #013769; 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 { .tips-model {
padding: 10px; padding: 10px;
color: #ff7f00;
color: #ff7f00;
color: #fff;
} }
.tips-model .tips-model-title { .tips-model .tips-model-title {
@ -49,7 +53,8 @@
border: 1px solid #eee; 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; width: 500px;
display: flex; display: flex;
align-items: center; align-items: center;
@ -57,7 +62,8 @@
height: 20px; 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%; width: 20%;
height: 100%; height: 100%;
display: flex; display: flex;
@ -294,6 +300,7 @@ textarea {
.warning-btn { .warning-btn {
justify-content: flex-end; justify-content: flex-end;
margin-top: -70px; margin-top: -70px;
color: #fff;
} }
.warning-btn .btn.green { .warning-btn .btn.green {
@ -302,6 +309,7 @@ textarea {
.warning-model { .warning-model {
padding: 0 30px 25px; padding: 0 30px 25px;
color: #fff;
} }
.warning-model .input-main { .warning-model .input-main {
@ -330,6 +338,7 @@ textarea {
.warning-sel { .warning-sel {
width: 200px !important; width: 200px !important;
color: #fff;
} }
.table-title { .table-title {
@ -384,6 +393,7 @@ textarea {
background: url(../image/index-background.png) no-repeat; background: url(../image/index-background.png) no-repeat;
background-size: cover; background-size: cover;
background-position: center top; background-position: center top;
color: #fff;
} }
.index .no-list { .index .no-list {
@ -437,6 +447,7 @@ textarea {
position: relative; position: relative;
z-index: 2; z-index: 2;
font-size: 35px; font-size: 35px;
color: #fff;
} }
.index .header .header-center { .index .header .header-center {
@ -607,6 +618,7 @@ textarea {
align-items: center; align-items: center;
flex-wrap: wrap; flex-wrap: wrap;
margin-top: 15px; margin-top: 15px;
color: #fff;
} }
.input-view > div { .input-view > div {
@ -621,6 +633,10 @@ textarea {
padding: 0 8px; padding: 0 8px;
} }
.input-sel {
color: #fff;
}
.input-sel > span { .input-sel > span {
padding: 0 10px; padding: 0 10px;
} }
@ -696,6 +712,10 @@ textarea {
width: 200px !important; width: 200px !important;
} }
.input-main {
color: #fff;
}
.input-main span { .input-main span {
padding: 0 10px; padding: 0 10px;
} }
@ -747,6 +767,7 @@ textarea {
display: flex; display: flex;
align-items: center; align-items: center;
margin: 0 15px 0 0 !important; margin: 0 15px 0 0 !important;
color: #fff;
} }
.number-view > div { .number-view > div {
@ -772,6 +793,7 @@ textarea {
flex-wrap: wrap; flex-wrap: wrap;
display: flex; display: flex;
align-items: center; align-items: center;
color: #fff;
} }
.input-main-60.table-input { .input-main-60.table-input {
@ -825,6 +847,7 @@ textarea {
flex-wrap: wrap; flex-wrap: wrap;
display: flex; display: flex;
align-items: center; align-items: center;
color: #fff;
} }
.input-main-one.table-input { .input-main-one.table-input {
@ -870,6 +893,7 @@ textarea {
width: 300px; width: 300px;
border: none; border: none;
background-color: #014781; background-color: #014781;
color: #fff;
} }
.el-dropdown-menu.input-menu-180 { .el-dropdown-menu.input-menu-180 {
@ -950,6 +974,7 @@ textarea {
} }
.formula { .formula {
color: #fff;
width: 100%; width: 100%;
height: 100%; height: 100%;
padding: 20px; padding: 20px;
@ -969,6 +994,7 @@ textarea {
.table-view { .table-view {
background: transparent; background: transparent;
margin-top: 30px; margin-top: 30px;
color: #fff;
} }
.table-view .cell { .table-view .cell {
@ -1180,6 +1206,7 @@ textarea {
display: flex; display: flex;
align-items: center; align-items: center;
flex-wrap: wrap; flex-wrap: wrap;
color: #fff;
} }
.flex-view > div { .flex-view > div {
@ -1338,6 +1365,10 @@ textarea {
border-color: #0294E2; border-color: #0294E2;
} }
.PIDSet {
color: #fff;
}
.PIDSet .flex-view { .PIDSet .flex-view {
border-bottom: none; border-bottom: none;
} }
@ -1441,6 +1472,10 @@ textarea {
min-height: 101px; min-height: 101px;
} }
.upload {
color: #fff;
}
.upload .upload-view { .upload .upload-view {
width: 520px; width: 520px;
height: 520px; height: 520px;
@ -1492,6 +1527,7 @@ textarea {
.sensorSet { .sensorSet {
height: 100%; height: 100%;
color: #fff;
} }
.sensorSet .sensor-view { .sensorSet .sensor-view {
@ -1663,6 +1699,10 @@ textarea {
padding: 0 20px; padding: 0 20px;
} }
.el-dialog__wrapper {
color: #fff;
}
.el-dialog__wrapper .el-dialog { .el-dialog__wrapper .el-dialog {
background: rgba(0, 59, 114, 0.8); background: rgba(0, 59, 114, 0.8);
border: 2px solid rgba(0, 186, 255, 0.35); 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 { .el-dialog__wrapper .el-dialog .el-dialog__body .model1-top .model-right > div .input-main-60 {
width: auto; width: auto;
color: #fff;
} }
.el-dialog__wrapper .el-dialog .el-dialog__body .model1-bottom { .el-dialog__wrapper .el-dialog .el-dialog__body .model1-bottom {
@ -1800,6 +1841,10 @@ textarea {
flex-shrink: 0; flex-shrink: 0;
} }
.login {
color: #fff;
}
.login .login-header { .login .login-header {
position: relative; position: relative;
width: 100%; width: 100%;
@ -1945,6 +1990,7 @@ textarea {
.dataModel { .dataModel {
height: 650px; height: 650px;
color: #fff;
} }
.dataModel .view-new { .dataModel .view-new {
@ -2003,6 +2049,7 @@ textarea {
padding: 20px; padding: 20px;
flex-direction: column; flex-direction: column;
justify-content: unset; justify-content: unset;
color: #fff;
} }
.realTime .new-data { .realTime .new-data {
@ -2883,6 +2930,10 @@ textarea {
margin-bottom: 10px; margin-bottom: 10px;
} }
.synthesis-con {
color: #fff;
}
.synthesis-con .synthesis-content { .synthesis-con .synthesis-content {
width: 100%; width: 100%;
display: flex; display: flex;
@ -2987,6 +3038,12 @@ textarea {
align-items: center; align-items: center;
} }
.flex-between {
display: flex;
justify-content: space-between;
align-items: center;
}
.vrcode .el-menu, .vrcode .el-menu,
.el-submenu__title:hover, .el-submenu__title:hover,
.el-menu-item:hover, .el-menu-item:hover,
@ -3041,6 +3098,7 @@ textarea {
.vrcode .el-menu-item { .vrcode .el-menu-item {
display: flex; display: flex;
align-items: center; align-items: center;
color: #fff;
} }
.vrcode .el-submenu__title .img, .vrcode .el-submenu__title .img,
@ -3277,7 +3335,8 @@ textarea {
margin-bottom: 10px; margin-bottom: 10px;
} }
.manage-input input { .manage-input input,
.manage-input .input {
width: 240px; width: 240px;
height: 44px; height: 44px;
background: rgba(0, 186, 255, 0.15); background: rgba(0, 186, 255, 0.15);
@ -3286,12 +3345,42 @@ textarea {
font-family: Microsoft YaHei; font-family: Microsoft YaHei;
font-weight: 400; font-weight: 400;
color: #FFFFFF; color: #FFFFFF;
cursor: pointer;
} }
.manage-input input::placeholder { .manage-input input::placeholder,
.manage-input .input::placeholder {
color: #92B1D0; 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 { .vrcode-input-sel {
margin-right: 30px; margin-right: 30px;
margin-bottom: 15px; margin-bottom: 15px;
@ -3455,6 +3544,10 @@ textarea {
transform: translateY(-50%); transform: translateY(-50%);
} }
.vrcode-model {
color: #fff;
}
.vrcode-model.manage-model .el-dialog { .vrcode-model.manage-model .el-dialog {
background: rgba(0, 59, 114, 0.8); background: rgba(0, 59, 114, 0.8);
border: 2px solid rgba(0, 186, 255, 0.35); border: 2px solid rgba(0, 186, 255, 0.35);
@ -3468,6 +3561,14 @@ textarea {
grid-column-gap: 20px; 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 { .vrcode-model.manage-model .el-dialog__footer {
padding: 15px 22px; padding: 15px 22px;
border-top: 1px solid rgba(0, 180, 255, 0.35); border-top: 1px solid rgba(0, 180, 255, 0.35);
@ -3477,21 +3578,34 @@ textarea {
justify-content: flex-start; justify-content: flex-start;
} }
.vrcode-model.manage-model .manage-right .manage-img { .vrcode-model.manage-model .manage-img {
width: 380px; width: 380px;
position: relative; position: relative;
background: rgba(0, 132, 255, 0.15); background: rgba(0, 132, 255, 0.15);
border: 2px solid rgba(0, 132, 255, 0.35); border: 2px solid rgba(0, 132, 255, 0.35);
min-height: 200px;
display: flex;
align-items: center;
justify-content: center;
padding: 10px; padding: 10px;
} }
.vrcode-model.manage-model .manage-right .manage-img img { .vrcode-model.manage-model .manage-img img {
width: 360px; width: 360px;
height: auto; height: auto;
min-height: 200px; 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; width: 0;
height: 0; height: 0;
position: absolute; position: absolute;
@ -3557,6 +3671,7 @@ textarea {
position: relative; position: relative;
font-weight: bold; font-weight: bold;
text-align: left; text-align: left;
color: #fff;
} }
.vrcode-model .vrcode-model-title.vrcode-model-title-282 { .vrcode-model .vrcode-model-title.vrcode-model-title-282 {
@ -3894,6 +4009,7 @@ textarea {
max-height: 700px; max-height: 700px;
overflow: auto; overflow: auto;
padding: 0 30px; padding: 0 30px;
color: #fff;
} }
.model-sel > div { .model-sel > div {
@ -3911,6 +4027,7 @@ textarea {
display: flex; display: flex;
align-items: center; align-items: center;
justify-content: space-between; justify-content: space-between;
color: #fff;
} }
.setsuyuan .setsuyuan-page { .setsuyuan .setsuyuan-page {
@ -4140,6 +4257,30 @@ textarea {
color: #606266; 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 { .historyData .table-view .el-table th.el-table__cell.is-leaf .cell {
font-size: 14px !important; font-size: 14px !important;
} }
@ -4213,7 +4354,7 @@ textarea {
border: 2px solid rgba(0, 186, 255, 0.2); 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; flex-wrap: nowrap !important;
} }
@ -4346,3 +4487,120 @@ textarea {
width: 6px; width: 6px;
height: 4px; 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%;
}

472
src/assets/css/main.scss
View File

@ -21,6 +21,7 @@
cursor: pointer; cursor: pointer;
background: #0294E2; background: #0294E2;
border: 3px solid #013769; border: 3px solid #013769;
color: #0077b1;
} }
&::-webkit-scrollbar-thumb:hover { &::-webkit-scrollbar-thumb:hover {
@ -32,27 +33,37 @@
} }
} }
.tips-model{
.tips-model {
padding: 10px; padding: 10px;
.tips-model-title{ color: #ff7f00;
color: #ff7f00;
color: #fff;
.tips-model-title {
font-size: 18px; font-size: 18px;
font-weight: bold; font-weight: bold;
} }
.tips-model-text{
font-size:14px; .tips-model-text {
font-size: 14px;
padding: 5px 20px; padding: 5px 20px;
} }
.tips-model-table{
.tips-model-table {
width: 500px; width: 500px;
border: 1px solid #eee; border: 1px solid #eee;
} }
.tips-model-th,.tips-model-tr{
.tips-model-th,
.tips-model-tr {
width: 500px; width: 500px;
display: flex; display: flex;
align-items: center; align-items: center;
justify-content: space-between; justify-content: space-between;
height: 20px; height: 20px;
>div{
>div {
width: 20%; width: 20%;
height: 100%; height: 100%;
display: flex; display: flex;
@ -62,6 +73,7 @@
} }
} }
} }
.mobile-scroll { .mobile-scroll {
overflow-y: auto; overflow-y: auto;
@ -118,34 +130,41 @@
max-height: 300px; max-height: 300px;
@extend .scroll; @extend .scroll;
} }
textarea{
resize: none; textarea {
resize: none;
} }
.border-none { .border-none {
border: none !important; border: none !important;
} }
.formula .page-content{
.formula .page-content {
position: relative; position: relative;
.export{
.export {
position: absolute; position: absolute;
right: 30px; right: 30px;
top: 20px; top: 20px;
display: flex; display: flex;
align-items: center; align-items: center;
.export-btn{
.export-btn {
height: 44px; height: 44px;
background: rgba(0, 186, 255, 0.15); background: rgba(0, 186, 255, 0.15);
border: 2px solid rgba(0, 186, 255, 0.4); border: 2px solid rgba(0, 186, 255, 0.4);
line-height: 42px; line-height: 42px;
margin-left: 20px; margin-left: 20px;
padding: 0 10px; padding: 0 10px;
cursor: pointer; cursor: pointer;
} }
} }
} }
.el-collapse-item__header{
.el-collapse-item__header {
line-height: unset; line-height: unset;
} }
.collapse { .collapse {
.el-collapse { .el-collapse {
border: none; border: none;
@ -310,6 +329,8 @@ textarea{
justify-content: flex-end; justify-content: flex-end;
margin-top: -70px; margin-top: -70px;
color: #fff;
.btn.green { .btn.green {
opacity: 1; opacity: 1;
} }
@ -318,6 +339,8 @@ textarea{
.warning-model { .warning-model {
padding: 0 30px 25px; padding: 0 30px 25px;
color: #fff;
.input-main { .input-main {
margin: 0; margin: 0;
@ -345,6 +368,7 @@ textarea{
.warning-sel { .warning-sel {
width: 200px !important; width: 200px !important;
color: #fff;
} }
.table-title { .table-title {
@ -401,6 +425,8 @@ textarea{
background-size: cover; background-size: cover;
background-position: center top; background-position: center top;
color: #fff;
.no-list { .no-list {
color: #fff; color: #fff;
display: flex; display: flex;
@ -429,11 +455,13 @@ textarea{
display: flex; display: flex;
align-items: center; align-items: center;
padding: 10px; padding: 10px;
.logo-img{
.logo-img {
position: relative; position: relative;
z-index: 2; z-index: 2;
margin-right: 10px; margin-right: 10px;
} }
.logo-bg { .logo-bg {
width: 373px; width: 373px;
height: 99px; height: 99px;
@ -443,9 +471,12 @@ textarea{
top: 0; top: 0;
z-index: 1; z-index: 1;
} }
.logo-title{
position: relative;z-index: 2; .logo-title {
position: relative;
z-index: 2;
font-size: 35px; font-size: 35px;
color: #fff;
} }
} }
@ -625,6 +656,8 @@ textarea{
flex-wrap: wrap; flex-wrap: wrap;
margin-top: 15px; margin-top: 15px;
color: #fff;
>div { >div {
flex-shrink: 0; flex-shrink: 0;
margin-right: 20px; margin-right: 20px;
@ -640,6 +673,8 @@ textarea{
} }
.input-sel { .input-sel {
color: #fff;
>span { >span {
padding: 0 10px; padding: 0 10px;
} }
@ -716,12 +751,17 @@ textarea{
.border-right { .border-right {
border-right: 1px solid rgba(2, 148, 226, 0.5); border-right: 1px solid rgba(2, 148, 226, 0.5);
} }
.input-main-200{
input{ .input-main-200 {
width: 200px!important; input {
width: 200px !important;
} }
} }
.input-main { .input-main {
color: #fff;
span { span {
padding: 0 10px; padding: 0 10px;
} }
@ -729,7 +769,7 @@ textarea{
div { div {
margin-bottom: 10px; margin-bottom: 10px;
} }
input { input {
width: 134px; width: 134px;
height: 44px; height: 44px;
@ -785,6 +825,8 @@ textarea{
align-items: center; align-items: center;
margin: 0 15px 0 0 !important; margin: 0 15px 0 0 !important;
color: #fff;
>div { >div {
width: 30px; width: 30px;
height: 30px; height: 30px;
@ -810,6 +852,7 @@ textarea{
flex-wrap: wrap; flex-wrap: wrap;
display: flex; display: flex;
align-items: center; align-items: center;
color: #fff;
&.table-input { &.table-input {
justify-content: center; justify-content: center;
@ -821,21 +864,25 @@ textarea{
span { span {
padding: 0 10px; padding: 0 10px;
&.tips{
&.tips {
color: rgba(255, 255, 255, 0.7); color: rgba(255, 255, 255, 0.7);
font-size: 14px; font-size: 14px;
} }
} }
&.h-44{
input{ &.h-44 {
height: 44px; input {
height: 44px;
}
} }
}
&.input-main-100{ &.input-main-100 {
input{ input {
width: 100px; width: 100px;
}
} }
}
input { input {
width: 60px; width: 60px;
height: 34px; height: 34px;
@ -852,7 +899,8 @@ textarea{
&::placeholder { &::placeholder {
color: #859BB6; color: #859BB6;
} }
&.w-100{
&.w-100 {
width: 100px; width: 100px;
} }
} }
@ -864,6 +912,8 @@ textarea{
display: flex; display: flex;
align-items: center; align-items: center;
color: #fff;
&.table-input { &.table-input {
justify-content: center; justify-content: center;
@ -900,8 +950,9 @@ textarea{
font-weight: bold; font-weight: bold;
font-size: 24px; font-size: 24px;
} }
.popper__arrow { .popper__arrow {
display: none!important; display: none !important;
} }
.el-dropdown-menu { .el-dropdown-menu {
@ -909,6 +960,8 @@ textarea{
border: none; border: none;
background-color: #014781; background-color: #014781;
color: #fff;
&.input-menu-180 { &.input-menu-180 {
width: 180px; width: 180px;
} }
@ -979,15 +1032,17 @@ textarea{
background-position: left center; background-position: left center;
min-width: 302px; min-width: 302px;
} }
&.title-402 { &.title-402 {
background: url(../image/title-302.png) no-repeat center; background: url(../image/title-302.png) no-repeat center;
background-size: 402px 43px; background-size: 402px 43px;
background-position: left center; background-position: left center;
min-width:402px; min-width: 402px;
} }
} }
.formula { .formula {
color: #fff;
width: 100%; width: 100%;
height: 100%; height: 100%;
padding: 20px; padding: 20px;
@ -1011,6 +1066,8 @@ textarea{
background: transparent; background: transparent;
margin-top: 30px; margin-top: 30px;
color: #fff;
.cell { .cell {
text-align: center; text-align: center;
} }
@ -1207,7 +1264,8 @@ textarea{
margin-top: 20px; margin-top: 20px;
display: flex; display: flex;
align-items: center; align-items: center;
>img{
>img {
width: 40px; width: 40px;
height: 40px; height: 40px;
} }
@ -1224,6 +1282,7 @@ textarea{
display: flex; display: flex;
align-items: center; align-items: center;
flex-wrap: wrap; flex-wrap: wrap;
color: #fff;
>div { >div {
flex-shrink: 0; flex-shrink: 0;
@ -1370,9 +1429,11 @@ textarea{
color: #00C8FF; color: #00C8FF;
margin: 7.5px 10px; margin: 7.5px 10px;
cursor: pointer; cursor: pointer;
&.w-250{
&.w-250 {
width: 250px; width: 250px;
} }
>img { >img {
margin-right: 10px; margin-right: 10px;
} }
@ -1387,6 +1448,8 @@ textarea{
} }
.PIDSet { .PIDSet {
color: #fff;
.flex-view { .flex-view {
border-bottom: none; border-bottom: none;
} }
@ -1486,7 +1549,8 @@ textarea{
font-family: Microsoft YaHei; font-family: Microsoft YaHei;
font-weight: 400; font-weight: 400;
color: #A8B6C8; color: #A8B6C8;
&.system-textarea{
&.system-textarea {
padding: 10px; padding: 10px;
height: auto; height: auto;
min-height: 101px; min-height: 101px;
@ -1494,6 +1558,8 @@ textarea{
} }
.upload { .upload {
color: #fff;
.upload-view { .upload-view {
width: 520px; width: 520px;
height: 520px; height: 520px;
@ -1552,6 +1618,8 @@ textarea{
.sensorSet { .sensorSet {
height: 100%; height: 100%;
color: #fff;
.sensor-view { .sensor-view {
display: flex; display: flex;
align-items: center; align-items: center;
@ -1739,6 +1807,8 @@ textarea{
} }
.el-dialog__wrapper { .el-dialog__wrapper {
color: #fff;
.el-dialog { .el-dialog {
background: rgba(0, 59, 114, 0.8); background: rgba(0, 59, 114, 0.8);
border: 2px solid rgba(0, 186, 255, 0.35); border: 2px solid rgba(0, 186, 255, 0.35);
@ -1828,6 +1898,7 @@ textarea{
.input-main-60 { .input-main-60 {
width: auto; width: auto;
color: #fff;
} }
} }
} }
@ -1896,6 +1967,8 @@ textarea{
.login { .login {
color: #fff;
.login-header { .login-header {
position: relative; position: relative;
width: 100%; width: 100%;
@ -2045,6 +2118,8 @@ textarea{
.dataModel { .dataModel {
height: 650px; height: 650px;
color: #fff;
.view-new { .view-new {
width: 100%; width: 100%;
display: flex; display: flex;
@ -2052,9 +2127,10 @@ textarea{
flex-wrap: wrap; flex-wrap: wrap;
padding: 20px 30px 0; padding: 20px 30px 0;
&.border{ &.border {
border-bottom: 1px solid rgba(0, 186, 255, 0.2); border-bottom: 1px solid rgba(0, 186, 255, 0.2);
} }
.list-view { .list-view {
flex-shrink: 0; flex-shrink: 0;
display: flex; display: flex;
@ -2063,6 +2139,7 @@ textarea{
margin-right: 20px; margin-right: 20px;
margin-bottom: 20px; margin-bottom: 20px;
min-width: 160px; min-width: 160px;
img { img {
width: 60px; width: 60px;
height: 60px; height: 60px;
@ -2102,6 +2179,7 @@ textarea{
padding: 20px; padding: 20px;
flex-direction: column; flex-direction: column;
justify-content: unset; justify-content: unset;
color: #fff;
@extend .scroll; @extend .scroll;
.new-data { .new-data {
@ -2582,12 +2660,14 @@ textarea{
justify-content: space-between; justify-content: space-between;
width: 100%; width: 100%;
padding: 0 50px; padding: 0 50px;
&.text-blue{
>div{ &.text-blue {
>div {
font-size: 18px; font-size: 18px;
color: #00C0F7; color: #00C0F7;
} }
} }
>div { >div {
display: flex; display: flex;
align-items: center; align-items: center;
@ -3054,6 +3134,8 @@ textarea{
} }
.synthesis-con { .synthesis-con {
color: #fff;
.synthesis-content { .synthesis-content {
width: 100%; width: 100%;
display: flex; display: flex;
@ -3159,11 +3241,18 @@ textarea{
align-items: center; align-items: center;
} }
.flex-start { .flex-start {
display: flex; display: flex;
justify-content: flex-start; justify-content: flex-start;
align-items: center; align-items: center;
}
.flex-between {
display: flex;
justify-content: space-between;
align-items: center;
} }
.vrcode .el-menu, .vrcode .el-menu,
.el-submenu__title:hover, .el-submenu__title:hover,
@ -3222,6 +3311,7 @@ textarea{
.el-menu-item { .el-menu-item {
display: flex; display: flex;
align-items: center; align-items: center;
color: #fff;
.img { .img {
width: 16px; width: 16px;
@ -3478,7 +3568,8 @@ textarea{
margin-bottom: 10px; margin-bottom: 10px;
} }
input { input,
.input {
width: 240px; width: 240px;
height: 44px; height: 44px;
background: rgba(0, 186, 255, 0.15); background: rgba(0, 186, 255, 0.15);
@ -3487,6 +3578,7 @@ textarea{
font-family: Microsoft YaHei; font-family: Microsoft YaHei;
font-weight: 400; font-weight: 400;
color: #FFFFFF; color: #FFFFFF;
cursor: pointer;
&::placeholder { &::placeholder {
color: #92B1D0; 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 { .vrcode-input-sel {
margin-right: 30px; margin-right: 30px;
margin-bottom: 15px; margin-bottom: 15px;
&.w-100{
&.w-100 {
width: calc(100% - 30px); width: calc(100% - 30px);
.el-dropdown{
.el-dropdown {
width: 100%; width: 100%;
} }
.el-dropdown-link{
.el-dropdown-link {
width: 100%; width: 100%;
} }
} }
>.title { >.title {
margin-bottom: 7px; margin-bottom: 7px;
} }
@ -3515,7 +3639,7 @@ textarea{
height: 44px; height: 44px;
cursor: pointer; cursor: pointer;
position: relative; position: relative;
input { input {
width: 100%; width: 100%;
height: 100%; height: 100%;
@ -3548,7 +3672,8 @@ textarea{
>img { >img {
width: 6px; width: 6px;
height: 4px; height: 4px;
&.search{
&.search {
width: 16px; width: 16px;
height: 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; height: 40px;
} }
.vrcode-input-sel{
.vrcode-input-sel {
margin-right: 10px; margin-right: 10px;
} }
.vrcode-input{
.vrcode-input {
margin-right: 10px; margin-right: 10px;
} }
.vrcode-selimage{
.vrcode-selimage {
width: auto; width: auto;
} }
} }
.vrcode-title { .vrcode-title {
width: 100%; width: 100%;
margin-bottom: 15px; margin-bottom: 15px;
@ -3649,10 +3779,14 @@ textarea{
transform: translateY(-50%); transform: translateY(-50%);
} }
} }
.vrcode-model { .vrcode-model {
color: #fff;
&.manage-model { &.manage-model {
.el-dialog { .el-dialog {
background: rgba(0, 59, 114, 0.8); background: rgba(0, 59, 114, 0.8);
border: 2px solid rgba(0, 186, 255, 0.35); border: 2px solid rgba(0, 186, 255, 0.35);
} }
@ -3663,6 +3797,14 @@ textarea{
grid-template-columns: repeat(2, 1fr); grid-template-columns: repeat(2, 1fr);
grid-row-gap: 0px; //纵向间隔 grid-row-gap: 0px; //纵向间隔
grid-column-gap: 20px; //横向间隔 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; justify-content: flex-start;
} }
.manage-right { .manage-img {
.manage-img { width: 380px;
width: 380px; position: relative;
position: relative; // height: 290px;
// height: 290px; background: rgba(0, 132, 255, 0.15);
background: rgba(0, 132, 255, 0.15); border: 2px solid rgba(0, 132, 255, 0.35);
border: 2px solid rgba(0, 132, 255, 0.35); min-height: 200px;
display: flex;
align-items: center;
justify-content: center;
img { img {
width: 360px; width: 360px;
height: auto; height: auto;
min-height: 200px; min-height: 200px;
} max-height: 360px;
}
padding: 10px; .upload-img {
width: 100px;
height: 100px;
min-height: unset;
cursor: pointer;
}
#sel-img { padding: 10px;
width: 0;
height: 0; #sel-img,
position: absolute; #sel-img1 {
left: 0; width: 0;
top: 0; height: 0;
} position: absolute;
left: 0;
top: 0;
} }
} }
.manage-right {}
.manage-text { .manage-text {
width: 240px; width: 240px;
height: 160px; height: 160px;
@ -3761,6 +3916,7 @@ textarea{
position: relative; position: relative;
font-weight: bold; font-weight: bold;
text-align: left; text-align: left;
color: #fff;
&.vrcode-model-title-282 { &.vrcode-model-title-282 {
background: url(../img/vrcode-title-282.png) no-repeat; background: url(../img/vrcode-title-282.png) no-repeat;
@ -3802,7 +3958,7 @@ textarea{
} }
} }
&.confirm-psw { &.confirm-psw {
.el-dialog__body { .el-dialog__body {
@ -3823,7 +3979,7 @@ textarea{
height: calc(100% - 43px); height: calc(100% - 43px);
padding: 0 30px; padding: 0 30px;
} }
} }
@ -3836,6 +3992,7 @@ textarea{
} }
} }
.vrcode-view { .vrcode-view {
width: 100%; width: 100%;
padding: 20px 0 15px 0; padding: 20px 0 15px 0;
@ -3848,16 +4005,20 @@ textarea{
flex-shrink: 0; flex-shrink: 0;
} }
} }
.vrcode-input { .vrcode-input {
width: 300px; width: 300px;
margin-right: 30px; margin-right: 30px;
margin-bottom: 15px; margin-bottom: 15px;
&.w-100{
&.w-100 {
width: calc(100% - 30px); width: calc(100% - 30px);
} }
&.w-50{
&.w-50 {
width: calc(50% - 30px); width: calc(50% - 30px);
} }
.input-title { .input-title {
font-size: 16px; font-size: 16px;
font-family: Microsoft YaHei; font-family: Microsoft YaHei;
@ -3867,7 +4028,7 @@ textarea{
} }
input { input {
width:100%; width: 100%;
height: 44px; height: 44px;
background: rgba(90, 210, 255, 0.25); background: rgba(90, 210, 255, 0.25);
border: 2px solid rgba(86, 209, 255, 0.5); border: 2px solid rgba(86, 209, 255, 0.5);
@ -3889,10 +4050,12 @@ textarea{
>.title { >.title {
margin-bottom: 7px; margin-bottom: 7px;
} }
.tips{
.tips {
font-size: 16px; font-size: 16px;
color: #FF9999; color: #FF9999;
} }
.sel-image-view { .sel-image-view {
display: flex; display: flex;
align-items: center; align-items: center;
@ -4111,6 +4274,7 @@ color: #FF9999;
max-height: 700px; max-height: 700px;
overflow: auto; overflow: auto;
padding: 0 30px; padding: 0 30px;
color: #fff;
>div { >div {
width: 33%; width: 33%;
@ -4130,6 +4294,7 @@ color: #FF9999;
display: flex; display: flex;
align-items: center; align-items: center;
justify-content: space-between; justify-content: space-between;
color: #fff;
.setsuyuan-page { .setsuyuan-page {
width: 375px; width: 375px;
@ -4373,6 +4538,36 @@ color: #FF9999;
} }
.historyData { .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 { .table-view {
.el-table th.el-table__cell.is-leaf .cell { .el-table th.el-table__cell.is-leaf .cell {
font-size: 14px !important; font-size: 14px !important;
@ -4599,7 +4794,114 @@ color: #FF9999;
>img { >img {
width: 6px; width: 6px;
height: 4px; 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%;
} }
} }
} }

BIN
src/assets/image/background.jpg
View File

Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 616 KiB

After

Width:  |  Height:  |  Size: 56 KiB

BIN
src/assets/image/background.png
View File

Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 1.4 MiB

After

Width:  |  Height:  |  Size: 624 KiB

BIN
src/assets/image/index-background.png
View File

Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 1.9 MiB

After

Width:  |  Height:  |  Size: 848 KiB

BIN
src/assets/image/index-icon1.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 335 B

BIN
src/assets/image/login-bg.png
View File

Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 1.4 MiB

After

Width:  |  Height:  |  Size: 604 KiB

BIN
src/assets/image/more.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 879 B

BIN
src/assets/image/pest.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 343 KiB

BIN
src/assets/img/map9.jpg Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 2.0 MiB

BIN
src/assets/img/upload-img.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 1.8 KiB

807
src/assets/js/charts.js
View File

@ -1,177 +1,177 @@
import * as echarts from "echarts"; import * as echarts from "echarts";
import store from '../../store/index' 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) { export function realTimeLine(id, data,pageId) {
var chartDom = document.getElementById(id); var chartDom = document.getElementById(id);
var myChart = echarts.init(chartDom); var myChart = echarts.init(chartDom);
chartDom.removeAttribute('_echarts_instance_')//解决切换页面echarts不显示的问题 chartDom.removeAttribute('_echarts_instance_')//解决切换页面echarts不显示的问题
var Xdata = [] 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=store.state.equipmentSelList
var equipmentList=JSON.parse(localStorage.getItem('equipmentSelList')) var equipmentList=JSON.parse(localStorage.getItem('equipmentSelList'))
@ -374,172 +374,7 @@ export function realTimeLine1(id, data,pageId) {
var myChart = echarts.init(chartDom); var myChart = echarts.init(chartDom);
chartDom.removeAttribute('_echarts_instance_')//解决切换页面echarts不显示的问题 chartDom.removeAttribute('_echarts_instance_')//解决切换页面echarts不显示的问题
var Xdata = [] 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=store.state.equipmentSelList
var equipmentList=JSON.parse(localStorage.getItem('equipmentSelList')) var equipmentList=JSON.parse(localStorage.getItem('equipmentSelList'))
@ -742,172 +577,7 @@ export function realTimeLine2(id, data,pageId) {
var myChart = echarts.init(chartDom); var myChart = echarts.init(chartDom);
chartDom.removeAttribute('_echarts_instance_')//解决切换页面echarts不显示的问题 chartDom.removeAttribute('_echarts_instance_')//解决切换页面echarts不显示的问题
var Xdata = [] 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=store.state.equipmentSelList
var equipmentList=JSON.parse(localStorage.getItem('equipmentSelList')) var equipmentList=JSON.parse(localStorage.getItem('equipmentSelList'))
@ -1080,6 +750,147 @@ export function realTimeLine2(id, data,pageId) {
myChart.resize(); 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) { export function statusCharts(id, data) {
var chartDom = document.getElementById(id); var chartDom = document.getElementById(id);

53
src/router/index.js
View File

@ -39,6 +39,12 @@ const routes = [
name: 'largeScreen1', name: 'largeScreen1',
component: () => import('../views/page/largeScreen1.vue') component: () => import('../views/page/largeScreen1.vue')
}, },
// 虫情查看的
{
path: '/imageViewer',
name: 'imageViewer',
component: () => import('../views/insectPest/imageViewer.vue'),
},
{ {
path: '/index', path: '/index',
name: 'index', name: 'index',
@ -96,7 +102,7 @@ const routes = [
path: '/systemManage', path: '/systemManage',
name: 'systemManage', name: 'systemManage',
component: () => import('../views/page/systemManage.vue') component: () => import('../views/page/systemManage.vue')
},{ },{//管理页面
path: '/manage', path: '/manage',
name: 'manage', name: 'manage',
component: () => import('../views/manage/index.vue'), component: () => import('../views/manage/index.vue'),
@ -137,8 +143,49 @@ const routes = [
path: '/videoManage', path: '/videoManage',
name: 'videoManage', name: 'videoManage',
component: () => import('../views/manage/videoManage.vue') 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', path: '/control',
name: 'control', name: 'control',
@ -309,7 +356,7 @@ const routes = [
},] },]
},] },]
}, },
{ {
path: '/vrcode', path: '/vrcode',
name: 'vrcode', name: 'vrcode',

76
src/views/index.vue
View File

@ -86,6 +86,7 @@
<script> <script>
import { getnowtime } from '../assets/js/nowTime' import { getnowtime } from '../assets/js/nowTime'
import axios from "axios";
export default { export default {
data() { data() {
return { return {
@ -104,7 +105,7 @@ export default {
// { name: '设备菜单', router: '', routerList: [], img: require('../assets/image/header-img5.png') }, // { name: '设备菜单', router: '', routerList: [], img: require('../assets/image/header-img5.png') },
//systemManage systemManage //systemManage systemManage
// manage // 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') } { 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', '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: ['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: [ leftList1: [
{ name: '管理', img: require('../assets/image/index-icon.png'), list: [], router: 'manage', isRouter: true, }, { name: '管理', img: require('../assets/image/index-icon.png'), list: [], router: 'manage', isRouter: true, },
{ name: '用户管理', routerList: [''], img: require('../assets/image/left-img0.png'), list: [ { name: '用户管理', routerList: [''], img: require('../assets/image/left-img0.png'), list: [
@ -137,6 +139,11 @@ export default {
'dataDevice', 'dataDevice',
'mobileControl', 'mobileControl',
'userInfoControl', 'userInfoControl',
'officialWebsiteCase',
'officialWebsiteNews',
'officialWebsiteDetail',
'officialWebsiteProduct',
'officialWebsiteBanner',
'deviceManage', 'deviceManage',
'videoManage',], 'videoManage',],
activeNames1: [3,2], activeNames1: [3,2],
@ -228,12 +235,50 @@ export default {
this.headerList.splice(foundName, 1) 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() { getByid() {
@ -404,6 +449,11 @@ export default {
{ name: '管理员管理', routerList: [''], img: require('../assets/image/left-img0.png'), list: [ { name: '管理员管理', routerList: [''], img: require('../assets/image/left-img0.png'), list: [
{deviceTypeName:'用户信息管理',router:'userInfoControl',index:6}, {deviceTypeName:'用户信息管理',router:'userInfoControl',index:6},
{deviceTypeName:'设备管理',router:'deviceManage',index:7}, {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}, // {deviceTypeName:'摄像头信息管理',router:'videoManage',index:8},
] }, ] },
] ]
@ -459,6 +509,11 @@ export default {
}, },
toRouter(item) { toRouter(item) {
if (item.router) { if (item.router) {
// 是虫情
if(this.routerNow == 'insectPestDetail'||this.routerNow == 'insectPestImageList'){
this.$message('虫情设备无该页面');
return
}
if (item.http) { if (item.http) {
window.location.href = item.http; window.location.href = item.http;
} else if (item.router == 'formula' && this.$route.query.index != item.index) { } else if (item.router == 'formula' && this.$route.query.index != item.index) {
@ -489,7 +544,7 @@ export default {
} }
} else if (item.router == 'realTime') { } else if (item.router == 'realTime') {
this.$router.push({ path: `/realTime` }) this.$router.push({ path: `/realTime` })
} else if (item.router == 'videoMonitoring') { } else if (item.router == 'videoMonitoring') {
@ -508,7 +563,7 @@ export default {
// item.id == 1 丽水; // item.id == 1 丽水;
// item.id == 5 石门; // 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) { if (!foundObject) {
this.$message('您当前没有权限查看!') this.$message('您当前没有权限查看!')
return return
@ -529,7 +584,14 @@ export default {
if (item.http) { if (item.http) {
window.location.href = item.http; window.location.href = item.http;
}else if(item.isRouter){ }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) { } else if ( this.$route.query.index != item.index) {
if (this.routerNow == 'realTime'||item.router=='realTime') { if (this.routerNow == 'realTime'||item.router=='realTime') {
this.$store.state.equipmentIndex = item.index this.$store.state.equipmentIndex = item.index

21
src/views/insectPest.vue Normal file
View 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
View 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
View 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
View 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
View 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
View 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
View 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
View 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
View 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
View 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>

395
src/views/page/largeScreen.vue
View File

@ -206,10 +206,47 @@
<img class="axis_shimen1" 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_shimen2" src="../../assets/img/axis1.png" alt="" @click="handlerAxis_5" />
</div> </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>
</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"></div>
<div class="liveVideo_content" v-show="limitUserId != 12"> <div class="liveVideo_content" v-show="limitUserId != 12">
@ -383,7 +420,7 @@
</div> </div>
<!-- 大冶鑫 --> <!-- 大冶鑫 -->
<div class="content_item" <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 v-for="(item, index) in fiveControlList" :key="index" style="margin-bottom: 0.15rem">
<div class="i_title" v-if="item.controlState != 0"> <div class="i_title" v-if="item.controlState != 0">
<img src="../../assets/img/i_title_img.png" alt="" /> <img src="../../assets/img/i_title_img.png" alt="" />
@ -427,6 +464,10 @@ import EZUIKit from "ezuikit-js";
import videojs from "video.js"; import videojs from "video.js";
import video_zhCN from "video.js/dist/lang/zh-CN.json"; import video_zhCN from "video.js/dist/lang/zh-CN.json";
import vueSeamless from "vue-seamless-scroll"; import vueSeamless from "vue-seamless-scroll";
import axios from "axios";
import { pestLine } from "@/assets/js/charts";
export default { export default {
name: "largeScreen", name: "largeScreen",
components: { vueSeamless }, components: { vueSeamless },
@ -556,8 +597,12 @@ export default {
}, },
], ],
// 金山吕港草莓数据 // 金山吕港草莓数据id12
imgUrl: '', imgUrl: '',
//长兴前卫柑桔新优品种扩繁基地id13单独虫情接口数据
imageList: [],
chartsData: null,
srcList: [],
}; };
}, },
beforeMount() { beforeMount() {
@ -653,7 +698,17 @@ export default {
this.get_environmentData(2023120613270120); this.get_environmentData(2023120613270120);
this.get_readControl_getState(2023120613270120); this.get_readControl_getState(2023120613270120);
this.getWeatherData(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 // 获取控制器第一个Id
const list = [] const list = []
this.$store.state.equipmentList.forEach((el, index) => { 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) { get_weather_echart_data(deviceId) {
this.api.Bigdata_getTemperature(deviceId).then((res1) => { this.api.Bigdata_getTemperature(deviceId).then((res1) => {
@ -961,7 +1072,7 @@ export default {
// id == 1 丽水; // id == 1 丽水;
// id == 5 石门; // id == 5 石门;
// 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) { if (this.limitUserId == 1) {
this.drag_boxHandler(); this.drag_boxHandler();
this.dataInit(userId, this.limitUserId); this.dataInit(userId, this.limitUserId);
@ -989,6 +1100,9 @@ export default {
}else if (this.limitUserId == 12) { }else if (this.limitUserId == 12) {
this.drag_boxHandler12(); this.drag_boxHandler12();
this.dataInit(userId, this.limitUserId); 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); this.get_readControl_getState(2023042214250070);
} else if (this.limitUserId == 7) { } else if (this.limitUserId == 7) {
this.get_readControl_getState(2023120613270120); 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); this.get_readControl_getState(list[0].deviceId);
} }
@ -1226,6 +1340,63 @@ export default {
// console.log(scale); // 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() { drag_boxHandler12() {
let demo = this.$refs.drag_box12; let demo = this.$refs.drag_box12;
@ -1883,6 +2054,20 @@ export default {
justify-content: space-between; justify-content: space-between;
box-sizing: border-box; box-sizing: border-box;
padding: 0 0.66rem; 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 { .left {
width: 4rem; width: 4rem;
@ -1962,20 +2147,6 @@ export default {
height: calc((100% - 4.04rem) / 2); 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 { .environmentData {
width: 3.98rem; width: 3.98rem;
height: 3.27rem; height: 3.27rem;
@ -2283,6 +2454,154 @@ export default {
cursor: pointer; 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 { .drag_box12 {
width: 100%; width: 100%;
height: auto; height: auto;
@ -2800,7 +3119,21 @@ export default {
top: 0.56rem; top: 0.56rem;
right: 0.66rem; right: 0.66rem;
z-index: 999; 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 { .liveVideo {
width: 4rem; width: 4rem;
height: 0.43rem; height: 0.43rem;

807
src/views/page/largeScreen1.vue
View File

File diff suppressed because it is too large Load Diff

13
vue.config.js
View File

@ -40,12 +40,21 @@ module.exports = {
devServer: { devServer: {
// https:true, // https:true,
proxy: { proxy: {
"/api": { "/jiaxing": {
target: 'https://api.lihe-control.com', //地址 target: 'https://api.lihe-control.com', //地址
// target: 'http://jiaxingtest.a1.luyouxia.net:21114', //地址 // target: 'http://jiaxingtest.a1.luyouxia.net:21114', //地址
//target: 'http://jiaxingtest.a1.luyouxia.net:25762', //地址
changeOrigin: true, changeOrigin: true,
pathRewrite: { pathRewrite: {
"^/api": "", "^/jiaxing": "",
},
},
"/api1": {
target: 'https://zdny.zznongyeyiqi.com', //地址
changeOrigin: true,
pathRewrite: {
"^/api1": "",
}, },
}, },
}, },