From 7ab410022cbf32fd0eb1fe94456a13c95d4a3f89 Mon Sep 17 00:00:00 2001
From: zhangwencui <1064582902@qq.com>
Date: 星期四, 22 一月 2026 16:53:04 +0800
Subject: [PATCH] 客户拜访修改删除接口、规章制度页面
---
src/pages/cooperativeOffice/clientVisit/detail.vue | 572 ++++++++++++++++++++++++++++++--------------------------
1 files changed, 304 insertions(+), 268 deletions(-)
diff --git a/src/pages/cooperativeOffice/clientVisit/detail.vue b/src/pages/cooperativeOffice/clientVisit/detail.vue
index 9c0460e..9c3ce0d 100644
--- a/src/pages/cooperativeOffice/clientVisit/detail.vue
+++ b/src/pages/cooperativeOffice/clientVisit/detail.vue
@@ -1,324 +1,360 @@
<template>
<view class="client-visit-detail">
- <PageHeader title="瀹㈡埛鎷滆璇︽儏" @back="goBack" />
-
- <u-form @submit="handleSignIn" ref="formRef" label-width="90">
+ <PageHeader title="瀹㈡埛鎷滆璇︽儏"
+ @back="goBack" />
+ <u-form @submit="handleSignIn"
+ ref="formRef"
+ label-width="90">
<!-- 瀹㈡埛淇℃伅 -->
<u-cell-group title="瀹㈡埛淇℃伅">
- <u-form-item label="瀹㈡埛鍚嶇О" prop="customerName" required border-bottom>
- <u-input
- v-model="form.customerName"
- placeholder="璇疯緭鍏ュ鎴峰悕绉�"
- />
+ <u-form-item label="瀹㈡埛鍚嶇О"
+ prop="customerName"
+ required
+ border-bottom>
+ <u-input v-model="form.customerName"
+ placeholder="璇疯緭鍏ュ鎴峰悕绉�" />
</u-form-item>
- <u-form-item label="鑱旂郴浜�" prop="contact" border-bottom>
- <u-input
- v-model="form.contact"
- placeholder="璇疯緭鍏ヨ仈绯讳汉"
- />
+ <u-form-item label="鑱旂郴浜�"
+ prop="contact"
+ border-bottom>
+ <u-input v-model="form.contact"
+ placeholder="璇疯緭鍏ヨ仈绯讳汉" />
</u-form-item>
- <u-form-item label="鑱旂郴鐢佃瘽" prop="contactPhone" border-bottom>
- <u-input
- v-model="form.contactPhone"
- placeholder="璇疯緭鍏ヨ仈绯荤數璇�"
- />
+ <u-form-item label="鑱旂郴鐢佃瘽"
+ prop="contactPhone"
+ border-bottom>
+ <u-input v-model="form.contactPhone"
+ placeholder="璇疯緭鍏ヨ仈绯荤數璇�" />
</u-form-item>
</u-cell-group>
-
<!-- 鎷滆淇℃伅 -->
<u-cell-group title="鎷滆淇℃伅">
- <u-form-item label="鎷滆鐩殑" prop="purposeVisit" required border-bottom>
- <u-input
- v-model="form.purposeVisit"
- placeholder="璇疯緭鍏ユ嫓璁跨洰鐨�"
- />
+ <u-form-item label="鎷滆鐩殑"
+ prop="purposeVisit"
+ required
+ border-bottom>
+ <u-input v-model="form.purposeVisit"
+ placeholder="璇疯緭鍏ユ嫓璁跨洰鐨�" />
</u-form-item>
- <u-form-item label="鎷滆鏃堕棿" prop="purposeDate" required border-bottom>
- <u-input
- v-model="form.purposeDate"
- placeholder="璇烽�夋嫨鎷滆鏃堕棿"
- @click="showTimePicker"
- />
+ <u-form-item label="鎷滆鏃堕棿"
+ prop="purposeDate"
+ required
+ border-bottom>
+ <u-input v-model="form.purposeDate"
+ placeholder="璇烽�夋嫨鎷滆鏃堕棿"
+ @click="showTimePicker" />
<template #right>
- <up-icon
- name="arrow-right"
- @click="showTimePicker"
- ></up-icon>
- </template>
+ <up-icon name="arrow-right"
+ @click="showTimePicker"></up-icon>
+ </template>
</u-form-item>
- <u-form-item label="鎷滆鍦扮偣" prop="visitAddress" required border-bottom>
- <u-input
- v-model="form.visitAddress"
- placeholder="璇疯緭鍏ユ嫓璁垮湴鐐�"
- >
+ <u-form-item label="鎷滆鍦扮偣"
+ prop="visitAddress"
+ required
+ border-bottom>
+ <u-input v-model="form.visitAddress"
+ placeholder="璇疯緭鍏ユ嫓璁垮湴鐐�">
<template #suffix>
- <u-icon name="map" @click="getCurrentLocation" class="location-icon" />
+ <u-icon name="map"
+ @click="getCurrentLocation"
+ class="location-icon" />
</template>
</u-input>
</u-form-item>
</u-cell-group>
-
<!-- 澶囨敞淇℃伅 -->
<u-cell-group title="澶囨敞淇℃伅">
- <u-form-item label="澶囨敞" prop="remark" border-bottom>
- <u-textarea
- v-model="form.remark"
- placeholder="璇疯緭鍏ュ娉ㄤ俊鎭�"
- :maxlength="200"
- count
- :autoHeight="true"
- />
+ <u-form-item label="澶囨敞"
+ prop="remark"
+ border-bottom>
+ <u-textarea v-model="form.remark"
+ placeholder="璇疯緭鍏ュ娉ㄤ俊鎭�"
+ :maxlength="200"
+ count
+ :autoHeight="true" />
</u-form-item>
</u-cell-group>
-
<!-- 鎻愪氦鎸夐挳 -->
<view class="footer-btns">
- <u-button class="cancel-btn" @click="goBack">鍙栨秷</u-button>
- <u-button class="sign-btn" type="primary" @click="handleSignIn" :loading="loading">绛惧埌</u-button>
+ <u-button class="cancel-btn"
+ @click="goBack">鍙栨秷</u-button>
+ <u-button class="sign-btn"
+ type="primary"
+ @click="handleSignIn"
+ :loading="loading">绛惧埌</u-button>
</view>
</u-form>
-
<!-- 鏃堕棿閫夋嫨鍣� -->
- <up-datetime-picker
- :show="showTime"
- v-model="currentTime"
- @confirm="onTimeConfirm"
- @cancel="showTime = false"
- mode="datetime"
- />
+ <up-datetime-picker :show="showTime"
+ v-model="currentTime"
+ @confirm="onTimeConfirm"
+ @cancel="showTime = false"
+ mode="datetime" />
</view>
</template>
<script setup>
-// 鏇挎崲 toast 鏂规硶
-defineOptions({name: 'client-visit-detail'})
-const showToast = (message) => {
- uni.showToast({
- title: message,
- icon: 'none'
- })
-}
+ // 鏇挎崲 toast 鏂规硶
+ defineOptions({ name: "client-visit-detail" });
+ const showToast = message => {
+ uni.showToast({
+ title: message,
+ icon: "none",
+ });
+ };
-import { ref, onMounted } from 'vue'
-import PageHeader from '@/components/PageHeader.vue'
-import { clientVisitSignIn } from '@/api/cooperativeOffice/clientVisit'
-import useUserStore from "@/store/modules/user"
-import dayjs from "dayjs"
+ import { ref, onMounted } from "vue";
+ import PageHeader from "@/components/PageHeader.vue";
+ import {
+ clientVisitSignIn,
+ clientVisitUpdate,
+ } from "@/api/cooperativeOffice/clientVisit";
+ import useUserStore from "@/store/modules/user";
+ import dayjs from "dayjs";
+ import { onLoad } from "@dcloudio/uni-app";
-const userStore = useUserStore()
+ const userStore = useUserStore();
-// 琛ㄥ崟鏁版嵁
-const form = ref({
- customerName: '',
- contact: '',
- contactPhone: '',
- visitingPeople: '',
- purposeVisit: '',
- purposeDate: '',
- visitAddress: '',
- latitude: '',
- longitude: '',
- locationAddress: '',
- remark: ''
-})
+ // 琛ㄥ崟鏁版嵁
+ const form = ref({
+ customerName: "",
+ contact: "",
+ contactPhone: "",
+ visitingPeople: "",
+ purposeVisit: "",
+ purposeDate: "",
+ visitAddress: "",
+ latitude: "",
+ longitude: "",
+ locationAddress: "",
+ remark: "",
+ });
-// 椤甸潰鐘舵��
-const loading = ref(false)
-const formRef = ref(null)
+ // 椤甸潰鐘舵��
+ const loading = ref(false);
+ const formRef = ref(null);
-// 鏃堕棿鐩稿叧
-const currentTime = ref(Date.now())
-const showTime = ref(false)
+ // 鏃堕棿鐩稿叧
+ const currentTime = ref(Date.now());
+ const showTime = ref(false);
-// 杩斿洖涓婁竴椤�
-const goBack = () => {
- // 杩斿洖鏃舵竻闄ゆ湰鍦板瓨鍌ㄧ殑ID
- uni.removeStorageSync('clientVisit')
- uni.navigateBack()
-}
+ // 杩斿洖涓婁竴椤�
+ const goBack = () => {
+ // 杩斿洖鏃舵竻闄ゆ湰鍦板瓨鍌ㄧ殑ID
+ uni.removeStorageSync("clientVisit");
+ uni.navigateBack();
+ };
-// 鏄剧ず鏃堕棿閫夋嫨鍣�
-const showTimePicker = () => {
- showTime.value = true
-}
+ // 鏄剧ず鏃堕棿閫夋嫨鍣�
+ const showTimePicker = () => {
+ showTime.value = true;
+ };
-// 纭鏃堕棿閫夋嫨
-const onTimeConfirm = (e) => {
- console.log(e)
- form.value.purposeDate = dayjs(e.value).format('YYYY-MM-DD HH:mm:ss')
- currentTime.value = e.value
- showTime.value = false;
-}
+ // 纭鏃堕棿閫夋嫨
+ const onTimeConfirm = e => {
+ console.log(e);
+ form.value.purposeDate = dayjs(e.value).format("YYYY-MM-DD HH:mm:ss");
+ currentTime.value = e.value;
+ showTime.value = false;
+ };
-// 鑾峰彇褰撳墠浣嶇疆
-const getCurrentLocation = () => {
- uni.showLoading({ title: '鑾峰彇浣嶇疆涓�...' })
-
- uni.getLocation({
- type: 'gcj02',
- success: (res) => {
- form.value.latitude = res.latitude
- form.value.longitude = res.longitude
-
- // 浣跨敤閫嗗湴鐞嗙紪鐮佽幏鍙栧湴鍧�淇℃伅
- uni.request({
- url: `https://restapi.amap.com/v3/geocode/regeo?key=c120a5dc69a9f61839f7763e6057005f&location=${res.longitude},${res.latitude}&radius=1000&extensions=all`,
- success: (geoRes) => {
- uni.hideLoading()
- if (geoRes.data.status === '1' && geoRes.data.regeocode) {
- const regeocode = geoRes.data.regeocode
- const address = regeocode.formatted_address
-
- // 浼樺厛鏄剧ず璇︾粏鍦板潃
- if (address) {
- form.value.visitAddress = address
- showToast('浣嶇疆鑾峰彇鎴愬姛')
+ // 鑾峰彇褰撳墠浣嶇疆
+ const getCurrentLocation = () => {
+ uni.showLoading({ title: "鑾峰彇浣嶇疆涓�..." });
+
+ uni.getLocation({
+ type: "gcj02",
+ success: res => {
+ form.value.latitude = res.latitude;
+ form.value.longitude = res.longitude;
+
+ // 浣跨敤閫嗗湴鐞嗙紪鐮佽幏鍙栧湴鍧�淇℃伅
+ uni.request({
+ url: `https://restapi.amap.com/v3/geocode/regeo?key=c120a5dc69a9f61839f7763e6057005f&location=${res.longitude},${res.latitude}&radius=1000&extensions=all`,
+ success: geoRes => {
+ uni.hideLoading();
+ if (geoRes.data.status === "1" && geoRes.data.regeocode) {
+ const regeocode = geoRes.data.regeocode;
+ const address = regeocode.formatted_address;
+
+ // 浼樺厛鏄剧ず璇︾粏鍦板潃
+ if (address) {
+ form.value.visitAddress = address;
+ showToast("浣嶇疆鑾峰彇鎴愬姛");
+ } else {
+ // 濡傛灉娌℃湁璇︾粏鍦板潃锛屽皾璇曠粍鍚堝湴鍧�淇℃伅
+ const addressComponent = regeocode.addressComponent;
+ const combinedAddress = `${addressComponent.province}${addressComponent.city}${addressComponent.district}${addressComponent.township}`;
+ form.value.visitAddress = combinedAddress;
+ showToast("浣嶇疆鑾峰彇鎴愬姛");
+ }
} else {
- // 濡傛灉娌℃湁璇︾粏鍦板潃锛屽皾璇曠粍鍚堝湴鍧�淇℃伅
- const addressComponent = regeocode.addressComponent
- const combinedAddress = `${addressComponent.province}${addressComponent.city}${addressComponent.district}${addressComponent.township}`
- form.value.visitAddress = combinedAddress
- showToast('浣嶇疆鑾峰彇鎴愬姛')
+ // API璋冪敤鎴愬姛浣嗘病鏈夎繑鍥炲湴鍧�淇℃伅
+ const fallbackAddress = `浣嶇疆: ${res.latitude.toFixed(
+ 4
+ )}, ${res.longitude.toFixed(4)}`;
+ form.value.visitAddress = fallbackAddress;
+ showToast("鑾峰彇鍒颁綅缃紝浣嗗湴鍧�瑙ｆ瀽澶辫触");
}
- } else {
- // API璋冪敤鎴愬姛浣嗘病鏈夎繑鍥炲湴鍧�淇℃伅
- const fallbackAddress = `浣嶇疆: ${res.latitude.toFixed(4)}, ${res.longitude.toFixed(4)}`
- form.value.visitAddress = fallbackAddress
- showToast('鑾峰彇鍒颁綅缃紝浣嗗湴鍧�瑙ｆ瀽澶辫触')
- }
- },
- fail: (err) => {
- uni.hideLoading()
- console.error('閫嗗湴鐞嗙紪鐮佸け璐�:', err)
-
- // 閫嗗湴鐞嗙紪鐮佸け璐ユ椂锛屾樉绀虹畝鍖栫殑浣嶇疆淇℃伅
- const fallbackAddress = `浣嶇疆: ${res.latitude.toFixed(4)}, ${res.longitude.toFixed(4)}`
- form.value.visitAddress = fallbackAddress
- showToast('浣嶇疆鑾峰彇鎴愬姛锛屼絾鍦板潃瑙ｆ瀽澶辫触')
+ },
+ fail: err => {
+ uni.hideLoading();
+ console.error("閫嗗湴鐞嗙紪鐮佸け璐�:", err);
+
+ // 閫嗗湴鐞嗙紪鐮佸け璐ユ椂锛屾樉绀虹畝鍖栫殑浣嶇疆淇℃伅
+ const fallbackAddress = `浣嶇疆: ${res.latitude.toFixed(
+ 4
+ )}, ${res.longitude.toFixed(4)}`;
+ form.value.visitAddress = fallbackAddress;
+ showToast("浣嶇疆鑾峰彇鎴愬姛锛屼絾鍦板潃瑙ｆ瀽澶辫触");
+ },
+ });
+ },
+ fail: err => {
+ uni.hideLoading();
+ showToast("鑾峰彇浣嶇疆澶辫触锛岃妫�鏌ュ畾浣嶆潈闄�");
+ console.error("鑾峰彇浣嶇疆澶辫触:", err);
+
+ // 澶辫触鏃舵樉绀洪敊璇俊鎭�
+ form.value.visitAddress = "浣嶇疆鑾峰彇澶辫触";
+ },
+ });
+ };
+
+ // 鎻愪氦绛惧埌
+ const handleSignIn = async () => {
+ if (!form.value.customerName) {
+ showToast("璇疯緭鍏ュ鎴峰悕绉�");
+ return;
+ }
+
+ if (!form.value.purposeVisit) {
+ showToast("璇疯緭鍏ユ嫓璁跨洰鐨�");
+ return;
+ }
+
+ if (!form.value.purposeDate) {
+ showToast("璇烽�夋嫨鎷滆鏃堕棿");
+ return;
+ }
+ if (!form.value.visitAddress) {
+ showToast("璇疯幏鍙栧綋鍓嶄綅缃�");
+ return;
+ }
+
+ try {
+ loading.value = true;
+
+ // 浣跨敤瀹夊叏娴呮嫹璐濓紝閬垮厤瀵硅薄灞曞紑鍦ㄦ煇浜涜繍琛屾椂鎶涢敊
+ const source =
+ form.value && typeof form.value === "object" ? form.value : {};
+ const submitData = {};
+ Object.keys(source).forEach(k => {
+ submitData[k] = source[k];
+ });
+ console.log("submitData", submitData);
+ if (isEdit.value) {
+ const { code } = await clientVisitUpdate(submitData);
+ if (code === 200) {
+ showToast("淇敼鎴愬姛");
+ setTimeout(() => {
+ goBack();
+ }, 500);
+ } else {
+ loading.value = false;
+ showToast("绛惧埌澶辫触锛岃閲嶈瘯");
}
- })
- },
- fail: (err) => {
- uni.hideLoading()
- showToast('鑾峰彇浣嶇疆澶辫触锛岃妫�鏌ュ畾浣嶆潈闄�')
- console.error('鑾峰彇浣嶇疆澶辫触:', err)
-
- // 澶辫触鏃舵樉绀洪敊璇俊鎭�
- form.value.visitAddress = '浣嶇疆鑾峰彇澶辫触'
+ } else {
+ const { code } = await clientVisitSignUp(submitData);
+ if (code === 200) {
+ showToast("绛惧埌鎴愬姛");
+ setTimeout(() => {
+ goBack();
+ }, 500);
+ } else {
+ loading.value = false;
+ showToast("绛惧埌澶辫触锛岃閲嶈瘯");
+ }
+ }
+ } catch (e) {
+ loading.value = false;
+ console.error("绛惧埌澶辫触:", e);
}
- })
-}
-
-// 鎻愪氦绛惧埌
-const handleSignIn = async () => {
- if (!form.value.customerName) {
- showToast('璇疯緭鍏ュ鎴峰悕绉�')
- return
- }
-
- if (!form.value.purposeVisit) {
- showToast('璇疯緭鍏ユ嫓璁跨洰鐨�')
- return
- }
-
- if (!form.value.purposeDate) {
- showToast('璇烽�夋嫨鎷滆鏃堕棿')
- return
- }
- if (!form.value.visitAddress) {
- showToast('璇疯幏鍙栧綋鍓嶄綅缃�')
- return
- }
-
- try {
- loading.value = true
-
- // 浣跨敤瀹夊叏娴呮嫹璐濓紝閬垮厤瀵硅薄灞曞紑鍦ㄦ煇浜涜繍琛屾椂鎶涢敊
- const source = (form.value && typeof form.value === 'object') ? form.value : {}
- const submitData = {}
- Object.keys(source).forEach((k) => {
- submitData[k] = source[k]
- })
- console.log('submitData', submitData)
-
- const { code } = await clientVisitSignIn(submitData)
-
- if (code === 200) {
- showToast('绛惧埌鎴愬姛')
- setTimeout(() => {
- goBack()
- }, 500)
+ };
+ const isEdit = ref(false);
+ onLoad(() => {
+ // 缂栬緫鎷滆鏃讹紝浠庢湰鍦板瓨鍌ㄨ幏鍙栨嫓璁胯褰�
+ const visit = uni.getStorageSync("clientVisit");
+ if (visit) {
+ form.value = visit;
+ isEdit.value = true;
+ console.log("form.value", form.value);
} else {
- loading.value = false
- showToast('绛惧埌澶辫触锛岃閲嶈瘯')
+ isEdit.value = false;
}
- } catch (e) {
- loading.value = false
- console.error('绛惧埌澶辫触:', e)
- }
-}
+ });
-// 鍒濆鍖栭〉闈㈡暟鎹�
-const initPageData = () => {
- // 璁剧疆榛樿鎷滆鏃堕棿涓哄綋鍓嶆椂闂�
- form.value.purposeDate = dayjs().format('YYYY-MM-DD HH:mm:ss')
- currentTime.value = Date.now()
-
- // 璁剧疆鎷滆浜轰负褰撳墠鐧诲綍鐢ㄦ埛鐨勬樀绉�
- form.value.visitingPeople = userStore.nickName || ''
-}
+ // 鍒濆鍖栭〉闈㈡暟鎹�
+ const initPageData = () => {
+ // 璁剧疆榛樿鎷滆鏃堕棿涓哄綋鍓嶆椂闂�
+ form.value.purposeDate = dayjs().format("YYYY-MM-DD HH:mm:ss");
+ currentTime.value = Date.now();
-onMounted(() => {
- initPageData()
-})
+ // 璁剧疆鎷滆浜轰负褰撳墠鐧诲綍鐢ㄦ埛鐨勬樀绉�
+ form.value.visitingPeople = userStore.nickName || "";
+ };
+
+ onMounted(() => {
+ initPageData();
+ });
</script>
<style scoped lang="scss">
-@import '@/static/scss/form-common.scss';
-.client-visit {
- min-height: 100vh;
- background: #f8f9fa;
- padding-bottom: 5rem;
-}
+ @import "@/static/scss/form-common.scss";
+ .client-visit {
+ min-height: 100vh;
+ background: #f8f9fa;
+ padding-bottom: 5rem;
+ }
-.footer-btns {
- position: fixed;
- left: 0;
- right: 0;
- bottom: 0;
- background: #fff;
- display: flex;
- justify-content: space-around;
- align-items: center;
- padding: 0.75rem 0;
- box-shadow: 0 -0.125rem 0.5rem rgba(0,0,0,0.05);
- z-index: 1000;
-}
+ .footer-btns {
+ position: fixed;
+ left: 0;
+ right: 0;
+ bottom: 0;
+ background: #fff;
+ display: flex;
+ justify-content: space-around;
+ align-items: center;
+ padding: 0.75rem 0;
+ box-shadow: 0 -0.125rem 0.5rem rgba(0, 0, 0, 0.05);
+ z-index: 1000;
+ }
-.cancel-btn {
- font-weight: 400;
- font-size: 1rem;
- color: #666;
- background: #f5f5f5;
- border: 1px solid #ddd;
- width: 45%;
- height: 2.5rem;
- border-radius: 2.5rem 2.5rem 2.5rem 2.5rem;
-}
+ .cancel-btn {
+ font-weight: 400;
+ font-size: 1rem;
+ color: #666;
+ background: #f5f5f5;
+ border: 1px solid #ddd;
+ width: 45%;
+ height: 2.5rem;
+ border-radius: 2.5rem 2.5rem 2.5rem 2.5rem;
+ }
-.sign-btn {
- font-weight: 500;
- font-size: 1rem;
- color: #fff;
- background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
- border: none;
- width: 45%;
- height: 2.5rem;
- border-radius: 2.5rem 2.5rem 2.5rem 2.5rem;
-}
+ .sign-btn {
+ font-weight: 500;
+ font-size: 1rem;
+ color: #fff;
+ background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
+ border: none;
+ width: 45%;
+ height: 2.5rem;
+ border-radius: 2.5rem 2.5rem 2.5rem 2.5rem;
+ }
-.location-icon {
- color: #1989fa;
- font-size: 1.2rem;
-}
+ .location-icon {
+ color: #1989fa;
+ font-size: 1.2rem;
+ }
</style>
\ No newline at end of file
--
Gitblit v1.9.3