qa-prevention-xgf-app/pages/eight_assignments/confined_space/apply.vue

<template>
	<view class="content">
		<view class="card">
			<u--form labelPosition="left" :model="form" :rules="rules" ref="formRef" labelWidth="140px">
				<u-form-item label="申请单位" prop="APPLY_DEPARTMENT_NAME" borderBottom required>
					<u--input v-model="form.APPLY_DEPARTMENT_NAME" border="none" readonly />
				</u-form-item>
				<u-form-item label="申请人" prop="APPLY_USER_NAME" borderBottom required>
					<u--input v-model="form.APPLY_USER_NAME" border="none" readonly />
				</u-form-item>
				<u-form-item label="作业分公司" prop="CORP_NAME" borderBottom required>
					<u--input v-model="form.CORP_NAME" border="none" readonly />
				</u-form-item>
				<u-form-item label="受限空间所属单位" prop="BELONG_CORP" borderBottom required>
					<u--input v-model="form.BELONG_CORP" border="none" />
				</u-form-item>
				<u-form-item label="受限空间名称" prop="LIMITSPACE_NAME" borderBottom required
					@click="fnSingleChoiceClick('LIMITSPACE_NAME')">
					<u--input v-model="form.LIMITSPACE_NAME" border="none" readonly />
				</u-form-item>
				<u-form-item label="受限空间内原有介质名称" prop="MEDIUM_NAME" borderBottom required>
					<u--input v-model="form.MEDIUM_NAME" border="none" />
				</u-form-item>
				<u-form-item label="作业内容" prop="WORK_CONTENT" borderBottom required labelPosition="top">
					<u--textarea v-model="form.WORK_CONTENT" border="none" autoHeight />
				</u-form-item>
				<u-form-item label="作业开始时间" prop="WORK_START_DATE" borderBottom required
					@click="fnDateTimePickerClick('WORK_START_DATE')">
					<u--input v-model="form.WORK_START_DATE" border="none" readonly />
				</u-form-item>
				<u-form-item label="作业结束时间" prop="WORK_END_DATE" borderBottom required
					@click="fnDateTimePickerClick('WORK_END_DATE')">
					<u--input v-model="form.WORK_END_DATE" border="none" readonly />
				</u-form-item>
				<u-form-item label="地点坐标" borderBottom required>
					<u-button type="primary" size="small" text="定位" :customStyle="{width:'100upx',margin:0}"
						@click="fnLocation" />
				</u-form-item>
				<u-form-item label="经度" prop="WORK_LONGITUDE" borderBottom required>
					<u--input v-model="form.WORK_LONGITUDE" border="none" readonly />
				</u-form-item>
				<u-form-item label="纬度" prop="WORK_LATITUDE" borderBottom required>
					<u--input v-model="form.WORK_LATITUDE" border="none" readonly />
				</u-form-item>
				<u-form-item label="作业人" prop="WORK_USER" borderBottom required>
					<u--input v-model="form.WORK_USER" border="none" />
				</u-form-item>
				<u-form-item label="关联的其他特殊作业及安全作业票编号" prop="SPECIAL_WORK" borderBottom required labelPosition="top"
					labelWidth="auto">
					<u-button type="primary" size="mini" text="选择其它"
						:customStyle="{position: 'absolute',top: '-46upx',right: '20upx',width: '150upx'}"
						@click="otherAssignmentsShow = true" />
					<u--textarea v-model="form.SPECIAL_WORK" border="none" autoHeight maxlength="-1" />
				</u-form-item>
				<u-form-item label="风险辨识结果" prop="RISK_IDENTIFICATION" borderBottom required labelPosition="top"
					labelWidth="auto">
					<u-button type="primary" size="mini" text="选择其它"
						:customStyle="{position: 'absolute',top: '-46upx',right: '20upx',width: '150upx'}"
						@click="otherIdentificationShow = true" />
					<u--textarea v-model="form.RISK_IDENTIFICATION" border="none" autoHeight maxlength="-1" />
				</u-form-item>
			</u--form>
		</view>
		<u-picker :show="picker.show" :columns="picker.columns" :keyName="picker.key" :key="picker.type"
			@confirm="fnSingleChoiceConfirm" @cancel="fnSingleChoiceCancel" />
		<u-datetime-picker :show="datetimePicker.show" v-model="datetimePicker.value" :mode="datetimePicker.mode"
			:minDate="datetimePicker.min" :key="datetimePicker.type" @confirm="fnDateTimePickerConfirm"
			@cancel="fnDateTimePickerCancel" />
		<other-select :visible.sync="otherAssignmentsShow" v-model="form.SPECIAL_WORK" type="assignments" />
		<other-select :visible.sync="otherIdentificationShow" v-model="form.RISK_IDENTIFICATION" type="identification" />
	</view>
</template>

<script>
	import {
		getConfinedSpaceSelectList
	} from '../../../api/index'
	import OtherSelect from '@/components/other-select/index.vue';

	export default {
		components: {
			OtherSelect
		},
		data() {
			return {
				form: {
					APPLY_DEPARTMENT_ID: this.$store.getters.getUserInfo.DEPARTMENT_ID,
					APPLY_DEPARTMENT_NAME: this.$store.getters.getUserInfo.DEPARTMENT_NAME,
					APPLY_USER_ID: this.$store.getters.getUserInfo.USER_ID,
					APPLY_USER_NAME: this.$store.getters.getUserInfo.NAME,
					BELONG_CORP: '',
					LIMITSPACE_NAME: '',
					LIMITSPACE_ID: '',
					MEDIUM_NAME: '',
					WORK_CONTENT: '',
					WORK_START_DATE: '',
					WORK_END_DATE: '',
					WORK_LONGITUDE: '',
					WORK_LATITUDE: '',
					WORK_USER: '',
					SPECIAL_WORK: '',
				},
				rules: {},
				picker: {
					show: false,
					columns: [],
					key: 'NAME',
					type: ''
				},
				datetimePicker: {
					show: false,
					value: Number(new Date()),
					min: new Date().getTime(),
					mode: 'datetime',
					type: ''
				},
				otherAssignmentsShow: false,
				otherIdentificationShow: false,
			}
		},
		onLoad(options) {
			this.form.CORP_ID = options.CORPINFO_ID
			this.form.CORP_NAME = options.CORP_NAME
		},
		methods: {
			async fnGetConfinedSpaceSelectList() {
				const resData = await getConfinedSpaceSelectList()
				this.picker.columns = [resData.varList]
			},
			fnSingleChoiceClick(event) {
				this.picker.type = event
				if (event === 'LIMITSPACE_NAME') this.fnGetConfinedSpaceSelectList()
				this.picker.show = true
			},
			fnSingleChoiceConfirm(event) {
				if (this.picker.type === 'LIMITSPACE_NAME') {
					this.form.LIMITSPACE_ID = event.value[0].LIMITSPACE_ID
					this.form.LIMITSPACE_NAME = event.value[0].NAME
				}
				this.fnSingleChoiceCancel()
			},
			fnSingleChoiceCancel() {
				this.picker.show = false
			},
			fnDateTimePickerClick(event) {
				this.datetimePicker.type = event
				this.datetimePicker.value = Number(new Date(this.form[event])) || Number(new Date())
				this.datetimePicker.show = true
			},
			fnDateTimePickerConfirm(event) {
				this.form[this.datetimePicker.type] = uni.$u.timeFormat(event.value, 'yyyy-mm-dd hh:MM')
				this.fnDateTimePickerCancel()
			},
			fnDateTimePickerCancel() {
				this.datetimePicker.show = false
			},
			fnLocation() {
				uni.navigateTo({
					url: '/pages/map/index',
					events: {
						acceptLocationData: (event) => {
							this.form.WORK_LONGITUDE = event.data.longitue;
							this.form.WORK_LATITUDE = event.data.latitude;
						}
					},
				})
			}
		}
	}
</script>

<style>
</style>