You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
280 lines
7.7 KiB
280 lines
7.7 KiB
<template>
|
|
<view>
|
|
<cpn-navbar title="回访" :is-back="true"></cpn-navbar>
|
|
|
|
<view class="container">
|
|
<u-form :model="form" ref="uForm" :label-width="200" :error-type="['message', 'border-bottom']">
|
|
<u-form-item label="回访方式" prop="way">
|
|
<u-radio-group v-model="form.way">
|
|
<u-radio v-for="(item, index) in ways" :key="item.value" :name="item.value">
|
|
{{ item.label }}
|
|
</u-radio>
|
|
</u-radio-group>
|
|
</u-form-item>
|
|
<u-form-item label="是否接通" prop="is_coherent">
|
|
<u-switch v-model="form.is_coherent" :active-value="1" :inactive-value="0"></u-switch>
|
|
</u-form-item>
|
|
<u-form-item label="回访时间" required prop="visit_time">
|
|
<u-input :value="form.visit_time" type="select" @click="isShowTime = true"></u-input>
|
|
</u-form-item>
|
|
<u-form-item label="是否回访" prop="is_serve">
|
|
<u-switch v-model="form.is_serve" :active-value="1" :inactive-value="0"></u-switch>
|
|
</u-form-item>
|
|
<u-form-item label="满意度" required prop="satisfy">
|
|
<u-radio-group v-model="form.satisfy">
|
|
<u-radio v-for="(item, index) in satisfies" :key="item.value" :name="item.value">
|
|
{{ item.label }}
|
|
</u-radio>
|
|
</u-radio-group>
|
|
</u-form-item>
|
|
<u-form-item label="服务规范" prop="is_standard">
|
|
<u-radio-group v-model="form.is_standard">
|
|
<u-radio v-for="(item, index) in standards" :key="item.value" :name="item.value">
|
|
{{ item.label }}
|
|
</u-radio>
|
|
</u-radio-group>
|
|
</u-form-item>
|
|
<u-form-item label="回访备注" prop="remark">
|
|
<u-input v-model="form.remark" type="textarea"></u-input>
|
|
</u-form-item>
|
|
<u-form-item label="回访图片">
|
|
<u-upload ref="uUpload" :custom-btn="true" :action="action" :file-list="fileList"
|
|
:source-type="['camera']" @on-choose-fail="test">
|
|
<view slot="addBtn" class="slot-btn" hover-class="slot-btn__hover" hover-stay-time="150">
|
|
<u-icon name="camera" size="60" color="#c0c4cc" label="点击拍摄" label-pos="bottom"></u-icon>
|
|
</view>
|
|
</u-upload>
|
|
</u-form-item>
|
|
<u-form-item label="所在位置">
|
|
<view>
|
|
<u-button type="primary" size="mini" :throttle-time="3000" @click="getLoaction">获取位置</u-button>
|
|
<view style="word-break: break-all;">
|
|
{{ `${(form.lng || form.lat) ? ('(' + form.lng + ',' + form.lat + ')') : ''}${form.address}` }}
|
|
</view>
|
|
</view>
|
|
</u-form-item>
|
|
</u-form>
|
|
<u-button type="primary" @click="submit">提交</u-button>
|
|
</view>
|
|
|
|
<u-picker mode="time"
|
|
v-model="isShowTime"
|
|
:params="{
|
|
year: true,
|
|
month: true,
|
|
day: true,
|
|
hour: true,
|
|
minute: true,
|
|
second: true
|
|
}" @confirm="timeConfirm"></u-picker>
|
|
</view>
|
|
</template>
|
|
|
|
<script>
|
|
import QQMapWX from '@/libs/qqmap-wx-jssdk.js'
|
|
import moment from "@/libs/moment.min";
|
|
import { ROOTPATH } from "@/common/config"
|
|
export default {
|
|
data() {
|
|
return {
|
|
action: `${ROOTPATH}/api/admin/upload-file`,
|
|
fileList: [],
|
|
isShowTime: false,
|
|
type: "add",
|
|
id: "",
|
|
form: {
|
|
schedule_list_id: "",
|
|
way: "",
|
|
is_coherent: 1,
|
|
visit_time: moment().format('YYYY-MM-DD HH:mm:ss'),
|
|
is_serve: 1,
|
|
satisfy: "",
|
|
is_standard: 1,
|
|
remark: "",
|
|
file_ids: [],
|
|
lat: "",
|
|
lng: "",
|
|
address: ""
|
|
},
|
|
rules: {
|
|
visit_time: [
|
|
{
|
|
required: true,
|
|
type: 'string',
|
|
message: '请选择回访时间',
|
|
trigger: ['change','blur']
|
|
}
|
|
],
|
|
satisfy: [
|
|
{
|
|
required: true,
|
|
type: "number",
|
|
message: '请选择满意度',
|
|
trigger: ['change','blur']
|
|
}
|
|
]
|
|
},
|
|
standards: [
|
|
{
|
|
label: "不规范",
|
|
value: 0
|
|
},
|
|
{
|
|
label: "规范",
|
|
value: 1
|
|
},
|
|
],
|
|
satisfies: [
|
|
{
|
|
label: "非常满意",
|
|
value: 1
|
|
},
|
|
{
|
|
label: "满意",
|
|
value: 2
|
|
},
|
|
{
|
|
label: "一般",
|
|
value: 3
|
|
},
|
|
{
|
|
label: "不满意",
|
|
value: 4
|
|
},
|
|
],
|
|
ways: [
|
|
{
|
|
label: "上门",
|
|
value: 1
|
|
},
|
|
{
|
|
label: "电话",
|
|
value: 2
|
|
}
|
|
],
|
|
};
|
|
},
|
|
methods: {
|
|
test (e) {
|
|
console.error(e)
|
|
},
|
|
load() {
|
|
this.qqmapsdk = new QQMapWX({
|
|
key: 'D5EBZ-C3BWP-HZIDG-VO6BE-P2MN5-ESFZO'
|
|
});
|
|
},
|
|
timeConfirm (e) {
|
|
this.form.visit_time = `${e.year}-${e.month}-${e.day} ${e.hour}:${e.minute}:${e.second}`
|
|
},
|
|
getLoaction() {
|
|
return new Promise((resolve, reject) => {
|
|
uni.getLocation({
|
|
type: 'gcj02',
|
|
isHighAccuracy: true
|
|
}).then(res => {
|
|
if (res[1]) {
|
|
this.form.lat = res[1]?.latitude
|
|
this.form.lng = res[1]?.longitude
|
|
|
|
this.qqmapsdk.reverseGeocoder({
|
|
location: {
|
|
latitude: this.form.lat,
|
|
longitude: this.form.lng
|
|
},
|
|
success: (res) => {
|
|
this.form.address = res.result.address + res.result.formatted_addresses.recommend
|
|
console.log(this.form)
|
|
resolve(res)
|
|
},
|
|
fail: (err) => {
|
|
reject(err)
|
|
}
|
|
})
|
|
} else {
|
|
uni.showToast({
|
|
icon: 'none',
|
|
title: '操作频繁,请稍后再试'
|
|
})
|
|
reject(res)
|
|
console.log(res);
|
|
}
|
|
})
|
|
})
|
|
},
|
|
|
|
submit () {
|
|
this.$refs.uForm.validate(valid => {
|
|
if (valid) {
|
|
this.form.file_ids = this.$refs.uUpload.lists.filter(i => i.progress === 100).map(i => i.response?.id)
|
|
if (this.type === 'add') {
|
|
delete this.form.id
|
|
} else {
|
|
this.form.id = this.id
|
|
}
|
|
this.$u.api.adminSaveCallback(this.form).then(res => {
|
|
uni.showToast({
|
|
icon: 'success',
|
|
title: '保存成功',
|
|
})
|
|
setTimeout(() => {
|
|
uni.navigateBack()
|
|
},1500)
|
|
})
|
|
}
|
|
})
|
|
},
|
|
|
|
async getDetail () {
|
|
const res = await this.$u.api.adminCallbackDetail(this.id)
|
|
for (let key in this.form) {
|
|
this.form[key] = res[key]
|
|
}
|
|
console.log(this.form)
|
|
this.fileList = res.files.map(i => ({
|
|
url: i.url,
|
|
response: i
|
|
}))
|
|
}
|
|
},
|
|
onLoad(option) {
|
|
this.form.schedule_list_id = option.schedule_list_id;
|
|
this.id = option.id;
|
|
this.type = option.id ? 'edit' : 'add';
|
|
if (this.type === 'edit') {
|
|
this.getDetail()
|
|
}
|
|
},
|
|
onReady() {
|
|
this.load();
|
|
this.$refs.uForm.setRules(this.rules);
|
|
},
|
|
}
|
|
</script>
|
|
|
|
<style lang="scss">
|
|
.container {
|
|
border-radius: 10rpx;
|
|
background: #FFFFFF;
|
|
box-shadow: 0rpx 4rpx 10rpx 0rpx rgba(219, 218, 218, 0.5);
|
|
margin: 20rpx;
|
|
padding: 20rpx;
|
|
}
|
|
|
|
.slot-btn {
|
|
width: 200rpx;
|
|
height: 200rpx;
|
|
display: flex;
|
|
justify-content: center;
|
|
align-items: center;
|
|
background: rgb(244, 245, 246);
|
|
border: 2rpx #108cff solid;
|
|
border-radius: 10rpx;
|
|
box-sizing: content-box;
|
|
filter: drop-shadow(0 0 4rpx #0fc7ff) drop-shadow(0 0 6rpx #00eaff);
|
|
}
|
|
.slot-btn__hover {
|
|
background-color: rgb(235, 236, 238);
|
|
}
|
|
|
|
</style>
|