README.md

@@ -16,13 +16,13 @@
 - node>=18
 - pnpm>=7.30
 
-- UnoCss https://alfred-skyblue.github.io/unocss-docs-cn/
-- uni-ui https://hellouniapp.dcloud.net.cn/pages/component/view/view
-- uv-ui https://www.uvui.cn/components/intro.html
-- wot-ui https://wot-design-uni.pages.dev/component/button
-- tmui https://tmui.design/
-- firstui https://doc.firstui.cn/docs/introduce.html
-- mockjs https://wll8.github.io/mockjs-examples/
+- UnoCss <https://alfred-skyblue.github.io/unocss-docs-cn/>
+- uni-ui <https://hellouniapp.dcloud.net.cn/pages/component/view/view>
+- uv-ui <https://www.uvui.cn/components/intro.html>
+- wot-ui <https://wot-design-uni.pages.dev/component/button>
+- tmui <https://tmui.design/>
+- firstui <https://doc.firstui.cn/docs/introduce.html>
+- mockjs <https://wll8.github.io/mockjs-examples/>
 
 ## &#x1F4C2; 快速开始
 
@@ -36,6 +36,16 @@
 - weixin 平台：`pnpm dev:mp-weixin` 然后打开微信开发者工具，导入本地文件夹，选择本项目的`dist/dev/mp-weixin` 文件。
 - APP 平台：`pnpm dev:app`, 然后打开 `HBuilderX`，导入刚刚生成的`dist/dev/app` 文件夹，选择运行到模拟器(开发时优先使用)，或者运行的安卓/ios 基座。
 
+### `SVG`：使用了[zui-svg-icon](https://ext.dcloud.net.cn/plugin?id=13964)
+
+1. 将`SVG`文件放入到`/assets/svg-icons`文件夹下
+2. 执行`pnpm svg-icon`，生成图标库
+3. 使用图标组件传入`icon`属性即可，`icon`是图标的文件名不包含后缀名，可以传入`width, height, color`
+
+   ```vue
+   <zui-svg-icon icon="arrow-right" color="blue" />
+   ```
+
 ## 🔗 发布
 
 - web 平台： `pnpm build:h5`，打包后的文件在 `dist/build/h5`，可以放到 web 服务器，如 nginx 运行。如果最终不是放在根目录，可以在 `manifest.config.ts` 文件的 `h5.router.base` 属性进行修改。

src/components/profile-card.vue

@@ -1,6 +1,6 @@
 <script lang="ts" setup>
 interface IProps {
-  bgColor: string
+  bgColor?: string
   link?: string
 }
 

src/pages/appointment/index.vue

@@ -8,19 +8,31 @@
 </route>
 
 <template>
-  <view class="appointment">
+  <view class="appointment px-2">
     <view class="appointment-form">
-      <uv-form labelPosition="left" :model="formList" ref="formRef">
-        <uv-form-item label="选择医疗项目" prop="userInfo.name" borderBottom>
-          <uv-input border="none"></uv-input>
-        </uv-form-item>
-        <uv-form-item label="选择检查时间" prop="userInfo.name" borderBottom>
-          <uv-input border="none"></uv-input>
-        </uv-form-item>
-      </uv-form>
+      <wd-form ref="form" :model="formList">
+        <wd-cell-group border>
+          <template v-for="(item, index) in formList" :key="index">
+            <view class="form-item mt-4">
+              <wd-picker
+                :columns="columns"
+                label="选择医疗项目"
+                v-model="item.name"
+                :rules="[{ required: true, message: '请选择医疗项目' }]"
+              />
+              <wd-datetime-picker
+                type="time"
+                v-model="item.time"
+                label="选择器检查时间"
+                :rules="[{ required: true, message: '请选择检查时间' }]"
+              />
+            </view>
+          </template>
+        </wd-cell-group>
+      </wd-form>
     </view>
     <view class="appointment-footer flex items-center justify-around mt-80rpx">
-      <uv-button type="error" text="增加一个新项目"></uv-button>
+      <uv-button type="error" text="增加一个新项目" @click="addFormItem"></uv-button>
       <uv-button type="primary" text="提交"></uv-button>
     </view>
   </view>
@@ -30,13 +42,38 @@
 //
 const formList = ref([
   {
-    name: '姓名',
-    value: '张三',
-    type: 'text',
+    name: '',
+    time: '',
   },
 ])
+const columns = ref([
+  {
+    label: '项目一',
+    value: '1',
+  },
+  {
+    label: '项目二',
+    value: '2',
+  },
+  {
+    label: '项目三',
+    value: '3',
+  },
+])
+function addFormItem() {
+  formList.value.push({
+    name: '',
+    time: '',
+  })
+}
 </script>
 
 <style lang="scss" scoped>
 //
+.appointment {
+  box-sizing: border-box;
+}
+.form-item {
+  border: 1px solid #ccc;
+}
 </style>

src/pages/patient-detail/index.vue

@@ -55,7 +55,7 @@ const menuList = [
     icon: '',
     text: '就诊预约',
     color: '#8fd7ff',
-    link: '',
+    link: '/pages/appointment/index',
   },
   {
     icon: '',

src/pages/profile/index.vue

@@ -1,5 +1,5 @@
 <!-- 使用 type="home" 属性设置首页，其他页面不需要设置，默认为page；推荐使用json5，更强大，且允许注释 -->
-<route lang="json5" type="home">
+<route lang="json5">
 {
   style: {
     navigationStyle: 'custom',