284 lines
6.8 KiB
Vue
284 lines
6.8 KiB
Vue
<template>
|
|
<!-- 顶部导航栏 -->
|
|
<custom-nav-bar :left="true" leftText="" @leftClick="" title="地块详情">
|
|
</custom-nav-bar>
|
|
<view class="item-container" :style="{ height: `${windowHeight}px` }" @touchmove.stop.prevent="() => {}">
|
|
<u-gap height="10" bgColor="#F3F3F3"></u-gap>
|
|
<view class="card">
|
|
<view class="cards-title">
|
|
<view>
|
|
<view class="text">地块编号：{{ item.landNum }}</view>
|
|
|
|
</view>
|
|
<view class="title-r">
|
|
<uni-tag :text="item.status == 0 ? '启用' : '禁用'" :circle="true"
|
|
:type="item.status == 0 ? 'success' : 'error'" ></uni-tag>
|
|
</view>
|
|
</view>
|
|
<view class="cards-content">
|
|
<view class="txt-list">
|
|
<view class="list1">
|
|
<view>地块名称：{{ item.landName }}</view>
|
|
<view>地块地址：{{ item.landAddress || "-" }}</view>
|
|
<view>地块面积：{{ item.landArea != null ? item.landArea : "" }}</view>
|
|
<view>土壤类型：{{ getDictName(1, item.soilType) }}</view>
|
|
<view>水源类型：{{ getDictName(2, item.waterSourceType) }}</view>
|
|
<view>是否分组：<text v-if="item.landConfig.enableGroup === 0">是</text>
|
|
<text v-if="item.landConfig.enableGroup === 1">否</text>
|
|
</view>
|
|
<view>启用蝶阀：<text v-if="item.landConfig.enableButterflyValve === 0">启用</text>
|
|
<text v-if="item.landConfig.enableButterflyValve === 1">禁用</text>
|
|
</view>
|
|
<view>启用批量控制：<text v-if="item.landConfig.enableBatchControl === 0">是</text>
|
|
<text v-if="item.landConfig.enableBatchControl === 1">否</text>
|
|
</view>
|
|
<view>启用自动刷新：<text v-if="item.landConfig.enableAutoRefresh === 0">是</text>
|
|
<text v-if="item.landConfig.enableAutoRefresh === 1">否</text>
|
|
</view>
|
|
<view>所属公司：<text v-if="item.companyGroup && item.companyGroup.companyFullName">
|
|
{{item.companyGroup.companyFullName}}
|
|
</text>
|
|
</view>
|
|
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
<view class="charge">
|
|
<view class="flex item charge-item">
|
|
<view style="color: #939393">负责人：</view>
|
|
<view>{{ item.user.userName }}</view>
|
|
</view>
|
|
<view class="flex item charge-item">
|
|
<view style="color: #939393">手机号码：</view>
|
|
<view v-if="item.user && item.user.mobilePhone">{{ item.user.mobilePhone }}</view>
|
|
</view>
|
|
<view class="call">
|
|
<u--text text="打电话" color="#009933" iconStyle="margin-right:5px"
|
|
prefixIcon="../../../static/images/work/user/user-index-phone-icon.png"
|
|
@click="onClickPhone(item.mobilePhone)"></u--text>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</template>
|
|
<script>
|
|
import plugin from "@/plugins"
|
|
import store from "@/store"
|
|
export default {
|
|
data() {
|
|
return {
|
|
windowHeight: null,
|
|
item: {},
|
|
soilType: [],
|
|
waterSourceType: [],
|
|
paging: null,
|
|
form: null,
|
|
treeList: [],
|
|
query: {
|
|
companyId: null,
|
|
landName: null
|
|
},
|
|
selectCompanyObj: {}
|
|
}
|
|
},
|
|
created() {
|
|
this.windowHeight = uni.getSystemInfoSync().windowHeight;
|
|
},
|
|
onLoad(options) {
|
|
this.item = JSON.parse(decodeURIComponent(options.item));
|
|
this.getDictList("custom_soil_type");
|
|
this.getDictList("custom_water_source_type");
|
|
this.getLandInfo();
|
|
},
|
|
methods: {
|
|
getDictList(type) {
|
|
store
|
|
.dispatch("getDictList", type)
|
|
.then(res => {
|
|
const obj = res.data.reduce((accumulator, current) => {
|
|
accumulator[current.dictValue] = current;
|
|
return accumulator;
|
|
}, {});
|
|
if (type == "custom_soil_type") {
|
|
this.soilType = obj
|
|
}
|
|
if (type == "custom_water_source_type") {
|
|
this.waterSourceType = obj
|
|
}
|
|
})
|
|
.catch(error => {
|
|
plugin.modal.msgError(error)
|
|
})
|
|
.finally(() => {
|
|
plugin.modal.closeLoading()
|
|
})
|
|
},
|
|
getLandInfo() {
|
|
store
|
|
.dispatch("getLandInfo", this.item.id)
|
|
.then(res => {
|
|
if (res.data != null) {
|
|
this.item = res.data;
|
|
}
|
|
})
|
|
.catch(error => {
|
|
plugin.modal.msgError(error)
|
|
})
|
|
.finally(() => {
|
|
plugin.modal.closeLoading()
|
|
})
|
|
},
|
|
getDictName(type, value) {
|
|
const that = this;
|
|
let text = "";
|
|
if (value) {
|
|
if (type == 1) {
|
|
if (that.soilType[String(type)] && that.soilType[String(type)].dictLabel) {
|
|
text = that.soilType[String(type)].dictLabel
|
|
}
|
|
}
|
|
if (type == 2) {
|
|
value = value.split(',');
|
|
value.forEach(item => {
|
|
if (text == "") {
|
|
if (that.waterSourceType[String(item)] && that.waterSourceType[String(item)]
|
|
.dictLabel) {
|
|
text = that.waterSourceType[String(item)].dictLabel
|
|
}
|
|
} else {
|
|
if (that.waterSourceType[String(item)] && that.waterSourceType[String(item)]
|
|
.dictLabel) {
|
|
text = text + "," + that.waterSourceType[String(item)].dictLabel;
|
|
}
|
|
}
|
|
});
|
|
}
|
|
}
|
|
return text;
|
|
},
|
|
onClickPhone(phone) {
|
|
plugin.modal.confirm("是否拨打电话?").then(res => {
|
|
//#ifdef APP-PLUS
|
|
plus.device.dial(phone, true)
|
|
//#endif
|
|
//#ifdef MP-WEIXIN
|
|
uni.makePhoneCall({
|
|
phoneNumber: phone,
|
|
fail: res => {
|
|
console.log(res)
|
|
},
|
|
success: res => {
|
|
console.log("success" + res)
|
|
}
|
|
})
|
|
//#endif
|
|
})
|
|
}
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<style lang="scss">
|
|
.item-container {
|
|
background: #f3f3f3;
|
|
}
|
|
|
|
.flex {
|
|
display: flex;
|
|
align-items: center;
|
|
}
|
|
|
|
.item {
|
|
margin-bottom: 5px;
|
|
}
|
|
|
|
.info {
|
|
background: white;
|
|
margin: 10px 10px;
|
|
padding: 10px;
|
|
border-radius: 10px;
|
|
box-shadow: 1px 1px 2px 2px rgba(0, 0, 0, 0.05);
|
|
|
|
.title {
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: space-between;
|
|
margin: 10px 10px;
|
|
}
|
|
|
|
.info-item {
|
|
margin-left: 20px;
|
|
}
|
|
}
|
|
|
|
.charge {
|
|
background: white;
|
|
margin: 10px 10px;
|
|
padding: 20px 10px;
|
|
border-radius: 10px;
|
|
box-shadow: 1px 1px 2px 2px rgba(0, 0, 0, 0.05);
|
|
position: relative;
|
|
|
|
.charge-item {
|
|
margin-left: 20px;
|
|
}
|
|
|
|
.call {
|
|
position: absolute;
|
|
top: 20px;
|
|
right: 20px;
|
|
}
|
|
}
|
|
|
|
.buttons {
|
|
background: white;
|
|
margin: 30px 20px;
|
|
padding: 10px 0;
|
|
border-radius: 10px;
|
|
box-shadow: rgba(50, 50, 93, 0.25) 0px 13px 27px -5px, rgba(0, 0, 0, 0.3) 0px 8px 16px -8px;
|
|
position: absolute;
|
|
width: calc(100% - 40px);
|
|
bottom: 0%;
|
|
transition: all 0.1s;
|
|
box-sizing: border-box;
|
|
|
|
.row1 {
|
|
margin-bottom: 20px;
|
|
width: 100%;
|
|
display: flex;
|
|
align-items: center;
|
|
|
|
&>view {
|
|
width: 25%;
|
|
white-space: nowrap;
|
|
text-align: center;
|
|
display: flex;
|
|
flex-direction: column;
|
|
justify-content: center;
|
|
align-items: center;
|
|
}
|
|
}
|
|
|
|
.row2 {
|
|
width: 100%;
|
|
display: flex;
|
|
align-items: center;
|
|
|
|
&>view {
|
|
width: 25%;
|
|
white-space: nowrap;
|
|
text-align: center;
|
|
display: flex;
|
|
flex-direction: column;
|
|
justify-content: center;
|
|
align-items: center;
|
|
}
|
|
}
|
|
}
|
|
|
|
.font {
|
|
margin-top: 5px;
|
|
font-size: 12px;
|
|
text-align: center;
|
|
}
|
|
</style> |