modify ota page style

This commit is contained in:
龚祖望 2023-09-08 13:39:30 +08:00
parent 54a974611a
commit 5d4a053a95
2 changed files with 56 additions and 37 deletions

View File

@ -74,19 +74,19 @@
item.verify item.verify
}}</span> }}</span>
</div> </div>
<div style="margin-left: 20px"> <div style="margin-left: 10px">
<img src="@/assets/images/ota_version.png"> <img src="@/assets/images/ota_version.png">
<span style="color: #fbc511">{{ item.fileVersion }}</span> <span style="color: #fbc511">{{ item.fileVersion }}</span>
</div> </div>
<div style="margin-left: 20px"> <div style="margin-left: 10px">
<img src="@/assets/images/ota_file.png"> <img src="@/assets/images/ota_file.png">
<span style="color: #00ccf2">{{ item.fileName }}</span> <span style="color: #00ccf2">{{ item.fileName }}</span>
</div> </div>
<div style="margin-left: 20px"> <div style="margin-left: 10px">
<img src="@/assets/images/ota_md5.png"> <img src="@/assets/images/ota_md5.png">
<span style="color: #724fe8">{{ item.fileMd5 }}</span> <el-tooltip :content="item.fileMd5" placement="top" effect="light"><span style="color: #724fe8">MD5</span></el-tooltip>
</div> </div>
<div style="margin-left: 20px"> <div style="margin-left: 10px">
<img src="@/assets/images/ota_time.png"> <img src="@/assets/images/ota_time.png">
<span style="color: #20be0b">{{ item.createTime }}</span> <span style="color: #20be0b">{{ item.createTime }}</span>
</div> </div>
@ -132,11 +132,20 @@
<el-step title="信息填写" icon="el-icon-edit" /> <el-step title="信息填写" icon="el-icon-edit" />
</el-steps> </el-steps>
<div v-show="active === 1" style="padding: 50px"> <div v-show="active === 1" style="padding: 50px">
<el-form ref="form" label-width="100px" :model="newFile" size="medium">
<el-row>
<el-form-item label="固件版本:" prop="fileVersion">
<el-input v-model="newFile.fileVersion" />
</el-form-item>
</el-row>
</el-form>
<el-upload <el-upload
ref="upload" ref="upload"
class="upload-demo" class="upload-demo"
drag drag
action="/dashengda/firmware/upload" action="/dashengda/firmware/upload"
:data="{ version: newFile.fileVersion }"
:disabled="!newFile.fileVersion"
:multiple="false" :multiple="false"
:limit="1" :limit="1"
:file-list="firmwareList" :file-list="firmwareList"
@ -155,9 +164,6 @@
<el-form-item label="固件名称:" prop="fileName"> <el-form-item label="固件名称:" prop="fileName">
<el-input v-model="newFile.fileName" disabled /> <el-input v-model="newFile.fileName" disabled />
</el-form-item> </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-form-item label="MD5码" prop="fileMd5">
<el-input v-model="newFile.fileMd5" disabled /> <el-input v-model="newFile.fileMd5" disabled />
</el-form-item> </el-form-item>
@ -192,11 +198,9 @@
<svg-icon icon-class="ota_refresh" class="refresh_icon" /> <svg-icon icon-class="ota_refresh" class="refresh_icon" />
</div> </div>
<div v-for="(item, index) in taskList" :key="index" class="item"> <div v-for="(item, index) in taskList" :key="index" class="item">
<div class="head">{{ item.deviceId }}</div> <div class="head">{{ item.id }}</div>
<p>{{ item.fileName }}</p> <p class="label">升级设备id<br><strong>{{ item.deviceId }}</strong></p>
<p>{{ item.fileVersion }}</p> <p class="label">创建时间<br><strong>{{ item.date + ' ' + item.time }}</strong></p>
<p>2023-08-24</p>
<p>15:00:00</p>
<p style="margin-top: 0px"> <p style="margin-top: 0px">
<el-tag <el-tag
style="padding: 0 30px" style="padding: 0 30px"
@ -205,7 +209,10 @@
</p> </p>
<p> <p>
<el-tooltip content="任务重试"> <el-tooltip content="任务重试">
<i class="el-icon-refresh-right success" @click="retryTask(item)" /> <i
class="el-icon-refresh-right success"
@click="retryTask(item)"
/>
</el-tooltip> </el-tooltip>
<el-tooltip content="强制结束"> <el-tooltip content="强制结束">
<i class="el-icon-close error" @click="endTask(item.id)" /> <i class="el-icon-close error" @click="endTask(item.id)" />
@ -312,7 +319,7 @@ export default {
primaryColor: '#00CCF2', primaryColor: '#00CCF2',
fileDesc: '', fileDesc: '',
fileMd5: '', fileMd5: '',
totalSize: 0, fileSize: 0,
createTime: '' createTime: ''
}, },
taskList: [], taskList: [],
@ -334,6 +341,11 @@ export default {
deviceOnline: false deviceOnline: false
} }
}, },
watch: {
fileList: function(val) {
this.sum = this.fileList.length
}
},
created() { created() {
this.getList() this.getList()
}, },
@ -468,10 +480,10 @@ export default {
this.addTaskVisible = false this.addTaskVisible = false
}, },
handleSuccess(res) { handleSuccess(res) {
const { fileName, fileMd5, totalSize } = res.data const { fileName, fileMd5, fileSize } = res.data
this.newFile.fileName = fileName this.newFile.fileName = fileName
this.newFile.fileMd5 = fileMd5 this.newFile.fileMd5 = fileMd5
this.newFile.totalSize = totalSize this.newFile.fileSize = fileSize
this.nextDisabled = false this.nextDisabled = false
this.$message.success('上传成功') this.$message.success('上传成功')
}, },
@ -529,24 +541,28 @@ export default {
updateType: task.updateType, updateType: task.updateType,
id: task.id id: task.id
} }
this.$confirm('确认重试任务?', '提示', { type: 'warning' }).then(() => { this.$confirm('确认重试任务?', '提示', { type: 'warning' })
retryTask(data).then(res => { .then(() => {
retryTask(data).then((res) => {
if (res.code === '200000') { if (res.code === '200000') {
this.$message.success('任务重试发起成功') this.$message.success('任务重试发起成功')
this.refresh(false) this.refresh(false)
} }
}) })
}).catch(err => {}) })
.catch((err) => {})
}, },
endTask(id) { endTask(id) {
this.$confirm('确认强制结束任务?', '提示', { type: 'warning' }).then(() => { this.$confirm('确认强制结束任务?', '提示', { type: 'warning' })
endTask({ id }).then(res => { .then(() => {
endTask({ id }).then((res) => {
if (res.code === '200000') { if (res.code === '200000') {
this.$message.success('任务强制结束成功') this.$message.success('任务强制结束成功')
this.refresh() this.refresh()
} }
}) })
}).catch(err => {}) })
.catch((err) => {})
}, },
refresh(needMsg = true) { refresh(needMsg = true) {
getTaskList({ fileName: this.currentFileName }).then((res) => { getTaskList({ fileName: this.currentFileName }).then((res) => {
@ -595,10 +611,10 @@ export default {
}) })
}, },
submit() { submit() {
if (!this.deviceOnline) { // if (!this.deviceOnline) {
this.$message.warning('请先检测设备是否在线并确保在线后再提交') // this.$message.warning('线线')
return // return
} // }
const date = new Date() const date = new Date()
const year = date.getFullYear() const year = date.getFullYear()
let month = date.getMonth() + 1 let month = date.getMonth() + 1
@ -848,10 +864,13 @@ export default {
p { p {
margin: 0; margin: 0;
text-align: center; text-align: center;
font-size: 22px; font-size: 16px;
font-family: Microsoft YaHei; font-family: Microsoft YaHei;
line-height: 30px; line-height: 30px;
color: #2e4765; color: #2e4765;
strong{
font-size: 18px;
}
.success { .success {
color: #20be0b; color: #20be0b;
margin: auto 10px; margin: auto 10px;

View File

@ -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.130.52: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: {