修改组件

gaoluyang

2 天以前 025e46e11cb2962fd7692adfa401333758cc779b

 src/pages/cooperativeOffice/clientVisit/detail.vue

@@ -1,123 +1,112 @@
<template>
  <view class="client-visit">
    <!-- 使用通用页面头部组件 -->
    <PageHeader title="客户拜访登记" @back="goBack" />
  <view class="client-visit-detail">
    <PageHeader title="客户拜访详情" @back="goBack" />
    
    <!-- 签到表单 -->
    <van-form @submit="handleSignIn" ref="formRef" label-width="110px" input-align="right" error-message-align="right">
    <u-form @submit="handleSignIn" ref="formRef" label-width="90">
      <!-- 客户信息 -->
      <van-cell-group title="客户信息" inset>
        <van-field
          v-model="form.customerName"
          label="客户名称"
          placeholder="请输入客户名称"
          required
          name="customerName"
          clearable
        />
        <van-field
          v-model="form.contact"
          label="联系人"
          placeholder="请输入联系人"
          name="contact"
          clearable
        />
        <van-field
          v-model="form.contactPhone"
          label="联系电话"
          placeholder="请输入联系电话"
          name="contactPhone"
          clearable
        />
      </van-cell-group>
      
      <u-cell-group title="客户信息">
        <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>
        <u-form-item label="联系电话" prop="contactPhone" border-bottom>
          <u-input
            v-model="form.contactPhone"
            placeholder="请输入联系电话"
          />
        </u-form-item>
      </u-cell-group>

      <!-- 拜访信息 -->
      <van-cell-group title="拜访信息" inset>
        <van-field
          v-model="form.visitingPeople"
          label="拜访人"
          placeholder="拜访人"
          name="visitingPeople"
          readonly
          clearable
        />
        <van-field
          v-model="form.purposeVisit"
          label="拜访目的"
          placeholder="请输入拜访目的"
          name="purposeVisit"
          required
          clearable
        />
        <van-field
          v-model="form.purposeDate"
          label="拜访时间"
          placeholder="请选择拜访时间"
          name="purposeDate"
          required
          readonly
          @click="showTimePicker"
          clearable
        />
        <van-field
          v-model="form.visitAddress"
          label="当前位置"
          placeholder="点击获取当前位置"
          name="visitAddress"
          :readonly="true"
  :disabled="true" 
          type="textarea"
          @click="getCurrentLocation"
          clearable
        >
          <template #right-icon>
            <van-icon name="location-o" @click.stop="getCurrentLocation" class="location-icon" />
          </template>
        </van-field>
      </van-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>
        <u-form-item label="拜访时间" prop="purposeDate" required border-bottom>
          <u-input
            v-model="form.purposeDate"
            placeholder="请选择拜访时间"
            readonly
            @click="showTimePicker"
          />
          <template #right>
               <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="请输入拜访地点"
          >
            <template #suffix>
              <u-icon name="map" @click.stop="getCurrentLocation" class="location-icon" />
            </template>
          </u-input>
        </u-form-item>
      </u-cell-group>

      <!-- 备注信息 -->
      <van-cell-group title="备注信息" inset>
        <van-field
          v-model="form.remark"
          label="备注"
          name="remark"
          type="textarea"
          placeholder="请输入备注信息"
          rows="3"
          autosize
          clearable
        />
      </van-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">
        <van-button class="cancel-btn" @click="goBack">取消</van-button>
        <van-button class="sign-btn" native-type="submit" form-type="submit" :loading="loading">签到</van-button>
        <u-button class="cancel-btn" @click="goBack">取消</u-button>
        <u-button class="sign-btn" type="primary" @click="handleSignIn" :loading="loading">签到</u-button>
      </view>
    </van-form>
    
    </u-form>

    <!-- 时间选择器 -->
    <van-popup v-model:show="showTime" position="bottom">
      <van-date-picker
        v-model="currentTime"
        type="datetime"
        @confirm="onTimeConfirm"
        @cancel="showTime = false"
        title="选择拜访时间"
      />
    </van-popup>
    <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'
  })
}

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 { showToast } from 'vant'
import dayjs from "dayjs"
import { formatDateToYMD } from '@/utils/ruoyi'

const userStore = useUserStore()

@@ -141,7 +130,7 @@
const formRef = ref(null)

// 时间相关
const currentTime = ref(new Date())
const currentTime = ref(Date.now())
const showTime = ref(false)

// 返回上一页
@@ -155,10 +144,11 @@
}

// 确认时间选择
const onTimeConfirm = ({ selectedValues }) => {
  form.value.purposeDate = selectedValues.join('-')
  currentTime.value = selectedValues.join('-')
  showTime.value = false
const onTimeConfirm = (e) => {
  console.log(e)
  form.value.purposeDate = e.value
   currentTime.value = e.value
   showTime.value = false;
}

// 获取当前位置
@@ -222,8 +212,6 @@

// 提交签到
const handleSignIn = async () => {
    console.log('form.value----', form.value);
    
  if (!form.value.customerName) {
    showToast('请输入客户名称')
    return
@@ -278,7 +266,7 @@
const initPageData = () => {
  // 设置默认拜访时间为当前时间
  form.value.purposeDate = dayjs().format('YYYY-MM-DD HH:mm:ss')
  currentTime.value = new Date()
  currentTime.value = Date.now()
  
  // 设置拜访人为当前登录用户的昵称
  form.value.visitingPeople = userStore.nickName || ''
@@ -290,6 +278,7 @@
</script>

<style scoped lang="scss">
@import '@/static/scss/form-common.scss';
.client-visit {
  min-height: 100vh;
  background: #f8f9fa;