员工注册 添加部门岗位

pages/index/index.vue

@@ -10,46 +10,79 @@
 
 					<view style="font-size: 15px; font-weight: bold;color: #3d4b70;margin-bottom: 10px;">基本信息填写</view>
 					<u-form-item label="姓名" prop="userInfo.Name" borderBottom ref="item1">
-						<u--input v-model="model1.userInfo.Name" border="none" customStyle="margin:0px;display:flex;padding:3px 9px"></u--input>
+						<u--input v-model="model1.userInfo.Name" border="none"
+							customStyle="margin:0px;display:flex;padding:3px 9px"></u--input>
 					</u-form-item>
 					<u-form-item label="性别" prop="userInfo.Sex" borderBottom @click="showSex = true;" ref="item1">
-						<u--input v-model="model1.userInfo.Sex" disabled disabledColor="#ffffff" placeholder="请选择性别" border="none" suffixIcon="arrow-right" fontSize="14px"
+						<u--input v-model="model1.userInfo.Sex" disabled disabledColor="#ffffff" placeholder="请选择性别"
-							customStyle="margin:0px;display:flex;padding:3px 9px" suffixIconStyle="font-size:12px"></u--input>
+							border="none" suffixIcon="arrow-right" fontSize="14px"
+							customStyle="margin:0px;display:flex;padding:3px 9px"
+							suffixIconStyle="font-size:12px"></u--input>
 						<!-- <u-icon slot="right" name="arrow-right"></u-icon> -->
 					</u-form-item>
 					<u-form-item label="手机号码" prop="userInfo.Phone" borderBottom ref="item1">
-						<u--input v-model="model1.userInfo.Phone" border="none" customStyle="margin:0px;display:flex;padding:3px 9px"></u--input>
+						<u--input v-model="model1.userInfo.Phone" border="none"
+							customStyle="margin:0px;display:flex;padding:3px 9px"></u--input>
 					</u-form-item>
 					<u-form-item label="身份证号码" prop="userInfo.ID_CARD" borderBottom ref="item1">
-						<u--input v-model="model1.userInfo.ID_CARD" border="none" customStyle="margin:0px;display:flex;padding:3px 9px"></u--input>
+						<u--input v-model="model1.userInfo.ID_CARD" border="none"
+							customStyle="margin:0px;display:flex;padding:3px 9px"></u--input>
+					</u-form-item>
+
+					<!-- <u-form-item label="入职组织" prop="userInfo.ID_CARD" borderBottom ref="item1">
+						<u--input v-model="model1.userInfo.ID_CARD" border="none"
+							customStyle="margin:0px;display:flex;padding:3px 9px"></u--input>
+					</u-form-item> -->
+					<u-form-item label="入职组织" prop="userInfo.DEPARTMENT_NAME" borderBottom ref="item1"
+						@click="handleShowSheet({name:'DEPARTMENT_NAME', title: '入职组织'})">
+						<u--input v-model="model1.userInfo.DEPARTMENT_NAME" disabled border="none"
+							suffixIcon="arrow-right" customStyle="margin:0px;display:flex;padding:3px 9px"
+							suffixIconStyle="font-size:12px"></u--input>
+					</u-form-item>
+					<u-form-item label="入职岗位" prop="userInfo.POST_NAME" borderBottom ref="item1"
+						@click="handleShowSheet({name:'POST_NAME', title: '入职岗位'})">
+						<u--input v-model="model1.userInfo.POST_NAME" disabled border="none" suffixIcon="arrow-right"
+							customStyle="margin:0px;display:flex;padding:3px 9px"
+							suffixIconStyle="font-size:12px"></u--input>
 					</u-form-item>
 					<u-form-item label="入职时间" prop="userInfo.InTime" borderBottom ref="item1" @click="showCheckDate()">
-						<u--input disabledColor="#fff" v-model="model1.userInfo.InTime" disabled placeholder="请选择入职时间" suffixIcon="arrow-right" suffixIconStyle="font-size:12px" fontSize="14px"
+						<u--input disabledColor="#fff" v-model="model1.userInfo.InTime" disabled placeholder="请选择入职时间"
+							suffixIcon="arrow-right" suffixIconStyle="font-size:12px" fontSize="14px"
 							customStyle="margin:0px;display:flex;padding:3px 9px" border="none">
 						</u--input>
 
 						<!-- <u--input v-model="model1.userInfo.InTime" border="none"></u--input> -->
 					</u-form-item>
-					<u-form-item label="工龄" prop="userInfo.WORKINGYEAR" borderBottom ref="item1" @click="pickerShow = true">
+					<u-form-item label="工龄" prop="userInfo.WORKINGYEAR" borderBottom ref="item1"
-						<u--input disabledColor="#fff" disabled v-model="model1.userInfo.WORKINGYEAR" border="none" suffixIcon="arrow-right" suffixIconStyle="font-size:12px" fontSize="14px"
+						@click="pickerShow = true">
+						<u--input disabledColor="#fff" disabled v-model="model1.userInfo.WORKINGYEAR" border="none"
+							suffixIcon="arrow-right" suffixIconStyle="font-size:12px" fontSize="14px"
 							customStyle="margin:0px;display:flex;padding:3px 9px"></u--input>
 					</u-form-item>
 				</u-form>
 				<view style="display: flex;flex-direction: row;" class="bottom-button">
-					<u-button type="primary" @click="reset" color="#3d4b70" :plain="true" style="margin-right: 5px;">重置</u-button>
+					<u-button type="primary" @click="reset" color="#3d4b70" :plain="true"
-					<u-button type="primary" @click="submit" color="#3d4b70" style="margin-left: 5px;" v-if="loading == false">提交</u-button>
+						style="margin-right: 5px;">重置</u-button>
-					<u-button type="primary" loading loadingText="加载中" color="#3d4b70" style="margin-left: 5px;" v-if="loading == true">提交</u-button>
+					<u-button type="primary" @click="submit" color="#3d4b70" style="margin-left: 5px;"
+						v-if="loading == false">提交</u-button>
+					<u-button type="primary" loading loadingText="加载中" color="#3d4b70" style="margin-left: 5px;"
+						v-if="loading == true">提交</u-button>
 				</view>
-				<u-action-sheet :show="showSex" :actions="actions" title="请选择性别" @close="showSex = false" @select="sexSelect">
+				<u-action-sheet :show="showSex" :actions="actions" title="请选择性别" @close="showSex = false"
+					@select="sexSelect">
 				</u-action-sheet>
-				<u-datetime-picker :show="dateTimePickerInfo.showCheckDate" mode="date" v-model='dateTimePickerInfo.defaultDateTime' :formatter="formatter" @confirm="handleCheckDate"
+				<u-datetime-picker :show="dateTimePickerInfo.showCheckDate" mode="date"
-					@close="dateTimePickerInfo.showCheckDate = false;" @cancel="dateTimePickerInfo.showCheckDate = false;"></u-datetime-picker>
+					v-model='dateTimePickerInfo.defaultDateTime' :formatter="formatter" @confirm="handleCheckDate"
-				<u-picker :show="pickerShow" :columns="pickerColumns" @confirm="pickerConfirm" @cancel="pickerCancel"></u-picker>
+					@close="dateTimePickerInfo.showCheckDate = false;"
+					@cancel="dateTimePickerInfo.showCheckDate = false;"></u-datetime-picker>
+				<u-picker :show="pickerShow" :columns="pickerColumns" @confirm="pickerConfirm"
+					@cancel="pickerCancel"></u-picker>
 
+				<query-selector :show="selectorInfo.showPopup" :defaultChecked="selectorInfo.defaultChecked" :title="selectorInfo.title"
+					:lists="selectorInfo.dataLists" @search="handleSearch" @select="handleSelected"
+					@close="selectorInfo.showPopup=false" :total="selectorInfo.totalCount" />
 			</view>
 		</view>
-
-
 	</view>
 </template>
 
@@ -61,8 +94,14 @@
 	import {
 		isChinaMobilePhone,
 		easyCheckID,
-		getNowFormatDate
+		getNowFormatDate,
+		initFilter,
+		extendRule
 	} from '../../utils/common.js'
+	import {
+		UserPostOrderPaged,
+		DepartmentOrderPaged
+	} from '../../services/common.js'
 	export default {
 		data() {
 			return {
@@ -81,6 +120,10 @@
 						ID_CARD: '',
 						InTime: getNowFormatDate(),
 						WORKINGYEAR: '',
+						DEPARTMENT_NAME: '',
+						DEPARTMENT_ID: '',
+						POST_NAME: '',
+						POST_ID: ''
 					},
 				},
 				dateTimePickerInfo: {
@@ -95,6 +138,17 @@
 						name: '女',
 					},
 				],
+				selectorInfo: {
+					showPopup: false,
+					totalCount: 0,
+					title: '入职组织',
+					index: 0,
+					dataLists: [],
+					defaultText: '',
+					defaultValue: '',
+					name: '',
+					defaultChecked: []
+				},
 				rules: {
 					'userInfo.Name': {
 						type: 'string',
@@ -121,6 +175,12 @@
 						message: '请填写身份证号',
 						trigger: ['blur', 'change']
 					},
+					'userInfo.DEPARTMENT_NAME': {
+						type: 'string',
+						required: true,
+						message: '请选择入职组织',
+						trigger: ['blur', 'change']
+					},
 					'userInfo.InTime': {
 						type: 'string',
 						required: true,
@@ -233,6 +293,8 @@
 					ID_CARD: this.model1.userInfo.ID_CARD,
 					InTime: this.model1.userInfo.InTime,
 					WORKINGYEAR: this.model1.userInfo.WORKINGYEAR,
+					POST_ID: this.model1.userInfo.POST_ID,
+					DEPARTMENT_ID: this.model1.userInfo.DEPARTMENT_ID,
 					ORG_ID: this.OrgId
 				}
 				RegisterUser(json).then((res) => {
@@ -271,6 +333,90 @@
 				})
 			},
 
+
+
+
+			//显示组件
+			handleChange() {
+				this.selectorInfo.showPopup = true
+				this.selectorInfo.title = '班组名称'
+				this.handleSearch()
+			},
+
+			//数据加载
+			handleSearch(val, pageIndex) {
+				var p = {
+					name: this.selectorInfo.name,
+					title: this.selectorInfo.title,
+					val: val,
+					pageIndex: pageIndex
+				}
+				this.handleShowSheet(p)
+			},
+			async handleShowSheet(p) {
+				this.pageIndex = 0
+				var defaultChecked = []
+				const json = initFilter(this.OrgId, null, "NAME", 0, (p.pageIndex ?? 1));
+				json.IgnoreDataRule = true
+				json.Limit = 20
+				if (p.val) {
+					extendRule(json, "NAME", 9, p.val)
+				}
+				
+				let dataSelect = []
+				if (p.name == 'DEPARTMENT_NAME') {
+					dataSelect = await DepartmentOrderPaged(json).then(res => {
+						this.selectorInfo.totalCount = res.TotalCount
+						if (res != undefined && res.Data.length > 0) {
+							for (let i = 0; i < res.Data.length; i++) {
+								res.Data[i].name = res.Data[i].NAME
+								res.Data[i].code = res.Data[i].CODE
+							}
+						}
+						return res.Data
+					})
+				} else if (p.name == 'POST_NAME') {
+					dataSelect = await UserPostOrderPaged(json).then(res => {
+						this.selectorInfo.totalCount = res.TotalCount
+						if (res != undefined && res.Data.length > 0) {
+							for (let i = 0; i < res.Data.length; i++) {
+								res.Data[i].name = res.Data[i].NAME
+								res.Data[i].code = res.Data[i].CODE
+							}
+						}
+						return res.Data
+					})
+				}
+
+				if (defaultChecked == null)
+					defaultChecked = []
+				if (dataSelect.length) {
+					this.selectorInfo = {
+						totalCount: this.selectorInfo.totalCount,
+						showPopup: true,
+						title: p.title,
+						name: p.name,
+						dataLists: dataSelect,
+						defaultChecked: defaultChecked
+					}
+				} else {
+					// 暂无数据
+				}
+			},
+			handleSelected(e) {
+				this.selectorInfo.showPopup = false
+				if(this.selectorInfo.name=='POST_NAME'){
+					// this.userInfo.POST_NAME = e.NAME
+					// this.userInfo.POST_ID = e.ID
+					this.model1.userInfo.POST_NAME = e.NAME
+					this.model1.userInfo.POST_ID = e.ID
+				}else if(this.selectorInfo.name=='DEPARTMENT_NAME'){
+					// this.userInfo.DEPARTMENT_NAME = e.NAME
+					// this.userInfo.DEPARTMENT_ID = e.ID
+					this.model1.userInfo.DEPARTMENT_NAME = e.NAME
+					this.model1.userInfo.DEPARTMENT_ID = e.ID
+				}
+			}
 		}
 	}
 </script>