From adeb8b768926ed50a3fb0857f366d6a0308d2cc0 Mon Sep 17 00:00:00 2001
From: gaoluyang <2820782392@qq.com>
Date: 星期五, 29 八月 2025 17:45:57 +0800
Subject: [PATCH] 修改组件
---
src/pages/cooperativeOffice/clientVisit/detail.vue | 324 ++++++++++++++++++++++++++++++++++++++++++++++++++++++
1 files changed, 324 insertions(+), 0 deletions(-)
diff --git a/src/pages/cooperativeOffice/clientVisit/detail.vue b/src/pages/cooperativeOffice/clientVisit/detail.vue
new file mode 100644
index 0000000..d429a6b
--- /dev/null
+++ b/src/pages/cooperativeOffice/clientVisit/detail.vue
@@ -0,0 +1,324 @@
+<template>
+ <view class="client-visit-detail">
+ <PageHeader title="瀹㈡埛鎷滆璇︽儏" @back="goBack" />
+
+ <u-form @submit="handleSignIn" ref="formRef" label-width="110" input-align="right" error-message-align="right">
+ <!-- 瀹㈡埛淇℃伅 -->
+ <u-cell-group title="瀹㈡埛淇℃伅">
+ <u-form-item label="瀹㈡埛鍚嶇О" prop="customerName" required border-bottom>
+ <u-input
+ v-model="form.customerName"
+ placeholder="璇疯緭鍏ュ鎴峰悕绉�"
+ readonly
+ />
+ </u-form-item>
+ <u-form-item label="鑱旂郴浜�" prop="contactPerson" border-bottom>
+ <u-input
+ v-model="form.contactPerson"
+ placeholder="璇疯緭鍏ヨ仈绯讳汉"
+ readonly
+ />
+ </u-form-item>
+ <u-form-item label="鑱旂郴鐢佃瘽" prop="contactPhone" border-bottom>
+ <u-input
+ v-model="form.contactPhone"
+ placeholder="璇疯緭鍏ヨ仈绯荤數璇�"
+ readonly
+ />
+ </u-form-item>
+ </u-cell-group>
+
+ <!-- 鎷滆淇℃伅 -->
+ <u-cell-group title="鎷滆淇℃伅">
+ <u-form-item label="鎷滆鐩殑" prop="visitPurpose" required border-bottom>
+ <u-input
+ v-model="form.visitPurpose"
+ placeholder="璇疯緭鍏ユ嫓璁跨洰鐨�"
+ />
+ </u-form-item>
+ <u-form-item label="鎷滆鏃堕棿" prop="visitTime" required border-bottom>
+ <u-input
+ v-model="form.visitTime"
+ placeholder="璇烽�夋嫨鎷滆鏃堕棿"
+ readonly
+ @click="showTimePicker"
+ />
+ </u-form-item>
+ <u-form-item label="鎷滆鍦扮偣" prop="visitLocation" required border-bottom>
+ <u-input
+ v-model="form.visitLocation"
+ placeholder="璇疯緭鍏ユ嫓璁垮湴鐐�"
+ >
+ <template #suffix>
+ <u-icon name="map" @click.stop="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>
+ </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>
+ </view>
+ </u-form>
+
+ <!-- 鏃堕棿閫夋嫨鍣� -->
+ <u-popup v-model="showTime" mode="bottom">
+ <u-datetime-picker
+ v-model="currentTime"
+ title="閫夋嫨鏃堕棿"
+ @confirm="onTimeConfirm"
+ @cancel="showTime = false"
+ />
+ </u-popup>
+ </view>
+</template>
+
+<script setup>
+// 鏇挎崲 toast 鏂规硶
+const showToast = (message) => {
+ uni.showToast({
+ title: message,
+ icon: 'none'
+ })
+}
+
+import { ref, onMounted } from 'vue'
+import { onShow } from '@dcloudio/uni-app'
+import PageHeader from '@/components/PageHeader.vue'
+import { clientVisitSignIn } from '@/api/cooperativeOffice/clientVisit'
+import useUserStore from "@/store/modules/user"
+import dayjs from "dayjs"
+
+const userStore = useUserStore()
+
+// 琛ㄥ崟鏁版嵁
+const form = ref({
+ customerName: '',
+ contact: '',
+ contactPhone: '',
+ visitingPeople: '',
+ purposeVisit: '',
+ purposeDate: '',
+ visitAddress: '',
+ latitude: '',
+ longitude: '',
+ locationAddress: '',
+ remark: ''
+})
+
+// 椤甸潰鐘舵��
+const loading = ref(false)
+const formRef = ref(null)
+
+// 鏃堕棿鐩稿叧
+const currentTime = ref(new Date())
+const showTime = ref(false)
+
+// 杩斿洖涓婁竴椤�
+const goBack = () => {
+ uni.navigateBack()
+}
+
+// 鏄剧ず鏃堕棿閫夋嫨鍣�
+const showTimePicker = () => {
+ showTime.value = true
+}
+
+// 纭鏃堕棿閫夋嫨
+const onTimeConfirm = ({ selectedValues }) => {
+ form.value.purposeDate = selectedValues.join('-')
+ currentTime.value = selectedValues.join('-')
+ 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('浣嶇疆鑾峰彇鎴愬姛')
+ } else {
+ // 濡傛灉娌℃湁璇︾粏鍦板潃锛屽皾璇曠粍鍚堝湴鍧�淇℃伅
+ const addressComponent = regeocode.addressComponent
+ const combinedAddress = `${addressComponent.province}${addressComponent.city}${addressComponent.district}${addressComponent.township}`
+ form.value.visitAddress = combinedAddress
+ 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()
+ showToast('鑾峰彇浣嶇疆澶辫触锛岃妫�鏌ュ畾浣嶆潈闄�')
+ console.error('鑾峰彇浣嶇疆澶辫触:', err)
+
+ // 澶辫触鏃舵樉绀洪敊璇俊鎭�
+ form.value.visitAddress = '浣嶇疆鑾峰彇澶辫触'
+ }
+ })
+}
+
+// 鎻愪氦绛惧埌
+const handleSignIn = async () => {
+ console.log('form.value----', form.value);
+
+ 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)
+
+ const { code } = await clientVisitSignIn(submitData)
+ console.log('code----', code);
+
+ if (code === 200) {
+ showToast('绛惧埌鎴愬姛')
+ setTimeout(() => {
+ uni.navigateBack()
+ }, 500)
+ } else {
+ loading.value = false
+ showToast('绛惧埌澶辫触锛岃閲嶈瘯')
+ }
+ } catch (e) {
+ loading.value = false
+ showToast('绛惧埌澶辫触锛岃妫�鏌ョ綉缁滆繛鎺�')
+ console.error('绛惧埌澶辫触:', e)
+ }
+}
+
+// 鍒濆鍖栭〉闈㈡暟鎹�
+const initPageData = () => {
+ // 璁剧疆榛樿鎷滆鏃堕棿涓哄綋鍓嶆椂闂�
+ form.value.purposeDate = dayjs().format('YYYY-MM-DD HH:mm:ss')
+ currentTime.value = new Date()
+
+ // 璁剧疆鎷滆浜轰负褰撳墠鐧诲綍鐢ㄦ埛鐨勬樀绉�
+ form.value.visitingPeople = userStore.nickName || ''
+}
+
+onMounted(() => {
+ initPageData()
+})
+</script>
+
+<style scoped lang="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;
+}
+
+.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;
+}
+
+.location-icon {
+ color: #1989fa;
+ font-size: 1.2rem;
+}
+</style>
\ No newline at end of file
--
Gitblit v1.9.3