【招生小程序】 新增# 线索详情页

src/bundle/pages/clue/detail.vue

@@ -0,0 +1,165 @@
+<template>
+    <view class="bg-[#FAFAFE]">
+        <view class="bg-white px-[32rpx]">
+            <TForm ref="tForm" :model="form" errorType="toast">
+                <TFormItem prop="studentName">
+                    <TInputField
+                        v-model="form.studentName"
+                        label="客户姓名"
+                        placeholder=""
+                        inputAlign="left"
+                        readonly
+                        :required="false"
+                        :labelWidth="120"
+                    />
+                </TFormItem>
+                <TFormItem prop="phone">
+                    <TInputField
+                        v-model="form.phone"
+                        label="电话"
+                        placeholder=""
+                        inputAlign="left"
+                        readonly
+                        :required="false"
+                        :labelWidth="120"
+                    />
+                </TFormItem>
+                <TFormItem prop="basicInformation">
+                    <TTextareaField
+                        v-model="form.basicInformation"
+                        label="基本情况"
+                        placeholder=""
+                        autoHeight
+                        disabled
+                        :required="false"
+                        :labelWidth="120"
+                    />
+                </TFormItem>
+                <TFormItem prop="recruitTeacherName">
+                    <TInputField
+                        v-model="form.recruitTeacherName"
+                        label="电销老师"
+                        placeholder=""
+                        inputAlign="left"
+                        readonly
+                        :required="false"
+                        :labelWidth="120"
+                    />
+                </TFormItem>
+                <TFormItem prop="followUpTime">
+                    <TInputField
+                        v-model="form.followUpTime"
+                        label="跟进时间"
+                        placeholder=""
+                        inputAlign="left"
+                        readonly
+                        :required="false"
+                        :labelWidth="120"
+                    />
+                </TFormItem>
+                <TFormItem prop="recruitTeacherName">
+                    <TInputField
+                        v-model="form.recruitTeacherName"
+                        label="招生老师"
+                        placeholder=""
+                        inputAlign="left"
+                        readonly
+                        :required="false"
+                        :labelWidth="120"
+                    />
+                </TFormItem>
+                <TFormItem prop="state">
+                    <TInputField
+                        v-model="parseStatusText"
+                        label="状态"
+                        placeholder=""
+                        inputAlign="left"
+                        readonly
+                        :required="false"
+                        :labelWidth="120"
+                    />
+                </TFormItem>
+                <TFormItem prop="isConversion">
+                    <TSwitchField
+                        v-model="form.isConversion"
+                        label="是否转化成功"
+                        :labelWidth="120"
+                        disabled
+                        :required="false"
+                    />
+                </TFormItem>
+                <TFormItem prop="remark">
+                    <TTextareaField
+                        v-model="form.remark"
+                        label="备注"
+                        placeholder=""
+                        autoHeight
+                        disabled
+                        :required="false"
+                        :labelWidth="120"
+                    />
+                </TFormItem>
+                <TFormItem prop="accomplishTime">
+                    <TTextareaField
+                        v-model="form.accomplishTime"
+                        label="成交时间"
+                        placeholder=""
+                        autoHeight
+                        disabled
+                        :required="false"
+                        :labelWidth="120"
+                    />
+                </TFormItem>
+            </TForm>
+        </view>
+    </view>
+</template>
+
+<script setup lang="ts">
+import { onLoad } from '@dcloudio/uni-app'
+import { ref, computed } from 'vue'
+import { useClueDetail } from '@/hooks/useCommon'
+import { optionsMap } from '@/config/options'
+
+const { fetchClueDetail, clueDetailInfo } = useClueDetail()
+
+const id = ref('')
+
+const tForm = ref()
+const form = ref({
+    id: '',
+    recruitTeacherName: '',
+    studentName: '',
+    phone: '',
+    basicInformation: '',
+    state: 1,
+    isConversion: 0,
+    remark: '',
+    accomplishTime: '',
+    followUpTime: ''
+})
+const parseStatusText = computed(
+    () => optionsMap.stateOptions.find(item => item.value == form.value.state)?.label
+)
+
+onLoad(async option => {
+    if (option?.id) {
+        id.value = option.id
+        await fetchClueDetail(id.value)
+        setFormData()
+    }
+})
+const setFormData = () => {
+    for (const key in clueDetailInfo.value) {
+        if (
+            Object.prototype.hasOwnProperty.call(form.value, key) &&
+            clueDetailInfo.value[key] != null &&
+            clueDetailInfo.value[key] != undefined
+        ) {
+            form.value[key] = clueDetailInfo.value[key]
+        }
+    }
+}
+</script>
+
+<style scoped lang="scss"></style>

src/components/design-switch-field.vue

@@ -14,6 +14,7 @@
             v-model="innerValue"
             :activeValue="1"
             :inactiveValue="0"
+            :disabled="disabled"
             @change="handleSwitchChange"
         ></u-switch>
     </view>
@@ -45,6 +46,10 @@ const props = defineProps({
     labelWidth: {
         type: Number,
         default: 120
+    },
+    disabled: {
+        type: Boolean,
+        default: false
     }
 })
 const emit = defineEmits(['update:modelValue'])

src/components/design-textarea-field.vue

@@ -21,6 +21,7 @@
             :placeholder="placeholder"
             :border="border"
             :autoHeight="autoHeight"
+            :disabled="disabled"
             placeholderStyle="color: '#7c7e82'"
         ></u-textarea>
         <!-- <u-textarea
@@ -112,7 +113,7 @@ watch(
 
 <style lang="scss" scoped>
 .design-field {
-    @include flex-align;
+    display: flex;
     border-bottom: 1px solid $gray-3;
     padding: 24rpx 32rpx 24rpx 32rpx;
     .field {

src/components/widgets/card/card.vue

@@ -1,5 +1,5 @@
 <template>
-    <view class="flex flex-col bg-white rounded-[16rpx] mb-[20rpx]">
+    <view class="flex flex-col bg-white rounded-[16rpx] mb-[20rpx]" @click.stop="handleCardClick">
         <view
             class="flex justify-between px-[24rpx] py-[12rpx] border-b border-solid border-[#F3F3F3]"
         >
@@ -22,7 +22,12 @@ defineProps({
         default: () => ({})
     }
 })
+const emit = defineEmits(['click'])
+
 const slots = useSlots()
 const isSlotAction = computed(() => slots.action)
+const handleCardClick = () => {
+    emit('click')
+}
 </script>
 <style scoped></style>

src/components/widgets/recruitsale/clue-card.vue

@@ -1,5 +1,5 @@
 <template>
-    <w-card>
+    <w-card @click="handleDetail">
         <template #title>
             <view class="flex justify-between w-full py-[10rpx]">
                 <view class="flex">
@@ -60,7 +60,7 @@
                         <text class="text-error">{{ item.remark }}</text>
                         <view
                             class="flex gap-[4rpx] items-center text-primary text-[28rpx]"
-                            @click="handleUpdateRemark"
+                            @click.stop="handleUpdateRemark"
                         >
                             <TIcon name="icon-edit" color="#0E66FB" />
                             <text>修改</text>
@@ -83,7 +83,7 @@
                         color="#0E66FB"
                         shape="circle"
                         v-if="item.situation == converStatusEnum.UN_RECEIVED"
-                        @click="handleGet"
+                        @click.stop="handleGet"
                     >
                         领取
                     </u-button>
@@ -91,7 +91,7 @@
                         color="#0E66FB"
                         shape="circle"
                         v-if="item.situation == converStatusEnum.CONVERTED_PROCESS"
-                        @click="handleAddProgress"
+                        @click.stop="handleAddProgress"
                     >
                         添加进展
                     </u-button>
@@ -99,7 +99,7 @@
                         color="#0E66FB"
                         shape="circle"
                         v-if="item.situation == converStatusEnum.ADD_RELATION"
-                        @click="handleComplete"
+                        @click.stop="handleComplete"
                     >
                         转化完成
                     </u-button>
@@ -169,5 +169,12 @@ const handleUpdateRemark = () => {
     const { item } = props
     emit('handleUpdateRemark', item)
 }
+// 线索详情
+const handleDetail = () => {
+    const { item } = props
+    uni.navigateTo({
+        url: '/bundle/pages/clue/detail?id=' + item.id
+    })
+}
 </script>
 <style scoped></style>

src/components/widgets/telesale/clue-card.vue

@@ -1,5 +1,5 @@
 <template>
-    <w-card>
+    <w-card @click="handleDetail">
         <template #title>
             <view class="flex justify-between w-full py-[10rpx]">
                 <view class="flex">
@@ -41,7 +41,7 @@
                 class="px-[32rpx] border-t border-solid border-[#F3F3F3] flex justify-end py-[12rpx]"
                 v-if="item.situation == converStatusEnum.EXCEPTION"
             >
-                <u-button color="#0E66FB" shape="circle" @click="handleEditFollow">
+                <u-button color="#0E66FB" shape="circle" @click.stop="handleEditFollow">
                     修改跟进
                 </u-button>
             </view>
@@ -52,7 +52,6 @@
 <script setup lang="ts">
 import { computed, PropType } from 'vue'
 import { converStatusEnum, stateEnum } from '@/enums'
-import { onLoad } from '@dcloudio/uni-app'
 
 export interface IClue {
     studentName: string
@@ -96,5 +95,12 @@ const handleEditFollow = () => {
         url: '/bundle/pages/follow_edit/index?id=' + item.id
     })
 }
+// 线索详情
+const handleDetail = () => {
+    const { item } = props
+    uni.navigateTo({
+        url: '/bundle/pages/clue/detail?id=' + item.id
+    })
+}
 </script>
 <style scoped></style>

src/pages.json

@@ -132,6 +132,12 @@
         {
             "root": "bundle",
             "pages": [
+                {
+                    "path": "pages/clue/detail",
+                    "style": {
+                        "navigationBarTitleText": "线索详情"
+                    }
+                },
                 {
                     "path": "pages/summary-list/index",
                     "style": {

src/styles/public.scss

@@ -293,3 +293,8 @@ page {
         z-index: 999 !important;
     }
 }
+.u-textarea {
+    &--disabled {
+        background: transparent !important;
+    }
+}