zmt
4 years ago
11 changed files with 567 additions and 11 deletions
-
9src/pages.json
-
29src/subpackage/device/components/store_name/store_name.vue
-
4src/subpackage/device/js/device_api.js
-
67src/subpackage/device/js/ouxuanac.md
-
2src/subpackage/device/pages/audio_manage/audio_manage.vue
-
129src/subpackage/device/pages/index/index.vue
-
336src/subpackage/device/pages/index/timing_list.vue
-
BINsrc/subpackage/device/static/images/arrow_b2_light.png
-
BINsrc/subpackage/device/static/images/arrow_back.png
-
BINsrc/subpackage/device/static/images/icon_clock.png
-
BINsrc/subpackage/device/static/images/index_bg.png
@ -0,0 +1,336 @@ |
|||
<template> |
|||
<view class="timing-page"> |
|||
<store-name></store-name> |
|||
<view class="t-title">定时列表</view> |
|||
<view class="t-box"> |
|||
<view class="tab-list"> |
|||
<view class="t-item " :class="e.on?'active':''" v-for="(e,i) in tabArr" @click="clickTab(i)"> |
|||
{{e.name}} |
|||
</view> |
|||
</view> |
|||
<view class="info-list"> |
|||
<view class="i-item" v-for="(item,index) in infoArr"> |
|||
<view class="i-box">{{item[0]}}</view> |
|||
<rich-text class="i-box" :nodes="item[1]"></rich-text> |
|||
<!-- {{item[1]}} --> |
|||
<view class="i-box" v-if="isDel(item)" @click="delItem(item,index)" style="color: red;">{{item[2]}}</view> |
|||
<view class="i-box" v-else>{{item[2]}}</view> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
</template> |
|||
|
|||
<script> |
|||
import util from '../../../../utils/util'; |
|||
import store_name from '../../components/store_name/store_name'; |
|||
import deviceServer from '../../js/device_server'; |
|||
import deviceApi from '../../js/device_api'; |
|||
|
|||
const rootPage = '/subpackage/device' |
|||
const tabArr = [{ |
|||
id: 0, |
|||
name: '全部', |
|||
path: ``, |
|||
on: true |
|||
}, |
|||
// { |
|||
// id: 1, |
|||
// name: '照明', |
|||
// path: ``, |
|||
// on: false |
|||
// }, |
|||
// { |
|||
// id: 2, |
|||
// name: '风扇', |
|||
// path: ``, |
|||
// on: false |
|||
// }, |
|||
// { |
|||
// id: 3, |
|||
// name: '水阀', |
|||
// path: ``, |
|||
// on: false |
|||
// }, |
|||
]; |
|||
const infoArr = [ |
|||
["标题", "时间", "操作"], |
|||
// ["2号场", "每个星期的 周日6:00 执行 开启 操作", "删除"], |
|||
]; |
|||
import { |
|||
mapState |
|||
} from 'vuex' |
|||
export default { |
|||
components: { |
|||
'store-name': store_name |
|||
}, |
|||
computed: { |
|||
...mapState({ |
|||
storeList: state => state.device.storeList, |
|||
curStoreInfo: state => state.device.curStoreInfo, |
|||
}), |
|||
isDel() { |
|||
return (item) => { |
|||
return item[2] == "删除" ? "true" : "" |
|||
} |
|||
} |
|||
}, |
|||
data() { |
|||
return { |
|||
tabArr, |
|||
infoArr, |
|||
} |
|||
}, |
|||
async onLoad(opts) { |
|||
|
|||
try { |
|||
util.showLoad(); |
|||
let _brandInfo = await this.$store.dispatch('getBrandInfo'); |
|||
await this.$store.dispatch('getStoreList'); |
|||
util.hideLoad(); |
|||
} catch (err) { |
|||
util.hideLoad(); |
|||
} |
|||
|
|||
}, |
|||
onShow() { |
|||
this.updateList() //更新中控信息 |
|||
}, |
|||
watch: { |
|||
curStoreInfo(newVal, oldVal){ |
|||
this.infoArr.length = 1 |
|||
this.updateList() |
|||
} |
|||
}, |
|||
methods: { |
|||
clickTab(i) { |
|||
this.tabArr.forEach((item) => { |
|||
item.on = false |
|||
}) |
|||
this.tabArr[i].on = true |
|||
}, |
|||
//删除计划任务 |
|||
delItem(e,i) { |
|||
let that = this |
|||
let delData = { |
|||
"device": this.curStoreInfo.device_name, |
|||
"delay": 1, |
|||
"data": { |
|||
"name": "delete-time-select", |
|||
"value": { |
|||
"uuid": e[3] |
|||
} |
|||
} |
|||
} |
|||
uni.showModal({ |
|||
content: `确认要删除: ${e[0]}的计划任务 ?`, |
|||
success(res) { |
|||
console.log("确认删除", res.confirm) |
|||
if(res.confirm){ |
|||
that.operateReq({ |
|||
data: delData, |
|||
succFun: (res) => { |
|||
that.updateList() |
|||
}, |
|||
isTip:true |
|||
}) |
|||
} |
|||
}, |
|||
}) |
|||
}, |
|||
async updateList() { |
|||
let that = this |
|||
let timingData = { |
|||
"device": this.curStoreInfo.device_name, |
|||
"data": { |
|||
"name": "get-time-select", |
|||
"value": {} |
|||
} |
|||
} |
|||
|
|||
this.operateReq({ |
|||
data: timingData, |
|||
succFun: (list) => { |
|||
that.infoArr.length = 1; |
|||
list.forEach(async (item,i)=> { |
|||
if(item.day_of_week)item.day_of_week = item.day_of_week.sort((a,b)=>a-b);//后端数据未排序 |
|||
let timetxt = await that.getTimeTxt(item); |
|||
that.infoArr.push([item.expand_value.main.title||"-",timetxt||"-","删除",item.time_arrow_id]) |
|||
}) |
|||
} |
|||
}) |
|||
}, |
|||
//该函数由后台管理前端提供逻辑, 与后台前端显示逻辑同步 |
|||
getTimeTxt(row) { |
|||
return new Promise((rs,rj)=>{ |
|||
let timeText = "" |
|||
if (!row.expand_value) { |
|||
rj('error') |
|||
} |
|||
if (row.type === 'DAY_OF_WEEK' && row.day_of_week) { |
|||
let arr = [] |
|||
for (let i = 0; i < row.day_of_week.length; i++) { |
|||
arr += ' 周' + ['日', '一', '二', '三', '四', '五', '六'][row.day_of_week[i]]; |
|||
} |
|||
timeText = `每个星期的 <strong>[${arr} ]</strong> ` |
|||
} |
|||
if (row.type === 'DAY_OF_MONTH' && row.day_of_month) { |
|||
let arr = [] |
|||
for (let i = 0; i < row.day_of_month.length; i++) { |
|||
arr += row.day_of_month[i] + '号 '; |
|||
} |
|||
timeText = `每个月的 <strong>[ ${arr} ]</strong> ` |
|||
} |
|||
if (row.type === 'DATE_SLICE' && row.date_slice) { |
|||
timeText = ` ${row.date_slice[0].start.substring(0, 10)}~${row.date_slice[0].end.substring(0, 10)}` |
|||
} |
|||
if (row.times_on_day && row.times_on_day.length) { |
|||
timeText += ` 当天<strong>${row.times_on_day[0].substring(0, 5)}</strong>` |
|||
} |
|||
if (!row.expand_value.main) return '历史错误数据'; |
|||
rs(` ${timeText} 执行 ${row.expand_value.main.value.status === 'high' ? '<strong style="color:gray;">[关闭]</strong>' : '<strong style="color:#009874;">[开启]</strong>'} 操作`) |
|||
}) |
|||
|
|||
}, |
|||
goBack() { |
|||
uni.navigateBack({ |
|||
delta: 1 |
|||
}) |
|||
}, |
|||
goTimingList() { |
|||
let timing_list = "/subpackage/device/pages/index/timing_list" |
|||
util.routeTo(`${timing_list}`, 'nT'); |
|||
}, |
|||
// 操作接口请求 |
|||
operateReq({ |
|||
data, |
|||
succFun, |
|||
isTip = false, |
|||
isLoad = true, |
|||
|
|||
}) { |
|||
let that = this |
|||
if (isLoad) util.showLoad(); |
|||
deviceServer.post({ |
|||
url: deviceApi.ouxuanac, |
|||
data: data, |
|||
isDefaultGet: false, |
|||
}) |
|||
.then(res => { |
|||
if (isLoad) util.hideLoad(); |
|||
if (res.data.code == 0) { |
|||
if (isTip) util.showNone(res.data.message || '操作成功！'); |
|||
succFun(res.data.data) |
|||
} else { |
|||
if (isTip) util.showNone(res.data.message || '操作失败！'); |
|||
} |
|||
}) |
|||
.catch(err => { |
|||
if (isLoad) util.hideLoad() |
|||
}) |
|||
}, |
|||
|
|||
} |
|||
} |
|||
</script> |
|||
|
|||
<style lang="scss"> |
|||
@import '~style/public.scss'; |
|||
|
|||
.timing-page { |
|||
|
|||
.t-title { |
|||
font-size: 44rpx; |
|||
color: #1A1A1A; |
|||
font-weight: 900; |
|||
margin: 60rpx auto 72rpx 40rpx; |
|||
} |
|||
|
|||
.t-box { |
|||
height: 500rpx; |
|||
display: flex; |
|||
flex-direction: column; |
|||
align-items: center; |
|||
justify-content: flex-start; |
|||
width: 100%; |
|||
|
|||
.tab-list { |
|||
width: 100%; |
|||
padding-left: 30rpx; |
|||
@include centerFlex(flex-start); |
|||
flex-wrap: nowrap; |
|||
position: relative; |
|||
|
|||
.t-item { |
|||
margin-right: 50rpx; |
|||
padding: 10rpx; |
|||
font-size: 32rpx; |
|||
font-weight: 900; |
|||
color: #9C9C9F; |
|||
line-height: 40rpx; |
|||
} |
|||
|
|||
.active { |
|||
color: #009874; |
|||
@include centerFlex(center); |
|||
flex-direction: column; |
|||
} |
|||
|
|||
.active:after { |
|||
position: absolute; |
|||
content: ""; |
|||
background-color: #009874; |
|||
color: #009874; |
|||
width: auto; |
|||
display: block; |
|||
width: 30rpx; |
|||
text-align: center; |
|||
height: 6rpx; |
|||
border-radius: 3rpx; |
|||
top: 60rpx; |
|||
} |
|||
} |
|||
|
|||
.info-list { |
|||
margin-top: 30rpx; |
|||
margin-bottom: 50rpx; |
|||
width: 700rpx; |
|||
height: auto; |
|||
background: #FFFFFF; |
|||
border-radius: 10rpx; |
|||
font-size: 28rpx; |
|||
|
|||
.i-item { |
|||
@include centerFlex(space-between); |
|||
|
|||
.i-box { |
|||
@include centerFlex(center); |
|||
flex-direction: row; |
|||
padding: 26rpx 10rpx; |
|||
height: 100%; |
|||
} |
|||
|
|||
.i-box:first-child { |
|||
width: 176rpx; |
|||
} |
|||
|
|||
.i-box:nth-child(2) { |
|||
width: 100%; |
|||
border: 1rpx solid #F2F2F7; |
|||
border-bottom: none; |
|||
border-top: none; |
|||
} |
|||
|
|||
.i-box:last-child { |
|||
width: 114rpx; |
|||
} |
|||
} |
|||
|
|||
.i-item:not(:last-child) { |
|||
border-bottom: 1rpx solid #F2F2F7; |
|||
} |
|||
|
|||
} |
|||
} |
|||
} |
|||
</style> |
|||
|
After Width: 14 | Height: 14 | Size: 311 B |
|
After Width: 20 | Height: 20 | Size: 395 B |
|
After Width: 14 | Height: 14 | Size: 512 B |
|
After Width: 187 | Height: 155 | Size: 16 KiB |
Write
Preview
Loading…
Cancel
Save
Reference in new issue