618 lines
15 KiB
Vue
618 lines
15 KiB
Vue
<template>
|
|
<view class="pages">
|
|
<u-navbar title="设备管理" :border-bottom="false" :background="bgc" back-icon-color="#3D3D3D" title-color='#3D3D3D'
|
|
title-size='36' height='44'></u-navbar>
|
|
<view class="nav">
|
|
<view class="tab">
|
|
<view @click="btntab(1)" :class="indexactive == 1 ? 'active' : ''">全部</view>
|
|
<view @click="btntab(2)" :class="indexactive == 2 ? 'active' : ''">使用中</view>
|
|
<view @click="btntab(3)" :class="indexactive == 3 ? 'active' : ''">待使用</view>
|
|
<view @click="btntab(4)" :class="indexactive == 4 ? 'active' : ''">仓库中</view>
|
|
<view @click="btntab(5)" :class="indexactive == 5 ? 'active' : ''">投放中</view>
|
|
</view>
|
|
<view class="serch">
|
|
<image src="https://api.ccttiot.com/smartmeter/img/static/uBY0VGovU7BZrSdUi7cn" mode=""></image>
|
|
<input type="text" v-model="keyword" @blur="blurs" placeholder="请输入内容" />
|
|
</view>
|
|
</view>
|
|
<!-- 设备 -->
|
|
<scroll-view scroll-y="true" @scrolltolower="onScrollToLower" style="height: 1300rpx;" class="list">
|
|
<view class="list_item" v-for="(item,index) in wateringList" :key="index" @click="btnxq(item.deviceId)">
|
|
<view class="top">
|
|
<view class="bh">设备编号：{{item.deviceNo == undefined ? '--' : item.deviceNo}}</view>
|
|
<view class="zx" v-if="item.onlineStatus == 1">
|
|
<view class="yuan"></view>
|
|
<view class="wz">在线</view>
|
|
</view>
|
|
<view class="zx" v-else>
|
|
<view class="yuan" style="background-color: red;"></view>
|
|
<view style="color: red;">离线</view>
|
|
</view>
|
|
</view>
|
|
<view class="bd">
|
|
<view class="one">设备类型</view>
|
|
<view class="one">{{item.model == undefined ? '--' : item.model}}</view>
|
|
</view>
|
|
<view class="bd">
|
|
<view class="one">经营场所</view>
|
|
<view class="one" v-if="item.storeName">{{item.storeName == undefined ? '--' : item.storeName}}
|
|
</view>
|
|
<view class="wbd" v-else style="color: #8883F0;" @click.stop="btnbds(item.deviceId)">未绑定</view>
|
|
</view>
|
|
<view class="bd">
|
|
<view class="one" style="width: 160rpx;">经营地址</view>
|
|
<view class="one">{{item.storeAddress == undefined ? '--' : item.storeAddress}}</view>
|
|
</view>
|
|
<view class="cen" v-if="type == 2">
|
|
<view class="fj">所在房间</view>
|
|
<input type="text" v-model="item.room" :placeholder="item.room == undefined ? '无' : item.room" @change="change(item.room)" @click.stop="" />
|
|
<view class="btn" @click.stop="btnedit(item.deviceId)" v-if="type == 2">修改</view>
|
|
</view>
|
|
<view class="cen" v-else>
|
|
<view class="fj">所在房间</view>
|
|
<view>{{item.room}}</view>
|
|
</view>
|
|
<view class="devixexq">
|
|
<view class="xiaoav">
|
|
<view class="">设备状态</view>
|
|
<view style="color: rgb(18, 210, 172);;" v-if="item.status == 2">使用中</view>
|
|
<view style="color: rgb(18, 210, 172);;" v-if="item.status == 1">正常</view>
|
|
<view style="color: red;" v-if="item.status == 3">不可用</view>
|
|
</view>
|
|
<view class="xiaoav">
|
|
<view class="">所属合作伙伴</view>
|
|
<view class="">{{item.agentName == undefined ? '--' : item.agentName}}</view>
|
|
</view>
|
|
<view class="xiaoav">
|
|
<view class="">所属渠道商</view>
|
|
<view class="">{{item.bizManName == undefined ? '--' : item.bizManName}}</view>
|
|
<!-- <view class="wbd" v-else @click.stop="btnbd">未绑定</view> -->
|
|
</view>
|
|
<view class="xiaoav">
|
|
<view class="">所属创业者</view>
|
|
<view class="" v-if="item.userId">{{item.userName == undefined ? '--' : item.userName}}</view>
|
|
<view class="wbd" v-else @click.stop="btntz(item.deviceId)">未绑定</view>
|
|
</view>
|
|
</view>
|
|
<view class="zong">
|
|
<view class="xiaoav">
|
|
<view class="">订单总数</view>
|
|
<view class="">{{item.orderCount == undefined ? '--' : item.orderCount}}</view>
|
|
</view>
|
|
<view class="xiaoav">
|
|
<view class="">订单总金额</view>
|
|
<view class="">￥{{item.orderAmount == undefined ? '--' : item.orderAmount}}</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
<view class="" style="width: 100%;text-align: center;color: #ccc;margin-top: 50rpx;">
|
|
-已经到底了-
|
|
</view>
|
|
</scroll-view>
|
|
<!-- 渠道商 -->
|
|
<!-- <u-select v-model="show" :list="list" @confirm="confirm"></u-select> -->
|
|
<!-- 经营场所 -->
|
|
<u-select v-model="shows" :list="lists" @confirm="confirms"></u-select>
|
|
<!-- 投资 -->
|
|
<u-select v-model="showtz" :list="listtz" @confirm="confirmtz"></u-select>
|
|
</view>
|
|
</template>
|
|
|
|
<script>
|
|
export default {
|
|
data() {
|
|
return {
|
|
bgc: {
|
|
backgroundColor: "#fff",
|
|
},
|
|
indexactive: 1,
|
|
show: false,
|
|
room: '',
|
|
shows: false,
|
|
showtz: false,
|
|
listtz: [],
|
|
lists: [],
|
|
list: [{
|
|
value: '1',
|
|
label: '张三'
|
|
},
|
|
{
|
|
value: '2',
|
|
label: '李四'
|
|
}, {
|
|
value: '3',
|
|
label: '王五'
|
|
}
|
|
],
|
|
pagenum: 1,
|
|
wateringList: [],
|
|
pagesize: 10, // 一页多少数据
|
|
total: 0,
|
|
type: 2,
|
|
keyword: '',
|
|
statusList: '',
|
|
deviceId: '',
|
|
type:'',
|
|
isUsing:''
|
|
}
|
|
},
|
|
onLoad(option) {
|
|
this.type = option.type
|
|
this.getlist()
|
|
this.gettzr()
|
|
this.getchangsuo()
|
|
},
|
|
// 分享到好友（会话）
|
|
onShareAppMessage: function() {
|
|
return {
|
|
title: '创亿康',
|
|
path: '/pages/index/index'
|
|
}
|
|
},
|
|
|
|
// 分享到朋友圈
|
|
onShareTimeline: function() {
|
|
return {
|
|
title: '创亿康',
|
|
query: '',
|
|
path: '/pages/index/index'
|
|
}
|
|
},
|
|
methods: {
|
|
// 切换tab高亮
|
|
btntab(num) {
|
|
this.indexactive = num
|
|
if (num == 1) {
|
|
this.wateringList = []
|
|
this.pagenum = 1
|
|
this.statusList = ''
|
|
this.isUsing = ''
|
|
this.getlist()
|
|
} else if (num == 2) {
|
|
this.wateringList = []
|
|
this.pagenum = 1
|
|
this.statusList = 2
|
|
this.isUsing = true
|
|
this.getlist()
|
|
} else if (num == 3) {
|
|
this.wateringList = []
|
|
this.pagenum = 1
|
|
this.statusList = 1
|
|
this.isUsing = false
|
|
this.getlist()
|
|
} else if (num == 4) {
|
|
this.wateringList = []
|
|
this.pagenum = 1
|
|
this.statusList = 3
|
|
this.isUsing = ''
|
|
this.getlist()
|
|
} else {
|
|
this.wateringList = []
|
|
this.pagenum = 1
|
|
this.statusList = '2,3'
|
|
this.isUsing = ''
|
|
this.getlist()
|
|
}
|
|
},
|
|
// 跳转到详情
|
|
btnxq(deviceId) {
|
|
uni.navigateTo({
|
|
url: '/page_user/deviceedit?deviceId=' + deviceId
|
|
})
|
|
},
|
|
change(room){
|
|
this.room = room
|
|
},
|
|
// 修改房间号
|
|
btnedit(deviceId) {
|
|
let data = {
|
|
deviceId: deviceId,
|
|
room: this.room
|
|
}
|
|
this.$u.put(`agent/device`, data).then(res => {
|
|
if (res.code == 200) {
|
|
uni.showToast({
|
|
title: res.msg,
|
|
icon: 'success',
|
|
duration: 1000,
|
|
})
|
|
} else {
|
|
uni.showToast({
|
|
title: res.msg,
|
|
icon: 'none',
|
|
duration: 1000,
|
|
})
|
|
}
|
|
})
|
|
},
|
|
// 点击绑定渠道商
|
|
// btnbd() {
|
|
// this.show = true
|
|
// },
|
|
// 点击绑定创业者
|
|
btntz(deviceId) {
|
|
this.showtz = true
|
|
this.deviceId = deviceId
|
|
},
|
|
// 点击确定绑定创业者
|
|
confirmtz(e) {
|
|
let userId = e[0].value
|
|
let data = {
|
|
deviceId: this.deviceId,
|
|
userId: userId
|
|
}
|
|
this.$u.put(`agent/device`, data).then(res => {
|
|
if (res.code == 200) {
|
|
uni.showToast({
|
|
title: res.msg,
|
|
icon: 'success',
|
|
duration: 1000,
|
|
})
|
|
this.wateringList = []
|
|
this.pagenum = 1
|
|
this.getlist()
|
|
} else {
|
|
uni.showToast({
|
|
title: res.msg,
|
|
icon: 'none',
|
|
duration: 1000,
|
|
})
|
|
}
|
|
})
|
|
},
|
|
// 点击绑定经营场所
|
|
btnbds(deviceId) {
|
|
this.shows = true
|
|
this.deviceId = deviceId
|
|
},
|
|
confirms(e) {
|
|
let storeId = e[0].value
|
|
let data = {
|
|
deviceId: this.deviceId,
|
|
storeId: storeId
|
|
}
|
|
this.$u.put(`agent/device`, data).then(res => {
|
|
if (res.code == 200) {
|
|
uni.showToast({
|
|
title: res.msg,
|
|
icon: 'success',
|
|
duration: 1000,
|
|
})
|
|
this.wateringList = []
|
|
this.pagenum = 1
|
|
this.getlist()
|
|
} else {
|
|
uni.showToast({
|
|
title: res.msg,
|
|
icon: 'none',
|
|
duration: 1000,
|
|
})
|
|
}
|
|
})
|
|
},
|
|
|
|
//获取列表
|
|
getlist() {
|
|
// 合作伙伴（代理）
|
|
if(this.type == 2){
|
|
this.$u.get(
|
|
`/agent/device/list?pageNum=${this.pagenum}&pageSize=${this.pagesize}&statusList=${this.statusList}&keyword=${this.keyword}&isUsing=${this.isUsing}`
|
|
).then(res => {
|
|
if (res.code == 200) {
|
|
this.total = res.total
|
|
if (res.rows.length > 0) {
|
|
// 有数据，追加到列表
|
|
this.wateringList = this.wateringList.concat(res.rows)
|
|
this.pagenum++
|
|
}
|
|
}
|
|
})
|
|
// 创业者（投资人）
|
|
}else if(this.type == 4){
|
|
this.$u.get(
|
|
`/app/device/list?pageNum=${this.pagenum}&pageSize=${this.pagesize}&statusList=${this.statusList}&keyword=${this.keyword}&isUsing=${this.isUsing}`
|
|
).then(res => {
|
|
if (res.code == 200) {
|
|
this.total = res.total
|
|
if (res.rows.length > 0) {
|
|
// 有数据，追加到列表
|
|
this.wateringList = this.wateringList.concat(res.rows)
|
|
this.pagenum++
|
|
}
|
|
}
|
|
})
|
|
// 渠道商（业务员）
|
|
}else if(this.type == 3){
|
|
this.$u.get(
|
|
`/biz/device/list?pageNum=${this.pagenum}&pageSize=${this.pagesize}&statusList=${this.statusList}&keyword=${this.keyword}&isUsing=${this.isUsing}`
|
|
).then(res => {
|
|
if (res.code == 200) {
|
|
this.total = res.total
|
|
if (res.rows.length > 0) {
|
|
// 有数据，追加到列表
|
|
this.wateringList = this.wateringList.concat(res.rows)
|
|
this.pagenum++
|
|
}
|
|
}
|
|
})
|
|
// 经营场所
|
|
}else if(this.type == 5){
|
|
this.$u.get(
|
|
`store/device/list?pageNum=${this.pagenum}&pageSize=${this.pagesize}&statusList=${this.statusList}&keyword=${this.keyword}&isUsing=${this.isUsing}`
|
|
).then(res => {
|
|
if (res.code == 200) {
|
|
this.total = res.total
|
|
if (res.rows.length > 0) {
|
|
// 有数据，追加到列表
|
|
this.wateringList = this.wateringList.concat(res.rows)
|
|
this.pagenum++
|
|
}
|
|
}
|
|
})
|
|
}
|
|
},
|
|
|
|
|
|
// 滚动到底部
|
|
onScrollToLower() {
|
|
if (this.total > this.wateringList.length) {
|
|
this.getlist() // 上拉加载更多
|
|
}
|
|
},
|
|
|
|
// 失焦搜索
|
|
blurs() {
|
|
this.wateringList = []
|
|
this.pagenum = 1
|
|
this.getlist()
|
|
},
|
|
getinfo(){
|
|
this.$u.get(`/app/user/userInfo`).then(res => {
|
|
if(res.code == 200){
|
|
if(res.data.type == 2){
|
|
this.gettzr()
|
|
}else{
|
|
this.gettzrs()
|
|
}
|
|
}
|
|
})
|
|
},
|
|
// 合作伙伴取所有创业者
|
|
gettzr() {
|
|
this.$u.get(`/agent/user/allInvestorList`).then(res => {
|
|
if (res.code == 200) {
|
|
res.data.forEach(item => {
|
|
this.listtz.push({
|
|
label: item.userName,
|
|
value: item.userId
|
|
})
|
|
})
|
|
}
|
|
})
|
|
},
|
|
// 渠道商
|
|
// gettzr() {
|
|
// this.$u.get(`/biz/user/allInvestorList`).then(res => {
|
|
// if (res.code == 200) {
|
|
// res.data.forEach(item => {
|
|
// this.listtz.push({
|
|
// label: item.userName,
|
|
// value: item.userId
|
|
// })
|
|
// })
|
|
// }
|
|
// })
|
|
// },
|
|
|
|
// 获取所有的经营场所
|
|
getchangsuo() {
|
|
this.$u.get(`/agent/store/allList`).then(res => {
|
|
if (res.code == 200) {
|
|
res.data.forEach(item => {
|
|
this.lists.push({
|
|
label: item.name,
|
|
value: item.storeId
|
|
})
|
|
})
|
|
}
|
|
})
|
|
},
|
|
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<style lang="scss" scoped>
|
|
.active {
|
|
color: #3D3D3D !important;
|
|
border-bottom: 6rpx solid #8883F0;
|
|
}
|
|
|
|
/deep/ .u-title {
|
|
padding-bottom: 15rpx;
|
|
}
|
|
|
|
/deep/ .u-icon__icon {
|
|
padding-bottom: 15rpx;
|
|
}
|
|
|
|
.pages {
|
|
background-color: #F7FAFE !important;
|
|
height: 100vh;
|
|
width: 100%;
|
|
overflow: hidden;
|
|
|
|
.list {
|
|
padding: 0 38rpx;
|
|
box-sizing: border-box;
|
|
padding-bottom: 200rpx;
|
|
box-sizing: border-box;
|
|
|
|
.list_item {
|
|
max-height: 618rpx;
|
|
padding: 24rpx 28rpx;
|
|
box-sizing: border-box;
|
|
background-color: #fff;
|
|
background: #FFFFFF;
|
|
box-shadow: 0rpx 4rpx 22rpx 0rpx rgba(0, 0, 0, 0.07);
|
|
border-radius: 20rpx 20rpx 20rpx 20rpx;
|
|
margin-top: 20rpx;
|
|
|
|
.devixexq {
|
|
display: flex;
|
|
justify-content: space-between;
|
|
margin-top: 14rpx;
|
|
text-align: center;
|
|
|
|
.xiaoav {
|
|
font-size: 24rpx;
|
|
color: #3D3D3D;
|
|
|
|
view {
|
|
margin-top: 12rpx;
|
|
}
|
|
|
|
.wbd {
|
|
color: #8883F0 !important;
|
|
}
|
|
}
|
|
}
|
|
|
|
.zong {
|
|
margin-top: 14rpx;
|
|
display: flex;
|
|
justify-content: space-between;
|
|
text-align: center;
|
|
padding: 0 50rpx;
|
|
box-sizing: border-box;
|
|
font-size: 24rpx;
|
|
color: #3D3D3D;
|
|
|
|
view {
|
|
margin-top: 12rpx;
|
|
}
|
|
}
|
|
|
|
.cen {
|
|
display: flex;
|
|
justify-content: space-between;
|
|
margin-top: 22rpx;
|
|
align-items: center;
|
|
border-bottom: 1px solid #D8D8D8;
|
|
padding-bottom: 34rpx;
|
|
box-sizing: border-box;
|
|
|
|
.fj {
|
|
font-size: 24rpx;
|
|
color: #3D3D3D;
|
|
}
|
|
|
|
input {
|
|
width: 346rpx;
|
|
height: 38rpx;
|
|
background: #F0F0F0;
|
|
border-radius: 8rpx 8rpx 8rpx 8rpx;
|
|
padding-left: 30rpx;
|
|
box-sizing: border-box;
|
|
color: #808080;
|
|
}
|
|
|
|
.btn {
|
|
width: 110rpx;
|
|
height: 38rpx;
|
|
background: #8883F0;
|
|
border-radius: 8rpx 8rpx 8rpx 8rpx;
|
|
text-align: center;
|
|
line-height: 38rpx;
|
|
font-size: 20rpx;
|
|
color: #FFFFFF;
|
|
}
|
|
}
|
|
|
|
.top {
|
|
display: flex;
|
|
justify-content: space-between;
|
|
border-bottom: 1px solid #D8D8D8;
|
|
padding-bottom: 26rpx;
|
|
box-sizing: border-box;
|
|
|
|
.bh {
|
|
font-size: 24rpx;
|
|
color: #3D3D3D;
|
|
}
|
|
|
|
.zx {
|
|
display: flex;
|
|
align-items: center;
|
|
|
|
.yuan {
|
|
width: 14rpx;
|
|
height: 14rpx;
|
|
background: #12D2AC;
|
|
border-radius: 50%;
|
|
margin-right: 10rpx;
|
|
}
|
|
|
|
.wz {
|
|
font-size: 24rpx;
|
|
color: #12D2AC;
|
|
}
|
|
}
|
|
}
|
|
|
|
.bd {
|
|
display: flex;
|
|
justify-content: space-between;
|
|
font-size: 24rpx;
|
|
color: #3D3D3D;
|
|
margin-top: 22rpx;
|
|
}
|
|
}
|
|
}
|
|
|
|
.nav {
|
|
background-color: #fff;
|
|
width: 100%;
|
|
height: 280rpx;
|
|
|
|
.serch {
|
|
width: 672rpx;
|
|
height: 100rpx;
|
|
background: #F4F4F4;
|
|
border-radius: 10rpx 10rpx 10rpx 10rpx;
|
|
display: flex;
|
|
margin: auto;
|
|
margin-top: 28rpx;
|
|
align-items: center;
|
|
padding-left: 30rpx;
|
|
box-sizing: border-box;
|
|
|
|
input {
|
|
width: 80%;
|
|
}
|
|
|
|
image {
|
|
width: 36rpx;
|
|
height: 36rpx;
|
|
margin-right: 26rpx;
|
|
}
|
|
}
|
|
|
|
.tab {
|
|
display: flex;
|
|
justify-content: space-between;
|
|
padding: 0 50rpx;
|
|
box-sizing: border-box;
|
|
padding-top: 46rpx;
|
|
font-size: 36rpx;
|
|
color: #808080;
|
|
font-weight: 600;
|
|
|
|
view {
|
|
padding-bottom: 10rpx;
|
|
box-sizing: border-box;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
</style> |