From 42f6344edef3f71074d40811462771ea24aca13d Mon Sep 17 00:00:00 2001
From: tpc <1679867915@qq.com>
Date: Tue, 23 Feb 2021 00:18:14 +0800
Subject: [PATCH] 'X'

---
 App.vue                          |  7 +++-
 components/listitem/listItem.vue | 66 ++++++++++++++++++++++++++++++++
 pages.json                       | 12 ++++++
 pages/csubstation/edit.vue       | 59 ++++++++++++++++++++++++++++
 pages/csubstation/index.vue      |  8 ++++
 pages/index/index.vue            | 48 ++++++++++++++++++++++-
 6 files changed, 198 insertions(+), 2 deletions(-)
 create mode 100644 components/listitem/listItem.vue
 create mode 100644 pages/csubstation/edit.vue
 create mode 100644 pages/csubstation/index.vue

diff --git a/App.vue b/App.vue
index 8c2b732..daecd20 100644
--- a/App.vue
+++ b/App.vue
@@ -12,6 +12,11 @@
 	}
 </script>
 
-<style>
+<style lang="scss">
 	/*每个页面公共css */
+	uni-page-body {
+		height: 100%;
+		overflow: auto;
+		background-color: $uni-bg-color;
+	}
 </style>
diff --git a/components/listitem/listItem.vue b/components/listitem/listItem.vue
new file mode 100644
index 0000000..83116d6
--- /dev/null
+++ b/components/listitem/listItem.vue
@@ -0,0 +1,66 @@
+<template>
+	<view class="item">
+		<view class="content">{{label}}</view>
+		<view class="opear">
+			<slot><u-input v-model="valueModel" type="text" class="input-c"/></slot>
+		</view>
+	</view>
+</template>
+
+<script>
+	export default {
+		name: 'listitem',
+		props: {
+			value: {
+				
+			},
+			label: {
+				type: String
+			},
+			itemIcon: {
+				type: String
+			}
+		},
+		computed: {
+			valueModel: {
+				get () {
+					return this.value
+				},
+				set (val) {
+					this.$emit('update:value', val)
+				}
+			}
+		},
+		methods: {
+			
+		}
+	}
+</script>
+
+<style scoped lang="scss">
+	.item {
+		display: flex;
+		justify-content: space-between;
+		align-items: center;
+		padding: 30rpx 0 29rpx;
+		
+		& .input-c /deep/ input {
+			color: #FFFFFF;
+		}
+		& .input-c /deep/ .input-placeholder {
+			color: #757896 !important;
+		}
+		& .content {
+			width: 200rpx;
+			height: 33rpx;
+			font-size: 24rpx;
+			font-family: PingFangSC-Regular, PingFang SC;
+			font-weight: 400;
+			color: #FFFFFF;
+			line-height: 33rpx;
+		}
+		& .opear {
+			flex: 1;
+		}
+	}
+</style>
diff --git a/pages.json b/pages.json
index 2054bbd..0ef7989 100644
--- a/pages.json
+++ b/pages.json
@@ -8,6 +8,18 @@
 			"style": {
 				"navigationBarTitleText": ""
 			}
+		},
+		{
+			"path": "pages/csubstation/index",
+			"style": {
+				"navigationBarTitleText": "分站搭建"
+			}
+		},
+		{
+			"path": "pages/csubstation/edit",
+			"style": {
+				"navigationBarTitleText": "分站搭建"
+			}
 		}
 	],
 	"globalStyle": {
diff --git a/pages/csubstation/edit.vue b/pages/csubstation/edit.vue
new file mode 100644
index 0000000..a5f9fb8
--- /dev/null
+++ b/pages/csubstation/edit.vue
@@ -0,0 +1,59 @@
+<template>
+	<view class="box">
+		<view class="tip">
+			可用字母，数字建议为2-5字，不能有标点符号（尽量简短，便于推广宣传）
+		</view>
+		<list-item class="item" label="管理员账号" v-model="adminacount"></list-item>
+		<list-item class="item" label="管理员密码" v-model="adminacount"></list-item>
+		<list-item class="item" label="绑定QQ" v-model="adminacount"></list-item>
+		<list-item class="item" label="网站名称" v-model="adminacount"></list-item>
+		<button class="confim">页面主操作 Loading</button>
+	</view>
+</template>
+
+<script>
+	import listItem from '../../components/listitem/listItem.vue'
+	export default {
+		name: 'cosEdit',
+		components: {
+			listItem
+		},
+		data () {
+			return {
+				adminacount: ''
+			}
+		}
+	}
+</script>
+
+<style scoped lang="scss">
+	.box {
+		padding: 20px 20px 0 20px;
+		height: 100%;
+		font-size: 28px;
+		font-family: PingFangSC-Regular, PingFang SC;
+		font-weight: 400;
+		color: #FFFFFF;
+		line-height: 40px;
+		& .tip {
+			margin: 16px 0 30px;
+			font-size: 22px;
+			font-family: PingFangSC-Regular, PingFang SC;
+			color: #C1C4E3;
+			line-height: 30px;
+		}
+		& .item{
+			border-top: 1rpx solid #3A4361;
+			&:last-child {
+				border-bottom: 1rpx solid #3A4361;
+			}
+		}
+		& .confim {
+			margin-top: 150rpx;
+			height: 90px;
+			background: linear-gradient(102deg, #F4D8AB 0%, #EF6F5F 0%, #CD9C78 100%, #FB2636 100%);
+			border-radius: 45px;
+			font-size: 32px;
+		}
+	}
+</style>
diff --git a/pages/csubstation/index.vue b/pages/csubstation/index.vue
new file mode 100644
index 0000000..48d48ea
--- /dev/null
+++ b/pages/csubstation/index.vue
@@ -0,0 +1,8 @@
+<template>
+</template>
+
+<script>
+</script>
+
+<style>
+</style>
diff --git a/pages/index/index.vue b/pages/index/index.vue
index 2e70749..914e137 100644
--- a/pages/index/index.vue
+++ b/pages/index/index.vue
@@ -16,6 +16,15 @@
 				</view>
 			</view>
 		</u-popup>
+		
+		<u-popup v-model="show" mode="center" border-radius="10" length="40%" class="popup-center">
+			<view class="content">本次兑换将扣除您9元余额是否确认交易</view>
+			<view style="display: flex;">
+				<view>否</view>
+				<view>是</view>
+			</view>
+		</u-popup>
+		<u-button @click="showModal">弹起Modal</u-button>
 	</view>
 </template>
 
@@ -35,7 +44,17 @@
 
 		},
 		methods: {
-
+			confirm() {
+				setTimeout(() => {
+					// 3秒后自动关闭
+					// 如果不想关闭，而单是清除loading状态，需要通过ref手动调用方法
+					this.$refs.uModal.clearLoading();
+					this.show = false
+				}, 3000)
+			},
+			showModal () {
+				this.show = true
+			}
 		}
 	}
 </script>
@@ -64,4 +83,31 @@
 		font-size: 36rpx;
 		color: #8f8f94;
 	}
+	.dialog /deep/ .u-mode-center-box {
+		background-color: #2B3062;
+	}
+	.dialog /deep/ .u-model {
+		background-color: #2B3062;
+	}
+	.dialogtxt {
+		width: 359px;
+		height: 84px;
+		font-size: 30px;
+		font-family: PingFangSC-Regular, PingFang SC;
+		font-weight: 400;
+		color: #FFFFFF;
+		line-height: 42px;
+	}
+	.popup-center /deep/ .u-mode-center-box {
+		background-color: #2B3062;
+		& .content {
+			text-align: center;
+			height: 84px;
+			font-size: 30px;
+			font-family: PingFangSC-Regular, PingFang SC;
+			font-weight: 400;
+			color: #FFFFFF;
+			line-height: 42px;
+		}
+	}
 </style>