提交分站搭建

components/select/buttomDialog/csubAddressSelect.vue

@@ -0,0 +1,100 @@
+<template>
+	<u-popup v-model="localShow" :mode="mode" :border-radius="24">
+		<view class="content">
+			<view style="height: 1rpx;">
+				<image src="../../../static/img/fz_icon_gb/fz_icon_gb.png" class="close"></image>
+			</view>
+			<view class="slectAddress">
+				<view v-for="(item, index) in listJurisdiction" :key="index">
+					<list-item>
+						<template v-slot:left>
+							<view>{{item.title}}</view>
+						</template>
+						<template v-slot:right>
+							<image :src="item.iconCheck ? checkBoxImg[0] : checkBoxImg[1]" style="width: 50rpx; height: 50rpx;"></image>
+						</template>
+					</list-item>
+				</view>
+			</view>
+			<u-button class="confim" @click="confim" shape="circle" :ripple="true" :plain="false">确认</u-button>
+		</view>
+	</u-popup>
+</template>
+
+<script>
+	import listItem from '../../listitem/listItem.vue'
+	export default {
+		components: {
+			listItem
+		},
+		props: {
+			show: {
+				type: Boolean,
+				default: false
+			},
+			mode: {
+				type: String,
+				default: 'bottom'
+			}
+		},
+		data () {
+			return {
+				checkBoxImg: ['../../static/img/fz_icon_xz/fz_icon_xz.png', '../../static/img/fz_icon_gb/fz_icon_gb.png'],
+				listJurisdiction: [
+					{
+						title: 'qqkld.net',
+						iconCheck: true,
+					},
+					{
+						title: '在线支付接口',
+						iconCheck: false,
+					}
+				]
+			}
+		},
+		computed: {
+			localShow: {
+				get () {
+					return this.show
+				},
+				set (val) {
+					this.$emit('update:show', val)
+				}
+			}
+		},
+		methods: {
+			confim () {
+				
+			}
+		}
+	}
+</script>
+
+<style scoped lang="scss">
+	.close {
+		margin: 24rpx 24rpx 0 0;
+		float: right;
+		height: 50rpx;
+		width: 50rpx;
+	}
+	.slectAddress {
+		margin: 125rpx 50rpx 38rpx 50rpx;
+	}
+	/deep/ .u-drawer__scroll-view {
+		background-color: #2B3062;
+		color: #FFFFFF;
+		font-size: 32rpx;
+	}
+	.confim {
+		margin: 0 45rpx 29rpx 45rpx;
+		height: 90rpx;
+		
+		background: linear-gradient(143deg, #EF6F5F 0%, #FB2636 100%);
+		border-radius: 45rpx;
+		font-size: 32rpx;
+		color: #FFFFFF;
+		&::after {
+			border: none;
+		}
+	}
+</style>

pages.json

@@ -20,6 +20,12 @@
 			"style": {
 				"navigationBarTitleText": "分站搭建"
 			}
+		},
+		{
+			"path": "pages/csubstation/complete",
+			"style": {
+				"navigationBarTitleText": "分站搭建"
+			}
 		}
 	    ,{
             "path" : "pages/login/login",

pages/csubstation/complete.vue

@@ -0,0 +1,56 @@
+<template>
+	<view class="wc_box">
+		<image src="../../static/img/fz_icon_wc/fz_icon_wc.png" class="wc-image"></image>
+		<view class="wc_txt">已完成</view>
+		<view class="wc_tip_txt">专业版分站已建好，钱途一片光明</view>
+		<u-button class="home-btn" @click="confim" shape="circle" :ripple="true">逛逛首页</u-button>
+	</view>
+</template>
+
+<script>
+	export default {
+		methods: {
+			// 返回首页
+			confim () {
+				
+			}
+		}
+	}
+</script>
+
+<style scoped lang="scss">
+	.wc_box {
+		font-weight: 400;
+		margin: auto;
+		text-align: center;
+		& .wc_txt {
+			font-size: 40rpx;
+			color: #CED6F1;
+			line-height: 56rpx;
+			letter-spacing: 1rpx;
+		}
+		& .wc_tip_txt {
+			margin-top: 30rpx;
+			font-size: 28rpx;
+			color: #9496B1;
+			line-height: 40rpx;
+			letter-spacing: 0.8rpx;
+		}
+	}
+	.wc-image {
+		margin: 145rpx 0 111rpx 0;
+		width: 556rpx;
+		height: 262rpx;
+	}
+	.home-btn {
+		margin-top: 70rpx;
+		height: 80rpx;
+		width: 233rpx;
+		background: linear-gradient(143deg, #EF6F5F 0%, #FB2636 100%);
+		color: #FFFFFF;
+		font-size: 28rpx;
+		&::after {
+			border: none;
+		}
+	}
+</style>

pages/csubstation/index.vue

@@ -1,6 +1,6 @@
 <template>
 	<view class="box">
-		<u-button class="onCreateBox" shape="circle" :ripple="true" @click="onCreateBtnClick" :plain="true">还未创建分站</u-button>
+		<u-button class="onCreateBox" shape="circle" :ripple="true" @click="onCreateBtnClick" :plain="false">还未创建分站</u-button>
 		<u-swiper :list="list" :effect3d="true" :border-radius="10" :effect3d-previous-margin="120" bgColor="transparent"></u-swiper>
 		<view class="titletip">
 			<view class="line line-l"></view>
@@ -9,7 +9,7 @@
 		</view>
 		<u-card :border="false" class="card">
 			<template v-slot:body>
-				<view v-for="item in listJurisdiction">
+				<view v-for="(item, index) in listJurisdiction" :key="index">
 					<list-item>
 						<template v-slot:left>
 							<view>{{item.title}}</view>
@@ -22,18 +22,22 @@
 			</template>
 		</u-card>
 		<u-button class="confim" @click="confim" shape="circle" :ripple="true" :plain="false">立即建站</u-button>
+		<csub-address-select :show.sync="addressShow"></csub-address-select>
 	</view>
 </template>
 
 <script>
 	import listItem from '../../components/listitem/listItem.vue'
+	import csubAddressSelect from '../../components/select/buttomDialog/csubAddressSelect.vue'
 	export default {
 		name: 'createBefore',
 		components: {
-			listItem
+			listItem,
+			csubAddressSelect
 		},
 		data () {
 			return {
+				addressShow: false,
 				list: [
 					{
 						image: '../../static/img/fz_ptb/fz_ptb.png',
@@ -98,7 +102,7 @@
 				
 			},
 			confim () {
-				
+				this.addressShow = true
 			}
 		}
 	}
@@ -114,6 +118,9 @@
 		background: #6C6269;
 		font-size: 24rpx;
 		color: #FEE4C5;
+		&::after {
+			border: none;
+		}
 	}
 	.titletip {
 		margin-top: 30rpx;
@@ -156,5 +163,8 @@
 		border-radius: 45rpx;
 		font-size: 32rpx;
 		color: #FFFFFF;
+		&::after {
+			border: none;
+		}
 	}
 </style>