From b60b93ec8eaa3919c5a5fbd9f238f67bfe7a3e96 Mon Sep 17 00:00:00 2001
From: liutong <836164388@qq.com>
Date: Mon, 31 Mar 2025 14:30:34 +0800
Subject: [PATCH] =?UTF-8?q?refactor(market):=20=E4=BC=98=E5=8C=96=E7=BA=BF?=
 =?UTF-8?q?=E7=B4=A2=E8=B7=9F=E8=BF=9B=E9=A1=B5=E9=9D=A2=E5=B8=83=E5=B1=80?=
 =?UTF-8?q?=E5=92=8C=E4=BB=A3=E7=A0=81=E7=BB=93=E6=9E=84?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

- 调整了表单各项的样式和间距
- 优化了选择器和日期选择框的使用
- 改进了代码的可读性和可维护性
---
 pages/market/clue/writing_followUp.vue | 630 +++++++++++++------------
 1 file changed, 321 insertions(+), 309 deletions(-)

diff --git a/pages/market/clue/writing_followUp.vue b/pages/market/clue/writing_followUp.vue
index d319299..9ef5c7e 100644
--- a/pages/market/clue/writing_followUp.vue
+++ b/pages/market/clue/writing_followUp.vue
@@ -1,319 +1,331 @@
 <template>
-	<view class="assemble">
-		<view class="form-style">
-			<fui-form ref="form" top="0" :model="formData" :show="false">
-				<view class="input-style">
-					<fui-form-item label="跟进类型" asterisk asteriskPosition="right" labelSize='26' prop="name" background='#434544' labelColor='#fff'
-						:bottomBorder='false'>
-						<view class="input-title" style="margin-right:14rpx;" v-if="result_leixing == ''"
-							@click="selectCon(2)">点击选择</view>
-						<view class="input-title" style="margin-right:14rpx;" v-else @click="selectCon(2)">{{ result_leixing }}
-						</view>
-					</fui-form-item>
-					<fui-form-item label="跟进时间" labelSize='26' asterisk asteriskPosition="right" prop="mobile"
-						background='#434544' labelColor='#fff' :bottomBorder='false'>
-						<view class="input-title" style="margin-right:14rpx;" @click="selectCon(1)"
-							v-if="result_date == ''">点击选择</view>
-						<view class="input-title" style="margin-right:14rpx;" @click="selectCon(1)" v-else>{{ result_date }}
-						</view>
-					</fui-form-item>
-					<fui-form-item label="上传录音" labelSize='26' asterisk asteriskPosition="right" prop="mobile" background='#434544' labelColor='#fff'
-						:bottomBorder='false'>
-						<fui-input :borderBottom="false" :padding="[0]" placeholder="点击填写" v-model="formData.mobile"
-							backgroundColor="#434544" size="26" color="#fff"></fui-input>
-					</fui-form-item>
-				</view>
-				<view>
-					<fui-form-item label="跟进内容" labelSize='26' asterisk asteriskPosition="right" prop="mobile"
-						background='#434544' labelColor='#fff' :bottomBorder='false'>
-					</fui-form-item>
-					<view style="width: 100%;background: #434544;">
-						<view style="margin: auto;width: 92%;padding: 20rpx 0 50rpx;">
-							<fui-textarea :padding="[0]" v-model="formData.mobile"
-							backgroundColor="#434544" size="26" color="#fff" :textareaBorder="true"></fui-textarea>
-						</view>
-					</view>
-				</view>
-					
-				<view class="input-style" style="margin-top: 50rpx;">
-					<fui-form-item label="学员名称" labelSize='26' asterisk asteriskPosition="right" prop="mobile"
-						background='#434544' labelColor='#fff' :bottomBorder='false'>
-						<view class="input-title" style="margin-right:14rpx;" @click="selectCon(3)"
-							v-if="result_student == ''">点击选择</view>
-						<view class="input-title" style="margin-right:14rpx;" @click="selectCon(3)" v-else>{{ result_student }}
-						</view>
-					</fui-form-item>
-					<fui-form-item label="客户状态" labelSize='26' asterisk asteriskPosition="right" prop="mobile"
-						background='#434544' labelColor='#fff' :bottomBorder='false'>
-						<view class="input-title" style="margin-right:14rpx;" @click="selectCon(4)"
-							v-if="result_status == ''">点击选择</view>
-						<view class="input-title" style="margin-right:14rpx;" @click="selectCon(4)" v-else>{{ result_status }}
-						</view>
-					</fui-form-item>
-					<fui-form-item label="签单意向联系人" labelWidth="230" labelSize='26' asterisk asteriskPosition="right" prop="mobile"
-						background='#434544' labelColor='#fff' :bottomBorder='false'>
-						<view class="input-title" style="margin-right:14rpx;" @click="selectCon(5)"
-							v-if="result_intention == ''">点击选择</view>
-						<view class="input-title" style="margin-right:14rpx;" @click="selectCon(5)" v-else>{{ result_intention }}
-						</view>
-					</fui-form-item>
-				</view>
-				
-				<view class="title" style="margin-top: 20rpx;">跟进任务</view>
-				<view class="input-style">
-					<fui-form-item label="创建下次跟进任务" labelWidth="250" labelSize='26' asterisk asteriskPosition="right" prop="mobile"
-							background='#434544' labelColor='#fff' :bottomBorder='false'>
-							<fui-switch @change="switchChange" checked></fui-switch>
-					</fui-form-item>
-					<view v-if="switchChange_type == 1">
-						
-						<fui-form-item label="跟进时间" labelSize='26' asterisk asteriskPosition="right" prop="mobile"
-							background='#434544' labelColor='#fff' :bottomBorder='false'>
-							<view class="input-title" style="margin-right:14rpx;" @click="selectCon(6)"
-								v-if="result_dates == ''">点击选择</view>
-							<view class="input-title" style="margin-right:14rpx;" @click="selectCon(6)" v-else>{{ result_dates }}
-							</view>
-						</fui-form-item>
-						<fui-form-item label="跟进内容" labelSize='26' prop="mobile" background='#434544' labelColor='#fff'
-							:bottomBorder='false'>
-							<fui-input :borderBottom="false" :padding="[0]" placeholder="点击填写" v-model="formData.mobile"
-								backgroundColor="#434544" size="26" color="#fff"></fui-input>
-						</fui-form-item>
-						<fui-form-item label="跟进人员" labelSize='26' asterisk asteriskPosition="right" prop="mobile"
-							background='#434544' labelColor='#fff' :bottomBorder='false'>
-							<fui-input :borderBottom="false" :padding="[0]" placeholder="点击填写" v-model="formData.mobile"
-								backgroundColor="#434544" size="26" color="#fff"></fui-input>
-						</fui-form-item>
-						<fui-form-item label="任务提醒" labelSize='26' prop="mobile" background='#434544' labelColor='#fff'
-							:bottomBorder='false'>
-							<view class="input-title" style="margin-right:14rpx;" @click="selectCon(7)"
-								v-if="result_renwu == ''">点击选择</view>
-							<view class="input-title" style="margin-right:14rpx;" @click="selectCon(7)" v-else>{{ result_renwu }}
-							</view>
-						</fui-form-item>
-						<fui-form-item label="提醒方式" labelSize='26' prop="mobile" background='#434544' labelColor='#fff'
-							:bottomBorder='false'>
-							<view class="input-title" style="margin-right:14rpx;" @click="selectCon(8)"
-								v-if="result_fangshi == ''">点击选择</view>
-							<view class="input-title" style="margin-right:14rpx;" @click="selectCon(8)" v-else>{{ result_fangshi }}
-							</view>
-						</fui-form-item>
-						
-						
-					</view>
-				</view>
-			</fui-form>
-		</view>
-		<view class="fui-btn__box">
-			<fui-button background="#434544" color="#24BA9F" borderColor="#24BA9F" @click="submit">保存</fui-button>
-		</view>
+  <view class="assemble">
+    <view class="form-style">
+      <fui-form ref="form" top="0" :model="formData" :show="false">
+        <view class="input-style">
+          <fui-form-item label="跟进类型" asterisk asteriskPosition="right" labelSize='26' prop="name" background='#434544'
+                         labelColor='#fff'
+                         :bottomBorder='false'>
+            <view class="input-title" style="margin-right:14rpx;" v-if="result_leixing == ''"
+                  @click="selectCon(2)">点击选择
+            </view>
+            <view class="input-title" style="margin-right:14rpx;" v-else @click="selectCon(2)">{{ result_leixing }}
+            </view>
+          </fui-form-item>
+          <fui-form-item label="跟进时间" labelSize='26' asterisk asteriskPosition="right" prop="mobile"
+                         background='#434544' labelColor='#fff' :bottomBorder='false'>
+            <view class="input-title" style="margin-right:14rpx;" @click="selectCon(1)"
+                  v-if="result_date == ''">点击选择
+            </view>
+            <view class="input-title" style="margin-right:14rpx;" @click="selectCon(1)" v-else>{{ result_date }}
+            </view>
+          </fui-form-item>
+          <fui-form-item label="上传录音" labelSize='26' asterisk asteriskPosition="right" prop="mobile"
+                         background='#434544' labelColor='#fff'
+                         :bottomBorder='false'>
+            <fui-input :borderBottom="false" :padding="[0]" placeholder="点击填写" v-model="formData.mobile"
+                       backgroundColor="#434544" size="26" color="#fff"></fui-input>
+          </fui-form-item>
+        </view>
+        <view>
+          <fui-form-item label="跟进内容" labelSize='26' asterisk asteriskPosition="right" prop="mobile"
+                         background='#434544' labelColor='#fff' :bottomBorder='false'>
+          </fui-form-item>
+          <view style="width: 100%;background: #434544;">
+            <view style="margin: auto;width: 92%;padding: 20rpx 0 50rpx;">
+              <fui-textarea :padding="[0]" v-model="formData.mobile"
+                            backgroundColor="#434544" size="26" color="#fff" :textareaBorder="true"></fui-textarea>
+            </view>
+          </view>
+        </view>
 
-		<!-- 年月日-选择时间 -->
-		<fui-date-picker :show="show_date" type="3" @change="change_date" @cancel="cancel_date"></fui-date-picker>
+        <view class="input-style" style="margin-top: 50rpx;">
+          <fui-form-item label="学员名称" labelSize='26' asterisk asteriskPosition="right" prop="mobile"
+                         background='#434544' labelColor='#fff' :bottomBorder='false'>
+            <view class="input-title" style="margin-right:14rpx;" @click="selectCon(3)"
+                  v-if="result_student == ''">点击选择
+            </view>
+            <view class="input-title" style="margin-right:14rpx;" @click="selectCon(3)" v-else>{{ result_student }}
+            </view>
+          </fui-form-item>
+          <fui-form-item label="客户状态" labelSize='26' asterisk asteriskPosition="right" prop="mobile"
+                         background='#434544' labelColor='#fff' :bottomBorder='false'>
+            <view class="input-title" style="margin-right:14rpx;" @click="selectCon(4)"
+                  v-if="result_status == ''">点击选择
+            </view>
+            <view class="input-title" style="margin-right:14rpx;" @click="selectCon(4)" v-else>{{ result_status }}
+            </view>
+          </fui-form-item>
+          <fui-form-item label="签单意向联系人" labelWidth="230" labelSize='26' asterisk asteriskPosition="right" prop="mobile"
+                         background='#434544' labelColor='#fff' :bottomBorder='false'>
+            <view class="input-title" style="margin-right:14rpx;" @click="selectCon(5)"
+                  v-if="result_intention == ''">点击选择
+            </view>
+            <view class="input-title" style="margin-right:14rpx;" @click="selectCon(5)" v-else>{{ result_intention }}
+            </view>
+          </fui-form-item>
+        </view>
 
-		<!-- 选择器 -->
-		<fui-picker :linkage='linkage' :options="options" :layer="1" :show="show" @change="change" @cancel="cancel"></fui-picker>
+        <view class="title" style="margin-top: 20rpx;">跟进任务</view>
+        <view class="input-style">
+          <fui-form-item label="创建下次跟进任务" labelWidth="250" labelSize='26' asterisk asteriskPosition="right"
+                         prop="mobile"
+                         background='#434544' labelColor='#fff' :bottomBorder='false'>
+            <fui-switch @change="switchChange" checked></fui-switch>
+          </fui-form-item>
+          <view v-if="switchChange_type == 1">
 
-	</view>
+            <fui-form-item label="跟进时间" labelSize='26' asterisk asteriskPosition="right" prop="mobile"
+                           background='#434544' labelColor='#fff' :bottomBorder='false'>
+              <view class="input-title" style="margin-right:14rpx;" @click="selectCon(6)"
+                    v-if="result_dates == ''">点击选择
+              </view>
+              <view class="input-title" style="margin-right:14rpx;" @click="selectCon(6)" v-else>{{ result_dates }}
+              </view>
+            </fui-form-item>
+            <fui-form-item label="跟进内容" labelSize='26' prop="mobile" background='#434544' labelColor='#fff'
+                           :bottomBorder='false'>
+              <fui-input :borderBottom="false" :padding="[0]" placeholder="点击填写" v-model="formData.mobile"
+                         backgroundColor="#434544" size="26" color="#fff"></fui-input>
+            </fui-form-item>
+            <fui-form-item label="跟进人员" labelSize='26' asterisk asteriskPosition="right" prop="mobile"
+                           background='#434544' labelColor='#fff' :bottomBorder='false'>
+              <fui-input :borderBottom="false" :padding="[0]" placeholder="点击填写" v-model="formData.mobile"
+                         backgroundColor="#434544" size="26" color="#fff"></fui-input>
+            </fui-form-item>
+            <fui-form-item label="任务提醒" labelSize='26' prop="mobile" background='#434544' labelColor='#fff'
+                           :bottomBorder='false'>
+              <view class="input-title" style="margin-right:14rpx;" @click="selectCon(7)"
+                    v-if="result_renwu == ''">点击选择
+              </view>
+              <view class="input-title" style="margin-right:14rpx;" @click="selectCon(7)" v-else>{{ result_renwu }}
+              </view>
+            </fui-form-item>
+            <fui-form-item label="提醒方式" labelSize='26' prop="mobile" background='#434544' labelColor='#fff'
+                           :bottomBorder='false'>
+              <view class="input-title" style="margin-right:14rpx;" @click="selectCon(8)"
+                    v-if="result_fangshi == ''">点击选择
+              </view>
+              <view class="input-title" style="margin-right:14rpx;" @click="selectCon(8)" v-else>{{ result_fangshi }}
+              </view>
+            </fui-form-item>
+
+
+          </view>
+        </view>
+      </fui-form>
+    </view>
+    <view class="fui-btn__box">
+      <fui-button background="#434544" color="#24BA9F" borderColor="#24BA9F" @click="submit">保存</fui-button>
+    </view>
+
+    <!-- 年月日-选择时间 -->
+    <fui-date-picker :show="show_date" type="3" @change="change_date" @cancel="cancel_date"></fui-date-picker>
+
+    <!-- 选择器 -->
+    <fui-picker :linkage='linkage' :options="options" :layer="1" :show="show" @change="change"
+                @cancel="cancel"></fui-picker>
+
+  </view>
 </template>
 
 <script>
-	const rules = [{
-		name: "mobile",
-		rule: ["required", "isMobile"],
-		msg: ["请输入手机号", "请输入正确的手机号"]
-	}];
-	export default {
-		data() {
-			return {
-				switchChange_type: 1,
-				rules,
-				formData: {},
-				show_date: false,
-				result_date: '',
-				result_leixing: '',
-				result_student: '',
-				result_status: '',
-				result_intention: '',
-				
-				result_dates: '',
-				result_renwu: '',
-				result_fangshi: '',
-				
-				show: false,
-				options: [],
-				linkage: true,
-				options_type : undefined,
-				options_leixing: [{
-					'value': 1,
-					'text': '类型1'
-				}, {
-					'value': 2,
-					'text': '类型2'
-				}, {
-					'value': 3,
-					'text': '类型3'
-				}],
-				options_student: [{
-					'value': 1,
-					'text': '张三'
-				}, {
-					'value': 2,
-					'text': '李四'
-				}, {
-					'value': 3,
-					'text': '王五'
-				}],
-				options_status: [{
-					'value': 1,
-					'text': '状态1'
-				}, {
-					'value': 2,
-					'text': '状态2'
-				}, {
-					'value': 3,
-					'text': '状态3'
-				}],
-				options_intention: [{
-					'value': 1,
-					'text': '张三1'
-				}, {
-					'value': 2,
-					'text': '李四2'
-				}, {
-					'value': 3,
-					'text': '王五3'
-				}],
-				options_kehu: [{
-					'value': 1,
-					'text': '张三'
-				}, {
-					'value': 2,
-					'text': '李四'
-				}, {
-					'value': 3,
-					'text': '王五'
-				}],
-				options_renwu: [{
-					'value': 1,
-					'text': '是'
-				}, {
-					'value': 2,
-					'text': '否'
-				}],
-				options_fangshi: [{
-					'value': 1,
-					'text': '短信'
-				}, {
-					'value': 2,
-					'text': '微信'
-				}]
-			}
-		},
-		methods: {
-			submit() {
-				console.log(this.formData)
-				this.$refs.form.validator(null, null, true).then(res => {
-					console.log(res)
-					if (res.isPassed) {
-						console.log('校验通过！')
-					} else {
-						console.log('向上滑动页面查看错误提示！')
-					}
-				}).catch(err => {
-					console.log(err)
-				})
-			},
-			//选择弹窗
-			selectCon(type) {
-				if (type == 1) {
-					//选择跟进时间
-					this.options_date_type = 1
-					this.show_date = true
-				} else if (type == 2) {
-					this.options_type = 2
-					this.options = this.options_leixing
-					this.show = true
-					this.linkage = true
-				} else if (type == 3) {
-					this.options_type = 3
-					this.options = this.options_student
-					this.show = true
-					this.linkage = true
-				} else if (type == 4) {
-					this.options_type = 4
-					this.options = this.options_status
-					this.show = true
-					this.linkage = true
-				} else if (type == 5) {
-					this.options_type = 5
-					this.options = this.options_intention
-					this.show = true
-					this.linkage = true
-				}else if (type == 6) {
-					//选择跟进时间
-					this.options_date_type = 6
-					this.show_date = true
-				} else if (type == 7) {
-					//选择任务提醒
-					this.options_type = 7
-					this.options = this.options_renwu
-					this.show = true
-					this.linkage = true
-				} else if (type == 8) {
-					//选择提醒方式
-					this.options_type = 8
-					this.options = this.options_fangshi
-					this.show = true
-					this.linkage = true
-				}
-			},
-			//选择跟进时间
-			change_date(e) {
-				if(this.options_date_type == 1){
-					this.show_date = false
-					this.result_date = e.result ?? ''
-				}else if(this.options_date_type == 6){
-					this.show_date = false
-					this.result_dates = e.result ?? ''
-				}
-			},
-			//关闭选择跟进时间
-			cancel_date() {
-				this.show_date = false
-			},
-			//选择框
-			change(e) {
-				this.show = false
-				console.log(e)
-				if(this.options_type == 2){
-					this.result_leixing = e.result
-				} else if (this.options_type == 3) {
-					this.result_student = e.result
-				} else if (this.options_type == 4) {
-					this.result_status = e.result
-				} else if (this.options_type == 5) {
-					this.result_intention = e.result
-				} else if(this.options_type == 7){
-					this.result_renwu = e.result
-				} else if(this.options_type == 8){
-					this.result_fangshi = e.result
-				}
-			},
-			//关闭选择框
-			cancel() {
-				this.show = false
-			},
-			//开关选择
-			switchChange(e){
-				if(e.detail.value){
-					this.switchChange_type = 1
-				}else{
-					this.switchChange_type = 2
-				}
-			}
-		}
-	}
+const rules = [{
+  name: "mobile",
+  rule: ["required", "isMobile"],
+  msg: ["请输入手机号", "请输入正确的手机号"]
+}];
+export default {
+  data() {
+    return {
+      switchChange_type: 1,
+      rules,
+      formData: {},
+      show_date: false,
+      result_date: '',
+      result_leixing: '',
+      result_student: '',
+      result_status: '',
+      result_intention: '',
+
+      result_dates: '',
+      result_renwu: '',
+      result_fangshi: '',
+
+      show: false,
+      options: [],
+      linkage: true,
+      options_type: undefined,
+      options_leixing: [{
+        'value': 1,
+        'text': '类型1'
+      }, {
+        'value': 2,
+        'text': '类型2'
+      }, {
+        'value': 3,
+        'text': '类型3'
+      }],
+      options_student: [{
+        'value': 1,
+        'text': '张三'
+      }, {
+        'value': 2,
+        'text': '李四'
+      }, {
+        'value': 3,
+        'text': '王五'
+      }],
+      options_status: [{
+        'value': 1,
+        'text': '状态1'
+      }, {
+        'value': 2,
+        'text': '状态2'
+      }, {
+        'value': 3,
+        'text': '状态3'
+      }],
+      options_intention: [{
+        'value': 1,
+        'text': '张三1'
+      }, {
+        'value': 2,
+        'text': '李四2'
+      }, {
+        'value': 3,
+        'text': '王五3'
+      }],
+      options_kehu: [{
+        'value': 1,
+        'text': '张三'
+      }, {
+        'value': 2,
+        'text': '李四'
+      }, {
+        'value': 3,
+        'text': '王五'
+      }],
+      options_renwu: [{
+        'value': 1,
+        'text': '是'
+      }, {
+        'value': 2,
+        'text': '否'
+      }],
+      options_fangshi: [{
+        'value': 1,
+        'text': '短信'
+      }, {
+        'value': 2,
+        'text': '微信'
+      }]
+    }
+  },
+  methods: {
+    submit() {
+      console.log(this.formData)
+      this.$refs.form.validator(null, null, true).then(res => {
+        console.log(res)
+        if (res.isPassed) {
+          console.log('校验通过！')
+        } else {
+          console.log('向上滑动页面查看错误提示！')
+        }
+      }).catch(err => {
+        console.log(err)
+      })
+    },
+    //选择弹窗
+    selectCon(type) {
+      if (type == 1) {
+        //选择跟进时间
+        this.options_date_type = 1
+        this.show_date = true
+      } else if (type == 2) {
+        this.options_type = 2
+        this.options = this.options_leixing
+        this.show = true
+        this.linkage = true
+      } else if (type == 3) {
+        this.options_type = 3
+        this.options = this.options_student
+        this.show = true
+        this.linkage = true
+      } else if (type == 4) {
+        this.options_type = 4
+        this.options = this.options_status
+        this.show = true
+        this.linkage = true
+      } else if (type == 5) {
+        this.options_type = 5
+        this.options = this.options_intention
+        this.show = true
+        this.linkage = true
+      } else if (type == 6) {
+        //选择跟进时间
+        this.options_date_type = 6
+        this.show_date = true
+      } else if (type == 7) {
+        //选择任务提醒
+        this.options_type = 7
+        this.options = this.options_renwu
+        this.show = true
+        this.linkage = true
+      } else if (type == 8) {
+        //选择提醒方式
+        this.options_type = 8
+        this.options = this.options_fangshi
+        this.show = true
+        this.linkage = true
+      }
+    },
+    //选择跟进时间
+    change_date(e) {
+      if (this.options_date_type == 1) {
+        this.show_date = false
+        this.result_date = e.result ?? ''
+      } else if (this.options_date_type == 6) {
+        this.show_date = false
+        this.result_dates = e.result ?? ''
+      }
+    },
+    //关闭选择跟进时间
+    cancel_date() {
+      this.show_date = false
+    },
+    //选择框
+    change(e) {
+      this.show = false
+      console.log(e)
+      if (this.options_type == 2) {
+        this.result_leixing = e.result
+      } else if (this.options_type == 3) {
+        this.result_student = e.result
+      } else if (this.options_type == 4) {
+        this.result_status = e.result
+      } else if (this.options_type == 5) {
+        this.result_intention = e.result
+      } else if (this.options_type == 7) {
+        this.result_renwu = e.result
+      } else if (this.options_type == 8) {
+        this.result_fangshi = e.result
+      }
+    },
+    //关闭选择框
+    cancel() {
+      this.show = false
+    },
+    //开关选择
+    switchChange(e) {
+      if (e.detail.value) {
+        this.switchChange_type = 1
+      } else {
+        this.switchChange_type = 2
+      }
+    }
+  }
+}
 </script>
 
 <style lang="less" scoped>