319 lines
6.3 KiB
Vue
319 lines
6.3 KiB
Vue
<template>
|
||
<view class="fullHeight">
|
||
<headers :showBack="true" class="">
|
||
<view class="headerName">
|
||
存梁区
|
||
<view class="headerBack" @click="returnBack">
|
||
<u-icon name="arrow-left" color="#333333" size="40"></u-icon>
|
||
</view>
|
||
</view>
|
||
</headers>
|
||
<!-- 存梁台座列表 -->
|
||
<view class="dataList">
|
||
<view class="listItem" v-for="item in makeBeamList" :key="item.id" style="border-bottom: none;">
|
||
<view class="itemBox" @click="toSaveBeamRecord">
|
||
<view class="qrCode">
|
||
<image class="img" :src="url_config+'image/'+item.qrCode"></image>
|
||
</view>
|
||
<view class="makeBeamText">
|
||
<view class="makeType">
|
||
{{ item.pedestalTypeName }}
|
||
</view>
|
||
</view>
|
||
<view class="makeBeamTool">
|
||
<view class="edit-btn">
|
||
编辑
|
||
</view>
|
||
<view class="delete-btn">
|
||
删除
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
<view class="addMakeBeam" @click="toAddSaveBeam">
|
||
新增存梁台座
|
||
</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>
|
||
</view>
|
||
</template>
|
||
|
||
<script>
|
||
import headers from "@/components/headers/headers.vue"
|
||
export default {
|
||
components: {
|
||
headers
|
||
},
|
||
data() {
|
||
return {
|
||
form: {
|
||
name: ''
|
||
},
|
||
makeBeamList: [],
|
||
addSaveBeamShow: false,
|
||
};
|
||
},
|
||
mounted() {
|
||
this.projectDetail = JSON.parse(uni.getStorageSync('projectDetail'))
|
||
this.getMakeBeamList()
|
||
},
|
||
// 必须要在onReady生命周期,因为onLoad生命周期组件可能尚未创建完毕
|
||
|
||
methods: {
|
||
toSaveBeamRecord() {
|
||
uni.navigateTo({
|
||
url: "/pages/projectEnd/smartBeamField/saveBeamRecord"
|
||
})
|
||
},
|
||
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
|
||
},
|
||
returnBack() {
|
||
console.log("返回")
|
||
uni.navigateBack()
|
||
},
|
||
//获取制梁台座列表
|
||
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>
|
||
.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: 20rpx 0;
|
||
border-bottom: 1px solid #E6E6E6;
|
||
|
||
// 制梁台座
|
||
.itemBox {
|
||
width: 688rpx;
|
||
height: 170rpx;
|
||
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> |