feat: 设置界面基本信息板块开发

CHANGELOG.md

@@ -46,6 +46,7 @@
  - | 添加子任务插件 子项目插件 | [7bda7e2](https://dd.tall.wiki/gitea/binbin0314/yanyuan_js/commits/7bda7e2)
  - | 细节调整，添加project-webview | [4d9050b](https://dd.tall.wiki/gitea/binbin0314/yanyuan_js/commits/4d9050b)
  - | 向右箭头图标变化 | [8e9ca55](https://dd.tall.wiki/gitea/binbin0314/yanyuan_js/commits/8e9ca55)
+ - | 项目合并整理,设置页面添加 | [725491a](https://dd.tall.wiki/gitea/binbin0314/yanyuan_js/commits/725491a)
  - | 项目列表, 项目url | [32e005b](https://dd.tall.wiki/gitea/binbin0314/yanyuan_js/commits/32e005b)
  - | 项目列表排序 | [224c58b](https://dd.tall.wiki/gitea/binbin0314/yanyuan_js/commits/224c58b)
  - | 项目api url设置 | [6cd5245](https://dd.tall.wiki/gitea/binbin0314/yanyuan_js/commits/6cd5245)

src/common/styles/tailwind.scss

@@ -4306,6 +4306,9 @@
 .opacity-100 {
   opacity: 1;
 }
+.h-6 {
+  height: 1.5rem;
+}
 .h-full {
   height: 100%;
 }
@@ -4313,6 +4316,9 @@
   --tw-bg-opacity: 1;
   background-color: rgba(249, 250, 251, var(--tw-bg-opacity));
 }
+.w-6 {
+  width: 1.5rem;
+}
 .w-12 {
   width: 3rem;
 }

src/components/ConfigInfo/ConfigInfo.vue

@@ -1,36 +1,56 @@
 <template>
+  <scroll-view style="height: 100%" :scroll-y="true">
     <view class="pt-2">
-    <view class="bg-white px-5 pb-5">
+      <view class="bg-white">
         <u-collapse :head-style="headStyle" :accordion="true">
           <u-collapse-item v-for="(item, index) in itemList" :key="index" :open="item.open">
-          <view slot="title"> {{ item.head }} </view>
+            <view slot="title" class="flex items-center w-full">
-          {{ item.body }}
+              <view class="pl-5 flex flex-1 items-center">
+                <img class="w-6 h-6 mr-2" :src="item.img" alt="" />
+                {{ item.head }}
+              </view>
+              <view v-if="index === 0" class="text-gray-400">{{ patientName }}</view>
+            </view>
+            <Info v-if="index === 0" />
           </u-collapse-item>
         </u-collapse>
       </view>
+      <view class="mt-16 flex flex-col text-center">
+        <img class="mx-auto weixin-png" src="./img/weixin.png" />
+        <view class="mt-2" style="color: #999">扫码添加客服微信</view>
+      </view>
     </view>
+  </scroll-view>
 </template>
 
 <script>
+import Info from './components/Info.vue';
+
 export default {
   name: 'ConfigInfo',
-
+  components: { Info },
   data() {
     return {
       itemList: [
-        { head: '基本信息', open: true },
+        { head: '基本信息', open: true, body: '123', img: require('./img/1.png') },
-        { head: '药物使用记录', open: false },
+        // { head: '药物使用记录', open: false, body: '123', img: require('./img/2.png') },
-        { head: 'Zarit照顾者分担量表', open: false },
+        // { head: 'Zarit照顾者分担量表', open: false, body: '123', img: require('./img/3.png') },
-        { head: '家属成员', open: false },
+        // { head: '家属成员', open: false, body: '123', img: require('./img/4.png') },
       ],
       headStyle: {
         borderBottom: '1px solid #dcdfe6',
         height: '50px',
         fontSize: '16px',
       },
+      patientName: '传小控',
     };
   },
   methods: {},
 };
 </script>
-<style lang="scss" scoped></style>
+<style lang="scss" scoped>
+.weixin-png {
+  width: 120px;
+  height: 120px;
+}
+</style>

src/components/ConfigInfo/components/Info.vue

@@ -0,0 +1,288 @@
+<template>
+  <view style="background-color: #f3f3f3">
+    <view v-for="(item, index) in list" :key="index" class="card-box">
+      <template v-for="(colItem, itemIndex) in item">
+        <u-collapse v-if="colItem.showType === 1" :key="itemIndex" :head-style="headStyle" :body-style="bodyStyle" :accordion="false">
+          <u-collapse-item :title="colItem.name" :open="false">
+            <view style="border-bottom: 1px solid #eee"> 123 </view>
+          </u-collapse-item>
+        </u-collapse>
+        <view v-else :key="itemIndex">
+          {{ colItem.name }}
+        </view>
+      </template>
+    </view>
+  </view>
+</template>
+<script>
+export default {
+  name: 'Info',
+  data() {
+    return {
+      headStyle: {
+        backgroundColor: '#fff',
+        height: '46px',
+        paddingLeft: '1.5rem',
+        fontSize: '14px',
+      },
+      bodyStyle: { backgroundColor: '#fff', paddingLeft: '1.5rem' },
+      // 展示类型: showType: 1 标题+折叠, 2 直接展示
+      // 试题类型, type:1 单选,11 特殊处理的单选,2 日期,3 输入框,4 下拉框,5 多选
+      list: [
+        [
+          {
+            name: '性别',
+            showType: 1,
+            type: 1,
+            radioList: ['男', '女'],
+            value: null,
+          },
+          {
+            name: '出生日期',
+            showType: 2,
+            type: 2,
+            value: null,
+          },
+          {
+            name: '身高',
+            showType: 2,
+            type: 3,
+            value: null,
+          },
+          {
+            name: '体重',
+            showType: 2,
+            type: 3,
+            value: null,
+          },
+          {
+            name: '职业',
+            showType: 1,
+            type: 1,
+            radioList: ['干部', '军人', '技术人员', '农民', '工人', '运动员', '个体商业人员', '其他'],
+            value: null,
+          },
+          {
+            name: '受教育程度',
+            showType: 1,
+            type: 1,
+            radioList: ['文盲', '小学', '初中', '高中或中专', '大学或大专', '大学以上', '其他'],
+            value: null,
+          },
+          {
+            name: '受教育年限',
+            showType: 1,
+            type: 1,
+            radioList: [
+              '0',
+              '1',
+              '2',
+              '3',
+              '4',
+              '5',
+              '6',
+              '7',
+              '8',
+              '9',
+              '10',
+              '11',
+              '12',
+              '13',
+              '14',
+              '15',
+              '16',
+              '17',
+              '18',
+              '19',
+              '20',
+              '21',
+              '22',
+              '23',
+              '24',
+              '25',
+              '26',
+              '27',
+              '28',
+              '29',
+              '30',
+            ],
+            value: null,
+          },
+        ],
+        [
+          {
+            name: '出现认知障碍时间',
+            showType: 2,
+            type: 2,
+            value: null,
+          },
+          {
+            name: '首次诊断痴呆时间',
+            showType: 2,
+            type: 2,
+            value: null,
+          },
+          {
+            name: '诊断',
+            showType: 1,
+            type: 1,
+            radioList: ['阿尔茨海默病', '路易体痴呆', '额颞痴呆', '血管性痴呆', '混合性痴呆', '其他'],
+            value: null,
+          },
+        ],
+        [
+          {
+            name: '血压',
+            showType: 2,
+            type: 4,
+            value: null,
+          },
+          {
+            name: '血脂（低密度脂蛋白）',
+            showType: 2,
+            type: 3,
+            value: null,
+          },
+        ],
+        [
+          {
+            name: '体力活动',
+            showType: 1,
+            type: 1,
+            radioList: ['强', '中', '低'],
+            value: null,
+          },
+          {
+            name: 'APOE基因',
+            showType: 1,
+            type: 1,
+            radioList: ['是', '否', '不知道'],
+            value: null,
+          },
+        ],
+        [
+          {
+            name: '疾病史',
+            showType: 1,
+            type: 5,
+            checkList: [
+              '高血压',
+              '高血脂',
+              '糖尿病',
+              '冠心病',
+              '痛风',
+              '慢性胃炎',
+              '风湿',
+              '帕金森病',
+              '脑梗死',
+              '脑出血',
+              '抑郁症',
+              '其他',
+            ],
+            value: [],
+          },
+          {
+            name: '亲属疾病史（祖父母;外祖父母;父母）',
+            showType: 1,
+            type: 5,
+            checkList: [
+              '高血压',
+              '高血脂',
+              '糖尿病',
+              '冠心病',
+              '痛风',
+              '慢性胃炎',
+              '风湿',
+              '帕金森病',
+              '脑梗死',
+              '脑出血',
+              '抑郁症',
+              '其他',
+            ],
+            value: [],
+          },
+        ],
+        [
+          {
+            name: '失眠',
+            showType: 1,
+            type: 1,
+            radioList: ['是', '否'],
+            value: null,
+          },
+          {
+            name: '吸烟',
+            showType: 1,
+            type: 11,
+            value: null,
+          },
+          {
+            name: '饮酒',
+            showType: 1,
+            type: 11,
+            value: null,
+          },
+          {
+            name: '饮茶',
+            showType: 1,
+            type: 11,
+            value: null,
+          },
+          {
+            name: '饮食是否口重',
+            showType: 1,
+            type: 1,
+            radioList: ['是', '否'],
+            value: null,
+          },
+          {
+            name: '饮食喜好',
+            showType: 1,
+            type: 1,
+            radioList: ['荤菜', '素菜'],
+            value: null,
+          },
+          {
+            name: '炒菜放油多少',
+            showType: 1,
+            type: 1,
+            radioList: ['是', '否'],
+            value: null,
+          },
+        ],
+        [
+          {
+            name: '就诊医院',
+            showType: 2,
+            type: 3,
+            value: null,
+          },
+          {
+            name: '就诊医生',
+            showType: 2,
+            type: 3,
+            value: null,
+          },
+          {
+            name: '医院地址',
+            showType: 2,
+            type: 3,
+            value: null,
+          },
+          {
+            name: '就诊科室',
+            showType: 2,
+            type: 3,
+            value: null,
+          },
+        ],
+      ],
+    };
+  },
+};
+</script>
+<style lang="scss" scoped>
+.card-box {
+  margin: 0 0 8px 0;
+}
+</style>

src/pages.json

@@ -1,12 +1,6 @@
 {
 	"pages": [
 		{
-			"path": "pages/project/project",
-			"style": {
-				"navigationBarTitleText": "项目详情页",
-				"navigationStyle": "custom"
-			}
-		},{
 			"path": "pages/index/index",
 			"style": {
 				"navigationBarText": "TALL",
@@ -20,6 +14,20 @@
 				"navigationStyle": "custom"
 			}
 		},
+		{
+			"path": "pages/project/project",
+			"style": {
+				"navigationBarTitleText": "项目详情页",
+				"navigationStyle": "custom"
+			}
+		},
+				{
+			"path": "pages/git-phone-power/git-phone-power",
+			"style": {
+				"navigationBarTitleText": "授权信息",
+				"navigationStyle": "custom"
+			}
+		},
 		{
 			"path": "pages/project-webview/project-webview",
 			"style": {

src/pages/git-phone-power/git-phone-power.vue

@@ -0,0 +1,58 @@
+<template>
+  <view>
+    <u-button
+      :custom-style="customStyle"
+      shape="square"
+      size="default"
+      type="primary"
+      open-type="getPhoneNumber"
+      @getphonenumber="getphonenumber"
+    >
+      授权手机号
+    </u-button>
+  </view>
+</template>
+
+<script>
+export default {
+  data() {
+    return {
+      customStyle: {
+        margin: '188rpx 88rpx',
+        width: '574rpx',
+      },
+      show: false,
+    };
+  },
+  methods: {
+    // 点击体验按钮,获取用户手机号权限并绑定
+    // 如果拒绝授权,则跳转到手机号验证码绑定界面
+    // 如果授权,查看返回的绑定信息,如果有id,则直接绑定成功,跳转到项目列表页
+    // 如果没有id,则提示当前手机号已存在,是否合并信息
+    async getphonenumber(e) {
+      // if (e.detail.errMsg === 'getPhoneNumber:fail user deny') {
+      //   this.$u.route('/pages/phone-bind/phone-bind');
+      // } else {
+
+      // 如果用户授权信息
+      if (e.detail.errMsg === 'getPhoneNumber:ok') {
+        const params = {
+          encryptedData: e.detail.encryptedData,
+          iv: e.detail.iv,
+          miniType: 'basicCar',
+        };
+        const data = await this.$u.api.bindPhone(params);
+        if (data && data.id) {
+          // const newUser = { ...this.user, phone: data.phone };
+          // this.setUser(newUser);
+          // setTimeout(() => uni.navigateBack({ delta: 2 }), 50);
+          this.$u.route('pages/questionnaire-webview/questionnaire-webview', { u: this.userId });
+        } else {
+          this.phone = data.phone;
+          this.show = true;
+        }
+      }
+    },
+  },
+};
+</script>

src/pages/project/project.vue

@@ -13,7 +13,7 @@
 
       <!-- 定期任务面板 -->
       <!-- <TimeLine @getTasks="getTasks" style="background-color: #f3f3f3" class="flex-1 overflow-hidden" ref="timeLine" /> -->
-      <ConfigInfo class="flex-1" style="background-color: #f3f3f3" />
+      <ConfigInfo class="flex-1 overflow-hidden" style="background-color: #f3f3f3" />
     </view>
   </view>
 </template>