add ota page & plc export file function
This commit is contained in:
龚祖望
parent
cc406f18f8
commit
c015452ae3
|
|
@ -10,9 +10,10 @@
|
||||||
"license": "MIT",
|
"license": "MIT",
|
||||||
"dependencies": {
|
"dependencies": {
|
||||||
"axios": "0.18.1",
|
"axios": "0.18.1",
|
||||||
"core-js": "^3.6.5",
|
"core-js": "^3.23.4",
|
||||||
"echarts": "^5.3.3",
|
"echarts": "^5.3.3",
|
||||||
"element-ui": "^2.15.8",
|
"element-ui": "2.15.13",
|
||||||
|
"file-saver": "^2.0.5",
|
||||||
"html-loader": "^4.2.0",
|
"html-loader": "^4.2.0",
|
||||||
"js-cookie": "2.2.0",
|
"js-cookie": "2.2.0",
|
||||||
"markdown-loader": "^8.0.0",
|
"markdown-loader": "^8.0.0",
|
||||||
|
|
@ -6028,10 +6029,9 @@
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
"node_modules/core-js": {
|
"node_modules/core-js": {
|
||||||
"version": "3.6.5",
|
"version": "3.23.4",
|
||||||
"resolved": "https://registry.npmmirror.com/core-js/-/core-js-3.6.5.tgz",
|
"resolved": "https://registry.npmmirror.com/core-js/-/core-js-3.23.4.tgz",
|
||||||
"integrity": "sha512-vZVEEwZoIsI+vPEuoF9Iqf5H7/M3eeQqWlQnYa8FSKKePuYTf5MWnxb5SDAzCa60b3JBRS5g9b+Dq7b1y/RCrA==",
|
"integrity": "sha512-vjsKqRc1RyAJC3Ye2kYqgfdThb3zYnx9CrqoCcjMOENMtQPC7ZViBvlDxwYU/2z2NI/IPuiXw5mT4hWhddqjzQ==",
|
||||||
"deprecated": "core-js@<3.23.3 is no longer maintained and not recommended for usage due to the number of issues. Because of the V8 engine whims, feature detection in old core-js versions could cause a slowdown up to 100x even if nothing is polyfilled. Some versions have web compatibility issues. Please, upgrade your dependencies to the actual version of core-js.",
|
|
||||||
"hasInstallScript": true
|
"hasInstallScript": true
|
||||||
},
|
},
|
||||||
"node_modules/core-js-compat": {
|
"node_modules/core-js-compat": {
|
||||||
|
|
@ -7198,9 +7198,9 @@
|
||||||
"dev": true
|
"dev": true
|
||||||
},
|
},
|
||||||
"node_modules/element-ui": {
|
"node_modules/element-ui": {
|
||||||
"version": "2.15.10",
|
"version": "2.15.13",
|
||||||
"resolved": "https://registry.npmmirror.com/element-ui/-/element-ui-2.15.10.tgz",
|
"resolved": "https://registry.npmmirror.com/element-ui/-/element-ui-2.15.13.tgz",
|
||||||
"integrity": "sha512-jmD++mU2wKXbisvx4fxOl2mHaU+HWHTAq/3Wf8x9Bwyu4GdDZPLABb+CGi3DWN6fPqdgRcd74aX39DO+YHObLw==",
|
"integrity": "sha512-LJoatEYX6WV74FqXBss8Xfho9fh9rjDSzrDrTyREdGb1h1R3uRvmLh5jqp2JU137aj4/BgqA3K06RQpQBX33Bg==",
|
||||||
"dependencies": {
|
"dependencies": {
|
||||||
"async-validator": "~1.8.1",
|
"async-validator": "~1.8.1",
|
||||||
"babel-helper-vue-jsx-merge-props": "^2.0.0",
|
"babel-helper-vue-jsx-merge-props": "^2.0.0",
|
||||||
|
|
@ -8482,6 +8482,11 @@
|
||||||
"node": ">=4.0.0"
|
"node": ">=4.0.0"
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
"node_modules/file-saver": {
|
||||||
|
"version": "2.0.5",
|
||||||
|
"resolved": "https://registry.npmmirror.com/file-saver/-/file-saver-2.0.5.tgz",
|
||||||
|
"integrity": "sha512-P9bmyZ3h/PRG+Nzga+rbdI4OEpNDzAVyy74uVO9ATgzLK6VtAsYybF/+TOCvrc0MO793d6+42lLyZTw7/ArVzA=="
|
||||||
|
},
|
||||||
"node_modules/file-uri-to-path": {
|
"node_modules/file-uri-to-path": {
|
||||||
"version": "1.0.0",
|
"version": "1.0.0",
|
||||||
"resolved": "https://registry.npmmirror.com/file-uri-to-path/-/file-uri-to-path-1.0.0.tgz",
|
"resolved": "https://registry.npmmirror.com/file-uri-to-path/-/file-uri-to-path-1.0.0.tgz",
|
||||||
|
|
@ -25192,9 +25197,9 @@
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
"core-js": {
|
"core-js": {
|
||||||
"version": "3.6.5",
|
"version": "3.23.4",
|
||||||
"resolved": "https://registry.npmmirror.com/core-js/-/core-js-3.6.5.tgz",
|
"resolved": "https://registry.npmmirror.com/core-js/-/core-js-3.23.4.tgz",
|
||||||
"integrity": "sha512-vZVEEwZoIsI+vPEuoF9Iqf5H7/M3eeQqWlQnYa8FSKKePuYTf5MWnxb5SDAzCa60b3JBRS5g9b+Dq7b1y/RCrA=="
|
"integrity": "sha512-vjsKqRc1RyAJC3Ye2kYqgfdThb3zYnx9CrqoCcjMOENMtQPC7ZViBvlDxwYU/2z2NI/IPuiXw5mT4hWhddqjzQ=="
|
||||||
},
|
},
|
||||||
"core-js-compat": {
|
"core-js-compat": {
|
||||||
"version": "3.25.1",
|
"version": "3.25.1",
|
||||||
|
|
@ -26188,9 +26193,9 @@
|
||||||
"dev": true
|
"dev": true
|
||||||
},
|
},
|
||||||
"element-ui": {
|
"element-ui": {
|
||||||
"version": "2.15.10",
|
"version": "2.15.13",
|
||||||
"resolved": "https://registry.npmmirror.com/element-ui/-/element-ui-2.15.10.tgz",
|
"resolved": "https://registry.npmmirror.com/element-ui/-/element-ui-2.15.13.tgz",
|
||||||
"integrity": "sha512-jmD++mU2wKXbisvx4fxOl2mHaU+HWHTAq/3Wf8x9Bwyu4GdDZPLABb+CGi3DWN6fPqdgRcd74aX39DO+YHObLw==",
|
"integrity": "sha512-LJoatEYX6WV74FqXBss8Xfho9fh9rjDSzrDrTyREdGb1h1R3uRvmLh5jqp2JU137aj4/BgqA3K06RQpQBX33Bg==",
|
||||||
"requires": {
|
"requires": {
|
||||||
"async-validator": "~1.8.1",
|
"async-validator": "~1.8.1",
|
||||||
"babel-helper-vue-jsx-merge-props": "^2.0.0",
|
"babel-helper-vue-jsx-merge-props": "^2.0.0",
|
||||||
|
|
@ -27229,6 +27234,11 @@
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
"file-saver": {
|
||||||
|
"version": "2.0.5",
|
||||||
|
"resolved": "https://registry.npmmirror.com/file-saver/-/file-saver-2.0.5.tgz",
|
||||||
|
"integrity": "sha512-P9bmyZ3h/PRG+Nzga+rbdI4OEpNDzAVyy74uVO9ATgzLK6VtAsYybF/+TOCvrc0MO793d6+42lLyZTw7/ArVzA=="
|
||||||
|
},
|
||||||
"file-uri-to-path": {
|
"file-uri-to-path": {
|
||||||
"version": "1.0.0",
|
"version": "1.0.0",
|
||||||
"resolved": "https://registry.npmmirror.com/file-uri-to-path/-/file-uri-to-path-1.0.0.tgz",
|
"resolved": "https://registry.npmmirror.com/file-uri-to-path/-/file-uri-to-path-1.0.0.tgz",
|
||||||
|
|
|
||||||
|
|
@ -15,9 +15,10 @@
|
||||||
},
|
},
|
||||||
"dependencies": {
|
"dependencies": {
|
||||||
"axios": "0.18.1",
|
"axios": "0.18.1",
|
||||||
"core-js": "^3.6.5",
|
"core-js": "^3.23.4",
|
||||||
"echarts": "^5.3.3",
|
"echarts": "^5.3.3",
|
||||||
"element-ui": "2.15.13",
|
"element-ui": "2.15.13",
|
||||||
|
"file-saver": "^2.0.5",
|
||||||
"html-loader": "^4.2.0",
|
"html-loader": "^4.2.0",
|
||||||
"js-cookie": "2.2.0",
|
"js-cookie": "2.2.0",
|
||||||
"markdown-loader": "^8.0.0",
|
"markdown-loader": "^8.0.0",
|
||||||
|
|
|
||||||
|
|
@ -0,0 +1,82 @@
|
||||||
|
import request from '@/utils/request'
|
||||||
|
|
||||||
|
export function remove(data) {
|
||||||
|
return request({
|
||||||
|
url: '/firmware/delete',
|
||||||
|
method: 'post',
|
||||||
|
data
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
export function upload(data) {
|
||||||
|
return request({
|
||||||
|
url: '/firmware/upload',
|
||||||
|
method: 'post',
|
||||||
|
data
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
export function add(data) {
|
||||||
|
return request({
|
||||||
|
url: '/firmware/add',
|
||||||
|
method: 'post',
|
||||||
|
data
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
export function verify(data) {
|
||||||
|
return request({
|
||||||
|
url: '/firmware/verify',
|
||||||
|
method: 'post',
|
||||||
|
data
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
export function download(data) {
|
||||||
|
return request({
|
||||||
|
url: '/firmware/download',
|
||||||
|
method: 'get',
|
||||||
|
params: data || {},
|
||||||
|
responseType: 'blob'
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
export function getList(data) {
|
||||||
|
return request({
|
||||||
|
url: '/firmware/getAll',
|
||||||
|
method: 'get',
|
||||||
|
params: data || {}
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
export function getByVerify(data) {
|
||||||
|
return request({
|
||||||
|
url: '/firmware/getVerify',
|
||||||
|
method: 'get',
|
||||||
|
params: data || {}
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
export function getByName(data) {
|
||||||
|
return request({
|
||||||
|
url: '/firmware/getByName',
|
||||||
|
method: 'get',
|
||||||
|
params: data || {}
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
export function addTask(data) {
|
||||||
|
return request({
|
||||||
|
url: '/ota/addJob',
|
||||||
|
method: 'post',
|
||||||
|
data
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
export function getTaskList(data) {
|
||||||
|
return request({
|
||||||
|
url: '/ota/getAll',
|
||||||
|
method: 'get',
|
||||||
|
params: data || {}
|
||||||
|
})
|
||||||
|
}
|
||||||
Binary file not shown.
|
After Width: | Height: | Size: 306 B |
Binary file not shown.
|
After Width: | Height: | Size: 348 B |
Binary file not shown.
|
After Width: | Height: | Size: 823 B |
Binary file not shown.
|
After Width: | Height: | Size: 621 B |
Binary file not shown.
|
After Width: | Height: | Size: 201 B |
Binary file not shown.
|
After Width: | Height: | Size: 780 B |
Binary file not shown.
|
After Width: | Height: | Size: 201 B |
Binary file not shown.
|
After Width: | Height: | Size: 921 B |
Binary file not shown.
|
After Width: | Height: | Size: 215 B |
Binary file not shown.
|
After Width: | Height: | Size: 268 B |
|
|
@ -0,0 +1 @@
|
||||||
|
<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1692843395905" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="4793" xmlns:xlink="http://www.w3.org/1999/xlink" width="48" height="48"><path d="M554.666667 268.8v601.6h-85.333334V268.8L337.066667 401.066667 277.333333 341.333333 512 106.666667 746.666667 341.333333l-59.733334 59.733334L554.666667 268.8z" fill="#20BE0B" p-id="4794"></path></svg>
|
||||||
|
After Width: | Height: | Size: 533 B |
|
|
@ -0,0 +1 @@
|
||||||
|
<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1692842080408" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="3732" xmlns:xlink="http://www.w3.org/1999/xlink" width="48" height="48"><path d="M512 451.669333l211.2-211.2 60.330667 60.330667-211.2 211.2 211.2 211.2-60.330667 60.330667-211.2-211.2-211.2 211.2-60.330667-60.330667 211.2-211.2-211.2-211.2L300.8 240.469333z" p-id="3733" fill="#20BE0B"></path></svg>
|
||||||
|
After Width: | Height: | Size: 550 B |
|
|
@ -0,0 +1 @@
|
||||||
|
<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1692863669530" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="5867" xmlns:xlink="http://www.w3.org/1999/xlink" width="48" height="48"><path d="M960 416V192l-73.056 73.056a447.712 447.712 0 0 0-373.6-201.088C265.92 63.968 65.312 264.544 65.312 512S265.92 960.032 513.344 960.032a448.064 448.064 0 0 0 415.232-279.488 38.368 38.368 0 1 0-71.136-28.896 371.36 371.36 0 0 1-344.096 231.584C308.32 883.232 142.112 717.024 142.112 512S308.32 140.768 513.344 140.768c132.448 0 251.936 70.08 318.016 179.84L736 416h224z" p-id="5868" fill="#20BE0B"></path></svg>
|
||||||
|
After Width: | Height: | Size: 741 B |
|
|
@ -48,7 +48,7 @@ export default {
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
showBreadcrumb() {
|
showBreadcrumb() {
|
||||||
const whiteList = ['overview', 'terminal/add', 'terminal/plc', 'terminal/stock', 'data/value', 'configuration/development', 'dashboard', 'log/accessLog', 'log/systemLog', 'rule/manage', 'rule/dataTransfer']
|
const whiteList = ['overview', 'terminal/add', 'terminal/plc', 'terminal/stock', 'terminal/ota', 'data/value', 'configuration/development', 'dashboard', 'log/accessLog', 'log/systemLog', 'rule/manage', 'rule/dataTransfer']
|
||||||
return whiteList.every((item) => this.$route.path.indexOf(item) === -1)
|
return whiteList.every((item) => this.$route.path.indexOf(item) === -1)
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
|
|
||||||
|
|
@ -219,7 +219,7 @@ export const asyncRouter = [
|
||||||
path: 'ota',
|
path: 'ota',
|
||||||
name: 'OTA',
|
name: 'OTA',
|
||||||
component: () => import('@/views/terminal/OTA/index'),
|
component: () => import('@/views/terminal/OTA/index'),
|
||||||
meta: { title: 'OTA升级', disabled: true, permission: ['dashengda', 'hangxiao', 'qianjiangdianqi'] }
|
meta: { title: 'OTA升级', permission: ['dashengda', 'hangxiao', 'qianjiangdianqi'] }
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
path: 'stock',
|
path: 'stock',
|
||||||
|
|
|
||||||
|
|
@ -2,7 +2,7 @@
|
||||||
* @Author: 龚祖望 573413756@qq.com
|
* @Author: 龚祖望 573413756@qq.com
|
||||||
* @Date: 2022-05-16 09:16:41
|
* @Date: 2022-05-16 09:16:41
|
||||||
* @LastEditors: 龚祖望 573413756@qq.com
|
* @LastEditors: 龚祖望 573413756@qq.com
|
||||||
* @LastEditTime: 2022-11-10 15:09:14
|
* @LastEditTime: 2023-08-23 15:32:34
|
||||||
* @FilePath: \dashengda\src\utils\request.js
|
* @FilePath: \dashengda\src\utils\request.js
|
||||||
* @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
|
* @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
|
||||||
*/
|
*/
|
||||||
|
|
@ -56,35 +56,35 @@ service.interceptors.response.use(
|
||||||
*/
|
*/
|
||||||
response => {
|
response => {
|
||||||
const res = response.data
|
const res = response.data
|
||||||
|
if (res instanceof Blob) {
|
||||||
// if the custom code is not 20000, it is judged as an error.
|
return response
|
||||||
if (res.code !== '200000') {
|
} else {
|
||||||
Message({
|
if (res.code !== '200000') {
|
||||||
message: res.message || 'Error',
|
Message({
|
||||||
type: 'error',
|
message: res.message || 'Error',
|
||||||
duration: 5 * 1000
|
type: 'error',
|
||||||
})
|
duration: 5 * 1000
|
||||||
|
})
|
||||||
|
}
|
||||||
|
if (res.code === '200300') {}
|
||||||
|
// // 50008: Illegal token; 50012: Other clients logged in; 50014: Token expired;
|
||||||
|
// if (res.code === 50008 || res.code === 50012 || res.code === 50014) {
|
||||||
|
// // to re-login
|
||||||
|
// MessageBox.confirm('You have been logged out, you can cancel to stay on this page, or log in again', 'Confirm logout', {
|
||||||
|
// confirmButtonText: 'Re-Login',
|
||||||
|
// cancelButtonText: 'Cancel',
|
||||||
|
// type: 'warning'
|
||||||
|
// }).then(() => {
|
||||||
|
// store.dispatch('user/resetToken').then(() => {
|
||||||
|
// location.reload()
|
||||||
|
// })
|
||||||
|
// })
|
||||||
|
// }
|
||||||
|
// return Promise.reject(new Error(res.message || 'Error'))
|
||||||
|
// } else {
|
||||||
|
return res
|
||||||
|
// }
|
||||||
}
|
}
|
||||||
if (res.code === '200300') {
|
|
||||||
|
|
||||||
}
|
|
||||||
// // 50008: Illegal token; 50012: Other clients logged in; 50014: Token expired;
|
|
||||||
// if (res.code === 50008 || res.code === 50012 || res.code === 50014) {
|
|
||||||
// // to re-login
|
|
||||||
// MessageBox.confirm('You have been logged out, you can cancel to stay on this page, or log in again', 'Confirm logout', {
|
|
||||||
// confirmButtonText: 'Re-Login',
|
|
||||||
// cancelButtonText: 'Cancel',
|
|
||||||
// type: 'warning'
|
|
||||||
// }).then(() => {
|
|
||||||
// store.dispatch('user/resetToken').then(() => {
|
|
||||||
// location.reload()
|
|
||||||
// })
|
|
||||||
// })
|
|
||||||
// }
|
|
||||||
// return Promise.reject(new Error(res.message || 'Error'))
|
|
||||||
// } else {
|
|
||||||
return res
|
|
||||||
// }
|
|
||||||
},
|
},
|
||||||
error => {
|
error => {
|
||||||
Message({
|
Message({
|
||||||
|
|
|
||||||
|
|
@ -1,3 +1,836 @@
|
||||||
<template>
|
<template>
|
||||||
<div class="app-container" />
|
<div class="app-container">
|
||||||
|
<el-row
|
||||||
|
type="flex"
|
||||||
|
justify="space-between"
|
||||||
|
style="align-items: baseline; margin-bottom: 30px"
|
||||||
|
>
|
||||||
|
<div class="header">
|
||||||
|
<h1 class="title">固件升级</h1>
|
||||||
|
<div class="content">
|
||||||
|
<div class="content_left">
|
||||||
|
<span class="date">{{ date }}</span>
|
||||||
|
<span class="sum">{{ "共" + sum + "个固件" }}</span>
|
||||||
|
</div>
|
||||||
|
<div class="content_right">
|
||||||
|
<div class="type_btn">
|
||||||
|
<el-button-group>
|
||||||
|
<el-button
|
||||||
|
:class="{ active: buttonActive === 1 }"
|
||||||
|
:autofocus="true"
|
||||||
|
@click="handleClick(1)"
|
||||||
|
>全部</el-button>
|
||||||
|
<el-button
|
||||||
|
:class="{ active: buttonActive === 2 }"
|
||||||
|
@click="handleClick(2)"
|
||||||
|
>未验证</el-button>
|
||||||
|
<el-button
|
||||||
|
:class="{ active: buttonActive === 3 }"
|
||||||
|
@click="handleClick(3)"
|
||||||
|
>验证成功</el-button>
|
||||||
|
<el-button
|
||||||
|
:class="{ active: buttonActive === 4 }"
|
||||||
|
@click="handleClick(4)"
|
||||||
|
>验证失败</el-button>
|
||||||
|
</el-button-group>
|
||||||
|
</div>
|
||||||
|
<el-input
|
||||||
|
v-model="searchName"
|
||||||
|
placeholder="请输入固件名称"
|
||||||
|
suffix-icon="el-icon-search"
|
||||||
|
@change="getList"
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</el-row>
|
||||||
|
<el-row>
|
||||||
|
<el-button
|
||||||
|
class="add_btn"
|
||||||
|
icon="el-icon-plus"
|
||||||
|
@click="addFileVisible = true"
|
||||||
|
>新增固件</el-button>
|
||||||
|
</el-row>
|
||||||
|
<div class="table_container">
|
||||||
|
<div
|
||||||
|
v-for="(item, index) in fileList"
|
||||||
|
:key="index"
|
||||||
|
class="item"
|
||||||
|
:style="{
|
||||||
|
backgroundColor: item.bgColor,
|
||||||
|
borderColor: item.primaryColor,
|
||||||
|
}"
|
||||||
|
>
|
||||||
|
<div class="item_left">
|
||||||
|
<div class="line1">
|
||||||
|
<img :src="item.statusSrc_big">
|
||||||
|
<span class="name">{{ item.fileName }}</span>
|
||||||
|
<span class="desc">{{ item.fileDesc }}</span>
|
||||||
|
</div>
|
||||||
|
<div class="line2">
|
||||||
|
<div>
|
||||||
|
<img :src="item.statusSrc_small">
|
||||||
|
<span :style="{ color: item.primaryColor }">{{
|
||||||
|
item.verify
|
||||||
|
}}</span>
|
||||||
|
</div>
|
||||||
|
<div style="margin-left: 20px">
|
||||||
|
<img src="@/assets/images/ota_version.png">
|
||||||
|
<span style="color: #fbc511">{{ item.fileVersion }}</span>
|
||||||
|
</div>
|
||||||
|
<div style="margin-left: 20px">
|
||||||
|
<img src="@/assets/images/ota_file.png">
|
||||||
|
<span style="color: #00ccf2">{{ item.fileName }}</span>
|
||||||
|
</div>
|
||||||
|
<div style="margin-left: 20px">
|
||||||
|
<img src="@/assets/images/ota_md5.png">
|
||||||
|
<span style="color: #724fe8">{{ item.fileMd5 }}</span>
|
||||||
|
</div>
|
||||||
|
<div style="margin-left: 20px">
|
||||||
|
<img src="@/assets/images/ota_time.png">
|
||||||
|
<span style="color: #20be0b">{{ item.createTime }}</span>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="divider" :style="{ backgroundColor: item.primaryColor }" />
|
||||||
|
<div class="item_right">
|
||||||
|
<el-button
|
||||||
|
:style="{ borderColor: item.primaryColor }"
|
||||||
|
@click="download(item.fileName)"
|
||||||
|
>下载</el-button>
|
||||||
|
<el-button
|
||||||
|
:style="{ borderColor: item.primaryColor }"
|
||||||
|
@click="(event) => remove(item.fileName, event)"
|
||||||
|
>删除</el-button>
|
||||||
|
<el-button
|
||||||
|
:style="{ borderColor: item.primaryColor }"
|
||||||
|
@click="verify(item.fileName, index)"
|
||||||
|
>验证</el-button>
|
||||||
|
<el-button
|
||||||
|
:style="{
|
||||||
|
borderColor: item.primaryColor,
|
||||||
|
backgroundColor: item.primaryColor,
|
||||||
|
color: 'white',
|
||||||
|
}"
|
||||||
|
@click="showTask(item.fileName)"
|
||||||
|
>升级</el-button>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<!-- 新增固件弹窗 -->
|
||||||
|
<el-dialog
|
||||||
|
title="新增设备"
|
||||||
|
:visible="addFileVisible"
|
||||||
|
width="500px"
|
||||||
|
@close="closeDialog"
|
||||||
|
>
|
||||||
|
<el-steps :active="active" finish-status="success" align-center>
|
||||||
|
<el-step title="固件上传" icon="el-icon-upload" />
|
||||||
|
<el-step title="信息填写" icon="el-icon-edit" />
|
||||||
|
</el-steps>
|
||||||
|
<div v-show="active === 1" style="padding: 50px">
|
||||||
|
<el-upload
|
||||||
|
ref="upload"
|
||||||
|
class="upload-demo"
|
||||||
|
drag
|
||||||
|
action="/dashengda/firmware/upload"
|
||||||
|
:multiple="false"
|
||||||
|
:limit="1"
|
||||||
|
:file-list="firmwareList"
|
||||||
|
:on-success="handleSuccess"
|
||||||
|
:on-error="handleError"
|
||||||
|
>
|
||||||
|
<i class="el-icon-upload" />
|
||||||
|
<div class="el-upload__text">将文件拖到此处，或<em>点击上传</em></div>
|
||||||
|
<div slot="tip" class="el-upload__tip">文件大小不能超过1Mb</div>
|
||||||
|
</el-upload>
|
||||||
|
</div>
|
||||||
|
<div v-show="active === 2" style="padding: 30px 0">
|
||||||
|
<el-form ref="form" label-width="100px" :model="newFile" size="medium">
|
||||||
|
<el-row>
|
||||||
|
<el-col :span="18" :offset="3">
|
||||||
|
<el-form-item label="固件名称：" prop="fileName">
|
||||||
|
<el-input v-model="newFile.fileName" disabled />
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item label="固件版本：" prop="fileVersion">
|
||||||
|
<el-input v-model="newFile.fileVersion" />
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item label="MD5码：" prop="fileMd5">
|
||||||
|
<el-input v-model="newFile.fileMd5" disabled />
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item label="固件描述：" prop="fileDesc">
|
||||||
|
<el-input v-model="newFile.fileDesc" />
|
||||||
|
</el-form-item>
|
||||||
|
</el-col>
|
||||||
|
</el-row>
|
||||||
|
</el-form>
|
||||||
|
</div>
|
||||||
|
<el-button
|
||||||
|
:disabled="nextDisabled"
|
||||||
|
style="display: block; margin: auto"
|
||||||
|
type="primary"
|
||||||
|
@click="nextStep"
|
||||||
|
>{{ active === 2 ? "提 交" : "下一步" }}</el-button>
|
||||||
|
</el-dialog>
|
||||||
|
|
||||||
|
<!-- 升级任务弹窗 -->
|
||||||
|
<div v-show="taskListVisible" class="dialog_wrapper">
|
||||||
|
<div class="dialog-container">
|
||||||
|
<div class="dot">
|
||||||
|
<svg-icon icon-class="ota_arrow_up" class="dialog_icon" />
|
||||||
|
</div>
|
||||||
|
<div class="remove_icon" @click="closeTaskDialog">
|
||||||
|
<svg-icon icon-class="ota_close" class="close_icon" />
|
||||||
|
</div>
|
||||||
|
<h2>固件升级记录</h2>
|
||||||
|
<div class="content-container">
|
||||||
|
<div class="middle">
|
||||||
|
<div class="refresh" @click="refresh">
|
||||||
|
<svg-icon icon-class="ota_refresh" class="refresh_icon" />
|
||||||
|
</div>
|
||||||
|
<div v-for="(item, index) in taskList" :key="index" class="item">
|
||||||
|
<div class="head">{{ item.deviceId }}</div>
|
||||||
|
<p>{{ item.fileName }}</p>
|
||||||
|
<p>{{ item.file_version }}</p>
|
||||||
|
<p>2023-08-24</p>
|
||||||
|
<p>15:00:00</p>
|
||||||
|
<p style="margin-top: 10px">
|
||||||
|
<el-tag
|
||||||
|
style="padding: 0 30px"
|
||||||
|
:type="getTagType(item.status)"
|
||||||
|
>{{ item.statusDesc }}</el-tag>
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="footer">
|
||||||
|
<el-button class="button_add_task" @click="addTaskVisible = true">新增升级任务</el-button>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<!-- 新增升级任务弹窗 -->
|
||||||
|
<el-dialog
|
||||||
|
title="新增升级任务"
|
||||||
|
:visible="addTaskVisible"
|
||||||
|
width="500px"
|
||||||
|
@close="closeAddTaskDialog"
|
||||||
|
>
|
||||||
|
<el-form ref="form" label-width="100px" :model="newTask" size="medium">
|
||||||
|
<el-row>
|
||||||
|
<el-col :span="18" :offset="3">
|
||||||
|
<el-form-item label="升级版本号：" prop="file_version">
|
||||||
|
<el-input v-model="newTask.file_version" />
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item label="升级设备id：" prop="deviceId">
|
||||||
|
<el-input v-model="newTask.deviceId" />
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item label="升级时间：" prop="updateType">
|
||||||
|
<el-select v-model="newTask.updateType">
|
||||||
|
<el-option
|
||||||
|
v-for="(item, index) in updateTypeOptions"
|
||||||
|
:key="index"
|
||||||
|
:label="item.label"
|
||||||
|
:value="item.val"
|
||||||
|
/>
|
||||||
|
</el-select>
|
||||||
|
</el-form-item>
|
||||||
|
</el-col>
|
||||||
|
</el-row>
|
||||||
|
</el-form>
|
||||||
|
<span slot="footer" class="dialog-footer">
|
||||||
|
<el-button @click="closeAddTaskDialog">取 消</el-button>
|
||||||
|
<el-button type="primary" @click="submit">提 交</el-button>
|
||||||
|
</span>
|
||||||
|
</el-dialog>
|
||||||
|
</div>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
import {
|
||||||
|
remove,
|
||||||
|
add,
|
||||||
|
verify,
|
||||||
|
download,
|
||||||
|
getList,
|
||||||
|
getByVerify,
|
||||||
|
getByName,
|
||||||
|
getTaskList,
|
||||||
|
addTask
|
||||||
|
} from '@/api/terminal/ota.js'
|
||||||
|
|
||||||
|
export default {
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
date: '',
|
||||||
|
sum: 0,
|
||||||
|
searchName: '',
|
||||||
|
verifyStatus: 1,
|
||||||
|
active: 1,
|
||||||
|
buttonActive: 1,
|
||||||
|
addFileVisible: false,
|
||||||
|
taskListVisible: false,
|
||||||
|
addTaskVisible: false,
|
||||||
|
nextDisabled: true,
|
||||||
|
firmwareList: [],
|
||||||
|
currentFileName: '',
|
||||||
|
fileList: [],
|
||||||
|
newFile: {
|
||||||
|
fileName: '',
|
||||||
|
fileVersion: '',
|
||||||
|
verify: '未验证',
|
||||||
|
statusSrc_big: require('@/assets/images/ota_verify_not_big.png'),
|
||||||
|
statusSrc_small: require('@/assets/images/ota_verify_not_small.png'),
|
||||||
|
bgColor: '#E6F4F6',
|
||||||
|
primaryColor: '#00CCF2',
|
||||||
|
fileDesc: '',
|
||||||
|
fileMd5: '',
|
||||||
|
totalSize: 0,
|
||||||
|
createTime: ''
|
||||||
|
},
|
||||||
|
taskList: [],
|
||||||
|
newTask: {
|
||||||
|
file_version: '',
|
||||||
|
deviceId: '',
|
||||||
|
updateType: ''
|
||||||
|
},
|
||||||
|
updateTypeOptions: [
|
||||||
|
{
|
||||||
|
val: 0,
|
||||||
|
label: '立刻升级'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
val: 1,
|
||||||
|
label: '凌晨12点升级'
|
||||||
|
}
|
||||||
|
]
|
||||||
|
}
|
||||||
|
},
|
||||||
|
created() {
|
||||||
|
this.getList()
|
||||||
|
},
|
||||||
|
mounted() {
|
||||||
|
// this.$refs.allFile.$el.focus()
|
||||||
|
this.date = new Date().toLocaleDateString()
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
async getList() {
|
||||||
|
let tempList = []
|
||||||
|
let res
|
||||||
|
if (this.searchName) {
|
||||||
|
res = await getByName({ fileName: this.searchName })
|
||||||
|
if (res.data) {
|
||||||
|
tempList = [res.data]
|
||||||
|
}
|
||||||
|
} else {
|
||||||
|
switch (this.verifyStatus) {
|
||||||
|
case 1:
|
||||||
|
res = await getList()
|
||||||
|
tempList = res.data
|
||||||
|
break
|
||||||
|
case 2:
|
||||||
|
res = await getByVerify({ verify: '未验证' })
|
||||||
|
tempList = res.data
|
||||||
|
break
|
||||||
|
case 3:
|
||||||
|
res = await getByVerify({ verify: '验证成功' })
|
||||||
|
tempList = res.data
|
||||||
|
break
|
||||||
|
case 4:
|
||||||
|
res = await getByVerify({ verify: '验证失败' })
|
||||||
|
tempList = res.data
|
||||||
|
break
|
||||||
|
}
|
||||||
|
}
|
||||||
|
if (tempList.length) {
|
||||||
|
this.fileList = tempList.map((file) => {
|
||||||
|
return this.addCss(file)
|
||||||
|
})
|
||||||
|
} else {
|
||||||
|
this.fileList = []
|
||||||
|
}
|
||||||
|
},
|
||||||
|
addCss(file) {
|
||||||
|
switch (file.verify) {
|
||||||
|
case '验证成功':
|
||||||
|
file.statusSrc_big = require('@/assets/images/ota_verify_failed_big.png')
|
||||||
|
file.statusSrc_small = require('@/assets/images/ota_verify_failed_small.png')
|
||||||
|
file.bgColor = '#F9F2F1'
|
||||||
|
file.primaryColor = '#FF4E00'
|
||||||
|
break
|
||||||
|
case '验证失败':
|
||||||
|
file.statusSrc_big = require('@/assets/images/ota_verify_success_big.png')
|
||||||
|
file.statusSrc_small = require('@/assets/images/ota_verify_success_small.png')
|
||||||
|
file.bgColor = '#E5F7E1'
|
||||||
|
file.primaryColor = '#20BE0B'
|
||||||
|
break
|
||||||
|
case '未验证':
|
||||||
|
file.statusSrc_big = require('@/assets/images/ota_verify_not_big.png')
|
||||||
|
file.statusSrc_small = require('@/assets/images/ota_verify_not_small.png')
|
||||||
|
file.bgColor = '#E6F4F6'
|
||||||
|
file.primaryColor = '#00CCF2'
|
||||||
|
break
|
||||||
|
}
|
||||||
|
return file
|
||||||
|
},
|
||||||
|
download(fileName) {
|
||||||
|
download({ fileName })
|
||||||
|
.then((res) => {
|
||||||
|
const name = res.headers['content-disposition']
|
||||||
|
.split(';')[1]
|
||||||
|
.split('filename=')[1]
|
||||||
|
const data = res.data
|
||||||
|
if (!data) {
|
||||||
|
return
|
||||||
|
}
|
||||||
|
const url = window.URL.createObjectURL(new Blob([data]))
|
||||||
|
const a = document.createElement('a')
|
||||||
|
a.style.display = 'none'
|
||||||
|
a.href = url
|
||||||
|
a.download = name
|
||||||
|
document.body.appendChild(a)
|
||||||
|
a.click() // 执行下载
|
||||||
|
window.URL.revokeObjectURL(a.href)
|
||||||
|
document.body.removeChild(a)
|
||||||
|
})
|
||||||
|
.catch((err) => {})
|
||||||
|
},
|
||||||
|
remove(fileName, event) {
|
||||||
|
this.$confirm(`确定删除固件${fileName}？`, '提示').then(() => {
|
||||||
|
remove({ fileName }).then((res) => {
|
||||||
|
this.$message.success('删除成功')
|
||||||
|
event.target.blur()
|
||||||
|
this.getList()
|
||||||
|
})
|
||||||
|
})
|
||||||
|
},
|
||||||
|
verify(fileName, index) {
|
||||||
|
verify({ fileName }).then((res) => {
|
||||||
|
if (res.message === '验证成功') {
|
||||||
|
this.fileList[index].verify = '验证成功'
|
||||||
|
this.$message.success('验证成功')
|
||||||
|
} else {
|
||||||
|
this.fileList[index].verify = '验证失败'
|
||||||
|
this.$message.error('验证失败')
|
||||||
|
}
|
||||||
|
this.fileList[index] = this.addCss(this.fileList[index])
|
||||||
|
})
|
||||||
|
},
|
||||||
|
handleClick(num) {
|
||||||
|
this.buttonActive = num
|
||||||
|
this.verifyStatus = num
|
||||||
|
this.getList()
|
||||||
|
},
|
||||||
|
add() {},
|
||||||
|
closeDialog() {
|
||||||
|
this.active = 1
|
||||||
|
this.newFile = this.$options.data().newFile
|
||||||
|
this.$refs.upload.clearFiles()
|
||||||
|
this.addFileVisible = false
|
||||||
|
},
|
||||||
|
closeTaskDialog() {
|
||||||
|
this.taskListVisible = false
|
||||||
|
},
|
||||||
|
closeAddTaskDialog() {
|
||||||
|
this.newTask = this.$options.data().newTask
|
||||||
|
this.addTaskVisible = false
|
||||||
|
},
|
||||||
|
handleSuccess(res) {
|
||||||
|
const { fileName, fileMd5, totalSize } = res.data
|
||||||
|
this.newFile.fileName = fileName
|
||||||
|
this.newFile.fileMd5 = fileMd5
|
||||||
|
this.newFile.totalSize = totalSize
|
||||||
|
this.nextDisabled = false
|
||||||
|
this.$message.success('上传成功')
|
||||||
|
},
|
||||||
|
handleError() {
|
||||||
|
this.$message.error('上传失败')
|
||||||
|
},
|
||||||
|
nextStep() {
|
||||||
|
if (this.active === 1) {
|
||||||
|
this.active++
|
||||||
|
} else {
|
||||||
|
const date = new Date()
|
||||||
|
const year = date.getFullYear()
|
||||||
|
let month = date.getMonth() + 1
|
||||||
|
let day = date.getDate()
|
||||||
|
const time = date.toLocaleTimeString('it-IT')
|
||||||
|
if (month < 10) {
|
||||||
|
month = `0${month}`
|
||||||
|
}
|
||||||
|
if (day < 10) {
|
||||||
|
day = `0${day}`
|
||||||
|
}
|
||||||
|
this.newFile.createTime = year + '-' + month + '-' + day + ' ' + time
|
||||||
|
add(this.newFile).then((res) => {
|
||||||
|
if (res.code === '200000') {
|
||||||
|
this.$message.success('新增成功')
|
||||||
|
this.getList()
|
||||||
|
} else {
|
||||||
|
this.$message.error('新增失败')
|
||||||
|
}
|
||||||
|
this.addFileVisible = false
|
||||||
|
})
|
||||||
|
}
|
||||||
|
},
|
||||||
|
showTask(fileName) {
|
||||||
|
this.currentFileName = fileName
|
||||||
|
getTaskList({ fileName }).then((res) => {
|
||||||
|
this.$message.success('升级任务查询成功')
|
||||||
|
this.taskList = res.data.map(task => {
|
||||||
|
const statusList = ['失败', '成功', '进行中', '未开始']
|
||||||
|
task.statusDesc = statusList[task.status]
|
||||||
|
task.date = task.createTime.split(' ')[0]
|
||||||
|
task.time = task.createTime.split(' ')[1]
|
||||||
|
return task
|
||||||
|
})
|
||||||
|
})
|
||||||
|
this.taskListVisible = true
|
||||||
|
},
|
||||||
|
refresh(needMsg = true) {
|
||||||
|
getTaskList({ fileName: this.currentFileName }).then((res) => {
|
||||||
|
if (needMsg) {
|
||||||
|
this.$message.success('刷新成功')
|
||||||
|
}
|
||||||
|
this.taskList = res.data.map(task => {
|
||||||
|
const statusList = ['失败', '成功', '进行中', '未开始']
|
||||||
|
task.statusDesc = statusList[task.status]
|
||||||
|
task.date = task.createTime.split(' ')[0]
|
||||||
|
task.time = task.createTime.split(' ')[1]
|
||||||
|
return task
|
||||||
|
})
|
||||||
|
})
|
||||||
|
},
|
||||||
|
getTagType(status) {
|
||||||
|
let res = ''
|
||||||
|
switch (status) {
|
||||||
|
case 0:
|
||||||
|
res = 'danger'
|
||||||
|
break
|
||||||
|
case 1:
|
||||||
|
res = 'success'
|
||||||
|
break
|
||||||
|
case 2:
|
||||||
|
res = 'warning'
|
||||||
|
break
|
||||||
|
case 3:
|
||||||
|
res = 'info'
|
||||||
|
break
|
||||||
|
}
|
||||||
|
return res
|
||||||
|
},
|
||||||
|
submit() {
|
||||||
|
const date = new Date()
|
||||||
|
const year = date.getFullYear()
|
||||||
|
let month = date.getMonth() + 1
|
||||||
|
let day = date.getDate()
|
||||||
|
const time = date.toLocaleTimeString('it-IT')
|
||||||
|
if (month < 10) {
|
||||||
|
month = `0${month}`
|
||||||
|
}
|
||||||
|
if (day < 10) {
|
||||||
|
day = `0${day}`
|
||||||
|
}
|
||||||
|
this.newTask.createTime = year + '-' + month + '-' + day + ' ' + time
|
||||||
|
addTask({ fileName: this.currentFileName, ...this.newTask }).then(res => {
|
||||||
|
this.$message.success('提交成功')
|
||||||
|
this.closeAddTaskDialog()
|
||||||
|
this.refresh(false)
|
||||||
|
})
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
<style lang="scss" scoped>
|
||||||
|
@media screen and (max-height: 850px) {
|
||||||
|
.dialog-container {
|
||||||
|
margin-top: 5vh !important;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.header {
|
||||||
|
font-family: Lato;
|
||||||
|
width: 100%;
|
||||||
|
.title {
|
||||||
|
color: #174a84;
|
||||||
|
margin-top: 0;
|
||||||
|
}
|
||||||
|
.content {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
.date {
|
||||||
|
color: #a5c9ff;
|
||||||
|
}
|
||||||
|
.sum {
|
||||||
|
margin-left: 80px;
|
||||||
|
color: #a5c9ff;
|
||||||
|
}
|
||||||
|
.content_left {
|
||||||
|
flex: 1;
|
||||||
|
}
|
||||||
|
.content_right {
|
||||||
|
justify-self: end;
|
||||||
|
display: flex;
|
||||||
|
.el-input {
|
||||||
|
margin-left: 30px;
|
||||||
|
width: 280px;
|
||||||
|
display: inline-block;
|
||||||
|
}
|
||||||
|
.type_btn {
|
||||||
|
.el-button-group {
|
||||||
|
display: block;
|
||||||
|
.el-button {
|
||||||
|
width: 120px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.active {
|
||||||
|
background-color: #789af3;
|
||||||
|
color: #fff;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.add_btn {
|
||||||
|
width: 100%;
|
||||||
|
color: #fff;
|
||||||
|
border: 2px solid transparent;
|
||||||
|
background: linear-gradient(#789af3, #789af3) padding-box,
|
||||||
|
repeating-linear-gradient(
|
||||||
|
45deg,
|
||||||
|
#789af3 0,
|
||||||
|
#789af3 12px,
|
||||||
|
#fff 12px,
|
||||||
|
#fff 24px
|
||||||
|
);
|
||||||
|
}
|
||||||
|
.table_container {
|
||||||
|
margin-top: 30px;
|
||||||
|
.item {
|
||||||
|
border-radius: 27px;
|
||||||
|
width: 100%;
|
||||||
|
height: 140px;
|
||||||
|
margin-bottom: 9px;
|
||||||
|
padding: 20px 40px;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
&:hover {
|
||||||
|
border-width: 2px;
|
||||||
|
border-style: solid;
|
||||||
|
}
|
||||||
|
.item_left {
|
||||||
|
flex-grow: 1;
|
||||||
|
.line1 {
|
||||||
|
font-size: 28px;
|
||||||
|
font-family: Microsoft YaHei;
|
||||||
|
line-height: 37px;
|
||||||
|
color: #2e4765;
|
||||||
|
img {
|
||||||
|
vertical-align: middle;
|
||||||
|
}
|
||||||
|
.name {
|
||||||
|
margin-left: 20px;
|
||||||
|
}
|
||||||
|
.desc {
|
||||||
|
margin-left: 65px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.line2 {
|
||||||
|
margin-top: 25px;
|
||||||
|
// margin-left: 50px;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: space-evenly;
|
||||||
|
div {
|
||||||
|
font-size: 18px;
|
||||||
|
font-family: Poppins;
|
||||||
|
font-weight: 600;
|
||||||
|
line-height: 27px;
|
||||||
|
img {
|
||||||
|
vertical-align: middle;
|
||||||
|
margin-right: 5px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.divider {
|
||||||
|
width: 2px;
|
||||||
|
height: 41px;
|
||||||
|
margin: 0 30px;
|
||||||
|
}
|
||||||
|
.item_right {
|
||||||
|
flex: 1;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: space-around;
|
||||||
|
font-size: 23px;
|
||||||
|
font-family: Poppins;
|
||||||
|
font-weight: 600;
|
||||||
|
line-height: 31px;
|
||||||
|
color: #000000;
|
||||||
|
button {
|
||||||
|
// width: 117px;
|
||||||
|
// height: 52px;
|
||||||
|
border-radius: 10px;
|
||||||
|
&:hover {
|
||||||
|
color: inherit;
|
||||||
|
background-color: inherit;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.el-dialog__body {
|
||||||
|
padding: 30px 50px;
|
||||||
|
}
|
||||||
|
.dialog_wrapper {
|
||||||
|
z-index: 2;
|
||||||
|
position: fixed;
|
||||||
|
left: 230px;
|
||||||
|
right: 0;
|
||||||
|
top: 0;
|
||||||
|
bottom: 0;
|
||||||
|
margin: 0;
|
||||||
|
&::before {
|
||||||
|
content: "";
|
||||||
|
position: absolute;
|
||||||
|
left: -230px;
|
||||||
|
right: 0;
|
||||||
|
top: 0;
|
||||||
|
bottom: 0;
|
||||||
|
background-color: rgba(0, 0, 0, 0.4);
|
||||||
|
z-index: 2;
|
||||||
|
}
|
||||||
|
.dialog-container {
|
||||||
|
z-index: 10;
|
||||||
|
width: 1100px;
|
||||||
|
transform: none;
|
||||||
|
margin-top: 10vh;
|
||||||
|
padding: 10px 70px;
|
||||||
|
position: relative;
|
||||||
|
border-radius: 20px;
|
||||||
|
background-color: #def5da;
|
||||||
|
.content-container {
|
||||||
|
background-color: #fff;
|
||||||
|
height: 540px;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
.middle {
|
||||||
|
display: grid;
|
||||||
|
justify-content: space-around;
|
||||||
|
grid-template-columns: repeat(auto-fill, minmax(180px, 1fr));
|
||||||
|
grid-template-rows:repeat(auto-fill, 260px);
|
||||||
|
grid-gap: 0 20px;
|
||||||
|
height: 100%;
|
||||||
|
width: 100%;
|
||||||
|
padding: 10px 40px 10px;
|
||||||
|
overflow-y: auto;
|
||||||
|
position: relative;
|
||||||
|
.refresh {
|
||||||
|
position: absolute;
|
||||||
|
right: 10px;
|
||||||
|
top: 10px;
|
||||||
|
cursor: pointer;
|
||||||
|
.refresh_icon {
|
||||||
|
width: 25px;
|
||||||
|
height: 25px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.item {
|
||||||
|
margin-top: 40px;
|
||||||
|
padding: 40px 20px 10px;
|
||||||
|
position: relative;
|
||||||
|
border: 1px solid transparent;
|
||||||
|
background: linear-gradient(#fff, #fff) padding-box,
|
||||||
|
repeating-linear-gradient(
|
||||||
|
45deg,
|
||||||
|
#20be0b 0,
|
||||||
|
#20be0b 5px,
|
||||||
|
#fff 5px,
|
||||||
|
#fff 10px
|
||||||
|
);
|
||||||
|
div {
|
||||||
|
position: absolute;
|
||||||
|
left: 50%;
|
||||||
|
top: 0;
|
||||||
|
transform: translate(-50%, -50%);
|
||||||
|
width: 60%;
|
||||||
|
height: 45px;
|
||||||
|
border-radius: 10px;
|
||||||
|
text-align: center;
|
||||||
|
background-color: #20be0b;
|
||||||
|
font-size: 20px;
|
||||||
|
font-family: Poppins;
|
||||||
|
font-weight: 600;
|
||||||
|
line-height: 45px;
|
||||||
|
color: #ffffff;
|
||||||
|
}
|
||||||
|
p {
|
||||||
|
margin: 0;
|
||||||
|
text-align: center;
|
||||||
|
font-size: 22px;
|
||||||
|
font-family: Microsoft YaHei;
|
||||||
|
line-height: 30px;
|
||||||
|
color: #2e4765;
|
||||||
|
}
|
||||||
|
&:last-child {
|
||||||
|
// margin-right: auto;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.footer {
|
||||||
|
width: 100%;
|
||||||
|
text-align: center;
|
||||||
|
padding: 20px 0 0;
|
||||||
|
.button_add_task {
|
||||||
|
background-color: #20be0b;
|
||||||
|
color: #f5fbff;
|
||||||
|
font-size: 21px;
|
||||||
|
font-family: Montserrat;
|
||||||
|
font-weight: 600;
|
||||||
|
padding: 12px 30px;
|
||||||
|
border-radius: 15px;
|
||||||
|
&:hover {
|
||||||
|
background-color: #20be0b;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.dot {
|
||||||
|
width: 60px;
|
||||||
|
height: 30px;
|
||||||
|
border-radius: 50px 50px 0 0;
|
||||||
|
position: absolute;
|
||||||
|
left: 50%;
|
||||||
|
transform: translate(-50%, -100%);
|
||||||
|
text-align: center;
|
||||||
|
background-color: #def5da;
|
||||||
|
.dialog_icon {
|
||||||
|
// color: #;
|
||||||
|
width: 40px;
|
||||||
|
height: 40px;
|
||||||
|
margin-top: 10px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.remove_icon {
|
||||||
|
cursor: pointer;
|
||||||
|
position: absolute;
|
||||||
|
right: 70px;
|
||||||
|
top: 20px;
|
||||||
|
// font-size: 20px;
|
||||||
|
.close_icon {
|
||||||
|
width: 40px;
|
||||||
|
height: 40px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
h2 {
|
||||||
|
text-align: center;
|
||||||
|
color: #20be0b;
|
||||||
|
padding-top: 5px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.el-select{
|
||||||
|
width:100% !important
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
|
|
||||||
|
|
@ -6,7 +6,7 @@
|
||||||
style="align-items: baseline; margin-bottom: 30px"
|
style="align-items: baseline; margin-bottom: 30px"
|
||||||
>
|
>
|
||||||
<div class="header">
|
<div class="header">
|
||||||
<h1 class="title">{{ abbrCorpName+'PLC管理' }}</h1>
|
<h1 class="title">{{ abbrCorpName + "PLC管理" }}</h1>
|
||||||
<span class="date">{{ date }}</span>
|
<span class="date">{{ date }}</span>
|
||||||
</div>
|
</div>
|
||||||
</el-row>
|
</el-row>
|
||||||
|
|
@ -26,15 +26,32 @@
|
||||||
<div class="dot">
|
<div class="dot">
|
||||||
<img :src="formula.url">
|
<img :src="formula.url">
|
||||||
</div>
|
</div>
|
||||||
<div class="remove_icon" @click="remove(index,formula.productName)">x</div>
|
<div
|
||||||
|
class="remove_icon"
|
||||||
|
@click="remove(index, formula.productName)"
|
||||||
|
>
|
||||||
|
x
|
||||||
|
</div>
|
||||||
<p class="formula_name">{{ formula.productName }}</p>
|
<p class="formula_name">{{ formula.productName }}</p>
|
||||||
<p class="brand">{{ formula.brandName }}</p>
|
<p class="brand">{{ formula.brandName }}</p>
|
||||||
<p class="protocol_name">{{ formula.protocolType }}</p>
|
<p class="protocol_name">{{ formula.protocolType }}</p>
|
||||||
<el-collapse-transition>
|
<el-collapse-transition>
|
||||||
<div v-show="formula.active" class="addition">
|
<div v-show="formula.active" class="addition">
|
||||||
<p>{{ '工业设备ID：' + formula.deviceId }}</p>
|
<p>{{ "工业设备ID：" + formula.deviceId }}</p>
|
||||||
<p>{{ '工业设备名称：' + formula.deviceName }}</p>
|
<p>{{ "工业设备名称：" + formula.deviceName }}</p>
|
||||||
<p>{{ '扫描间隔：' + formula.readPeriod + 'ms' }}</p>
|
<p>{{ "扫描间隔：" + formula.readPeriod + "ms" }}</p>
|
||||||
|
<p style="margin-left: 0; text-align: center">
|
||||||
|
<el-button
|
||||||
|
class="func_button"
|
||||||
|
@click="exportFile(formula)"
|
||||||
|
>文件导出</el-button>
|
||||||
|
</p>
|
||||||
|
<p style="margin-left: 0; text-align: center">
|
||||||
|
<el-button
|
||||||
|
class="func_button"
|
||||||
|
@click="loadOnline(formula.deviceId)"
|
||||||
|
>在线烧录</el-button>
|
||||||
|
</p>
|
||||||
</div>
|
</div>
|
||||||
</el-collapse-transition>
|
</el-collapse-transition>
|
||||||
<div class="button-container">
|
<div class="button-container">
|
||||||
|
|
@ -153,7 +170,7 @@
|
||||||
<el-input v-if="add" v-model="form.readPeriod">
|
<el-input v-if="add" v-model="form.readPeriod">
|
||||||
<template slot="suffix">ms</template>
|
<template slot="suffix">ms</template>
|
||||||
</el-input>
|
</el-input>
|
||||||
<span v-else>{{ form.readPeriod + 'ms' }}</span>
|
<span v-else>{{ form.readPeriod + "ms" }}</span>
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
</el-form>
|
</el-form>
|
||||||
</div>
|
</div>
|
||||||
|
|
@ -228,50 +245,82 @@
|
||||||
</el-form>
|
</el-form>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div v-show="active === 1" class="content" style="width:100%">
|
<div v-show="active === 1" class="content" style="width: 100%">
|
||||||
<div class="step2_tab">
|
<div class="step2_tab">
|
||||||
<img src="@/assets/images/pie-chart.png" width="80px">
|
<img src="@/assets/images/pie-chart.png" width="80px">
|
||||||
<p class="active">读取数据设置</p>
|
<p class="active">读取数据设置</p>
|
||||||
</div>
|
</div>
|
||||||
<div v-if="add" class="step2_params">
|
<div v-if="add" class="step2_params">
|
||||||
<div class="line" />
|
<div class="line" />
|
||||||
<el-form :model="paramForm" label-position="left" label-width="80px">
|
<el-form
|
||||||
|
:model="paramForm"
|
||||||
|
label-position="left"
|
||||||
|
label-width="80px"
|
||||||
|
>
|
||||||
<el-form-item label="变量名">
|
<el-form-item label="变量名">
|
||||||
<el-input v-model="paramForm.value_name" />
|
<el-input v-model="paramForm.value_name" />
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
<el-form-item label="数据类型">
|
<el-form-item label="数据类型">
|
||||||
<el-select v-model="paramForm.value_type" placeholder="">
|
<el-select v-model="paramForm.value_type" placeholder="">
|
||||||
<el-option v-for="(item,index) in valueTypeList" :key="index" :value="item" />
|
<el-option
|
||||||
|
v-for="(item, index) in valueTypeList"
|
||||||
|
:key="index"
|
||||||
|
:value="item"
|
||||||
|
/>
|
||||||
</el-select>
|
</el-select>
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
<el-form-item v-if="form.brand === 'omron'" label="访问形式">
|
<el-form-item v-if="form.brand === 'omron'" label="访问形式">
|
||||||
<el-select v-model="paramForm.data_type" placeholder="">
|
<el-select v-model="paramForm.data_type" placeholder="">
|
||||||
<el-option v-for="(item,index) in finsDataTypeList" :key="index" :value="item" />
|
<el-option
|
||||||
|
v-for="(item, index) in finsDataTypeList"
|
||||||
|
:key="index"
|
||||||
|
:value="item"
|
||||||
|
/>
|
||||||
</el-select>
|
</el-select>
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
<el-form-item v-if="form.brand === 'siemens'" label="访问形式">
|
<el-form-item v-if="form.brand === 'siemens'" label="访问形式">
|
||||||
<el-select v-model="paramForm.data_type" placeholder="">
|
<el-select v-model="paramForm.data_type" placeholder="">
|
||||||
<el-option v-for="(item,index) in s7DataTypeList" :key="index" :value="item" />
|
<el-option
|
||||||
|
v-for="(item, index) in s7DataTypeList"
|
||||||
|
:key="index"
|
||||||
|
:value="item"
|
||||||
|
/>
|
||||||
</el-select>
|
</el-select>
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
<el-form-item v-if="form.brand === 'general'" label="命令码">
|
<el-form-item v-if="form.brand === 'general'" label="命令码">
|
||||||
<el-select v-model="paramForm.function_code" placeholder="">
|
<el-select v-model="paramForm.function_code" placeholder="">
|
||||||
<el-option v-for="(item,index) in functionCodeList" :key="index" :value="item" />
|
<el-option
|
||||||
|
v-for="(item, index) in functionCodeList"
|
||||||
|
:key="index"
|
||||||
|
:value="item"
|
||||||
|
/>
|
||||||
</el-select>
|
</el-select>
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
<el-form-item v-if="form.brand === 'omron'" label="存储区域">
|
<el-form-item v-if="form.brand === 'omron'" label="存储区域">
|
||||||
<el-select v-model="paramForm.area_char" placeholder="">
|
<el-select v-model="paramForm.area_char" placeholder="">
|
||||||
<el-option v-for="(item,index) in finsAreaCharList" :key="index" :value="item" />
|
<el-option
|
||||||
|
v-for="(item, index) in finsAreaCharList"
|
||||||
|
:key="index"
|
||||||
|
:value="item"
|
||||||
|
/>
|
||||||
</el-select>
|
</el-select>
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
<el-form-item v-if="form.brand === 'siemens'" label="存储区域">
|
<el-form-item v-if="form.brand === 'siemens'" label="存储区域">
|
||||||
<el-select v-model="paramForm.area_char" placeholder="">
|
<el-select v-model="paramForm.area_char" placeholder="">
|
||||||
<el-option v-for="(item,index) in s7AreaCharList" :key="index" :value="item" />
|
<el-option
|
||||||
|
v-for="(item, index) in s7AreaCharList"
|
||||||
|
:key="index"
|
||||||
|
:value="item"
|
||||||
|
/>
|
||||||
</el-select>
|
</el-select>
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
<el-form-item v-if="form.brand === 'mufg'" label="存储区域">
|
<el-form-item v-if="form.brand === 'mufg'" label="存储区域">
|
||||||
<el-select v-model="paramForm.area_char" placeholder="">
|
<el-select v-model="paramForm.area_char" placeholder="">
|
||||||
<el-option v-for="(item,index) in mcAreaCharList" :key="index" :value="item" />
|
<el-option
|
||||||
|
v-for="(item, index) in mcAreaCharList"
|
||||||
|
:key="index"
|
||||||
|
:value="item"
|
||||||
|
/>
|
||||||
</el-select>
|
</el-select>
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
<el-form-item label="起始地址">
|
<el-form-item label="起始地址">
|
||||||
|
|
@ -288,7 +337,11 @@
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
<el-form-item v-if="form.brand === 'mufg'" label="命令类型">
|
<el-form-item v-if="form.brand === 'mufg'" label="命令类型">
|
||||||
<el-select v-model="paramForm.command_type" placeholder="">
|
<el-select v-model="paramForm.command_type" placeholder="">
|
||||||
<el-option v-for="(item,index) in commandTypeList" :key="index" :value="item" />
|
<el-option
|
||||||
|
v-for="(item, index) in commandTypeList"
|
||||||
|
:key="index"
|
||||||
|
:value="item"
|
||||||
|
/>
|
||||||
</el-select>
|
</el-select>
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
<el-form-item v-if="form.brand === 'mufg'" label="监控时间">
|
<el-form-item v-if="form.brand === 'mufg'" label="监控时间">
|
||||||
|
|
@ -297,30 +350,105 @@
|
||||||
</el-form>
|
</el-form>
|
||||||
</div>
|
</div>
|
||||||
<div class="step2_table">
|
<div class="step2_table">
|
||||||
<el-table :data="form.readItemList" height="330px" highlight-current-row fit :header-row-style="{'color':'#FF4E00'}" @row-click="handleSelect">
|
<el-table
|
||||||
<el-table-column align="center" label="变量名" prop="value_name" />
|
:data="form.readItemList"
|
||||||
<el-table-column align="center" label="数据类型" prop="value_type" />
|
height="330px"
|
||||||
<el-table-column v-if="form.brand === 'omron' || form.brand === 'siemens'" align="center" label="访问形式" prop="data_type" />
|
highlight-current-row
|
||||||
<el-table-column v-if="form.brand === 'general'" align="center" label="命令码" prop="function_code" />
|
fit
|
||||||
<el-table-column v-if="form.brand !== 'general'" align="center" label="存储区域" prop="area_char" />
|
:header-row-style="{ color: '#FF4E00' }"
|
||||||
<el-table-column align="center" label="起始地址" prop="start_address" />
|
@row-click="handleSelect"
|
||||||
<el-table-column v-if="form.brand === 'omron'" align="center" label="位地址" prop="bit_address" />
|
>
|
||||||
<el-table-column v-if="form.brand === 'siemens'" align="center" label="DB号" prop="db_number" />
|
<el-table-column
|
||||||
<el-table-column align="center" label="数据长度" prop="data_length" />
|
align="center"
|
||||||
<el-table-column v-if="form.brand === 'mufg'" align="center" label="命令类型" prop="command_type" />
|
label="变量名"
|
||||||
<el-table-column v-if="form.brand === 'mufg'" align="center" label="监控时间" prop="monitoring_timer" />
|
prop="value_name"
|
||||||
|
/>
|
||||||
|
<el-table-column
|
||||||
|
align="center"
|
||||||
|
label="数据类型"
|
||||||
|
prop="value_type"
|
||||||
|
/>
|
||||||
|
<el-table-column
|
||||||
|
v-if="form.brand === 'omron' || form.brand === 'siemens'"
|
||||||
|
align="center"
|
||||||
|
label="访问形式"
|
||||||
|
prop="data_type"
|
||||||
|
/>
|
||||||
|
<el-table-column
|
||||||
|
v-if="form.brand === 'general'"
|
||||||
|
align="center"
|
||||||
|
label="命令码"
|
||||||
|
prop="function_code"
|
||||||
|
/>
|
||||||
|
<el-table-column
|
||||||
|
v-if="form.brand !== 'general'"
|
||||||
|
align="center"
|
||||||
|
label="存储区域"
|
||||||
|
prop="area_char"
|
||||||
|
/>
|
||||||
|
<el-table-column
|
||||||
|
align="center"
|
||||||
|
label="起始地址"
|
||||||
|
prop="start_address"
|
||||||
|
/>
|
||||||
|
<el-table-column
|
||||||
|
v-if="form.brand === 'omron'"
|
||||||
|
align="center"
|
||||||
|
label="位地址"
|
||||||
|
prop="bit_address"
|
||||||
|
/>
|
||||||
|
<el-table-column
|
||||||
|
v-if="form.brand === 'siemens'"
|
||||||
|
align="center"
|
||||||
|
label="DB号"
|
||||||
|
prop="db_number"
|
||||||
|
/>
|
||||||
|
<el-table-column
|
||||||
|
align="center"
|
||||||
|
label="数据长度"
|
||||||
|
prop="data_length"
|
||||||
|
/>
|
||||||
|
<el-table-column
|
||||||
|
v-if="form.brand === 'mufg'"
|
||||||
|
align="center"
|
||||||
|
label="命令类型"
|
||||||
|
prop="command_type"
|
||||||
|
/>
|
||||||
|
<el-table-column
|
||||||
|
v-if="form.brand === 'mufg'"
|
||||||
|
align="center"
|
||||||
|
label="监控时间"
|
||||||
|
prop="monitoring_timer"
|
||||||
|
/>
|
||||||
</el-table>
|
</el-table>
|
||||||
<el-row v-if="add" type="flex" justify="space-between" style="width:60%;margin: 20px auto 0;">
|
<el-row
|
||||||
|
v-if="add"
|
||||||
|
type="flex"
|
||||||
|
justify="space-between"
|
||||||
|
style="width: 60%; margin: 20px auto 0"
|
||||||
|
>
|
||||||
<div class="table_btn">
|
<div class="table_btn">
|
||||||
<img src="@/assets/images/plus_orange.png" width="35px" @click="addParam">
|
<img
|
||||||
|
src="@/assets/images/plus_orange.png"
|
||||||
|
width="35px"
|
||||||
|
@click="addParam"
|
||||||
|
>
|
||||||
<p>添加</p>
|
<p>添加</p>
|
||||||
</div>
|
</div>
|
||||||
<div class="table_btn">
|
<div class="table_btn">
|
||||||
<img src="@/assets/images/minus_orange.png" width="35px" @click="removeParam">
|
<img
|
||||||
|
src="@/assets/images/minus_orange.png"
|
||||||
|
width="35px"
|
||||||
|
@click="removeParam"
|
||||||
|
>
|
||||||
<p>删除</p>
|
<p>删除</p>
|
||||||
</div>
|
</div>
|
||||||
<div class="table_btn">
|
<div class="table_btn">
|
||||||
<img src="@/assets/images/remove_orange.png" width="35px" @click="removeAllParam">
|
<img
|
||||||
|
src="@/assets/images/remove_orange.png"
|
||||||
|
width="35px"
|
||||||
|
@click="removeAllParam"
|
||||||
|
>
|
||||||
<p>清空</p>
|
<p>清空</p>
|
||||||
</div>
|
</div>
|
||||||
<!-- <div>
|
<!-- <div>
|
||||||
|
|
@ -362,9 +490,11 @@
|
||||||
class="dialog_btn"
|
class="dialog_btn"
|
||||||
@click="lastStep"
|
@click="lastStep"
|
||||||
>上一步</el-button>
|
>上一步</el-button>
|
||||||
<el-button v-if="!(active ===2 && !add)" class="dialog_btn primary" @click="nextStep">{{
|
<el-button
|
||||||
active === 2 ? '保存' : '下一步'
|
v-if="!(active === 2 && !add)"
|
||||||
}}</el-button>
|
class="dialog_btn primary"
|
||||||
|
@click="nextStep"
|
||||||
|
>{{ active === 2 ? "保存" : "下一步" }}</el-button>
|
||||||
</el-row>
|
</el-row>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
@ -435,7 +565,17 @@ export default {
|
||||||
checkModeList: ['NONE', 'ODD', 'EVEN'],
|
checkModeList: ['NONE', 'ODD', 'EVEN'],
|
||||||
stopBitsList: [1, 2, 3, 4],
|
stopBitsList: [1, 2, 3, 4],
|
||||||
dataBitsList: [5, 6, 7, 8, 9],
|
dataBitsList: [5, 6, 7, 8, 9],
|
||||||
valueTypeList: ['BOOL', 'INT8', 'INT16', 'INT32', 'UINT8', 'UINT16', 'UINT32', 'DOUBLE', 'FLOAT'],
|
valueTypeList: [
|
||||||
|
'BOOL',
|
||||||
|
'INT8',
|
||||||
|
'INT16',
|
||||||
|
'INT32',
|
||||||
|
'UINT8',
|
||||||
|
'UINT16',
|
||||||
|
'UINT32',
|
||||||
|
'DOUBLE',
|
||||||
|
'FLOAT'
|
||||||
|
],
|
||||||
finsDataTypeList: ['位', '字'],
|
finsDataTypeList: ['位', '字'],
|
||||||
finsAreaCharList: ['W', 'H', 'D'],
|
finsAreaCharList: ['W', 'H', 'D'],
|
||||||
s7DataTypeList: ['Bit', 'Byte', 'Word', 'DWord', 'Real'],
|
s7DataTypeList: ['Bit', 'Byte', 'Word', 'DWord', 'Real'],
|
||||||
|
|
@ -499,9 +639,10 @@ export default {
|
||||||
})
|
})
|
||||||
},
|
},
|
||||||
remove(index, productName) {
|
remove(index, productName) {
|
||||||
remove({ productName }).then(res => {
|
remove({ productName }).then((res) => {
|
||||||
if (res.code === '200000') {
|
if (res.code === '200000') {
|
||||||
const dom = document.getElementsByClassName('formula-container')[index]
|
const dom =
|
||||||
|
document.getElementsByClassName('formula-container')[index]
|
||||||
dom.classList.add('fadeOut')
|
dom.classList.add('fadeOut')
|
||||||
setTimeout(() => {
|
setTimeout(() => {
|
||||||
this.formulaList.splice(index, 1)
|
this.formulaList.splice(index, 1)
|
||||||
|
|
@ -529,7 +670,7 @@ export default {
|
||||||
nextStep() {
|
nextStep() {
|
||||||
if (this.active === 2) {
|
if (this.active === 2) {
|
||||||
this.form.productName = this.productPreName + this.form.productName
|
this.form.productName = this.productPreName + this.form.productName
|
||||||
add(this.form).then(res => {
|
add(this.form).then((res) => {
|
||||||
if (res.code === '200000') {
|
if (res.code === '200000') {
|
||||||
this.getList()
|
this.getList()
|
||||||
this.$message.success('配方设置成功')
|
this.$message.success('配方设置成功')
|
||||||
|
|
@ -550,7 +691,9 @@ export default {
|
||||||
this.step1_active = 1
|
this.step1_active = 1
|
||||||
},
|
},
|
||||||
handleSelect(row, col, event) {
|
handleSelect(row, col, event) {
|
||||||
this.currentIndex = this.form.readItemList.findIndex(item => item.value_name === row.value_name)
|
this.currentIndex = this.form.readItemList.findIndex(
|
||||||
|
(item) => item.value_name === row.value_name
|
||||||
|
)
|
||||||
},
|
},
|
||||||
addParam() {
|
addParam() {
|
||||||
this.form.readItemList.push(this.paramForm)
|
this.form.readItemList.push(this.paramForm)
|
||||||
|
|
@ -561,6 +704,24 @@ export default {
|
||||||
},
|
},
|
||||||
removeAllParam() {
|
removeAllParam() {
|
||||||
this.form.readItemList = []
|
this.form.readItemList = []
|
||||||
|
},
|
||||||
|
exportFile(formula) {
|
||||||
|
const data = JSON.stringify(formula)
|
||||||
|
const name = formula.productName + '.json'
|
||||||
|
const url = window.URL.createObjectURL(
|
||||||
|
new Blob([data], { type: 'application/json' })
|
||||||
|
)
|
||||||
|
const a = document.createElement('a')
|
||||||
|
a.style.display = 'none'
|
||||||
|
a.href = url
|
||||||
|
a.download = name
|
||||||
|
document.body.appendChild(a)
|
||||||
|
a.click() // 执行下载
|
||||||
|
window.URL.revokeObjectURL(a.href)
|
||||||
|
document.body.removeChild(a)
|
||||||
|
},
|
||||||
|
loadOnline(deviceId) {
|
||||||
|
console.log('在线烧录')
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
@ -595,20 +756,21 @@ export default {
|
||||||
font-family: PingFangSC-Regular;
|
font-family: PingFangSC-Regular;
|
||||||
color: rgba(0, 0, 0, 0.85);
|
color: rgba(0, 0, 0, 0.85);
|
||||||
}
|
}
|
||||||
.step2_params{
|
.step2_params {
|
||||||
.el-form-item__label{
|
.el-form-item__label {
|
||||||
color: #ff4e00;
|
color: #ff4e00;
|
||||||
}
|
}
|
||||||
.el-input__inner{
|
.el-input__inner {
|
||||||
border-color: #ff4e00;
|
border-color: #ff4e00;
|
||||||
}
|
}
|
||||||
.el-select .el-input .el-select__caret{
|
.el-select .el-input .el-select__caret {
|
||||||
color: #ff4e00;
|
color: #ff4e00;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
</style>
|
</style>
|
||||||
<style lang="scss" scoped>
|
<style lang="scss" scoped>
|
||||||
.el-button:hover,.el-button:focus {
|
.el-button:hover,
|
||||||
|
.el-button:focus {
|
||||||
background-color: #fff;
|
background-color: #fff;
|
||||||
}
|
}
|
||||||
.header {
|
.header {
|
||||||
|
|
@ -652,11 +814,18 @@ export default {
|
||||||
padding-top: 10px;
|
padding-top: 10px;
|
||||||
cursor: pointer;
|
cursor: pointer;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.func_button {
|
||||||
|
width: 70%;
|
||||||
|
border-radius: 39px;
|
||||||
|
width: 70%;
|
||||||
|
transform: scaleY(0.9);
|
||||||
|
}
|
||||||
.button-container {
|
.button-container {
|
||||||
text-align: center;
|
text-align: center;
|
||||||
margin-bottom: 10px;
|
margin-bottom: 10px;
|
||||||
.button {
|
.button {
|
||||||
color:#fff;
|
color: #fff;
|
||||||
border-radius: 39px;
|
border-radius: 39px;
|
||||||
border: none;
|
border: none;
|
||||||
width: 70%;
|
width: 70%;
|
||||||
|
|
@ -692,11 +861,16 @@ export default {
|
||||||
.button {
|
.button {
|
||||||
background-color: #00ccf2;
|
background-color: #00ccf2;
|
||||||
}
|
}
|
||||||
|
.func_button {
|
||||||
|
background-color: #fff;
|
||||||
|
border: 2px solid #00ccf2;
|
||||||
|
color: #00ccf2;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
.active .omron {
|
.active .omron {
|
||||||
border: 1px solid #00ccf2;
|
border: 1px solid #00ccf2;
|
||||||
&::after {
|
&::after {
|
||||||
content: '';
|
content: "";
|
||||||
width: 50px;
|
width: 50px;
|
||||||
height: 1px;
|
height: 1px;
|
||||||
position: absolute;
|
position: absolute;
|
||||||
|
|
@ -720,11 +894,16 @@ export default {
|
||||||
.button {
|
.button {
|
||||||
background-color: #724fe8;
|
background-color: #724fe8;
|
||||||
}
|
}
|
||||||
|
.func_button {
|
||||||
|
background-color: #fff;
|
||||||
|
border: 2px solid #724fe8;
|
||||||
|
color: #724fe8;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
.active .siemens {
|
.active .siemens {
|
||||||
border: 1px solid #724fe8;
|
border: 1px solid #724fe8;
|
||||||
&::after {
|
&::after {
|
||||||
content: '';
|
content: "";
|
||||||
width: 50px;
|
width: 50px;
|
||||||
height: 1px;
|
height: 1px;
|
||||||
position: absolute;
|
position: absolute;
|
||||||
|
|
@ -748,11 +927,16 @@ export default {
|
||||||
.button {
|
.button {
|
||||||
background-color: #ff4e00;
|
background-color: #ff4e00;
|
||||||
}
|
}
|
||||||
|
.func_button {
|
||||||
|
background-color: #fff;
|
||||||
|
border: 2px solid #ff4e00;
|
||||||
|
color: #ff4e00;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
.active .mufg {
|
.active .mufg {
|
||||||
border: 1px solid #ff4e00;
|
border: 1px solid #ff4e00;
|
||||||
&::after {
|
&::after {
|
||||||
content: '';
|
content: "";
|
||||||
width: 50px;
|
width: 50px;
|
||||||
height: 1px;
|
height: 1px;
|
||||||
position: absolute;
|
position: absolute;
|
||||||
|
|
@ -776,11 +960,16 @@ export default {
|
||||||
.button {
|
.button {
|
||||||
background-color: #20be0b;
|
background-color: #20be0b;
|
||||||
}
|
}
|
||||||
|
.func_button {
|
||||||
|
background-color: #fff;
|
||||||
|
border: 2px solid #20be0b;
|
||||||
|
color: #20be0b;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
.active .general {
|
.active .general {
|
||||||
border: 1px solid #20be0b;
|
border: 1px solid #20be0b;
|
||||||
&::after {
|
&::after {
|
||||||
content: '';
|
content: "";
|
||||||
width: 50px;
|
width: 50px;
|
||||||
height: 1px;
|
height: 1px;
|
||||||
position: absolute;
|
position: absolute;
|
||||||
|
|
@ -879,15 +1068,15 @@ export default {
|
||||||
top: 0;
|
top: 0;
|
||||||
bottom: 0;
|
bottom: 0;
|
||||||
margin: 0;
|
margin: 0;
|
||||||
&::before{
|
&::before {
|
||||||
content: '';
|
content: "";
|
||||||
position: absolute;
|
position: absolute;
|
||||||
left: -230px;
|
left: -230px;
|
||||||
right: 0;
|
right: 0;
|
||||||
top: 0;
|
top: 0;
|
||||||
bottom: 0;
|
bottom: 0;
|
||||||
background-color: rgba(0,0,0,.4);
|
background-color: rgba(0, 0, 0, 0.4);
|
||||||
z-index:2
|
z-index: 2;
|
||||||
}
|
}
|
||||||
.dialog-container {
|
.dialog-container {
|
||||||
z-index: 10;
|
z-index: 10;
|
||||||
|
|
@ -971,29 +1160,29 @@ export default {
|
||||||
.step1_form {
|
.step1_form {
|
||||||
flex: 1;
|
flex: 1;
|
||||||
}
|
}
|
||||||
.step2_tab{
|
.step2_tab {
|
||||||
text-align: center;
|
text-align: center;
|
||||||
flex: 1;
|
flex: 1;
|
||||||
}
|
}
|
||||||
.step2_params{
|
.step2_params {
|
||||||
width: 250px;
|
width: 250px;
|
||||||
position: relative;
|
position: relative;
|
||||||
.line{
|
.line {
|
||||||
right: 10px;
|
right: 10px;
|
||||||
height: 62%;
|
height: 62%;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
.step2_table{
|
.step2_table {
|
||||||
flex: 3;
|
flex: 3;
|
||||||
p{
|
p {
|
||||||
color:#FF4E00;
|
color: #ff4e00;
|
||||||
font-size: 16px;
|
font-size: 16px;
|
||||||
font-family: PingFangSC-Regular;
|
font-family: PingFangSC-Regular;
|
||||||
margin: 0;
|
margin: 0;
|
||||||
}
|
}
|
||||||
.table_btn{
|
.table_btn {
|
||||||
cursor: pointer;
|
cursor: pointer;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
.step3_tab {
|
.step3_tab {
|
||||||
position: relative;
|
position: relative;
|
||||||
|
|
|
||||||
|
|
@ -31,7 +31,7 @@ module.exports = {
|
||||||
proxy: {
|
proxy: {
|
||||||
'/dashengda': {
|
'/dashengda': {
|
||||||
// target: 'http://115.238.53.60:33333/', // 大胜达
|
// target: 'http://115.238.53.60:33333/', // 大胜达
|
||||||
target: 'http://192.168.23.100:8080/', // wty
|
target: 'http://192.168.140.64:8080/', // wty
|
||||||
// target: 'http://10.0.30.23:8080',
|
// target: 'http://10.0.30.23:8080',
|
||||||
changeOrigin: true,
|
changeOrigin: true,
|
||||||
pathRewrite: {
|
pathRewrite: {
|
||||||
|
|
|
||||||
Loading…
Reference in New Issue