|
|
@@ -1,281 +1,338 @@
|
|
|
<template>
|
|
|
- <view>
|
|
|
- <!-- 注意，如果需要兼容微信小程序，最好通过setRules方法设置rules规则 -->
|
|
|
- <u--form
|
|
|
- labelPosition="left"
|
|
|
- :model="model1"
|
|
|
- :rules="rules"
|
|
|
- ref="uForm"
|
|
|
- >
|
|
|
- <u-form-item
|
|
|
- labelWidth="150"
|
|
|
- label="报修位置"
|
|
|
- prop="userInfo.sex"
|
|
|
- borderBottom
|
|
|
- @click="showSex = true; hideKeyboard()"
|
|
|
- ref="item1"
|
|
|
- >
|
|
|
- <u--input
|
|
|
- v-model="model1.userInfo.sex"
|
|
|
- disabled
|
|
|
-
|
|
|
- placeholder="请选择报修位置"
|
|
|
- border="none"
|
|
|
- ></u--input>
|
|
|
- <u-icon
|
|
|
- slot="right"
|
|
|
- name="arrow-right"
|
|
|
- ></u-icon>
|
|
|
- </u-form-item>
|
|
|
- <u-form-item
|
|
|
- labelWidth="150"
|
|
|
- label="报修区域"
|
|
|
- prop="userInfo.sex"
|
|
|
- borderBottom
|
|
|
- @click="showSex = true; hideKeyboard()"
|
|
|
- ref="item1"
|
|
|
- >
|
|
|
- <u--input
|
|
|
- v-model="model1.userInfo.sex"
|
|
|
- disabled
|
|
|
- placeholder="请选择报修区域"
|
|
|
- border="none"
|
|
|
- ></u--input>
|
|
|
- <u-icon
|
|
|
- slot="right"
|
|
|
- name="arrow-right"
|
|
|
- ></u-icon>
|
|
|
- </u-form-item>
|
|
|
- <u-form-item
|
|
|
- labelWidth="150"
|
|
|
- label="报修类型"
|
|
|
- prop="userInfo.sex"
|
|
|
- borderBottom
|
|
|
- @click="showSex = true; hideKeyboard()"
|
|
|
- ref="item1"
|
|
|
- >
|
|
|
- <u--input
|
|
|
- v-model="model1.userInfo.sex"
|
|
|
- disabled
|
|
|
- placeholder="请选择报修类型"
|
|
|
- border="none"
|
|
|
- ></u--input>
|
|
|
- <u-icon
|
|
|
- slot="right"
|
|
|
- name="arrow-right"
|
|
|
- ></u-icon>
|
|
|
- </u-form-item>
|
|
|
- <u-form-item
|
|
|
- labelWidth="120"
|
|
|
- label="联系人"
|
|
|
- prop=""
|
|
|
-
|
|
|
- borderBottom
|
|
|
- ref="item1"
|
|
|
- >
|
|
|
- <u--input
|
|
|
- v-model="model1.userInfo.name"
|
|
|
- border="none"
|
|
|
- placeholder="请输入联系人"
|
|
|
- ></u--input>
|
|
|
- </u-form-item>
|
|
|
- <u-form-item
|
|
|
- labelWidth="150"
|
|
|
- label="联系电话"
|
|
|
- prop=""
|
|
|
- borderBottom
|
|
|
- ref="item1"
|
|
|
- >
|
|
|
- <u--input
|
|
|
- v-model="model1.userInfo.name"
|
|
|
- border="none"
|
|
|
- placeholder="请输入联系电话"
|
|
|
- ></u--input>
|
|
|
- </u-form-item>
|
|
|
- </u--form>
|
|
|
- <u-action-sheet
|
|
|
- :show="showSex"
|
|
|
- :actions="actions"
|
|
|
- title="请选择报修位置"
|
|
|
- description=""
|
|
|
- @close="showSex = false"
|
|
|
- @select="sexSelect"
|
|
|
- >
|
|
|
- </u-action-sheet>
|
|
|
- <u-action-sheet
|
|
|
- :show="showSex"
|
|
|
- :actions="actions"
|
|
|
- title="请选择报修区域"
|
|
|
- description=""
|
|
|
- @close="showSex = false"
|
|
|
- @select="sexSelect"
|
|
|
- >
|
|
|
- </u-action-sheet>
|
|
|
- <u-action-sheet
|
|
|
- :show="showSex"
|
|
|
- :actions="actions"
|
|
|
- title="请选择报修类型"
|
|
|
- description=""
|
|
|
- @close="showSex = false"
|
|
|
- @select="sexSelect"
|
|
|
- >
|
|
|
- </u-action-sheet>
|
|
|
- <u-form class="description">
|
|
|
- <u-form-item
|
|
|
- labelWidth="150"
|
|
|
- label="故障描述"
|
|
|
-
|
|
|
- prop="userInfo.name"
|
|
|
- ref="item1">
|
|
|
- </u-form-item>
|
|
|
- <u--textarea v-model="value2"
|
|
|
- placeholder="请输入故障描述"
|
|
|
- count height="250">
|
|
|
- </u--textarea>
|
|
|
- </u-form>
|
|
|
-
|
|
|
-
|
|
|
- <u-form class="upload">
|
|
|
- <u-form-item
|
|
|
- labelWidth="150"
|
|
|
- label="上传照片"
|
|
|
- prop="userInfo.name"
|
|
|
- ref="item1">
|
|
|
- </u-form-item>
|
|
|
- <u-upload
|
|
|
- style="display: flex; justify-content: center; align-items: center;"
|
|
|
- :fileList="fileList1"
|
|
|
- @afterRead="afterRead"
|
|
|
- @delete="deletePic"
|
|
|
- name="1"
|
|
|
- multiple
|
|
|
- uploadIconColor="#5776E6"
|
|
|
- :maxCount="10"
|
|
|
- width="200"
|
|
|
- height="200"
|
|
|
- ></u-upload>
|
|
|
- </u-form>
|
|
|
- <u-button type="primary" iconColor="#5776E6" text="提交"></u-button>
|
|
|
- </view>
|
|
|
+ <view class="OutermostLayer">
|
|
|
+
|
|
|
+ <view class="wfgz">
|
|
|
+ <!-- 注意，如果需要兼容微信小程序，最好通过setRules方法设置rules规则 -->
|
|
|
+ <u--form labelPosition="left" :model="model1" :rules="rules" ref="form1">
|
|
|
+ <!-- <u-form-item labelWidth='180' label="任务名称:" prop="userInfo.name" borderBottom ref="item1">
|
|
|
+ <u--input v-model="model1.userInfo.name" border="none"></u--input>
|
|
|
+ </u-form-item> -->
|
|
|
+
|
|
|
+ <u-form-item labelWidth='180' label="报修位置:" prop="userInfo.mydays" borderBottom
|
|
|
+ @click="showfloor = true;" ref="item1">
|
|
|
+ <u--input v-model="model1.userInfo.myposition" disabled disabledColor="#ffffff"
|
|
|
+ placeholder="请选择报修位置" border="none"></u--input>
|
|
|
+ <u-icon slot="right" name="arrow-right"></u-icon>
|
|
|
+ </u-form-item>
|
|
|
+
|
|
|
+ <u-form-item labelWidth='180' label="报修区域:" prop="userInfo.tasktype" borderBottom
|
|
|
+ @click="showSex = true;" ref="item1">
|
|
|
+ <u--input v-model="model1.userInfo.tasktype" disabled disabledColor="#ffffff" placeholder="请选择报修区域"
|
|
|
+ border="none"></u--input>
|
|
|
+ <u-icon slot="right" name="arrow-right"></u-icon>
|
|
|
+ </u-form-item>
|
|
|
+
|
|
|
+ <u-form-item labelWidth='180' label="报修类型:" prop="userInfo.taskdegree" borderBottom
|
|
|
+ @click="showtaskdegree = true;" ref="item1">
|
|
|
+ <u--input v-model="model1.userInfo.taskdegree" disabled disabledColor="#ffffff"
|
|
|
+ placeholder="请选择报修类型" border="none"></u--input>
|
|
|
+ <u-icon slot="right" name="arrow-right"></u-icon>
|
|
|
+ </u-form-item>
|
|
|
+
|
|
|
+ <!-- <u-form-item labelWidth='180' label="办理人员:" prop="userInfo.taskdegree" borderBottom
|
|
|
+ @click="showtaskpeople = true;" ref="item1">
|
|
|
+ <u--input v-model="model1.userInfo.taskpeople" disabled disabledColor="#ffffff"
|
|
|
+ placeholder="请选择办理人员" border="none"></u--input>
|
|
|
+ <u-icon slot="right" name="arrow-right"></u-icon> -->
|
|
|
+ </u-form-item>
|
|
|
+
|
|
|
+
|
|
|
+ </u--form>
|
|
|
+
|
|
|
+ <view class="guidang">
|
|
|
+ <view class="queding">
|
|
|
+ <u-button type="primary" :plain="true" text="返回" @click="returndata"></u-button>
|
|
|
+ </view>
|
|
|
+ <view class="queding">
|
|
|
+ <u-button type="primary" text="提交" @click="editdata"></u-button>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+
|
|
|
+
|
|
|
+ <!-- <u-picker @cancel='showtaskpeople = false' @confirm='peopleconfirm' :show="showtaskpeople"
|
|
|
+ :columns="columnspeople" keyName="label">
|
|
|
+ </u-picker> -->
|
|
|
+
|
|
|
+
|
|
|
+ <u-picker @cancel='showtaskdegree = false' @confirm='degreeconfirm' :show="showtaskdegree"
|
|
|
+ :columns="columnshowtaskdegree" keyName="label">
|
|
|
+ </u-picker>
|
|
|
+
|
|
|
+ <u-picker @cancel='showSex = false' @confirm='typeconfirm' :show="showSex" :columns="columns" keyName="label">
|
|
|
+ </u-picker>
|
|
|
+
|
|
|
+ <u-picker :show="showfloor" ref="uPicker" :loading="loading" @confirm="confirmfloor" @cancel='cancelfloor'
|
|
|
+ :columns="columns" keyName="orgName" @change="changeHandler"></u-picker>
|
|
|
+
|
|
|
|
|
|
+
|
|
|
+ </view>
|
|
|
</template>
|
|
|
|
|
|
<script>
|
|
|
-export default {
|
|
|
- data() {
|
|
|
- return {
|
|
|
- showSex: false,
|
|
|
- fileList1: [],
|
|
|
- value2:"",
|
|
|
- model1: {
|
|
|
- userInfo: {
|
|
|
-
|
|
|
- },
|
|
|
-
|
|
|
- },
|
|
|
- actions: [
|
|
|
- {
|
|
|
- name: '1',
|
|
|
- },
|
|
|
- {
|
|
|
- name: '2',
|
|
|
+ export default {
|
|
|
+ components: {
|
|
|
+
|
|
|
+ },
|
|
|
+ data() {
|
|
|
+ return {
|
|
|
+ loading: false,
|
|
|
+
|
|
|
+
|
|
|
+ local: '', //区域
|
|
|
+ localCode: '', //这个变量看个人需求使用
|
|
|
+ addressColumns: [], //数据数组
|
|
|
+ defaultAddress: [], //默认选中 (回填时或者初次显示默认选中)
|
|
|
+ addressData: '', //原始数据 (引入的json文件)
|
|
|
+
|
|
|
+ columns: [
|
|
|
+ [],
|
|
|
+ [],
|
|
|
+ []
|
|
|
+ ],
|
|
|
+ columnData: [],
|
|
|
+ columnDatalist: [],
|
|
|
+ showfloor: false,
|
|
|
+
|
|
|
+
|
|
|
+ showSex: false,
|
|
|
+ showday: false,
|
|
|
+ showPicker: false,
|
|
|
+ showtaskdegree: false,
|
|
|
+ showtaskpeople: false,
|
|
|
+
|
|
|
+ model1: {
|
|
|
+ userInfo: {
|
|
|
+ myposition: '',
|
|
|
+
|
|
|
+ id: "",
|
|
|
+ buildingId: "",
|
|
|
+ storeyId: "",
|
|
|
+ houseId: "",
|
|
|
+ repairPosition: "",
|
|
|
+ repairPositionName: "",
|
|
|
+ repairRegion: 1,
|
|
|
+ repairRegionName: "",
|
|
|
+ repairType: 1,
|
|
|
+ repairTypeName: "",
|
|
|
+ contactPerson: "",
|
|
|
+ contactPhone: "",
|
|
|
+ faultDes: "",
|
|
|
+ faultPics: "",
|
|
|
+
|
|
|
+
|
|
|
+
|
|
|
+ name: '维修灯具',
|
|
|
+ tasktype: '维修',
|
|
|
+ mydays: '2023/04/15',
|
|
|
+ taskdegree: '一般',
|
|
|
+ taskpeople: '杨刚',
|
|
|
+ },
|
|
|
},
|
|
|
- {
|
|
|
- name: '3',
|
|
|
+ columns: [
|
|
|
+ [{
|
|
|
+ label: '巡查',
|
|
|
+ id: 1
|
|
|
+
|
|
|
+ }, {
|
|
|
+ label: '维修',
|
|
|
+ id: 2
|
|
|
+ }]
|
|
|
+ ],
|
|
|
+
|
|
|
+ columnshowtaskdegree: [
|
|
|
+ [{
|
|
|
+ label: '一般',
|
|
|
+ id: 1
|
|
|
+
|
|
|
+ }, {
|
|
|
+ label: '重要',
|
|
|
+ id: 2
|
|
|
+ },
|
|
|
+ {
|
|
|
+ label: '紧急',
|
|
|
+ id: 3
|
|
|
+ },
|
|
|
+ {
|
|
|
+ label: '非常紧急',
|
|
|
+ id: 4
|
|
|
+ },
|
|
|
+ ]
|
|
|
+ ],
|
|
|
+ columnspeople: [
|
|
|
+ [{
|
|
|
+ label: '杨刚',
|
|
|
+ id: 1
|
|
|
+
|
|
|
+ }, {
|
|
|
+ label: '李伟',
|
|
|
+ id: 2
|
|
|
+ }]
|
|
|
+ ],
|
|
|
+
|
|
|
+ rules: {
|
|
|
+ 'userInfo.name': {
|
|
|
+ type: 'string',
|
|
|
+ required: true,
|
|
|
+ message: '请填写姓名',
|
|
|
+ trigger: ['blur', 'change']
|
|
|
+ },
|
|
|
+ 'userInfo.sex': {
|
|
|
+ type: 'string',
|
|
|
+ required: true,
|
|
|
+ message: '请选择任务类型',
|
|
|
+ trigger: ['blur', 'change']
|
|
|
+ },
|
|
|
+ 'userInfo.mydays': {
|
|
|
+ type: 'string',
|
|
|
+ required: true,
|
|
|
+ message: '请选择办结日期',
|
|
|
+ trigger: ['change']
|
|
|
+ },
|
|
|
+ 'userInfo.taskdegree': {
|
|
|
+ type: 'string',
|
|
|
+ required: true,
|
|
|
+ message: '请选择紧急程度',
|
|
|
+ trigger: ['blur', 'change']
|
|
|
+ },
|
|
|
+ 'userInfo.taskpeople': {
|
|
|
+ type: 'string',
|
|
|
+ required: true,
|
|
|
+ message: '请选择办理人员',
|
|
|
+ trigger: ['blur', 'change']
|
|
|
+ },
|
|
|
+
|
|
|
},
|
|
|
- ],
|
|
|
- rules: {
|
|
|
- // 'userInfo.name': {
|
|
|
- // type: 'string',
|
|
|
- // required: true,
|
|
|
- // message: '联系人',
|
|
|
- // trigger: ['blur', 'change']
|
|
|
- // },
|
|
|
- // 'userInfo.sex': {
|
|
|
- // type: 'string',
|
|
|
- // max: 1,
|
|
|
- // required: true,
|
|
|
- // message: '请选择男或女',
|
|
|
- // trigger: ['blur', 'change']
|
|
|
- // },
|
|
|
- },
|
|
|
- radio: '',
|
|
|
- switchVal: false
|
|
|
- };
|
|
|
- },
|
|
|
- methods: {
|
|
|
- hideKeyboard(){
|
|
|
- console.log(111);
|
|
|
+
|
|
|
+ };
|
|
|
},
|
|
|
-
|
|
|
- sexSelect(e) {
|
|
|
-
|
|
|
- // this.model1.userInfo.sex = e.name
|
|
|
- // this.$refs.uForm.validateField('userInfo.sex')
|
|
|
+ onLoad() {
|
|
|
+ this.getfloor();
|
|
|
+ // this.loadmore();
|
|
|
},
|
|
|
- // 删除图片
|
|
|
- deletePic(event) {
|
|
|
- this[`fileList${event.name}`].splice(event.index, 1)
|
|
|
- },
|
|
|
- // 新增图片
|
|
|
- async afterRead(event) {
|
|
|
- // 当设置 multiple 为 true 时, file 为数组格式，否则为对象格式
|
|
|
- let lists = [].concat(event.file)
|
|
|
- let fileListLen = this[`fileList${event.name}`].length
|
|
|
- lists.map((item) => {
|
|
|
- this[`fileList${event.name}`].push({
|
|
|
- ...item,
|
|
|
- status: 'uploading',
|
|
|
- message: '上传中'
|
|
|
- })
|
|
|
- })
|
|
|
- for (let i = 0; i < lists.length; i++) {
|
|
|
- const result = await this.uploadFilePromise(lists[i].url)
|
|
|
- let item = this[`fileList${event.name}`][fileListLen]
|
|
|
- this[`fileList${event.name}`].splice(fileListLen, 1, Object.assign(item, {
|
|
|
- status: 'success',
|
|
|
- message: '',
|
|
|
- url: result
|
|
|
- }))
|
|
|
- fileListLen++
|
|
|
+
|
|
|
+ methods: {
|
|
|
+
|
|
|
+ changeHandler(e) {
|
|
|
+ // console.log('77777', e)
|
|
|
+ const {
|
|
|
+ columnIndex,
|
|
|
+ index,
|
|
|
+ picker = this.$refs.uPicker
|
|
|
+ } = e
|
|
|
+ console.log('111111111111111111', columnIndex, index, picker)
|
|
|
+
|
|
|
+ if (columnIndex === 0) {
|
|
|
+ this.loading = true
|
|
|
+ picker.setColumnValues(1, this.columnData[index])
|
|
|
+ this.loading = false
|
|
|
+ }
|
|
|
+ // //this.getalldata();
|
|
|
+
|
|
|
+
|
|
|
+ },
|
|
|
+ confirmfloor(e) {
|
|
|
+ console.log('222222', e.value)
|
|
|
+ // this.model1.userInfo.myposition = e.value[0].orgName + e.value[1].orgName;
|
|
|
+
|
|
|
+ // this.dataForm.buildingId = e.value[0].orgId;
|
|
|
+ // this.dataForm.storeyId = e.value[1].orgId;
|
|
|
+ // this.showfloor = false;
|
|
|
+ // this.getalldata();
|
|
|
+ },
|
|
|
+ cancelfloor() {
|
|
|
+ this.showfloor = false;
|
|
|
+ },
|
|
|
+ getfloor() {
|
|
|
+ this.$api.get('/control/getOrgStructureTree', {})
|
|
|
+ .then(res => {
|
|
|
+ if (res.data.code == 0) {
|
|
|
+ //this.dataForm.projectId = res.data.data[0].orgId;
|
|
|
+
|
|
|
+ this.model1.userInfo.myposition = res.data.data[0].orgName;
|
|
|
+ this.alldata = res.data.data[0].childrenList;
|
|
|
+ console.log('111111111111111111', res.data.data[0].childrenList)
|
|
|
+ this.columns = [
|
|
|
+ res.data.data[0].childrenList,
|
|
|
+ res.data.data[0].childrenList[0].childrenList
|
|
|
+ ]
|
|
|
+ let allfloor = [];
|
|
|
+ for (let i = 0; i < res.data.data[0].childrenList.length; i++) {
|
|
|
+ allfloor.push(res.data.data[0].childrenList[i].childrenList)
|
|
|
+ }
|
|
|
+ this.columnData = allfloor;
|
|
|
+
|
|
|
+
|
|
|
+
|
|
|
+ // this.getalldata();
|
|
|
+ } else {
|
|
|
+ this.showdct = true
|
|
|
}
|
|
|
- },
|
|
|
- uploadFilePromise(url) {
|
|
|
- return new Promise((resolve, reject) => {
|
|
|
- let a = uni.uploadFile({
|
|
|
- url: 'http://192.168.2.21:7001/upload', // 仅为示例，非真实的接口地址
|
|
|
- filePath: url,
|
|
|
- name: 'file',
|
|
|
- formData: {
|
|
|
- user: 'test'
|
|
|
- },
|
|
|
- success: (res) => {
|
|
|
- setTimeout(() => {
|
|
|
- resolve(res.data.data)
|
|
|
- }, 1000)
|
|
|
- }
|
|
|
- });
|
|
|
- })
|
|
|
- },
|
|
|
- },
|
|
|
- onReady() {
|
|
|
- //如果需要兼容微信小程序，并且校验规则中含有方法等，只能通过setRules方法设置规则。
|
|
|
- // this.$refs.uForm.setRules(this.rules)
|
|
|
- },
|
|
|
- onLoad() {
|
|
|
-
|
|
|
- }
|
|
|
-};
|
|
|
+ })
|
|
|
+ },
|
|
|
+ onShowDatePicker() { //显示
|
|
|
+
|
|
|
+ this.showPicker = true;
|
|
|
+ // this.value =this.model1.userInfo.mydays;
|
|
|
+ },
|
|
|
+
|
|
|
+ returndata() {
|
|
|
+ uni.navigateBack({
|
|
|
+ delta: 1
|
|
|
+ });
|
|
|
+ },
|
|
|
+ editdata() {
|
|
|
+ uni.navigateBack({
|
|
|
+ delta: 1
|
|
|
+ });
|
|
|
+ },
|
|
|
+
|
|
|
+ typeconfirm(e) {
|
|
|
+ console.log('111111111111111111', e.value[0].label)
|
|
|
+ this.model1.userInfo.tasktype = e.value[0].label;
|
|
|
+ this.showSex = false;
|
|
|
+ // this.model1.userInfo.sex = e.name
|
|
|
+ this.$refs.form1.validateField('userInfo.tasktype')
|
|
|
+ },
|
|
|
+
|
|
|
+ degreeconfirm(e) {
|
|
|
+ //console.log('111111111111111111', e.value[0].label)
|
|
|
+ this.model1.userInfo.taskdegree = e.value[0].label;
|
|
|
+ this.showtaskdegree = false;
|
|
|
+ // this.model1.userInfo.sex = e.name
|
|
|
+ this.$refs.form1.validateField('userInfo.taskdegree')
|
|
|
+ },
|
|
|
+ peopleconfirm(e) {
|
|
|
+ //console.log('111111111111111111', e.value[0].label)
|
|
|
+ this.model1.userInfo.taskpeople = e.value[0].label;
|
|
|
+ this.showtaskpeople = false;
|
|
|
+ // this.model1.userInfo.sex = e.name
|
|
|
+ this.$refs.form1.validateField('userInfo.taskpeople')
|
|
|
+ },
|
|
|
+
|
|
|
+
|
|
|
+ },
|
|
|
+ onReady() {
|
|
|
+ //如果需要兼容微信小程序，并且校验规则中含有方法等，只能通过setRules方法设置规则。
|
|
|
+ this.$refs.form1.setRules(this.rules)
|
|
|
+ },
|
|
|
+ };
|
|
|
</script>
|
|
|
|
|
|
+<style>
|
|
|
+ .guidang {
|
|
|
+ display: flex;
|
|
|
+ justify-content: space-between;
|
|
|
+ align-items: center;
|
|
|
+ margin-top: 40rpx;
|
|
|
+ }
|
|
|
|
|
|
-<style lang="scss">
|
|
|
-
|
|
|
- uni-text.u-icon_icon.uicon-camera-fill{
|
|
|
- span{
|
|
|
- width: 150rpx;
|
|
|
- height: 150rpx;
|
|
|
- }
|
|
|
-
|
|
|
+ .queding {
|
|
|
+ width: 40%;
|
|
|
+ }
|
|
|
+
|
|
|
+ .wfgz {
|
|
|
+ padding: 20rpx;
|
|
|
}
|
|
|
-</style>
|
|
|
+</style>
|
