| | |
| | | <template> |
| | | <view> |
| | | <view class="content bgc-ff"> |
| | | |
| | | <view class="top item flex j-c-s-b a-i-c" @click="onScan()"> |
| | | <view class="flex a-i-c"> |
| | | <u-icon name="/static/icon/nav-05.png" width="90rpx" height="90rpx"></u-icon> |
| | | <text class="f-28 ml-10">扫码获取信息</text> |
| | | </view> |
| | | <u-icon name="arrow-right" size="20"></u-icon> |
| | | </view> |
| | | |
| | | <u-form labelPosition="left" :model="info" :rules="rules" ref="form" labelWidth="90" |
| | | :labelStyle="{fontSize:'28rpx'}"> |
| | | <u-form-item label="姓名" prop="info.name" borderBottom required> |
| | | <u-input v-model="info.name" border="none" placeholder="请输入标题" placeholderClass="f-28 c-99" |
| | | |
| | | <u-form-item label="走访类型" prop="type" :borderBottom="false" required @click="isShowTypePicker = true"> |
| | | <u-input v-model="typeName" disabled disabledColor="#fff" border="none" placeholder="请选择" |
| | | placeholderClass="f-28 c-99" inputAlign="right"></u-input> |
| | | <u-icon slot="right" name="arrow-right"></u-icon> |
| | | </u-form-item> |
| | | <u-form-item label="重点人群类型" prop="peopleType" :borderBottom="false" required |
| | | @click="isShowLabelPicker = true" v-if="info.type == 2"> |
| | | <u-input v-model="labelName" disabled disabledColor="#fff" border="none" placeholder="请选择" |
| | | placeholderClass="f-28 c-99" inputAlign="right"></u-input> |
| | | <u-icon slot="right" name="arrow-right"></u-icon> |
| | | </u-form-item> |
| | | |
| | | <u-form-item label="被访人姓名" prop="householdId" :borderBottom="false" required |
| | | @click="isShowPopup = true"> |
| | | <u-input v-model="selectedHousehold.name" disabled disabledColor="#fff" border="none" |
| | | placeholder="请选择" placeholderClass="f-28 c-99" inputAlign="right"></u-input> |
| | | <u-icon slot="right" name="arrow-right"></u-icon> |
| | | </u-form-item> |
| | | <u-form-item label="手机号" borderBottom required v-if="info.householdId"> |
| | | <u-input v-model="selectedHousehold.phoneNumber" border="none" disabled disabledColor="#ffffff" |
| | | placeholderClass="f-28 c-99" inputAlign="right"></u-input> |
| | | </u-form-item> |
| | | <u-form-item label="走访地址" borderBottom required v-if="info.householdId"> |
| | | <!-- <u-input v-model="address" border="none" disabled disabledColor="#f5f5f5" |
| | | placeholderClass="f-28 c-99" inputAlign="right"></u-input> --> |
| | | <view class="address-content"> |
| | | {{address}} |
| | | </view> |
| | | </u-form-item> |
| | | <!-- <u-form-item label="姓名" prop="info.name" borderBottom required> |
| | | <u-input v-model="info.name" border="none" placeholder="请输入" placeholderClass="f-28 c-99" |
| | | inputAlign="right"></u-input> |
| | | </u-form-item> |
| | | <u-form-item label="手机号" prop="phone" borderBottom required> |
| | | <u-input v-model="info.phone" border="none" placeholder="请输入标题" placeholderClass="f-28 c-99" |
| | | <u-form-item label="手机号" prop="phone" borderBottom required> |
| | | <u-input v-model="info.phone" border="none" placeholder="请输入手机号" placeholderClass="f-28 c-99" |
| | | inputAlign="right"></u-input> |
| | | </u-form-item> |
| | | <u-form-item label="内容" borderBottom required> |
| | | <u-input type="textarea" v-model="info.context" border="none" placeholderClass="f-28 c-99" |
| | | inputAlign="right"> |
| | | </u-input> |
| | | </u-form-item> --> |
| | | <u-form-item label="内容" borderBottom required prop="context"> |
| | | <!-- <u-input type="textarea" v-model="info.context" border="none" placeholderClass="f-28 c-99" |
| | | inputAlign="right" placeholder="请输入内容"> |
| | | </u-input> --> |
| | | <u--textarea v-model="info.context" border="none" placeholderClass="f-28 c-99" inputAlign="right" |
| | | placeholder="请输入内容"></u--textarea> |
| | | </u-form-item> |
| | | <u-form-item label="走访时间" prop="workTime" :borderBottom="false" required @click="showSelectDate = true"> |
| | | <u-input v-model="info.workTime" disabled disabledColor="#ffffff" border="none" placeholder="请选择" |
| | |
| | | </view> |
| | | |
| | | <u-datetime-picker ref="datetimePicker" :show="showSelectDate" v-model="workTime" mode="datetime" |
| | | :formatter="formatter" @confirm="confirmDate" @cancel="isShowPicker = false"></u-datetime-picker> |
| | | <!-- <u-picker :show="isShowPicker" :columns="scStatus" :defaultIndex="houseIndex" @cancel="isShowPicker = false" |
| | | @confirm="confirmHouse()"></u-picker> --> |
| | | <view class="footer"> |
| | | <button class="footer-btn" @click="submitInfo">提交</button> |
| | | </view> |
| | | :formatter="formatter" @confirm="confirmDate" @cancel="showSelectDate = false"></u-datetime-picker> |
| | | |
| | | <u-picker :show="isShowTypePicker" :columns="typeList" :defaultIndex="typeIndex" |
| | | @cancel="isShowTypePicker = false" @confirm="confirmType()" keyName="dictValue"></u-picker> |
| | | |
| | | <u-picker :show="isShowLabelPicker" ref="uPicker" @change="changeHandler" :columns="labelList" |
| | | :defaultIndex="labelIndex" @cancel="isShowLabelPicker = false" @confirm="confirmLabelType()" |
| | | keyName="name"></u-picker> |
| | | |
| | | <!-- <footer-btn @click="submitInfo" :text="isEdit?'保存':'提交'" /> --> |
| | | |
| | | <button class="submit-btn" @click="submitInfo">{{isEdit?"保存":"提交"}}</button> |
| | | <button class="list-btn" @click="navToRecord">走访记录</button> |
| | | |
| | | |
| | | <u-popup :show="isShowPopup" mode="bottom" :round="10" :closeable="true" @close="isShowPopup = false"> |
| | | <view class="popup-content"> |
| | | <view class="popup-title f-30"> |
| | | 选择居民 |
| | | </view> |
| | | <u-search placeholder="请输入要搜索的内容(姓名 手机号)" :showAction="true" actionText="搜索" :animation="true" |
| | | v-model="keyword" @search="searchHousehold" @custom="searchHousehold" |
| | | @clear="clearKeyword"></u-search> |
| | | <scroll-view class="popup-list" :scroll-y="true"> |
| | | <view class="popup-list-item" v-for="(i,k) in houseHoldList" :key="k" @click="selectHousehold(i)"> |
| | | <view class="flex a-i-c mb-10"> |
| | | <text class="f-28 fw mr-20">{{i.name}}</text> |
| | | <text class="f-26" v-if="i.phoneNumber">{{i.phoneNumber}}</text> |
| | | </view> |
| | | |
| | | <view class="f-28"> |
| | | {{i.townStreetName}}{{i.neiName}}{{i.aoiName}}{{i.address || ""}} |
| | | </view> |
| | | <view class="check-icon" v-if="i.id == info.householdId"> |
| | | <u-icon name="checkbox-mark" color="#017BFC" size="30"></u-icon> |
| | | </view> |
| | | |
| | | |
| | | </view> |
| | | </scroll-view> |
| | | </view> |
| | | </u-popup> |
| | | |
| | | |
| | | </view> |
| | | |
| | | </template> |
| | | |
| | | <script> |
| | | import { |
| | | addWorkLog |
| | | addWorkLog, |
| | | getWorkLogDetail, |
| | | updateWorkLog |
| | | } from "@/api/workLog/workLog.js" |
| | | import uploadMixin from "@/mixin/uploadMixin"; |
| | | import { |
| | | bizDictionary, |
| | | update |
| | | } from '@/api/system/dict.js' |
| | | import { |
| | | getLabelListByParentId |
| | | } from "@/api/label/label.js"; |
| | | import { |
| | | fetchHousehold |
| | | } from "@/api/house/household.js" |
| | | import { |
| | | getHouseholdDetail |
| | | } from '@/api/house/household.js' |
| | | export default { |
| | | mixins: [uploadMixin], |
| | | data() { |
| | |
| | | images: [] |
| | | }, |
| | | info: { |
| | | name: "", |
| | | phone: "", |
| | | context: "" |
| | | // name: "", |
| | | // phone: "", |
| | | type: "", |
| | | householdId: "", |
| | | context: "", |
| | | workTime: "", |
| | | personType: "" |
| | | }, |
| | | rules: { |
| | | 'name': { |
| | | // 'name': { |
| | | // type: 'string', |
| | | // required: true, |
| | | // message: '请输入姓名', |
| | | // trigger: ['blur', 'change'] |
| | | // }, |
| | | // 'phone': { |
| | | // type: 'string', |
| | | // required: true, |
| | | // message: '请输入手机号', |
| | | // trigger: ['blur', 'change'] |
| | | // }, |
| | | |
| | | type: [{ |
| | | type: 'number', |
| | | required: true, |
| | | message: '请选择走访类型', |
| | | trigger: ['blur', 'change'] |
| | | }], |
| | | // peopleType: [{ |
| | | // type: 'number', |
| | | // required: true, |
| | | // message: '请选择重点人群类型', |
| | | // trigger: ['blur', 'change'] |
| | | // }], |
| | | householdId: [{ |
| | | type: 'string', |
| | | required: true, |
| | | message: '请输入姓名', |
| | | message: '请选择被访问人', |
| | | trigger: ['blur', 'change'] |
| | | }, |
| | | 'phone': { |
| | | type: 'string', |
| | | required: true, |
| | | message: '请输入手机号', |
| | | trigger: ['blur', 'change'] |
| | | }, |
| | | 'context': { |
| | | }], |
| | | context: [{ |
| | | type: 'string', |
| | | required: true, |
| | | message: '请输入工作内容', |
| | | trigger: ['blur', 'change'] |
| | | }, |
| | | }], |
| | | }, |
| | | showSelectDate: false, |
| | | workTime: Number(new Date()), |
| | | isShowPicker: false, |
| | | houseIndex: [0] |
| | | houseIndex: [0], |
| | | typeList: [], |
| | | typeName: "", |
| | | typeIndex: [0], |
| | | isShowTypePicker: false, |
| | | isShowLabelPicker: false, |
| | | labelList: [], |
| | | labelListTwo: [], |
| | | labelIndex: [0], |
| | | labelName: "", |
| | | keyword: "", |
| | | houseHoldList: [], |
| | | selectedHousehold: {}, |
| | | isShowPopup: false, |
| | | address: "", |
| | | isEdit: false, |
| | | id: "", |
| | | houseCode: '' |
| | | } |
| | | }, |
| | | onLoad() { |
| | | let userInfo = uni.getStorageSync("userInfo"); |
| | | this.$set(this.info, "name", userInfo.real_name); |
| | | this.$set(this.info, "phone", userInfo.phone); |
| | | // onLoad() { |
| | | // let userInfo = uni.getStorageSync("userInfo"); |
| | | // this.$set(this.info, "name", userInfo.real_name); |
| | | // this.$set(this.info, "phone", userInfo.phone); |
| | | // }, |
| | | |
| | | |
| | | async onLoad(option) { |
| | | await this.getTypeList(); |
| | | await this.getLabelList(); |
| | | if (option.id) { |
| | | this.isEdit = true; |
| | | this.id = option.id; |
| | | setTimeout(() => { |
| | | this.getDetail(option.id) |
| | | }, 200) |
| | | } |
| | | }, |
| | | |
| | | onReady() { |
| | | //onReady 为uni-app支持的生命周期之一 |
| | | this.$refs.form.setRules(this.rules) |
| | | }, |
| | | |
| | | methods: { |
| | | |
| | | onScan() { |
| | | uni.scanCode({ |
| | | success: (res) => { |
| | | let obj = this.getUrlParams(res.result); |
| | | this.getHouseType(obj.stdId); |
| | | } |
| | | }) |
| | | }, |
| | | |
| | | |
| | | getUrlParams(url) { |
| | | let urlStr = url.split('?')[1] |
| | | let obj = {}; |
| | | let paramsArr = urlStr.split('&') |
| | | for (let i = 0, len = paramsArr.length; i < len; i++) { |
| | | let arr = paramsArr[i].split('=') |
| | | obj[arr[0]] = arr[1]; |
| | | } |
| | | return obj |
| | | }, |
| | | |
| | | getHouseType(code) { |
| | | this.houseCode = code |
| | | this.getHouseholdList(); |
| | | }, |
| | | |
| | | |
| | | getDetail(id) { |
| | | getWorkLogDetail({ |
| | | id |
| | | }).then(res => { |
| | | console.log(res); |
| | | if (res.code == 200) { |
| | | let data = res.data |
| | | this.tyepIndex = this.$getIndex(this.typeList[0], data.type, "dictKey", "dictValue").index; |
| | | this.typeName = this.$getIndex(this.typeList[0], data.type, "dictKey", "dictValue").name; |
| | | if (data.workTime) { |
| | | this.workTime = Number(new Date(data.workTime)) |
| | | } |
| | | // this.info.type = data.type; |
| | | // this.info.workTime = data.workTime; |
| | | // this.info.context = data.context; |
| | | // this.info.householdId = data.householdId; |
| | | // this.info.personType = data.personType; |
| | | // console.log(typeof data.personType) |
| | | // this.labelIndex = this.$getIndex(this.labelList[0], data.personType, "id", "name").index; |
| | | // this.labelName = this.$getIndex(this.labelList[0], data.personType, "id", "name").name; |
| | | this.labelName = data.labelName |
| | | this.getHousehold(data.householdId); |
| | | this.form.images = this.$setImageUrl(data.url, 2); |
| | | this.info.id = data.id; |
| | | for (let i in this.info) { |
| | | this.$set(this.info, i, data[i]) |
| | | } |
| | | } |
| | | }) |
| | | }, |
| | | |
| | | getTypeList() { |
| | | bizDictionary({ |
| | | code: "haveType" |
| | | }).then(res => { |
| | | console.log(res) |
| | | this.typeList = [res.data]; |
| | | }) |
| | | }, |
| | | |
| | | getLabelList() { |
| | | getLabelListByParentId({ |
| | | parentId: 1000 |
| | | }).then(res => { |
| | | // this.labelList = [res.data]; |
| | | // this.labelListTwo = res.data |
| | | this.labelList.push(res.data) |
| | | this.labelList.push(res.data[0].children) |
| | | }) |
| | | }, |
| | | |
| | | getHousehold(id) { |
| | | getHouseholdDetail({ |
| | | id |
| | | }).then(res => { |
| | | console.log(res); |
| | | this.address = res.data.currentAddress; |
| | | this.selectedHousehold = res.data; |
| | | this.houseCode = res.data.houseCode |
| | | this.getHouseholdList(); |
| | | }) |
| | | }, |
| | | |
| | | getHouseholdList() { |
| | | if (!this.houseCode) { |
| | | return |
| | | } |
| | | fetchHousehold({ |
| | | labelId: this.info.personType, |
| | | searchKey: this.keyword, |
| | | houseCode: this.houseCode, |
| | | limit: 20 |
| | | }).then(res => { |
| | | this.houseHoldList = res.data; |
| | | for (var i = 0; i < this.houseHoldList.length; i++) { |
| | | if (this.houseHoldList[i].address === null) { |
| | | this.houseHoldList[i].address = '' |
| | | } |
| | | |
| | | if (this.houseHoldList[i].aoiName === null) { |
| | | this.houseHoldList[i].aoiName = '' |
| | | } |
| | | |
| | | if (this.houseHoldList[i].neiName === null) { |
| | | this.houseHoldList[i].neiName = '' |
| | | } |
| | | |
| | | if (this.houseHoldList[i].townStreetName === null) { |
| | | this.houseHoldList[i].townStreetName = '' |
| | | } |
| | | } |
| | | }) |
| | | }, |
| | | |
| | | confirmDate(e) { |
| | | this.showSelectDate = false; |
| | |
| | | this.houseIndex = e.indexs; |
| | | this.info.houseCode = e.value[0]; |
| | | this.isShowPicker = false; |
| | | }, |
| | | |
| | | //选择走访类型 |
| | | confirmType(e) { |
| | | console.log("type==>", e); |
| | | this.typeIndex = e.indexs; |
| | | this.info.type = e.value[0].dictKey; |
| | | this.typeName = e.value[0].dictValue; |
| | | |
| | | if (e.value[0].dictKey == 1) { |
| | | this.info.personType = ""; |
| | | this.keyword = ""; |
| | | this.getHouseholdList(); |
| | | } |
| | | this.isShowTypePicker = false; |
| | | }, |
| | | |
| | | //选择重点人群类型 |
| | | // confirmLabelType(e) { |
| | | // this.labelIndex = e.indexs; |
| | | // this.info.personType = e.value[0].id; |
| | | // this.labelName = e.value[0].name; |
| | | // this.isShowLabelPicker = false; |
| | | // this.getHouseholdList(); |
| | | // }, |
| | | // 回调参数为包含columnIndex、value、values |
| | | confirmLabelType(e) { |
| | | console.log('confirm', e) |
| | | // this.show = false |
| | | this.labelIndex = e.indexs; |
| | | if (e.value[2]) { |
| | | this.info.personType = e.value[2].id; |
| | | this.labelName = e.value[2].name; |
| | | } else { |
| | | this.info.personType = e.value[1].id; |
| | | this.labelName = e.value[1].name; |
| | | } |
| | | this.isShowLabelPicker = false; |
| | | this.getHouseholdList(); |
| | | }, |
| | | |
| | | changeHandler(e) { |
| | | const { |
| | | columnIndex, |
| | | value, |
| | | values, // values为当前变化列的数组内容 |
| | | index, |
| | | // 微信小程序无法将picker实例传出来,只能通过ref操作 |
| | | picker = this.$refs.uPicker |
| | | } = e |
| | | // 当第一列值发生变化时,变化第二列(后一列)对应的选项 |
| | | if (columnIndex === 0) { |
| | | console.log("****************", e) |
| | | // picker为选择器this实例,变化第二列对应的选项 |
| | | picker.setColumnValues(1, value[0].children) |
| | | // picker为选择器this实例,变化第二列对应的选项 |
| | | if (value[0].hasChildren) { |
| | | picker.setColumnValues(2, value[0].children[0].children) |
| | | } |
| | | } |
| | | if (columnIndex === 1) { |
| | | console.log("*******1*********", e) |
| | | // picker为选择器this实例,变化第二列对应的选项 |
| | | if (value[1].hasChildren) { |
| | | picker.setColumnValues(2, value[1].children) |
| | | } |
| | | } |
| | | }, |
| | | |
| | | |
| | | //搜索住户 |
| | | searchHousehold() { |
| | | this.getHouseholdList() |
| | | }, |
| | | |
| | | clearKeyword() { |
| | | this.keyword = ""; |
| | | this.getHouseholdList() |
| | | }, |
| | | |
| | | //选择住户 |
| | | selectHousehold(item) { |
| | | this.selectedHousehold = item; |
| | | this.info.householdId = item.id; |
| | | this.address = |
| | | `${item.townStreetName}${item.neiName}${item.aoiName}${item.address}` |
| | | this.isShowPopup = false; |
| | | }, |
| | | |
| | | checkImages() { |
| | |
| | | submitInfo() { |
| | | this.$refs.form.validate().then(valid => { |
| | | this.checkImages(); |
| | | addWorkLog(this.info).then(res => { |
| | | uni.showToast({ |
| | | icon: 'success', |
| | | title: '提交成功', |
| | | success() { |
| | | setTimeout(() => { |
| | | uni.navigateBack() |
| | | }, 1000) |
| | | } |
| | | }) |
| | | this.info.status = 2; |
| | | if (this.info.type == 2 && !this.info.personType) { |
| | | this.$showTips("请选择重点人群类型") |
| | | return |
| | | } |
| | | if (this.isEdit) { |
| | | this.updateWorkLogRequest() |
| | | } else { |
| | | this.addWorkLogRequest() |
| | | } |
| | | }) |
| | | }, |
| | | |
| | | addWorkLogRequest() { |
| | | addWorkLog(this.info).then(res => { |
| | | uni.showToast({ |
| | | icon: 'success', |
| | | title: '提交成功' |
| | | }) |
| | | setTimeout(() => { |
| | | uni.navigateBack() |
| | | }, 300) |
| | | }) |
| | | }, |
| | | |
| | | updateWorkLogRequest() { |
| | | updateWorkLog(this.info).then(res => { |
| | | uni.showToast({ |
| | | icon: 'success', |
| | | title: '提交成功', |
| | | }) |
| | | setTimeout(() => { |
| | | this.reLoadPrePage() |
| | | }, 300) |
| | | }) |
| | | }, |
| | | |
| | | //刷新上一页数据后返回 |
| | | reLoadPrePage() { |
| | | let pages = getCurrentPages(); |
| | | let prePage = pages[pages.length - 2]; |
| | | prePage.$vm.resetParams(); |
| | | prePage.$vm.getList(); |
| | | uni.navigateBack(); |
| | | }, |
| | | |
| | | |
| | | navToRecord() { |
| | | uni.navigateTo({ |
| | | url: "/subPackage/workLog/list" |
| | | }) |
| | | } |
| | | |
| | | } |
| | | } |
| | | </script> |
| | |
| | | .content { |
| | | margin: 20rpx 30rpx; |
| | | padding: 0 30rpx; |
| | | |
| | | |
| | | } |
| | | |
| | | .top { |
| | | padding: 20rpx !important; |
| | | } |
| | | |
| | | |
| | | |
| | | .row { |
| | | padding: 20rpx 0; |
| | |
| | | font-size: 32rpx; |
| | | } |
| | | } |
| | | |
| | | .popup-content { |
| | | width: 100%; |
| | | padding: 0 30rpx 30rpx; |
| | | box-sizing: border-box; |
| | | |
| | | .popup-title { |
| | | padding: 30rpx 0; |
| | | text-align: center; |
| | | font-weight: bold; |
| | | } |
| | | |
| | | .popup-list { |
| | | height: 650rpx; |
| | | } |
| | | |
| | | .popup-list-item { |
| | | padding: 20rpx 0; |
| | | border-bottom: 1px solid #f1f1f1; |
| | | position: relative; |
| | | } |
| | | |
| | | .check-icon { |
| | | position: absolute; |
| | | right: 20rpx; |
| | | top: 20rpx; |
| | | } |
| | | } |
| | | |
| | | .address-content { |
| | | flex: 1; |
| | | background-color: #F5F5F5; |
| | | font-size: 28rpx; |
| | | padding: 2rpx 10rpx; |
| | | } |
| | | |
| | | .submit-btn { |
| | | width: 690rpx; |
| | | height: 78rpx; |
| | | line-height: 78rpx; |
| | | background: linear-gradient(163deg, #01BDFC 0%, #017BFC 100%); |
| | | border-radius: 8rpx 8rpx 8rpx 8rpx; |
| | | font-size: 32rpx; |
| | | color: #fff; |
| | | margin-top: 50rpx; |
| | | } |
| | | |
| | | .list-btn { |
| | | width: 690rpx; |
| | | height: 78rpx; |
| | | line-height: 78rpx; |
| | | background: linear-gradient(163deg, #c7d7dc 0%, #c3cdd8 100%); |
| | | border-radius: 8rpx 8rpx 8rpx 8rpx; |
| | | font-size: 32rpx; |
| | | color: #fff; |
| | | margin-top: 50rpx; |
| | | } |
| | | </style> |