549 lines
12 KiB
Vue
549 lines
12 KiB
Vue
<template>
|
|
<view class="fullHeight">
|
|
<headers :showBack="false" class="">
|
|
<view class="headerName">
|
|
智慧梁场
|
|
<view class="headerScan">
|
|
<u-icon name="scan" color="#333333" size="40"></u-icon>
|
|
</view>
|
|
<view class="headerBack" @click="returnBack">
|
|
<u-icon name="arrow-left" color="#333333" size="40"></u-icon>
|
|
</view>
|
|
</view>
|
|
</headers>
|
|
<view class="menuBox">
|
|
<view class="menuItem" @click="changeMenu(0)">
|
|
<view class="imgBox" v-if="tabIndex === 0">
|
|
<image class="img" src="/static/smartBeamField/jiHua_active.png"></image>
|
|
</view>
|
|
<view class="imgBox" v-else>
|
|
<image class="img" src="/static/smartBeamField/jiHua.png"></image>
|
|
</view>
|
|
<view class="menuText">
|
|
计划管理
|
|
</view>
|
|
|
|
</view>
|
|
<view class="menuItem" @click="changeMenu(1)">
|
|
<view class="imgBox" v-if="tabIndex === 1">
|
|
<image class="img" src="/static/smartBeamField/liang_active.png"></image>
|
|
</view>
|
|
<view class="imgBox" v-else>
|
|
<image class="img" src="/static/smartBeamField/liang.png"></image>
|
|
</view>
|
|
<view class="menuText">
|
|
梁管理
|
|
</view>
|
|
</view>
|
|
<view class="menuItem" @click="changeMenu(2)">
|
|
<view class="imgBox" v-if="tabIndex === 2">
|
|
<image class="img" src="/static/smartBeamField/cunLiang_active.png"></image>
|
|
</view>
|
|
<view class="imgBox" v-else>
|
|
<image class="img" src="/static/smartBeamField/liang.png"></image>
|
|
</view>
|
|
|
|
<view class="menuText">
|
|
存梁区管理
|
|
</view>
|
|
</view>
|
|
<view class="menuItem" @click="changeMenu(3)">
|
|
<view class="imgBox" v-if="tabIndex === 3">
|
|
<image class="img" src="/static/smartBeamField/zhiLiang_active.png"></image>
|
|
</view>
|
|
<view class="imgBox" v-else>
|
|
<image class="img" src="/static/smartBeamField/taiZuo.png"></image>
|
|
</view>
|
|
<view class="menuText">
|
|
制梁台座管理
|
|
</view>
|
|
</view>
|
|
</view>
|
|
|
|
<view class="dataList" v-if="tabIndex==0">
|
|
<!-- <uni-datetime-picker v-model="datetimerange" type="datetimerange" rangeSeparator="至"
|
|
@change="rangeTimeChange" /> -->
|
|
<view class="listTitle">
|
|
桥段列表
|
|
</view>
|
|
<view class="listSearch">
|
|
<u-search v-model="sectionSearch" input-align="left" height="70" :action-style="searchStyle"
|
|
@custom="searchBeamSection" placeholder="搜索桥段名称"></u-search>
|
|
</view>
|
|
<view class="listItem" v-for="item in sectionList" :key="item.id">
|
|
<view class="itemTitle" @click="toPlanList(item)">
|
|
{{ item.bridgeSectionName }}
|
|
</view>
|
|
</view>
|
|
<view class="noData" v-if="sectionList.length === 0">
|
|
暂无数据~
|
|
</view>
|
|
</view>
|
|
|
|
<!-- 梁列表 -->
|
|
<view class="dataList" v-if="tabIndex==1">
|
|
<view class="listTitle">
|
|
桥段列表
|
|
</view>
|
|
<view class="listItem" v-for="item in sectionList" :key="item.id">
|
|
<view class="itemTitle" @click="toBeamList(item)">
|
|
{{ item.bridgeSectionName }}
|
|
</view>
|
|
</view>
|
|
<view class="noData" v-if="sectionList.length === 0">
|
|
暂无数据~
|
|
</view>
|
|
</view>
|
|
<!-- 存梁区列表 -->
|
|
<view class="dataList" v-if="tabIndex === 2">
|
|
<view class="listTitle">
|
|
存梁区列表
|
|
</view>
|
|
<view class="listItem" v-for="item in saveBeamList" :key="item.id">
|
|
<view class="itemTitle" @click="toSaveBeam">
|
|
{{ item.saveBeamDistrictName }}
|
|
</view>
|
|
</view>
|
|
<view class="addMakeBeam" @click="addSaveBeamShow = true">
|
|
新增存梁区
|
|
</view>
|
|
<view class="noData" v-if="saveBeamList.length === 0">
|
|
暂无数据~
|
|
</view>
|
|
</view>
|
|
<!-- 制梁台座列表 -->
|
|
<view class="dataList" v-if="tabIndex === 3">
|
|
<view class="listTitle">
|
|
制梁台座列表
|
|
</view>
|
|
<view class="listItem" v-for="item in makeBeamList" :key="item.id" style="border-bottom: none;">
|
|
<view class="itemBox" @click="toProductDetail">
|
|
<view class="qrCode">
|
|
<image class="img" :src="url_config+'image/'+item.qrCode"></image>
|
|
</view>
|
|
<view class="makeBeamText">
|
|
<view class="makeType">
|
|
{{ item.pedestalTypeName }}
|
|
</view>
|
|
<view class="makeStage">
|
|
{{ item.pedestalProcess }}
|
|
</view>
|
|
<view class="makeName">
|
|
{{ item.makeBeamPedestalSn }}
|
|
</view>
|
|
</view>
|
|
<view class="makeBeamTool">
|
|
<view class="edit-btn">
|
|
编辑
|
|
</view>
|
|
<view class="delete-btn">
|
|
删除
|
|
</view>
|
|
</view>
|
|
</view>
|
|
|
|
</view>
|
|
<view class="addMakeBeam" @click="toAddMakeBeam">
|
|
新增制梁台座
|
|
</view>
|
|
<view class="noData" v-if="makeBeamList.length === 0">
|
|
暂无数据~
|
|
</view>
|
|
</view>
|
|
<!-- 新增存梁区输入框 -->
|
|
<u-popup v-model="addSaveBeamShow" :closeable="true" mode="center" border-radius="14">
|
|
<view class="dialog-content">
|
|
<view class="dialog-title">
|
|
新增存梁区
|
|
</view>
|
|
<view class="input-form">
|
|
<u-form :model="form">
|
|
<u-form-item label="存梁区名称" prop="name" label-width="200">
|
|
<span class="mustInput">*</span>
|
|
<u-input v-model="form.name" />
|
|
</u-form-item>
|
|
</u-form>
|
|
</view>
|
|
<view class="dialog-tool">
|
|
<view class="cancel-btn" @click="addSaveBeamShow = false">
|
|
取消
|
|
</view>
|
|
<view class="submit-btn" @click="submitSaveBeam">
|
|
确定
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</u-popup>
|
|
<levitatedsphere :x="100" :y="80"></levitatedsphere>
|
|
</view>
|
|
</template>
|
|
|
|
<script>
|
|
import headers from "@/components/headers/headers.vue"
|
|
export default {
|
|
components: {
|
|
headers
|
|
},
|
|
data() {
|
|
return {
|
|
datetimerange: "",
|
|
tabIndex: 0,
|
|
sectionSearch: "",
|
|
searchStyle: {
|
|
position: "absolute",
|
|
display: "flex",
|
|
alignItems: "center",
|
|
justifyContent: "center",
|
|
right: "13%",
|
|
width: "90rpx",
|
|
height: "40rpx",
|
|
color: "#fff",
|
|
fontSize: "23rpx",
|
|
background: "#5181F6",
|
|
borderRadius: "70rpx 70rpx 70rpx 70rpx",
|
|
},
|
|
sectionList: [],
|
|
saveBeamList: [],
|
|
makeBeamList: [],
|
|
form: {
|
|
name: ''
|
|
},
|
|
addSaveBeamShow: false,
|
|
};
|
|
},
|
|
mounted() {
|
|
this.projectDetail = JSON.parse(uni.getStorageSync('projectDetail'))
|
|
this.getSectionList()
|
|
this.getSaveBeamList()
|
|
this.getMakeBeamList()
|
|
},
|
|
methods: {
|
|
toProductDetail() {
|
|
console.log("去制梁台座生产记录")
|
|
uni.navigateTo({
|
|
url: "/pages/projectEnd/smartBeamField/makeBeamProductRecord"
|
|
})
|
|
},
|
|
submitSaveBeam() {
|
|
if (this.form.name == '') {
|
|
uni.showToast({
|
|
title: '请输入存梁区名称',
|
|
icon: 'error',
|
|
});
|
|
} else {
|
|
console.log("提交存梁区", this.form.name)
|
|
this.addSaveBeamShow = false
|
|
}
|
|
|
|
},
|
|
toAddSaveBeam() {
|
|
console.log("去新增存梁区")
|
|
this.addSaveBeamShow = true
|
|
},
|
|
toSaveBeam() {
|
|
console.log("去存梁区")
|
|
uni.navigateTo({
|
|
url: "/pages/projectEnd/smartBeamField/saveBeamArea"
|
|
})
|
|
},
|
|
toAddMakeBeam() {
|
|
console.log("去新增制梁台座")
|
|
uni.navigateTo({
|
|
url: "/pages/projectEnd/smartBeamField/addMakeBeam"
|
|
})
|
|
},
|
|
toPlanList(item) {
|
|
console.log("跳转计划列表", item)
|
|
uni.navigateTo({
|
|
url: "/pages/projectEnd/smartBeamField/planList?detailId=" + item.id
|
|
})
|
|
},
|
|
toBeamList(item) {
|
|
console.log("跳转梁列表", item)
|
|
uni.navigateTo({
|
|
url: "/pages/projectEnd/smartBeamField/beamList?detailId=" + item.id
|
|
})
|
|
},
|
|
rangeTimeChange(e) {
|
|
console.log("选择", e)
|
|
},
|
|
returnBack() {
|
|
console.log("返回")
|
|
uni.navigateBack()
|
|
},
|
|
changeMenu(e) {
|
|
this.tabIndex = e
|
|
this.sectionSearch = ''
|
|
},
|
|
// 搜索桥段
|
|
searchBeamSection(e) {
|
|
console.log("桥段", e)
|
|
this.sectionSearch = e
|
|
this.getSectionList()
|
|
},
|
|
//获取桥段列表
|
|
getSectionList() {
|
|
this.sendRequest({
|
|
url: "xmgl/smartBeamFieldBridgeSection/list",
|
|
data: {
|
|
projectSn: this.projectDetail.projectSn,
|
|
bridgeSectionName: this.sectionSearch
|
|
},
|
|
method: "get",
|
|
success: res => {
|
|
console.log("桥段列表", res, this.sectionList)
|
|
this.sectionList = res.result
|
|
}
|
|
})
|
|
},
|
|
//获取存梁区列表
|
|
getSaveBeamList() {
|
|
this.sendRequest({
|
|
url: "xmgl/smartBeamFieldSaveBeamDistrict/list",
|
|
data: {
|
|
projectSn: this.projectDetail.projectSn
|
|
},
|
|
method: "get",
|
|
success: res => {
|
|
console.log("存梁区列表", res)
|
|
this.saveBeamList = res.result
|
|
}
|
|
})
|
|
},
|
|
//获取制梁台座列表
|
|
getMakeBeamList() {
|
|
this.sendRequest({
|
|
url: "xmgl/smartBeamFieldMakeBeamPedestal/list",
|
|
data: {
|
|
projectSn: this.projectDetail.projectSn
|
|
},
|
|
method: "get",
|
|
success: res => {
|
|
console.log("制梁台座列表", res)
|
|
this.makeBeamList = res.result
|
|
}
|
|
})
|
|
},
|
|
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<style lang="scss" scoped>
|
|
.menuBox {
|
|
display: flex;
|
|
align-items: center;
|
|
margin-top: 23rpx;
|
|
position: relative;
|
|
|
|
.menuItem {
|
|
flex: 1;
|
|
text-align: center;
|
|
|
|
.menuText {
|
|
margin-top: 10rpx;
|
|
font-family: Advent Pro, Advent Pro;
|
|
color: #000000;
|
|
font-size: 23rpx;
|
|
}
|
|
|
|
.imgBox {
|
|
width: 120rpx;
|
|
height: 120rpx;
|
|
margin: 0 auto;
|
|
|
|
.img {
|
|
width: 100%;
|
|
height: 100%;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
.dataList {
|
|
padding: 0 40rpx;
|
|
padding-bottom: 70rpx;
|
|
|
|
.listTitle {
|
|
font-family: Acme, Acme;
|
|
color: #545454;
|
|
font-size: 32rpx;
|
|
margin-top: 50rpx
|
|
}
|
|
|
|
.listSearch {
|
|
margin-top: 30rpx
|
|
}
|
|
|
|
.addMakeBeam {
|
|
position: fixed;
|
|
display: flex;
|
|
justify-content: center;
|
|
align-items: center;
|
|
bottom: 20rpx;
|
|
width: 665rpx;
|
|
height: 69rpx;
|
|
color: #FFFFFF;
|
|
font-size: 27rpx;
|
|
background: #5181F6;
|
|
border-radius: 142rpx;
|
|
}
|
|
|
|
.listItem {
|
|
padding: 30rpx 0;
|
|
border-bottom: 1px solid #E6E6E6;
|
|
|
|
// 制梁台座
|
|
.itemBox {
|
|
width: 688rpx;
|
|
height: 190rpx;
|
|
padding: 30rpx 22rpx;
|
|
background: #FFFFFF;
|
|
box-shadow: 0px 0 19rpx 0px #E6E6E6;
|
|
border-radius: 19rpx;
|
|
margin: 0 auto;
|
|
display: flex;
|
|
position: relative;
|
|
|
|
.qrCode {
|
|
width: 100rpx;
|
|
height: 100rpx;
|
|
|
|
image {
|
|
width: 100%;
|
|
height: 100%;
|
|
}
|
|
}
|
|
|
|
.makeBeamText {
|
|
margin-left: 32rpx;
|
|
|
|
.makeType {
|
|
font-size: 31rpx;
|
|
color: #333333;
|
|
}
|
|
|
|
.makeStage {
|
|
font-size: 24rpx;
|
|
color: #8C8C8C;
|
|
margin-top: 14rpx;
|
|
}
|
|
|
|
.makeName {
|
|
font-size: 24rpx;
|
|
color: #8C8C8C;
|
|
margin-top: 14rpx;
|
|
}
|
|
}
|
|
|
|
.makeBeamTool {
|
|
display: flex;
|
|
position: absolute;
|
|
right: 30rpx;
|
|
bottom: 30rpx;
|
|
|
|
.edit-btn {
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
width: 77rpx;
|
|
height: 40rpx;
|
|
cursor: pointer;
|
|
color: #5680FA;
|
|
font-size: 20rpx;
|
|
background: rgba(86, 128, 250, 0.1);
|
|
border-radius: 8rpx;
|
|
}
|
|
|
|
.delete-btn {
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
width: 77rpx;
|
|
height: 40rpx;
|
|
cursor: pointer;
|
|
color: #EA3941;
|
|
font-size: 20rpx;
|
|
margin-left: 24rpx;
|
|
background: rgba(234, 57, 65, 0.1);
|
|
border-radius: 8rpx;
|
|
}
|
|
}
|
|
}
|
|
|
|
|
|
|
|
.itemTitle {
|
|
font-size: 27rpx;
|
|
font-family: Advent Pro, Advent Pro;
|
|
color: #333333;
|
|
}
|
|
}
|
|
}
|
|
|
|
.noData {
|
|
text-align: center;
|
|
padding: 120rpx 0;
|
|
color: #999;
|
|
}
|
|
|
|
.headerScan {
|
|
position: absolute;
|
|
right: 5%;
|
|
top: 5%;
|
|
}
|
|
|
|
.headerBack {
|
|
position: absolute;
|
|
left: 5%;
|
|
top: 5%;
|
|
}
|
|
.dialog-content {
|
|
width: 680rpx;
|
|
padding: 30rpx;
|
|
padding-bottom: 50rpx;
|
|
position: relative;
|
|
.dialog-title {
|
|
border-left: 6rpx solid #5181F6;
|
|
padding-left: 20rpx;
|
|
}
|
|
.input-form {
|
|
margin-top: 40rpx;
|
|
margin-left: 10rpx;
|
|
}
|
|
.dialog-tool {
|
|
display: flex;
|
|
width: 400rpx;
|
|
margin: 0 auto;
|
|
margin-top: 50rpx;
|
|
.submit-btn {
|
|
display: flex;
|
|
justify-content: center;
|
|
align-items: center;
|
|
width: 165rpx;
|
|
height: 69rpx;
|
|
margin-left: 50rpx;
|
|
color: #FFFFFF;
|
|
font-size: 27rpx;
|
|
background: #5181F6;
|
|
border-radius: 42rpx;
|
|
}
|
|
.cancel-btn {
|
|
display: flex;
|
|
justify-content: center;
|
|
align-items: center;
|
|
width: 165rpx;
|
|
height: 69rpx;
|
|
font-size: 27rpx;
|
|
border: 1px solid #8C8C8C;
|
|
border-radius: 42rpx;
|
|
}
|
|
}
|
|
}
|
|
.mustInput {
|
|
color: red;
|
|
position: absolute;
|
|
top: 26rpx;
|
|
left: -20rpx;
|
|
}
|
|
</style> |