You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

117 lines
2.6 KiB

7 months ago
<template>
<!-- 设备概览 -->
<view class="overview">
<view class="main" v-for="(item, index) in deviceList" :key="index" >
<u--image :src="item.picUrl" radius="5" :lazy-load="true" width="80" height="80" @click="imgPreview(item.picUrl)"></u--image>
<view class="content" @click="toCheck(item)">
<view class="c-name">
<u-text :text="item.name"></u-text>
</view>
<view class="c-addtime">
<u-text :text="'截止:'+item.enableTime"></u-text>
</view>
<view class="c-status">
<u-tag text="待分配" plain size="mini" v-if="item.status==0"></u-tag>
<u-tag text="待办" plain size="mini" type="warning" v-if="item.status==1"></u-tag>
<u-tag text="待审核" plain size="mini" type="success" v-if="item.status==2"></u-tag>
<u-tag text="已归档" plain size="mini" type="success" v-if="item.status==3"></u-tag>
</view>
</view>
<u-icon name="arrow-right" @click="toCheck(item)"></u-icon>
</view>
<u-divider text="没有更多数据了"></u-divider>
</view>
</template>
<script>
export default {
data() {
return {
// 1.2搜索内容
search: '',
// 3.设备列表
deviceList: [
],
// 配置项
actionStyle: {
background: 'hsl(200, 88%, 55%)',
color: '#fafaff',
'border-radius': '1vw',
'line-height': '26px'
}
}
},
onShow: function() {
this.getList()
},
methods: {
async getList() {
const { data:res } = await this.$http('/taskRecords')
if(res.code) return
this.deviceList = res.data
for (var i = 0; i < this.deviceList.length; i++) {
this.deviceList[i].picUrl = this.API_URL+this.deviceList[i].picUrl;
}
},
imgPreview(url){
uni.previewImage({
indicator:"number",
loop:true,
urls: [url]
})
},
// 1.2搜索
async searchDevice() {
const { data:res } = await this.$http('app/assetBaseList', {
name: this.search
})
if(res.code) return
this.deviceList = res.data
},
// 跳转详情页
toCheck(item) {
wx.navigateTo({
url:'manage_details?manage='+JSON.stringify(item),
})
}
}
}
</script>
<style lang="scss">
.overview {
background: #f6f6f6;
padding: 2.667vw 0;
height: 100vh;
// 展示信息
.main {
background: #ffffff;
margin-bottom: 2.667vw;
display: flex;
justify-content: space-around;
padding: 2vh 0;
.u-image{
float: left;
}
.content{
flex-direction: column;
align-items: flex-start;
justify-content: space-around;
display: flex;
width: 55vw;
.c-status{
display: flex;
}
}
}
}
</style>