修改集体样式

src/components/LaiTingTop.vue

@@ -1,9 +1,9 @@
 <script setup lang="ts">
 const prop = defineProps({
   des: {},
-})
-const safe = uni.getSystemInfoSync().safeArea?.top
-console.log(safe)
+});
+const safe = uni.getSystemInfoSync().safeArea?.top as number;
+console.log(safe);
 // const saftTop = safe.top
 //获取安全距离
 </script>
@@ -19,7 +19,7 @@ console.log(safe)
   text-align: center;
   color: #8ebfc7;
   font-size: 40rpx;
-  background-color: #f0f3f6;
+  background-color: #ffffff;
   padding-bottom: 40rpx;
   font-weight: 700;
 }

src/components/ShuiWuGetPhone.vue

@@ -0,0 +1,116 @@
+<script setup lang="ts">
+import { ref } from "vue";
+const popup = ref<any>();
+const open = () => {
+  popup.value.open("bottom");
+};
+const close = () => {
+  popup.value.close();
+};
+
+const agree = ref<boolean>(false);
+const radioChange = () => {
+  agree.value = !agree.value;
+};
+
+const stipulate = ref<any>();
+
+const stipulateClose = () => {
+  stipulate.value.close();
+};
+
+const viewDetail = () => {
+  stipulateOpen();
+};
+const stipulateOpen = () => {
+  stipulate.value.open("bottom");
+};
+
+defineExpose({
+  open,
+});
+</script>
+<template>
+  <view>
+    <uni-popup ref="popup" :mask-click="false">
+      <view class="get_phone_out">
+        <view
+          style="
+            text-align: right;
+            width: 100%;
+            color: #000000;
+            margin-right: 20rpx;
+            font-size: 40rpx;
+          "
+          ><text @click="close">X</text></view
+        >
+
+        <view class="welcome">欢迎登录税务风险检测</view>
+        <view class="serve">登录后可享受更好的服务</view>
+        <button :disabled="!agree">立即登录</button>
+        <view class="clause">
+          <label class="radio">
+            <radio value="r1" :checked="agree" @click="radioChange" />点击即表示同意
+          </label>
+          <view class="agreement" @click="viewDetail">《授权协议及条款》</view>
+        </view>
+      </view>
+    </uni-popup>
+
+    <uni-popup ref="stipulate" :mask-click="false">
+      <view class="get_phone_out">
+        <view
+          style="
+            text-align: right;
+            width: 100%;
+            color: #000000;
+            margin-right: 20rpx;
+            font-size: 40rpx;
+          "
+          ><text @click="stipulateClose">X</text></view
+        >
+        <view>
+          我是长条款我是长条款我是长条款我是长条款我是长条款我是长条款我是长条款我是长条款我是长条款我是长条款我是长条款我是长条款我是长条款我是长条款我是长条款我是长条款我是长条款我是长条款我是长条款我是长条款我是长条款我是长条款我是长条款我是长条款我是长条款我是长条款我是长条款我是长条款我是长条款我是长条款我是长条款我是长条款我是长条款我是长条款我是长条款我是长条款我是长条款我是长条款我是长条款我是长条款我是长条款我是长条款我是长条款我是长条款我是长条款我是长条款我是长条款我是长条款我是长条款我是长条款我是长条款我是长条款我是长条款我是长条款我是长条款我是长条款我是长条款我是长条款我是长条款我是长条款我是长条款我是长条款我是长条款我是长条款我是长条款我是长条款我是长条款我是长条款我是长条款我是长条款我是长条款我是长条款
+        </view>
+      </view>
+    </uni-popup>
+  </view>
+</template>
+<style lang="scss">
+.get_phone_out {
+  background: #ffffff;
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+
+  .welcome {
+    font-size: 40rpx;
+    font-weight: 700;
+    padding-top: 40rpx;
+  }
+
+  .serve {
+    font-size: 30rpx;
+    font-weight: 100;
+    color: #000000;
+    padding-top: 20rpx;
+  }
+
+  button {
+    background: rgb(132, 132, 226);
+    color: #ffffff;
+    border-radius: 40rpx;
+    margin-top: 60rpx;
+    padding: 0rpx 60rpx;
+  }
+
+  .clause {
+    padding-bottom: 100rpx;
+    padding-top: 40rpx;
+    display: flex;
+    .agreement {
+      color: blue;
+    }
+  }
+}
+</style>

src/components/ShuiWuLine.vue

@@ -0,0 +1,13 @@
+<script setup lang="ts"></script>
+
+<template>
+  <view class="divider"></view>
+</template>
+<style lang="scss">
+.divider {
+  background: #e0e3da;
+  width: 100%;
+  height: 2rpx;
+  opacity: 0.2;
+}
+</style>

src/components/ShuiWuTop.vue

@@ -0,0 +1,26 @@
+<script setup lang="ts">
+const prop = defineProps({
+  des: {},
+});
+const safe = uni.getSystemInfoSync().safeArea?.top as number;
+console.log(safe);
+// const saftTop = safe.top
+//获取安全距离
+</script>
+
+<template>
+  <view class="view-top" :style="{ paddingTop: safe + 40 + 'rpx' }">
+    {{ des }}
+  </view>
+</template>
+
+<style>
+.view-top {
+  text-align: center;
+  color: #8ebfc7;
+  font-size: 40rpx;
+  background-color: rgb(243, 250, 248);
+  padding-bottom: 40rpx;
+  font-weight: 700;
+}
+</style>

src/manifest.json

@@ -17,7 +17,9 @@
             "delay" : 0
         },
         /* 模块配置 */
-        "modules" : {},
+        "modules" : {
+            "Share" : {}
+        },
         /* 应用发布信息 */
         "distribute" : {
             /* android打包配置 */
@@ -43,7 +45,14 @@
             /* ios打包配置 */
             "ios" : {},
             /* SDK配置 */
-            "sdkConfigs" : {}
+            "sdkConfigs" : {
+                "share" : {
+                    "weixin" : {
+                        "appid" : "wxf9cf2808608b6781",
+                        "UniversalLinks" : ""
+                    }
+                }
+            }
         }
     },
     /* 快应用特有相关 */

src/pages.json

@@ -4,7 +4,8 @@
     "custom": {
       // uni-ui 规则如下配置
       "^uni-(.*)": "@dcloudio/uni-ui/lib/uni-$1/uni-$1.vue",
-      "^LaiTing(.*)": "@/components/LaiTing$1.vue"
+      "^LaiTing(.*)": "@/components/LaiTing$1.vue",
+      "^ShuiWu(.*)": "@/components/ShuiWu$1.vue"
     }
   },
   "pages": [
@@ -17,6 +18,15 @@
         "navigationStyle": "custom"
       }
 
+    },
+    {
+
+      "path": "pages/index/inviteUser",
+      "style": {
+        "navigationBarTitleText": "邀请用户",
+        // "navigationStyle": "custom"
+      }
+
     },
     {
       "path": "pages/my/my",
@@ -26,18 +36,35 @@
       }
     },
     {
-      "path": "pages/cart/cart",
+      "path": "pages/my/myEdit",
       "style": {
-        "navigationBarTitleText": "购物车"
+        "navigationBarTitleText": "编辑资料"
+        // "navigationStyle": "custom"
       }
     },
     {
-      "path": "pages/category/category",
+      "path": "pages/my/myInvite",
       "style": {
-        "navigationBarTitleText": "分类",
-        "navigationStyle": "custom"
+        "navigationBarTitleText": "我的邀请"
+        // "navigationStyle": "custom"
+      }
+    },
+    {
+      "path": "pages/my/reportList",
+      "style": {
+        "navigationBarTitleText": "报告记录"
+        // "navigationStyle": "custom"
       }
     },
+    {
+      "path": "pages/my/aboutMy",
+      "style": {
+        "navigationBarTitleText": "关于我们"
+        // "navigationStyle": "custom"
+      }
+    },
+
+
     {
       "path": "pages/login/login",
       "style": {
@@ -61,16 +88,16 @@
       {
         "text": "首页",
         "pagePath": "pages/index/index",
-        "iconPath": "static/tabs/main.png",
-        "selectedIconPath": "static/tabs/main_active.png"
-      },
-      {
-        "text": "收藏",
-        "pagePath": "pages/category/category",
-        "iconPath": "static/tabs/collect.png",
-        "selectedIconPath": "static/tabs/collect_active.png"
+        "iconPath": "static/tabs/home_default.png",
+        "selectedIconPath": "static/tabs/home_selected.png"
       },
       // {
+      //   "text": "收藏",
+      //   "pagePath": "pages/category/category",
+      //   "iconPath": "static/tabs/collect.png",
+      //   "selectedIconPath": "static/tabs/collect_active.png"
+      // },
+      // {
       //   "text": "购物车",
       //   "pagePath": "pages/cart/cart",
       //   "iconPath": "static/tabs/cart_default.png",
@@ -79,8 +106,8 @@
       {
         "text": "我的",
         "pagePath": "pages/my/my",
-        "iconPath": "static/tabs/my.png",
-        "selectedIconPath": "static/tabs/my_active.png"
+        "iconPath": "static/tabs/user_default.png",
+        "selectedIconPath": "static/tabs/user_selected.png"
       }
     ]
   }

src/pages/index/components/HomeList.vue

@@ -0,0 +1,143 @@
+<script setup lang="ts">
+import { ref, reactive, onMounted } from "vue";
+//到顶部多远时触发事件
+//more  上拉加载更多
+//loading //加载中
+//noMore 没有更多
+const status = ref<string>("more");
+onMounted(() => {});
+const scrollLower = () => {
+  //我到底部了
+  console.log("我到底部了");
+};
+</script>
+<template>
+  <view class="home_list_view">
+    <view style="height: 100%">
+      <scroll-view scroll-y="true" lower-threshold="30" @scrolltolower="scrollLower">
+        <view class="list_out">
+          <view class="list_title">
+            <view class="report_name">测试报告</view>
+            <view class="report_status">已生成</view>
+          </view>
+          <view class="list_button">
+            <view class="list_time"> 2024-04-15 23:33:05 </view>
+            <view> <button class="button_detail" size="mini">查看详情</button></view>
+          </view>
+        </view>
+        <view class="list_out">
+          <view class="list_title">
+            <view class="report_name">测试报告</view>
+            <view class="report_status">已生成</view>
+          </view>
+          <view class="list_button">
+            <view class="list_time"> 2024-04-15 23:33:05 </view>
+            <view> <button class="button_detail" size="mini">查看详情</button></view>
+          </view>
+        </view>
+        <view class="list_out">
+          <view class="list_title">
+            <view class="report_name">测试报告</view>
+            <view class="report_status">已生成</view>
+          </view>
+          <view class="list_button">
+            <view class="list_time"> 2024-04-15 23:33:05 </view>
+            <view> <button class="button_detail" size="mini">查看详情</button></view>
+          </view>
+        </view>
+        <view class="list_out">
+          <view class="list_title">
+            <view class="report_name">测试报告</view>
+            <view class="report_status">已生成</view>
+          </view>
+          <view class="list_button">
+            <view class="list_time"> 2024-04-15 23:33:05 </view>
+            <view> <button class="button_detail" size="mini">查看详情</button></view>
+          </view>
+        </view>
+        <view class="list_out">
+          <view class="list_title">
+            <view class="report_name">测试报告</view>
+            <view class="report_status">已生成</view>
+          </view>
+          <view class="list_button">
+            <view class="list_time"> 2024-04-15 23:33:05 </view>
+            <view> <button class="button_detail" size="mini">查看详情</button></view>
+          </view>
+        </view>
+        <view class="list_out">
+          <view class="list_title">
+            <view class="report_name">测试报告</view>
+            <view class="report_status">已生成</view>
+          </view>
+          <view class="list_button">
+            <view class="list_time"> 2024-04-15 23:33:05 </view>
+            <view> <button class="button_detail" size="mini">查看详情</button></view>
+          </view>
+        </view>
+        <uni-load-more iconType="circle" :status="status" />
+      </scroll-view>
+    </view>
+  </view>
+</template>
+
+<style lang="scss" scoped>
+.home_list_view {
+  flex: 1;
+  display: flex;
+  flex-direction: column;
+  height: 100%;
+  overflow: scroll;
+  .list_out {
+    margin-top: 20rpx;
+    border-radius: 40rpx;
+    background-color: #ffffff;
+    display: flex;
+    flex-direction: column;
+    .list_title {
+      display: flex;
+      flex-direction: row;
+      justify-content: space-between;
+      .report_name {
+        font-size: 30rpx;
+        font-weight: 700;
+        padding-left: 20rpx;
+        padding-top: 30rpx;
+      }
+      .report_status {
+        height: 40rpx;
+        border-top-right-radius: 40rpx;
+        border-bottom-left-radius: 40rpx;
+        font-size: 20rpx;
+        background-color: yellow;
+        display: flex;
+        align-items: center;
+        padding: 10rpx 20rpx;
+      }
+    }
+    .list_button {
+      display: flex;
+      flex-direction: row;
+      justify-content: space-between;
+      align-items: center;
+      padding: 30rpx 20rpx 20rpx;
+      .list_time {
+        color: #c4c4c4;
+      }
+      .button_detail {
+        color: #ffffff;
+        background: linear-gradient(rgb(198, 198, 243), rgb(94, 91, 247));
+      }
+    }
+  }
+}
+
+.is-input-border {
+  display: flex;
+  box-sizing: border-box;
+  flex-direction: row;
+  align-items: center;
+  border: 10px solid #dcdfe6;
+  border-radius: 400px !important;
+}
+</style>

src/pages/index/components/HomeTabs.vue

@@ -0,0 +1,46 @@
+<script setup lang="ts">
+const emit = defineEmits(["jumpInvite"]);
+const inviteUserFun = () => {
+  emit("jumpInvite");
+};
+</script>
+<template>
+  <view class="home_top"> 税务风险检测 </view>
+  <view class="home_tabs">
+    <view class="user_use" @click="inviteUserFun">邀请用户使用</view>
+    <view class="risk_detection">税务风险检测</view>
+  </view>
+</template>
+<style lang="scss">
+.home_top {
+  text-align: center;
+  font-size: 40rpx;
+  margin-bottom: 60rpx;
+}
+.home_tabs {
+  display: flex;
+  justify-content: space-around;
+  flex-direction: row;
+
+  .user_use {
+    color: #fff;
+    background: linear-gradient(blue, rgb(193, 192, 255));
+    flex: 1;
+    margin-right: 10rpx;
+    padding-left: 20rpx;
+    padding-top: 20rpx;
+    height: 200rpx;
+    border-radius: 30rpx;
+  }
+  .risk_detection {
+    color: #fff;
+    padding-left: 20rpx;
+    flex: 1;
+    background: linear-gradient(rgb(0, 255, 21), rgb(212, 255, 192));
+    padding-top: 20rpx;
+    height: 200rpx;
+    margin-left: 10rpx;
+    border-radius: 30rpx;
+  }
+}
+</style>

src/pages/index/components/MiddleScrollView.vue

@@ -1,34 +1,34 @@
 <script setup lang="ts">
-import { onLoad } from '@dcloudio/uni-app'
-import { imgUrl } from '@/utils/http'
-import { watch, watchEffect } from 'vue'
-import type { TypeList } from '@/types/home'
+import { onLoad } from "@dcloudio/uni-app";
+import { imgUrl } from "@/utils/http";
+import { watch, watchEffect } from "vue";
+import type { TypeList } from "@/types/home";
 // const prop = defineProps({
 //   list: [],
 // })
 // const props = defineProps<{ list: TypeList[] }>()
 
 const prop = defineProps<{
-  list: TypeList[]
-}>()
+  list: TypeList[];
+}>();
 
-const emit = defineEmits(['FatherClick'])
+const emit = defineEmits(["FatherClick"]);
 
 const selectType = (id: string) => {
-  emit('FatherClick', id)
-}
+  emit("FatherClick", id);
+};
 // const prop=defineProps({
 //   list:TypeList[]
 // })
 onLoad(() => {
   // console.log(prop)
-})
+});
 
 watchEffect(() => {
   // eslint-disable-next-line no-undef
-  console.log('测试监听')
-  console.log(prop.list)
-})
+  console.log("测试监听");
+  console.log(prop.list);
+});
 
 // watch(prop, (newValue, OldValue, onCleanup) => {
 //   console.log("数据变化了", `新值是：${newValue}`, `旧值是${OldValue}`);
@@ -54,7 +54,11 @@ watchEffect(() => {
         <view>
           <!-- {{ item.cover }} -->
         </view>
-        <image @click="selectType(item.id)" class="middle_sq_image" :src="imgUrl + item.cover" />
+        <image
+          @click="selectType(item.id)"
+          class="middle_sq_image"
+          :src="imgUrl + item.cover"
+        />
       </view>
     </scroll-view>
   </view>

src/pages/index/index.vue

@@ -1,127 +1,60 @@
 <script setup lang="ts">
-// import CustomNavbar from './components/CustomNavbar.vue'
-import Calculagraph from "./components/Calculagraph.vue";
-import GroupList from "./components/GroupList.vue";
-import MiddleScrollView from "./components/MiddleScrollView.vue";
+import HomeTabs from "./components/HomeTabs.vue";
+import HomeList from "./components/HomeList.vue";
+import { ref, reactive } from "vue";
+const companyName = ref<string>("");
 
-import { imgUrl } from "@/utils/http";
+const phoneGet = ref<any>();
 
-import { onLoad } from "@dcloudio/uni-app";
-
-import { getHomeApi, musicFindApi, musicTypeApi } from "@/services/home";
-import { reactive, ref } from "vue";
-import type { MusicFInd, TypeList } from "@/types/home";
-
-const homeApi = async () => {
-  const res = await getHomeApi();
-  // console.log(res)
+//调用子组件
+const phoneGetFun = () => {
+  phoneGet.value.open();
 };
-
-const bgUrl = ` url(${imgUrl}'./light-ting/covers/type-scene.png') no-repeat`;
-
-const old = reactive({ scrollTop: 0 });
-
-const scroll = (e: any) => {
-  old.scrollTop = e.detail.scrollTop;
+const validFun = () => {
+  //判断用户授权登录没有
+  phoneGetFun();
+  //跳转到邀请用户页面
+  // uni.navigateTo({ url: "/pages/index/inviteUser" });
 };
-let typeList = ref<TypeList[]>([]);
-let top = ref("211122");
-
-let firstId = ref<string>("");
-//查询音乐的方法s
-const musicType = async () => {
-  const res = await musicTypeApi();
-  top.value = "1111111111111111";
-  // typeList = res
-  typeList.value = res.data;
-
-  if (typeList.value.length > 0) {
-    // firstId.value = typeList.value[0].id
-    musicFind(typeList.value[0].id);
-  }
-  // console.log(typeList)
-};
-const Father = (id: string) => {
-  //父组件被调用以后需要调用接口查询方法
-
-  musicFind(id);
-};
-
-//调用查询具体音乐分类的方法
-let musicList = ref<MusicFInd[]>([]);
-const musicFind = async (id: string) => {
-  const a = await musicFindApi(id);
-  musicList.value = a.data;
-  // console.log("musicFindAop");
-  // console.log(a);
-};
-
-//小程序使用onload
-onLoad(() => {
-  // homeApi();
-  musicType();
-});
 </script>
-
 <template>
-  <view class="bg">
-    <Calculagraph />
-    <view class="tip_font"> 请选择声音，可多种组合 </view>
-    <MiddleScrollView :list="typeList" @FatherClick="Father" />
-    <GroupList :list="musicList" />
+  <!-- 引入头部安全区域组件 -->
+  <view class="home_padding">
+    <ShuiWuTop />
+    <HomeTabs @jumpInvite="validFun" />
+    <view class="list_search">
+      <uni-easyinput type="text" v-model="companyName" placeholder="请输入公司名称" />
+    </view>
+    <HomeList class="home_list_com" />
+    <ShuiWuGetPhone ref="phoneGet" />
   </view>
-  <!-- <CustomNavbar />
-  <LaiTingSwiper /> -->
 </template>
-
-<style lang="scss">
-//
-.bg {
-  // background: v-bind(bgUrl);
-  // background: url(v-bind(bgUrl)) no-repeat;
-  // background: url(v-bind(bgUrl)) no-repeat;
-  background: rgb(228, 240, 248)
-    url(https://test.jue-ming.com:8084/file/show?filePath=./light-ting/covers/bg.png)
-    no-repeat;
-  background-size: contain;
-  width: 750rpx;
-  // height: 100vh;
-  padding-top: 20vh;
-  padding-left: 20rpx;
-  padding-right: 20rpx;
-  padding-bottom: 40rpx;
-}
-
-.tip_font {
-  margin-top: 10rpx;
-  margin-bottom: 10rpx;
-  font-size: 30rpx;
-  color: #5aa4ae;
-  font-weight: 700;
-}
-
-.scroll-Y {
-  height: 300rpx;
-}
-
-.scroll-view_H {
-  white-space: nowrap;
-  width: 100%;
+<style>
+.list_search >>> .is-input-border {
+  display: flex;
+  box-sizing: border-box;
+  flex-direction: row;
+  align-items: center;
+  border: 1px solid #dcdfe6;
+  border-radius: 400px !important;
 }
-
-.scroll-view-item {
-  height: 300rpx;
-  line-height: 300rpx;
-  text-align: center;
-  font-size: 36rpx;
+</style>
+<style lang="scss">
+page {
+  height: 100%;
+  background-color: rgb(243, 250, 248);
 }
-
-.scroll-view-item_H {
-  display: inline-block;
-  width: 30%;
-  height: 300rpx;
-  line-height: 300rpx;
-  text-align: center;
-  font-size: 36rpx;
+.home_padding {
+  display: flex;
+  flex-direction: column;
+  height: 100%;
+  padding: 0rpx 20rpx;
+  .home_list_com {
+    flex: 1;
+    overflow: scroll;
+  }
+  .list_search {
+    margin-top: 40rpx;
+  }
 }
 </style>

src/pages/index/index1.vue

@@ -0,0 +1,127 @@
+<script setup lang="ts">
+// import CustomNavbar from './components/CustomNavbar.vue'
+import Calculagraph from "./components/Calculagraph.vue";
+import GroupList from "./components/GroupList.vue";
+import MiddleScrollView from "./components/MiddleScrollView.vue";
+
+import { imgUrl } from "@/utils/http";
+
+import { onLoad } from "@dcloudio/uni-app";
+
+import { getHomeApi, musicFindApi, musicTypeApi } from "@/services/home";
+import { reactive, ref } from "vue";
+import type { MusicFInd, TypeList } from "@/types/home";
+
+const homeApi = async () => {
+  const res = await getHomeApi();
+  // console.log(res)
+};
+
+const bgUrl = ` url(${imgUrl}'./light-ting/covers/type-scene.png') no-repeat`;
+
+const old = reactive({ scrollTop: 0 });
+
+const scroll = (e: any) => {
+  old.scrollTop = e.detail.scrollTop;
+};
+let typeList = ref<TypeList[]>([]);
+let top = ref("211122");
+
+let firstId = ref<string>("");
+//查询音乐的方法s
+const musicType = async () => {
+  const res = await musicTypeApi();
+  top.value = "1111111111111111";
+  // typeList = res
+  typeList.value = res.data;
+
+  if (typeList.value.length > 0) {
+    // firstId.value = typeList.value[0].id
+    musicFind(typeList.value[0].id);
+  }
+  // console.log(typeList)
+};
+const Father = (id: string) => {
+  //父组件被调用以后需要调用接口查询方法
+
+  musicFind(id);
+};
+
+//调用查询具体音乐分类的方法
+let musicList = ref<MusicFInd[]>([]);
+const musicFind = async (id: string) => {
+  const a = await musicFindApi(id);
+  musicList.value = a.data;
+  // console.log("musicFindAop");
+  // console.log(a);
+};
+
+//小程序使用onload
+onLoad(() => {
+  // homeApi();
+  musicType();
+});
+</script>
+
+<template>
+  <view class="bg">
+    <Calculagraph />
+    <view class="tip_font"> 请选择声音，可多种组合 </view>
+    <MiddleScrollView :list="typeList" @FatherClick="Father" />
+    <GroupList :list="musicList" />
+  </view>
+  <!-- <CustomNavbar />
+  <LaiTingSwiper /> -->
+</template>
+
+<style lang="scss">
+//
+.bg {
+  // background: v-bind(bgUrl);
+  // background: url(v-bind(bgUrl)) no-repeat;
+  // background: url(v-bind(bgUrl)) no-repeat;
+  background: rgb(228, 240, 248)
+    url(https://test.jue-ming.com:8084/file/show?filePath=./light-ting/covers/bg.png)
+    no-repeat;
+  background-size: contain;
+  width: 750rpx;
+  // height: 100vh;
+  padding-top: 20vh;
+  padding-left: 20rpx;
+  padding-right: 20rpx;
+  padding-bottom: 40rpx;
+}
+
+.tip_font {
+  margin-top: 10rpx;
+  margin-bottom: 10rpx;
+  font-size: 30rpx;
+  color: #5aa4ae;
+  font-weight: 700;
+}
+
+.scroll-Y {
+  height: 300rpx;
+}
+
+.scroll-view_H {
+  white-space: nowrap;
+  width: 100%;
+}
+
+.scroll-view-item {
+  height: 300rpx;
+  line-height: 300rpx;
+  text-align: center;
+  font-size: 36rpx;
+}
+
+.scroll-view-item_H {
+  display: inline-block;
+  width: 30%;
+  height: 300rpx;
+  line-height: 300rpx;
+  text-align: center;
+  font-size: 36rpx;
+}
+</style>

src/pages/index/inviteUser.vue

@@ -0,0 +1,118 @@
+<script setup lang="ts">
+import { ref } from "vue";
+const title = ref<string>("");
+const duration = ref<number>();
+const price = ref<number>();
+const num = ref<number>();
+</script>
+<template>
+  <view class="invite_user">
+    <uni-row class="demo-uni-row">
+      <uni-col :span="12">
+        <view class="user_input">
+          <view class="user_font">标题</view>
+          <view
+            ><uni-easyinput
+              type="text"
+              :inputBorder="false"
+              v-model="title"
+              placeholder="请输入标题"
+            ></uni-easyinput
+          ></view>
+        </view>
+      </uni-col>
+      <uni-col :span="12">
+        <view class="user_input">
+          <view class="user_out">
+            <view class="user_font">时长</view>
+            <view>
+              <uni-number-box
+                :min="0"
+                v-model="duration"
+                placeholder="请输入时长"
+              /> </view
+          ></view>
+
+          <view class="user_font_unit">天</view>
+        </view>
+      </uni-col>
+    </uni-row>
+    <uni-row style="margin-top: 100rpx">
+      <uni-col :span="12">
+        <view class="user_input">
+          <view class="user_out">
+            <view class="user_font">价格</view>
+            <uni-number-box :min="0" v-model="price" placeholder="请输入价格"
+          /></view>
+
+          <view class="user_font_unit">元</view>
+        </view>
+      </uni-col>
+      <uni-col :span="12">
+        <view class="user_input_time">
+          <view class="user_font">次数</view>
+          <uni-number-box :min="0" v-model="duration" placeholder="请输入次数" />
+        </view>
+      </uni-col>
+    </uni-row>
+    <view class="button_group">
+      <button class="mini-btn" type="default" size="mini">更换壁纸</button>
+      <button class="mini-btn" type="default" size="mini">生成海报</button>
+    </view>
+  </view>
+</template>
+<style lang="scss">
+page {
+  height: 100%;
+}
+.invite_user {
+  height: 100%;
+  width: 100%;
+  padding: 10rpx 15rpx;
+  background: rgb(243, 250, 248);
+  .button_group {
+    display: flex;
+    flex-direction: row;
+    justify-content: space-around;
+    align-items: center;
+    padding: 20rpx 0rpx;
+    button {
+      background: linear-gradient(#ffffff, blue);
+      color: #ffffff;
+      font-size: 36rpx;
+    }
+  }
+  .user_input_time {
+    padding: 20rpx 20rpx;
+    display: flex;
+    flex-direction: row;
+    justify-content: start;
+    align-items: center;
+    .user_font {
+      width: 100rpx;
+    }
+  }
+  .user_input {
+    padding: 20rpx 20rpx;
+    display: flex;
+    flex-direction: row;
+    justify-content: space-between;
+    align-items: center;
+    .user_out {
+      display: flex;
+      flex-direction: row;
+      justify-content: start;
+      align-items: center;
+      .user_font {
+        width: 100rpx;
+      }
+    }
+    .user_font {
+      width: 100rpx;
+    }
+    .user_font_unit {
+      color: blue;
+    }
+  }
+}
+</style>

src/pages/my/aboutMy.vue

@@ -0,0 +1,6 @@
+<script setup lang="ts"></script>
+<template>
+  <view>关于我们</view>
+  <view>权威报告</view>
+</template>
+<style lang="scss"></style>

src/pages/my/my.vue

@@ -1,4 +1,5 @@
 <script setup lang="ts">
+import ShuiWuTop from "@/components/ShuiWuTop.vue";
 import { useMemberStore } from "@/stores";
 import { http } from "@/utils/http";
 const memberStore = useMemberStore();
@@ -9,39 +10,116 @@ const getData = async () => {
     header: {},
   });
 };
+
+const editUser = () => {
+  //跳转到编辑页面
+  uni.navigateTo({
+    url: "/pages/my/myEdit",
+  });
+};
+const shireFun = () => {
+  uni.share({
+    provider: "weixin",
+    scene: "WXSceneSession",
+    type: 1,
+    summary: "我正在使用HBuilderX开发uni-app，赶紧跟我一起来体验！",
+    success: function (res) {
+      console.log("success:" + JSON.stringify(res));
+    },
+    fail: function (err) {
+      console.log("fail:" + JSON.stringify(err));
+    },
+  });
+};
+const myInvite = () => {
+  //跳转到邀请页面
+  uni.navigateTo({
+    url: "/pages/my/myInvite",
+  });
+};
+
+const aboutMy = () => {
+  //跳转到关于
+  uni.navigateTo({
+    url: "/pages/my/aboutMy",
+  });
+};
+const report = () => {
+  //跳转到报告页面
+  uni.navigateTo({
+    url: "/pages/my/reportList",
+  });
+};
+
+const exit = () => {
+  uni.showToast({ title: "已退出" });
+  //跳转到报告页面
+
+  setTimeout(() => {
+    uni.switchTab({
+      url: "/pages/index/index",
+    });
+  }, 550);
+};
 </script>
 
 <template>
   <view class="bg">
+    <ShuiWuTop />
+    <view class="home_top"> 我的 </view>
+    <view class="company_top"
+      ><image
+        class="company_image"
+        src="https://qiniu-web-assets.dcloud.net.cn/unidoc/zh/shuijiao.jpg"
+      ></image>
+      <view>xxxxxxx公司</view>
+    </view>
     <view class="my_info">
-      <view>
+      <view class="info_out">
         <image
-          class="user_icon"
+          class="user_image"
           src="https://qiniu-web-assets.dcloud.net.cn/unidoc/zh/shuijiao.jpg"
-        />
+        ></image>
+        <view class="user_name">
+          <view class="user_name_detail">张丽莎</view>
+          <view class="user_name_detail">岗位:&nbsp;&nbsp;销售</view>
+        </view>
+      </view>
+      <view class="info_detail" style="margin-top: 25rpx"
+        >联系电话:&nbsp;&nbsp;18595924672
+      </view>
+      <view class="info_detail">邮箱:&nbsp;&nbsp;1728114119@qq.com </view>
+      <view class="info_detail" style="margin-bottom: 15rpx"
+        >公司地址:&nbsp;&nbsp;自内蒙古自治区</view
+      >
+      <view class="info_edit">
+        <button class="button_edit" @click="editUser">编辑</button>
+        <button class="button_edit" @click="shireFun" open-type="share">分享</button>
       </view>
-      <view class="user_name">用户登录昵称</view>
     </view>
+
     <view class="my_tab">
-      <view class="my_tab_detail">
+      <view class="my_tab_detail" @click="myInvite">
         <view>
           <image class="tab_icon" src="../../static/images/shequ.png" />
         </view>
-        <view class="tab_des"> 加入社区 </view>
+        <view class="tab_des"> 我的邀请 </view>
         <view>
           <image class="tab_icon-right" src="../../static/images/right.png" />
         </view>
       </view>
-      <view class="my_tab_detail">
+      <ShuiWuLine />
+      <view class="my_tab_detail" @click="report">
         <view>
           <image class="tab_icon" src="../../static/images/fankui.png" />
         </view>
-        <view class="tab_des"> 问题反馈 </view>
+        <view class="tab_des"> 报告记录 </view>
         <view>
           <image class="tab_icon-right" src="../../static/images/right.png" />
         </view>
       </view>
-      <view class="my_tab_detail">
+      <ShuiWuLine />
+      <view class="my_tab_detail" @click="aboutMy">
         <view>
           <image class="tab_icon" src="../../static/images/about.png" />
         </view>
@@ -50,14 +128,12 @@ const getData = async () => {
           <image class="tab_icon-right" src="../../static/images/right.png" />
         </view>
       </view>
-      <view class="my_tab_detail">
+      <ShuiWuLine />
+      <view class="my_tab_detail_exit" @click="exit">
         <view>
           <image class="tab_icon" src="../../static/images/exit.png" />
         </view>
         <view class="tab_des"> 退出登录 </view>
-        <view>
-          <image class="tab_icon-right" src="../../static/images/right.png" />
-        </view>
       </view>
     </view>
     <view> </view>
@@ -67,27 +143,82 @@ const getData = async () => {
 
 <style lang="scss">
 //
+page {
+  height: 100%;
+}
+
 .bg {
-  background: url(@/static/images/bg.png) no-repeat;
-  background-size: 100% 100%;
-  width: 750rpx;
-  height: 100vh;
-  padding-top: 20vh;
-  padding-left: 20rpx;
-  padding-right: 20rpx;
-  padding-bottom: 40rpx;
+  height: 100%;
+  padding: 0rpx 20rpx;
+  background: rgb(243, 250, 248);
+  .home_top {
+    text-align: center;
+    font-size: 40rpx;
+    margin-bottom: 60rpx;
+  }
+  .company_top {
+    margin-bottom: 20rpx;
+    display: flex;
+    justify-content: start;
+    align-items: center;
+    .company_image {
+      width: 60rpx;
+      height: 60rpx;
+      background-color: #eeeeee;
+      border-radius: 50%;
+      margin-right: 20rpx;
+    }
+  }
 }
 
 .my_info {
   display: flex;
-  flex-direction: row;
+  flex-direction: column;
   justify-content: flex-start;
-  align-items: center;
-  background-color: #ffffff;
+  background: linear-gradient(rgb(191, 191, 243), rgb(98, 95, 240));
   padding-top: 15rpx;
-  padding-bottom: 20rpx;
-  padding-left: 15rpx;
-  border-radius: 30rpx;
+  border-radius: 15rpx;
+  .info_out {
+    padding: 0rpx 20rpx;
+    display: flex;
+    flex-direction: row;
+    .user_name {
+      color: #ffffff;
+      display: flex;
+      flex-direction: column;
+      justify-content: space-between;
+      .user_name_detail {
+        font-size: 36rpx;
+      }
+    }
+  }
+  .user_image {
+    width: 100rpx;
+    height: 100rpx;
+    background-color: #eeeeee;
+    border-radius: 50%;
+    margin-right: 20rpx;
+  }
+  .info_detail {
+    color: #ffffff;
+    padding: 10rpx 20rpx;
+    font-size: 36rpx;
+    font-weight: 100;
+  }
+  .info_edit {
+    line-height: 100rpx;
+    background-color: #ffffff;
+    color: #000000;
+    display: flex;
+    font-size: 36rpx;
+    flex-direction: row;
+    justify-content: space-around;
+    border-bottom-left-radius: 15rpx;
+    border-bottom-right-radius: 15rpx;
+    .button_edit {
+      background-color: transparent;
+    }
+  }
 
   // items-align:center;
 }
@@ -99,12 +230,6 @@ const getData = async () => {
   border-radius: 50%;
 }
 
-.user_name {
-  color: #5aa4ae;
-  font-size: 30rpx;
-  font-weight: 700;
-}
-
 .my_tab {
   background-color: #ffffff;
   margin-top: 40rpx;
@@ -113,14 +238,23 @@ const getData = async () => {
 }
 
 .my_tab_detail {
-  margin-top: 40rpx;
-  margin-bottom: 40rpx;
+  margin-top: 42rpx;
+  margin-bottom: 20rpx;
   display: flex;
   flex-direction: row;
   align-items: center;
 
   justify-content: flex-start;
 }
+.my_tab_detail_exit {
+  margin-top: 40rpx;
+  margin-bottom: 40rpx;
+  display: flex;
+  flex-direction: row;
+  align-items: center;
+  width: 100%;
+  justify-content: center;
+}
 
 .tab_icon {
   width: 40rpx;

src/pages/my/myEdit.vue

@@ -0,0 +1,170 @@
+<script setup lang="ts">
+import { ref, reactive } from "vue";
+const imageStyles = reactive({
+  width: 64,
+  height: 64,
+  border: {
+    radius: "50%",
+  },
+});
+const valiFormData = reactive({
+  name: "",
+  age: "",
+  introduction: "",
+});
+const rules = reactive({
+  rules: {
+    name: {
+      rules: [
+        {
+          required: true,
+          errorMessage: "名字不能为空",
+        },
+      ],
+    },
+    age: {
+      rules: [
+        {
+          required: true,
+          errorMessage: "年龄不能为空",
+        },
+        {
+          format: "number",
+          errorMessage: "年龄只能输入数字",
+        },
+      ],
+    },
+  },
+});
+const valiForm = ref();
+const submit = (ref: string) => {
+  uni.showToast({
+    title: "请填写名称",
+    duration: 2000,
+    icon: "error",
+  });
+};
+//提交并进行表单校验
+//注释
+// const valiForm = ref();
+// const submit = (ref: string) => {
+//   valiForm.value
+//     .validate()
+//     .then((res: any) => {
+//       console.log("success", res);
+//       uni.showToast({
+//         title: `校验通过`,
+//       });
+//     })
+//     .catch((err: any) => {
+//       console.log("err", err);
+//     });
+// };
+</script>
+<template>
+  <view class="my_edit">
+    <uni-forms
+      label-position="right"
+      ref="valiForm"
+      :modelValue="valiFormData"
+      :rules="rules.rules"
+    >
+      <uni-forms-item label="">
+        <view class="avatar_class">
+          <view>头像</view>
+          <uni-file-picker
+            style="width: 100rpx"
+            limit="1"
+            :del-icon="false"
+            disable-preview
+            :imageStyles="imageStyles"
+            file-mediatype="image"
+            >&nbsp;</uni-file-picker
+          >
+        </view>
+      </uni-forms-item>
+      <uni-forms-item label="">
+        <view class="name_class">
+          <view>名字</view>
+          <uni-easyinput
+            :inputBorder="false"
+            v-model="valiFormData.name"
+            placeholder="请输入名字"
+          ></uni-easyinput>
+        </view>
+      </uni-forms-item>
+      <uni-forms-item label="">
+        <view class="name_class">
+          <view>岗位 </view>
+          <uni-easyinput :inputBorder="false" placeholder="请输入岗位"></uni-easyinput>
+        </view>
+      </uni-forms-item>
+      <uni-forms-item label="">
+        <view class="name_class">
+          <view> 联系电话 </view>
+          <uni-easyinput
+            :inputBorder="false"
+            placeholder="请输入联系电话"
+          ></uni-easyinput>
+        </view>
+      </uni-forms-item>
+      <uni-forms-item label="">
+        <view class="name_class">
+          <view> 邮箱 </view>
+          <uni-easyinput :inputBorder="false" placeholder="请输入邮箱"></uni-easyinput>
+        </view>
+      </uni-forms-item>
+      <uni-forms-item></uni-forms-item>
+    </uni-forms>
+    <button class="submit_user" @click="submit('valiForm')">提交</button>
+  </view>
+</template>
+<style lang="scss">
+.my_edit .uni-easyinput {
+  text-align: right;
+}
+
+.my_edit .uni-easyinput__content {
+  background-color: transparent !important;
+}
+
+page {
+  height: 100%;
+}
+
+.my_edit {
+  background: rgb(243, 250, 248);
+  height: 100%;
+  padding: 0rpx 20rpx;
+  .submit_user {
+    background: linear-gradient(rgb(0, 89, 255), rgb(153, 0, 255));
+    color: #ffffff;
+  }
+  .avatar_class {
+    padding-bottom: 14rpx;
+    border-bottom: 2rpx solid #dbd8d8;
+    display: flex;
+    flex-direction: row;
+    justify-content: space-between;
+    align-items: center;
+
+    .uni-file-picker {
+      flex: none;
+      width: auto;
+    }
+
+    .file-picker__box-content {
+      border-color: #c5c2c2 !important;
+    }
+  }
+
+  .name_class {
+    padding-bottom: 14rpx;
+    border-bottom: 2rpx solid #dbd8d8;
+    display: flex;
+    flex-direction: row;
+    justify-content: space-between;
+    align-items: center;
+  }
+}
+</style>

src/pages/my/myInvite.vue

@@ -0,0 +1,10 @@
+<script setup lang="ts">
+import HomeList from "../index/components/HomeList.vue";
+</script>
+
+<template>
+  <view>
+    <HomeList />
+  </view>
+</template>
+<style lang="scss"></style>

src/pages/my/reportList.vue

@@ -0,0 +1,10 @@
+<script setup lang="ts">
+import HomeList from "../index/components/HomeList.vue";
+</script>
+
+<template>
+  <view>
+    <HomeList />
+  </view>
+</template>
+<style lang="scss"></style>

src/stores/modules/member.ts

@@ -7,7 +7,16 @@ export const useMemberStore = defineStore(
   () => {
     // 会员信息
     const profile = ref<any>()
+    const token = ref<any>()
 
+    //保存token  token校验时使用
+    const saveToken = (val: string) => {
+      token.value = val
+    }
+    //清除token
+    const clearToken = () => {
+      token.value = ''
+    }
     // 保存会员信息，登录时使用
     const setProfile = (val: any) => {
       profile.value = val
@@ -21,6 +30,9 @@ export const useMemberStore = defineStore(
     // 记得 return
     return {
       profile,
+      token,
+      saveToken,
+      clearToken,
       setProfile,
       clearProfile,
     }

src/utils/http.ts

@@ -1,5 +1,7 @@
 import { useMemberStore } from '@/stores'
-import { Decrypt, Encrypt } from "./utils";
+import { Decrypt, Encrypt } from './utils'
+
+//引入 pinia 。。登录后将信息储存到pinia
 
 // const baseUrl = 'https://pcapi-xiaotuxian-front-devtest.itheima.net'
 const baseUrl = 'https://test.jue-ming.com:8084'
@@ -20,9 +22,17 @@ const httpInterceptor = {
       ...options.header,
       'source-client': 'miniapp',
     }
+    //判断如果请求体里有data//且data不为空
+    if ('data' in options) {
+      //如果包含data属性
+      options.data = Encrypt(JSON.stringify(options.data))
+    }
+    console.log(options)
     //添加 token 请求头标识
     const memberStore = useMemberStore()
-    const token = memberStore.profile?.token
+    // const token = memberStore.profile?.token
+    const token = memberStore.token
+    options.header.Authorization = token ? `Bearer ${token}` : ''
   },
 }
 
@@ -44,7 +54,7 @@ interface Data<T> {
 }
 
 export const http = <T>(option: UniApp.RequestOptions) => {
-  console.log(option)
+  // console.log(option?.data)
   return new Promise<Data<T>>((resolve, reject) => {
     uni.request({
       ...option,
@@ -54,6 +64,8 @@ export const http = <T>(option: UniApp.RequestOptions) => {
         if (res.statusCode >= 200 && res.statusCode < 300) {
           //访问成功
           // eslint-disable-next-line no-debugger
+
+          // resolve(JSON.parse(Decrypt(res.data)))
           resolve(res.data as Data<T>)
         } else if (res.statusCode === 401) {
           //清理用户信息