zhupeng 3 år sedan
förälder
incheckning
a7b44267ce
5 ändrade filer med 293 tillägg och 39 borttagningar
  1. 20 4
      pages.json
  2. 116 11
      pages/login/step1.vue
  3. 67 10
      pages/login/step2.vue
  4. 77 7
      pages/login/step3.vue
  5. 13 7
      pages/login/step4.vue

+ 20 - 4
pages.json

@@ -3,7 +3,13 @@
 			"^u-(.*)": "uview-ui/components/u-$1/u-$1.vue"
 		},
 	"pages": [ //pages数组中第一项表示应用启动页,参考:https://uniapp.dcloud.io/collocation/pages	
-		
+		{
+			"name":"1.填写基础资料",
+			"path": "pages/login/step1",
+			"style": {
+				//"navigationStyle": "custom" // 隐藏系统导航栏
+			}
+		},
 		
 		{
 			"name":"首页",
@@ -90,13 +96,13 @@
 				//"navigationStyle": "custom" // 隐藏系统导航栏
 			}
 		},
-		{
+		/*{
 			"name":"1.填写基础资料",
 			"path": "pages/login/step1",
 			"style": {
 				//"navigationStyle": "custom" // 隐藏系统导航栏
 			}
-		},
+		},*/
 		{
 			"name":"2.完善个人信息",
 			"path": "pages/login/step2",
@@ -133,7 +139,7 @@
 		"color": "#b3a8a8",
 		"selectedColor": "#ff5e5e",
 		"backgroundColor": "#FFFFFF",
-		"borderStyle": "#e8e8e8",
+		"borderStyle": "white",
 		"list": [{
 				"pagePath": "pages/index/index",
 				"iconPath": "static/img/tabbar/home.png",
@@ -170,6 +176,16 @@
 				"text": "我的"
 			}
 		]
+	},
+	"condition" : { //模式配置,仅开发期间生效
+		"current": 0, //当前激活的模式(list 的索引项)
+		"list": [
+			{
+				"name": "步骤1", //模式名称
+				"path": "pages/login/step1", //启动页面,必选
+				"query": "" //启动参数,在页面的onLoad函数里面得到
+			}
+		]
 	}
   
 }

+ 116 - 11
pages/login/step1.vue

@@ -8,41 +8,146 @@
 			<view class="jpLogin-main">
 				<u-form :model="form" ref="uForm">
 					<view class="jpLogin-input">
-						<u-form-item required="true"><u-input v-model="form.sex" type="select" placeholder="请选择生日"/></u-form-item>
+						<u-form-item required="true"><u-input v-model="form.birthday" type="select" placeholder="请选择生日" @click="open"/>
+ 						</u-form-item>
 					</view>
 					<view class="jpLogin-input">
-						<u-form-item required="true"><u-input v-model="form.sex" type="select" placeholder="请选择身高"/></u-form-item>
+						<u-form-item required="true"><u-input v-model="form.height" type="select" placeholder="请选择身高"/></u-form-item>
 					</view>
 					<view class="jpLogin-input">
-						<u-form-item><u-input v-model="form.name" placeholder="请选择填写体重"/></u-form-item>
+						<u-form-item><u-input v-model="form.weight" type="select" placeholder="请选择填写体重"/></u-form-item>
 					</view>
 				</u-form>
 			</view>
 			<view style="margin-top: 60px;">
-				<u-button type="error" shape="circle" :custom-style="customStyle">下一步</u-button>
-				<view class="step-btn">跳过</view>
+				<u-button type="error" shape="circle" :custom-style="customStyle" @click="next">下一步</u-button>
+				<view class="step-btn" @click="goHome">跳过</view>
 			</view>
 		</view>
+		<uni-calendar ref="calendar" class="uni-calendar--hook" :clear-date="true" :date="info.date" :insert="info.insert" :lunar="info.lunar" :startDate="info.startDate"
+			 :endDate="info.endDate" :range="info.range" @confirm="confirm" @close="close"/>
+		 
 	</view>
 </template>
 
 <script>
+	let _self;
+	/**
+	 * 获取任意时间
+	 */
+	function getDate(date, AddDayCount = 0) {
+		if (!date) {
+			date = new Date()
+		}
+		if (typeof date !== 'object') {
+			date = date.replace(/-/g, '/')
+		}
+		const dd = new Date(date)
+	
+		dd.setDate(dd.getDate() + AddDayCount) // 获取AddDayCount天后的日期
+	
+		const y = dd.getFullYear()
+		const m = dd.getMonth() + 1 < 10 ? '0' + (dd.getMonth() + 1) : dd.getMonth() + 1 // 获取当前月份的日期,不足10补0
+		const d = dd.getDate() < 10 ? '0' + dd.getDate() : dd.getDate() // 获取当前几号,不足10补0
+		return {
+			fullDate: y + '-' + m + '-' + d,
+			year: y,
+			month: m,
+			date: d,
+			day: dd.getDay()
+		}
+	}
+	import uniCalendar from "../../components/uni-calendar/uni-calendar.vue";
 	export default {
+		components:{
+			uniCalendar
+		},
 		data() {
 			return {
 				form: {
-					name: '',
+					name: '',			
+					sex:'',		
+					birthday:"",
+					height:'',
+					weight:'',
 				},
 				value:'0',
 				customStyle: {
 					background: '#FF5E5E'
-				}
+				},
+				showCalendar: false,
+				info: {
+					lunar: true,
+					range: true,
+					insert: false,
+					selected: []
+				},
+				height_ranges:[],
+				weight_ranges:[],
 			}
-			methods: {
-
+		},		
+		onReady() {
+			
+			this.$nextTick(() => {
+				this.showCalendar = true
+			})
+			// TODO 模拟请求异步同步数据
+			setTimeout(() => {
+				this.info.date = getDate(new Date(),0).fullDate
+				this.info.startDate = getDate(new Date(),-36500).fullDate
+				this.info.endDate =  getDate(new Date(),0).fullDate
+				this.info.selected = []
+			}, 2000)
+		},
+		onLoad(){
+			_self = this;
+			for(let i = 130;i<=220;i++)
+			{
+				this.height_ranges.push(i.toString());
 			}
-
-		}
+			for(let i = 20;i<=120;i++)
+			{
+				this.weight_ranges.push(i.toString());
+			}
+		},
+		methods: { 
+			goHome(){
+				uni.switchTab({
+					url:'../index/index'
+				})
+			},
+			open() {
+				this.$refs.calendar.open()
+			},
+			close(){
+				this.form.birthday =this.info.date;
+				console.log('弹窗关闭'+JSON.stringify(this.info.date));
+			},
+			change(e) {
+				console.log('change 返回:', e)
+				this.info.selected = [];
+				
+				// 模拟动态打卡
+				if (this.info.selected.length > 5) return
+				this.info.selected.push({
+					date: e.fulldate,
+					info: '打卡'
+				}) 
+				
+			},
+			confirm(e) {
+				this.info.date = e.fulldate;
+				console.log('confirm 返回:', JSON.stringify(this.info.date))
+			},
+			monthSwitch(e) {
+				console.log('monthSwitchs 返回:', e)
+			},
+			next(){
+				uni.navigateTo({
+					url:'./step2'
+				})
+			}
+		} 
 	}
 </script>
 

+ 67 - 10
pages/login/step2.vue

@@ -8,13 +8,14 @@
 			<view class="jpLogin-main">
 				<u-form :model="form" ref="uForm">
 					<view class="jpLogin-input">
-						<u-form-item required="true"><u-input v-model="form.sex" type="select" placeholder="我的出生地"/></u-form-item>
+						<u-form-item required="true"><u-input v-model="form.address" type="select" placeholder="我的出生地" @click="birthdayAddressChange" />
+						</u-form-item>
 					</view>
 					<view class="jpLogin-input">
-						<u-form-item required="true"><u-input v-model="form.sex" type="select" placeholder="我的的户口所在地"/></u-form-item>
+						<u-form-item required="true"><u-input v-model="form.registered_residence" type="select" placeholder="我的的户口所在地" @click="registeredResidenceAddressChange"  /></u-form-item>
 					</view>
 					<view class="jpLogin-input">
-						<u-form-item required="true"><u-input v-model="form.sex" type="select" placeholder="我的工作所在地"/></u-form-item>
+						<u-form-item required="true"><u-input v-model="form.work_address" type="select" placeholder="我的工作所在地" @click="workAddressChange" /></u-form-item>
 					</view>
 					
 					<view class="jpLogin-input" style="margin-top: 38px;">
@@ -55,29 +56,85 @@
 				</u-form>
 			</view>
 			<view style="margin-top: 60px;">
-				<u-button type="error" shape="circle" :custom-style="customStyle">下一步</u-button>
-				<view class="step-btn">返回上一步</view>
+				<u-button type="error" shape="circle" :custom-style="customStyle" @click="next">下一步</u-button>
+				<view class="step-btn" @click="previous">返回上一步</view>
 			</view>
 		</view>
+		<mpvue-city-picker themeColor="#007AFF" ref="mpvuebirtydayCityPicker" :pickerValueDefault="cityPickerValueDefault" @onConfirm="onBirthdayCityConfirm"></mpvue-city-picker>		
+		<mpvue-city-picker themeColor="#007AFF" ref="mpvueRegisteredResidenceCityPicker" :pickerValueDefault="cityPickerValueDefault" @onConfirm="onResidenceRegisteredCityConfirm"></mpvue-city-picker>		
+		<mpvue-city-picker themeColor="#007AFF" ref="mpvueWorkCityPicker" :pickerValueDefault="cityPickerValueDefault" @onConfirm="onWorkCityConfirm"></mpvue-city-picker>		
 	</view>
 </template>
 
 <script>
+	import mpvueCityPicker from "../../components/mpvue-citypicker/mpvueCityPicker.vue";
+	let _self;
 	export default {
+		components:{
+			mpvueCityPicker
+		},
 		data() {
 			return {
-				form: {
-					name: '',
+				form: { 
+					address:'',
+					registered_residence:'',
+					work_address:'',
+					work_corporation:'',
+					work_post:'',
+					salary_range:'',
+					house_status:'',
+					marriage_status:'',
+					children_status:'',
 				},
+				salary_ranges:['2000元以下','2000-5000元','5000-10000元','10000-20000元','20000-50000元','50000元以上'],
+				education_ranges:['高中中专及以下','大专','本科','双学士','硕士','博士'],
+				profession_ragnes:['在校学生','人力资源/行政/后勤','高级管理','生产/加工/制造','质控/安检','工程机械','技工','财会/审计/统计','金融/证券/投资/保险','房地产/装修/物业','仓储/物流','计算机/互联网/IT','普通劳动力/家政服务','普通服务行业','航空服务业','教育/培训','咨询/顾问','学术/科研','法律','设计/创意','文学/传媒/影视','餐饮/旅游','电子/半导体/仪表仪器','化工','能源/地质勘察','医疗/护理','保健/美容','生物/制药/医疗器械','体育工作者','翻译','公务员/国家干部','私营业主','农/林/牧/渔业','通信技术','自由职业者','其他'],
+				marriage_statuses:['未婚','离异','丧偶'],
+				house_statuses:['已购住房','与人合租','独自租房','与父母同住','住亲朋家','住单位房','需要时购房'],
+				corportation_types:['世界500强','上市公司','国有企业','私营企业','自有公司'],
+				children_statuses:['没有孩子','有孩子跟着自己','有孩子跟着对方','有孩子但已独立'],
 				value:'0',
 				customStyle: {
 					background: '#FF5E5E'
 				}
-			}
-			methods: {
+			} 
 
+		},
+		onLoad(){
+			_self = this;
+		},
+		methods:{
+			previous(){
+				uni.navigateBack({
+					deta:1
+				})
+			},
+			next(){
+				uni.navigateTo({
+					url:'./step3'
+				})
+			},
+			onBirthdayCityConfirm(e) {
+				_self.form.address = e.label;
+				console.log('地址选择'+_self.address)
+			},
+			onResidenceRegisteredCityConfirm(e) {
+				_self.form.registered_residence = e.label;
+				console.log('地址选择'+_self.registered_residence)
+			},
+			onWorkCityConfirm(e) {
+				_self.form.work_address = e.label;
+				console.log('地址选择'+_self.work_address)
+			},
+			birthdayAddressChange(){
+				this.$refs.mpvuebirtydayCityPicker.show()
+			},
+			registeredResidenceAddressChange(){
+				this.$refs.mpvueRegisteredResidenceCityPicker.show()
+			},
+			workAddressChange(){
+				this.$refs.mpvueWorkCityPicker.show()
 			}
-
 		}
 	}
 </script>

+ 77 - 7
pages/login/step3.vue

@@ -14,7 +14,17 @@
 					</view>
 					<view class="jpLogin-input">
 						<u-form-item>
-							<u-input v-model="form.sex" type="select" placeholder="Ta的学历是" />
+								<u-input v-model="form.sex" type="select" placeholder="Ta的学历是" @click="educationPickerShow">
+								</u-input>
+								<u-input v-model="storage" :type="type" :border='true' @click="show = true"   placeholder="请选择所属仓库" style="border-radius: 10px;"/>
+								<u-select v-model="show" mode="single-column" :list="education_ranges" @confirm="StroageConfirm"></u-select>
+<!--							<picker  ref="educationPicker"   @change="bindPickerChange" :value="education_index" :range="education_ranges_by_names" range-key="name">
+								<view style="height: 100;width:100%;background-color: #007AFF; ">
+									
+									
+								</view>
+							</picker>-->
+							
 						</u-form-item>
 					</view>
 					<view class="jpLogin-input">
@@ -29,7 +39,7 @@
 					</view>
 					<view class="jpLogin-input">
 						<u-form-item>
-							<u-input v-model="form.sex" type="select" placeholder="Ta的工作所在地" />
+							<u-input v-model="form.work_address" type="select" placeholder="Ta的工作所在地" @click="workAddressChange"/>
 						</u-form-item>
 					</view>
 					<view class="form-tit">
@@ -43,30 +53,90 @@
 				</u-form>
 			</view>
 			<view style="margin-top: 60px;">
-				<u-button type="error" shape="circle" :custom-style="customStyle">下一步</u-button>
-				<view class="step-btn">返回上一步</view>
+				<u-button type="error" shape="circle" :custom-style="customStyle" @click="next">下一步</u-button>
+				<view class="step-btn" @click="previous">返回上一步</view>
 			</view>
 		</view>
+		<mpvue-city-picker themeColor="#007AFF" ref="mpvueWorkCityPicker" :pickerValueDefault="cityPickerValueDefault" @onConfirm="onWorkCityConfirm"></mpvue-city-picker>
+		
 	</view>
 </template>
 
 <script>
+	import mpvueCityPicker from "../../components/mpvue-citypicker/mpvueCityPicker.vue";
+	let _self;
 	export default {
+		components:{
+			mpvueCityPicker
+		},
 		data() {
 			return {
+				education_index:0,
+				show:false,
 				form: {
 					name: '',
 					value: '',
+					age_range:'',
+					height_range:'',
+					education:'',
+					salary_range:'',
+					profession:'',
+					work_address:'',
+					other:'',
 				},
+				age_ranges:[],
+				height_ranges:[],
+				education_ranges_by_names:[],
+				education_ranges:['不限','高中中专及以下','大专','本科','双学士','硕士','博士'],
+				salary_ranges:['不限','2000元以下','2000-5000元','5000-10000元','10000-20000元','20000-50000元','50000元以上'],				
 				value: '0',
 				customStyle: {
 					background: '#FF5E5E'
 				}
-			}
-			methods: {
+			} 
 
+		},
+		methods:{
+			bindPickerChange: function(e) {
+				console.log('picker发送选择改变,携带值为:' + e.detail.value)
+				//this.index = e.detail.value
+			},
+			previous(){
+				uni.navigateBack({
+					deta:1
+				})
+			},
+			next(){
+				uni.navigateTo({
+					url:'./step4'
+				})
+			},			
+			onWorkCityConfirm(e) {
+				_self.form.work_address = e.label;
+				console.log('地址选择'+_self.work_address)
+			},
+			workAddressChange(){
+				this.$refs.mpvueWorkCityPicker.show()
+			},
+			educationPickerShow(){
+				//this.$refs.educationPicker.show();
+			}
+		},
+		onLoad(){
+			_self = this;
+			for(let i = 18;i<=99;i++)
+			{
+				this.age_ranges.push(i);
+			}
+			for(let i = 130;i<=220;i++)
+			{
+				this.height_ranges.push(i);
+			}
+			for(let i = 0;i< _self.education_ranges.length;i++)
+			{
+				let education = {name:_self.education_ranges[i]};
+				_self.education_ranges_by_names.push(education);
 			}
-
 		}
 	}
 </script>

+ 13 - 7
pages/login/step4.vue

@@ -9,8 +9,8 @@
 				<u-upload :action="action" :file-list="fileList" ></u-upload>
 			</view>
 			<view style="margin-top: 60px;">
-				<u-button type="error" shape="circle" :custom-style="customStyle">确认提交</u-button>
-				<view class="step-btn">返回上一步</view>
+				<u-button type="error" shape="circle" :custom-style="customStyle" @click="formsubmit">确认提交</u-button>
+				<view class="step-btn" @click="previous">返回上一步</view>
 			</view>
 		</view>
 	</view>
@@ -26,11 +26,17 @@
 						url: 'http://pics.sc.chinaz.com/files/pic/pic9/201912/hpic1886.jpg',
 					}
 				]
-			}
-			methods: {
-
-			}
-
+			} 
+		},
+		methods:{
+			previous(){
+				uni.navigateBack({
+					deta:1
+				})
+			},
+			formsubmit(){
+				 
+			}	
 		}
 	}
 </script>