263 lines
6.2 KiB
Vue
263 lines
6.2 KiB
Vue
<template>
|
||
<view class="container">
|
||
<view class="titleWrap">后勤保障服务清单与能力需求</view>
|
||
|
||
<view class="main">
|
||
<view v-for="(item,index) in kinds">
|
||
<view class="moduleTitle">{{getChinese(index+1)}}、{{item.name}}</view>
|
||
<view v-for="(subItem,subIndex) in item.subSelectorList">
|
||
<view class="levelWrap" v-if="choosedLevelIdList[index][subIndex].id == levelIndex" v-for="(levelItem,levelIndex) in subItem.levelList">
|
||
<view class="prodctionTitle">{{subIndex+1}}. {{subItem.name}}-{{levelItem.name}}</view>
|
||
<view class="uni-list prodsList" v-if="levelItem.name != '跳过'">
|
||
<checkbox-group style="word-break: keep-all;">
|
||
<label class="produnctionWrap" v-for="(prodItem,prodIndex) in levelItem.prods" :key="item.value">
|
||
<checkbox disabled="true" class="productionCheckbox" :value="prodItem.value" :checked="prodItem.isChecked==1?true:false" />{{prodItem.name}}
|
||
</label>
|
||
</checkbox-group>
|
||
</view>
|
||
<view class="uni-list skipWrap" v-if="levelItem.name == '跳过'">
|
||
暂未选择产品
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
|
||
<view>
|
||
<view class="mid_view">
|
||
<view class="tab_left">
|
||
姓 名：<!-- <text style="color: red;position: absolute;">*</text> -->
|
||
</view>
|
||
<view class="tab_rig">
|
||
<input class="tab_text" v-model="userName" placeholder="请填写姓名" maxlength="10" />
|
||
</view>
|
||
</view>
|
||
<view class="mid_view">
|
||
<view class="tab_left">
|
||
手机号：<!-- <text style="color: red;position: absolute;">*</text> -->
|
||
</view>
|
||
<view class="tab_rig">
|
||
<input class="tab_text" v-model="userPhone" type="number" placeholder="请填写手机号码" maxlength="11"/>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
|
||
|
||
|
||
<view class="footer-box left" @click="goBack()">
|
||
<text>上一步</text>
|
||
</view>
|
||
<view class="footer-box right" @click="submit()">
|
||
<text>确认</text>
|
||
</view>
|
||
</view>
|
||
</template>
|
||
|
||
<script>
|
||
import { getAllProdunctions,getCatagoryList,getProductionList,saveMyProductionApply } from '@/common/api.js';
|
||
import { callbackRequest, alertTip, sureAlterTip, getStorage ,setStorage,transformNum2Chinese} from '@/common/util.js';
|
||
export default {
|
||
data() {
|
||
return {
|
||
kinds:[],
|
||
choosedLevelIdList:[],
|
||
choosedLevelIds:[],
|
||
userId:'',
|
||
userName:'',
|
||
userPhone:'',
|
||
}
|
||
},
|
||
onLoad:function (option) { //option为object类型，会序列化上个页面传递的参数
|
||
let self = this;
|
||
self.kinds = getStorage('kinds');
|
||
self.choosedLevelIdList = getStorage('choosedLevelIdList');
|
||
self.getChoosedLevelIdList();
|
||
|
||
let userInfo = getStorage('userInfo');
|
||
if(userInfo&&userInfo.id){
|
||
this.userId=userInfo.userId;
|
||
this.userName=userInfo.userName;
|
||
this.userPhone=userInfo.telnumber;
|
||
}
|
||
},
|
||
|
||
methods: {
|
||
getChoosedLevelIdList(){
|
||
let self = this;
|
||
// console.log(self.kinds);
|
||
// console.log(self.choosedLevelIdList);
|
||
self.choosedLevelIds = [];
|
||
for(var i=0;i<self.kinds.length;i++){
|
||
// console.log(self.kinds[i].subSelectorList);
|
||
for(var j=0; j<self.kinds[i].subSelectorList.length;j++){
|
||
// console.log(self.kinds[i].name+self.kinds[i].subSelectorList[j].name)
|
||
// console.log(self.kinds[i].subSelectorList[j].levelList[self.choosedLevelIdList[i][j].id])
|
||
console.log(self.kinds[i].subSelectorList[j].levelList[self.choosedLevelIdList[i][j].id])
|
||
self.choosedLevelIds.push((self.kinds[i].subSelectorList[j].levelList[self.choosedLevelIdList[i][j].id]).id);
|
||
}
|
||
|
||
}
|
||
console.log(self.choosedLevelIds)
|
||
},
|
||
submit(){
|
||
let self = this;
|
||
if(!self.userName){
|
||
alertTip('请输入姓名！');
|
||
return;
|
||
}
|
||
if(!self.userPhone){
|
||
alertTip('请输入手机号！');
|
||
return;
|
||
}
|
||
if(self.userPhone.toString().length < 11){
|
||
alertTip('请输入正确的手机号！');
|
||
return;
|
||
}
|
||
let userInfo = getStorage('userInfo');
|
||
let data = {
|
||
method: saveMyProductionApply,
|
||
data:
|
||
{
|
||
userId: self.userId,
|
||
userName:self.userName,
|
||
userPhone:self.userPhone,
|
||
choosedLevelIds:this.choosedLevelIds
|
||
}
|
||
};
|
||
callbackRequest(data).then(res => {
|
||
if (res.data.returnCode == 1) {
|
||
let result = res.data.returnData;
|
||
|
||
uni.navigateTo({
|
||
url: './production_apply_result?applyId='+result.applyId
|
||
});
|
||
}
|
||
});
|
||
},
|
||
goBack(){
|
||
uni.navigateBack({
|
||
delta: 1
|
||
});
|
||
},
|
||
getChinese(value){
|
||
return transformNum2Chinese(value);
|
||
},
|
||
},
|
||
}
|
||
</script>
|
||
|
||
<style lang="scss">
|
||
|
||
uni-checkbox-group uni-label{
|
||
width: 33% !important;
|
||
display: inline-flex;
|
||
padding:20upx 0;
|
||
text-align: left;
|
||
line-height: 46upx;
|
||
display:inline-block;
|
||
}
|
||
|
||
.container {
|
||
min-height: 100vh;
|
||
overflow: hidden;
|
||
background: #f8f8f8;
|
||
|
||
.produnctionWrap{
|
||
font-size: 24upx;
|
||
text-align: center;
|
||
}
|
||
.productionCheckbox{
|
||
transform:scale(0.7);
|
||
}
|
||
|
||
.titleWrap{
|
||
text-align: center;
|
||
font-weight: 600;
|
||
font-size: 36upx;
|
||
padding:20upx 0upx;
|
||
border-bottom: solid #CFCFCF 1px;
|
||
}
|
||
|
||
.main {
|
||
position: absolute;
|
||
// margin: 42upx 40upx 0;
|
||
width: 100%;
|
||
height:100%;
|
||
}
|
||
|
||
.moduleTitle{
|
||
text-align: center;
|
||
margin: 24upx 0;
|
||
}
|
||
|
||
.prodctionTitle{
|
||
text-align: left;
|
||
margin-left: 30upx;
|
||
font-size: 30upx;
|
||
margin-top: 20upx;
|
||
}
|
||
|
||
.levelWrap{
|
||
border-bottom:1px solid #eee;
|
||
}
|
||
|
||
.skipWrap{
|
||
text-align: center;
|
||
font-size: 30upx;
|
||
margin:20upx 0;
|
||
}
|
||
|
||
.right{
|
||
right:20upx;
|
||
}
|
||
|
||
.left{
|
||
left:20upx;
|
||
}
|
||
|
||
.footer-box {
|
||
position: fixed;
|
||
bottom: 5upx;
|
||
border-radius: 10upx;
|
||
width: 45%;
|
||
height: 80upx;
|
||
background: #348ff1;
|
||
text-align: center;
|
||
line-height: 80upx;
|
||
|
||
text {
|
||
font-size: 30upx;
|
||
color: #fff;
|
||
vertical-align: middle;
|
||
padding-left: 10upx;
|
||
}
|
||
}
|
||
|
||
.mid_view {
|
||
padding: 3vw 0;
|
||
display: flex;
|
||
border-bottom: 1px solid #eee;
|
||
font-size: 26upx;
|
||
}
|
||
|
||
.tab_left {
|
||
width: 25vw;
|
||
text-align: right;
|
||
margin-right: 3vw;
|
||
line-height:50rpx;
|
||
}
|
||
|
||
.tab_rig {
|
||
width: 55vw;
|
||
line-height:50rpx;
|
||
input{
|
||
height: 50rpx;
|
||
}
|
||
}
|
||
|
||
.tab_text{
|
||
font-size:26upx;
|
||
}
|
||
}
|
||
</style>
|