🎈 perf: 表单交互

src/pages/book/edit.vue

@@ -66,8 +66,8 @@ const openCalendar = () => {
                   @click="openCalendar"
         />
         <wd-input v-model="dataSource.title" label="名称" prop="title" placeholder="礼簿名称" clearable :rules="[{ required: true, message: '请填写礼簿名称' }]" />
-        <wd-input v-model="dataSource.cost" label="成本" prop="cost" placeholder="宴席、伴手礼等费用" />
-        <wd-textarea v-model="dataSource.remarks" label="备注" placeholder="请输入内容" />
+        <wd-input v-model="dataSource.cost" label="成本" prop="cost" type="number" placeholder="宴席、伴手礼等费用" />
+        <wd-input v-model="dataSource.remarks" label="备注" placeholder="请输入内容" />
       </wd-form>
       <div class="my-3 text-xs text-gray">
         一场宴席活动中，用来登记所有来宾贺礼的名册，称为礼簿。

src/pages/friend/detail.vue

@@ -152,9 +152,9 @@ const handleFriendDel = () => {
           <div class="text-lg font-bold">
             {{ friend.name }}
           </div>
-          <div class="mt-1 text-sm text-gray">
+          <div class="mt-1 flex items-center text-sm text-gray">
             关系：
-            <wd-tag type="primary">
+            <wd-tag v-if="friend.tag" type="primary" mark>
               {{ friend.tag }}
             </wd-tag>
           </div>

src/pages/friend/edit.vue

@@ -42,7 +42,7 @@ const onSubmit = async () => {
                   :rules="[{ required: true, message: '请填写亲友姓名' }]"
         />
         <wd-select-picker v-model="dataSource.tag" type="radio" label="标签" :columns="columns" />
-        <wd-textarea v-model="dataSource.remarks" label="备注" placeholder="请输入内容" />
+        <wd-input v-model="dataSource.remarks" label="备注" placeholder="请输入内容" />
       </wd-form>
       <wd-button block :loading="loading" @click="onSubmit">
         保存

src/pages/friend/list.vue

@@ -8,14 +8,14 @@ const columns = [
 const friendsList = ref<Array<{ index: string, data: Array<Api.Friend> }>>()
 const search = ref({
   keyword: '',
-  relation: '',
+  tag: '',
   showAction: false,
 })
 
 const loadData = async () => {
   apiFriendListGet({
     keyword: search.value.keyword,
-    relation: search.value.relation,
+    tag: search.value.tag,
   }).then((res) => {
     if (res.succeeded) {
       // 根据首字母firstLetter进行分组
@@ -47,7 +47,7 @@ onPullDownRefresh(async () => {
 })
 
 const onTabsClick = (item: any) => {
-  search.value.relation = item.value
+  search.value.tag = item.value
   loadData()
 }
 
@@ -58,7 +58,7 @@ function searchOk() {
 function searchCancel() {
   search.value = {
     keyword: '',
-    relation: '',
+    tag: '',
     showAction: false,
   }
   loadData()

src/pages/friend/select.vue

@@ -1,17 +1,20 @@
 <script setup lang="ts">
-import { friendCategory } from '@/constants/app';
+import { friendCategory } from '@/constants/app'
 
-const columns = friendCategory.map((i) => ({ name: i, value: i }));
+const columns = friendCategory.map(i => ({ name: i, value: i }))
 const instance: any = getCurrentInstance()
 const eventChannel = instance.proxy.getOpenerEventChannel()
 const friendsList = ref<Array<{ index: string, data: Array<Api.Friend> }>>()
 const search = ref({
   keyword: '',
-  relation: '',
+  tag: '',
   showAction: false,
 })
 const loadData = () => {
-  apiFriendListGet({}).then((res) => {
+  apiFriendListGet({
+    keyword: search.value.keyword,
+    tag: search.value.tag,
+  }).then((res) => {
     if (res.succeeded) {
       // 根据首字母firstLetter进行分组
       const map = new Map()
@@ -41,7 +44,7 @@ function onFriendClick(e: Api.Friend) {
 }
 
 const onTabsClick = (item: any) => {
-  search.value.relation = item.value
+  search.value.tag = item.value
   loadData()
 }
 
@@ -51,7 +54,7 @@ function searchOk() {
 function searchCancel() {
   search.value = {
     keyword: '',
-    relation: '',
+    tag: '',
     showAction: false,
   }
   loadData()
@@ -62,7 +65,8 @@ function searchCancel() {
   <div class="h-full flex flex-col">
     <div>
       <wd-search v-model="search.keyword" light :hide-cancel="!search.showAction" placeholder="请输入搜索内容" placeholder-left
-        @search="searchOk" @cancel="searchCancel" @focus="search.showAction = true" />
+                 @search="searchOk" @cancel="searchCancel" @focus="search.showAction = true"
+      />
       <uv-tabs :list="columns" line-color="#f87171" @click="onTabsClick" />
     </div>
     <div class="grow">
@@ -73,7 +77,8 @@ function searchCancel() {
         <div v-for="item in friendsList" :key="item.index">
           <wd-index-anchor :index="item.index" />
           <wd-cell v-for="cell in item.data" :key="cell.id" clickable border :title="cell.name"
-            @click="onFriendClick(cell)" />
+                   @click="onFriendClick(cell)"
+          />
         </div>
       </wd-index-bar>
     </div>
@@ -82,8 +87,10 @@ function searchCancel() {
 
 <style lang="scss" scoped></style>
 
-<route lang="json">{
+<route lang="json">
+{
   "style": {
     "navigationBarTitleText": "选择亲友"
   }
-}</route>
+}
+</route>

src/pages/giftIn/detail.vue

@@ -123,7 +123,7 @@ const navigateToFriendDetailPage = () => {
       </div>
     </div>
     <div class="mt-3 rounded-2xl bg-white p-1">
-      <uv-cell title="查看往来记录" is-link :border="false" @click="navigateToFriendDetailPage()" />
+      <wd-cell title="查看往来记录" is-link @click="navigateToFriendDetailPage()" />
     </div>
   </div>
 </template>

src/pages/giftIn/edit.vue

@@ -64,7 +64,7 @@ const onSelectFriend = () => {
                   :rules="[{ required: true, message: '请填写随礼金额' }]"
         />
         <wd-input v-model="dataSource.attendance" label="出席" prop="attendance" type="number" placeholder="参加宴席人数" />
-        <wd-textarea v-model="dataSource.remarks" label="备注" placeholder="请输入内容" />
+        <wd-input v-model="dataSource.remarks" label="备注" placeholder="请输入内容" />
       </wd-form>
       <wd-button block :loading="loading" @click="onSubmit">
         保存

src/pages/giftOut/detail.vue

@@ -125,7 +125,7 @@ const navigateToFriendDetailPage = () => {
       </div>
     </div>
     <div class="mt-3 rounded-2xl bg-white p-1">
-      <uv-cell title="查看往来记录" is-link :border="false" @click="navigateToFriendDetailPage()" />
+      <wd-cell title="查看往来记录" is-link @click="navigateToFriendDetailPage()" />
     </div>
   </div>
 </template>

src/pages/giftOut/edit.vue

@@ -120,7 +120,7 @@ const openCalendar = () => {
         <wd-input v-model="dataSource.money" label="金额" prop="money" placeholder="随礼金额" type="number"
                   :rules="[{ required: true, message: '请填写随礼金额' }]"
         />
-        <wd-textarea v-model="dataSource.remarks" label="备注" placeholder="请输入内容" />
+        <wd-input v-model="dataSource.remarks" label="备注" placeholder="请输入内容" />
       </wd-form>
       <wd-button block :loading="loading" @click="onSubmit">
         保存