修改问题

src/App.vue

@@ -5,6 +5,7 @@
   import 'vant/lib/index.css';
   import { onMounted, computed } from 'vue';
   import { useUserStore } from '/@/store/modules/user';
+  import { useCookies } from '@vueuse/integrations/useCookies';
   const userStore = useUserStore();
   const wxOpenId = computed(() => {
     return userStore.getWxOpenId;
@@ -21,6 +22,10 @@
       //进行微信登录
       getCodeApi(123);
     }
+    let clear = getUrlKey('clear'); //获取url参数code
+    if(clear){
+      useCookies().set('wxOpenId', '')
+    }
   });
   function getUrlKey(name) {
     //获取url 参数

src/layout/basic/index.vue

@@ -1,41 +1,19 @@
 <template>
-  <!-- <nut-navbar :left-show="false" :title="$t($route.meta.title)" /> -->
   <div class="main-page">
-    <!-- <keep-alive>
-      <router-view v-if="$route.meta.keepAlive" :key="$route.path" />
-    </keep-alive>
-    <router-view v-if="!$route.meta.keepAlive" :key="$route.path" /> -->
     <RouterView v-slot="{ Component }" v-if="$route.meta.keepAlive">
-      <keep-alive>
+      <keep-alive :include="['homePage','index']">
         <component :is="Component" :key="$route.path" />
       </keep-alive>
     </RouterView>
-    <RouterView v-if="!$route.meta.keepAlive" :key="$route.path" />
+    <RouterView v-else :key="$route.path" />
   </div>
-  <!-- <nut-tabbar unactive-color="#364636" active-color="#1989fa" @tab-switch="tabSwitch" bottom v-model:visible="activeTab">
-    <nut-tabbar-item v-for="item in tabItem" :key="item.key" :tab-title="$t(`tabbar.${item.key}`)" :icon="item.icon" />
-  </nut-tabbar> -->
 </template>
 
 <script lang="ts" setup name="BasicLayoutPage">
-  // import { useRouter } from 'vue-router';
   import { onMounted } from 'vue';
-
-  // const tabItem = [
-  //   { key: 'home', icon: 'home' },
-  //   { key: 'list', icon: 'horizontal' },
-  //   { key: 'member', icon: 'my' },
-  //   { key: 'demo', icon: 'location' },
-  // ];
-
-  // const router = useRouter();
-
-  // const activeTab = ref(0);
-
   onMounted(() => {
     // activeTab.value = tabItem.findIndex((item) => item.key === router.currentRoute.value.path.replace('/', ''));
   });
-
 </script>
 
 <style scoped lang="scss">

src/router/routes.ts

@@ -6,6 +6,7 @@ const routes = [
     children: [
       {
         path: 'home',
+        name: 'home',
         component: () => import('/@/views/home/index.vue'),
         meta: {
           title: 'tabbar.home',
@@ -14,14 +15,16 @@ const routes = [
       },
       {
         path: 'detail/:id',
+        name: 'detail',
         component: () => import('/@/views/detail/index.vue'),
         meta: {
           title: ' .list',
-          keepAlive: false,
+          keepAlive: true,
         },
       },
       {
         path: 'evaluate/:id',
+        name: 'evaluate',
         component: () => import('/@/views/detail/evaluate.vue'),
         meta: {
           title: '评价',
@@ -30,70 +33,42 @@ const routes = [
       },
       {
         path: 'payment/:id',
+        name: 'payment',
         component: () => import('/@/views/detail/payment.vue'),
         meta: {
           title: '支付',
-          keepAlive: false,
+          keepAlive: true,
         },
       },
       {
         path: 'repair/:id',
+        name: 'repair',
         component: () => import('/@/views/detail/repair.vue'),
         meta: {
           title: '维修',
-          keepAlive: false,
+          keepAlive: true,
         },
       },
       {
         path: 'evaluate/:id',
+        name: 'evaluate',
         component: () => import('/@/views/detail/evaluate.vue'),
         meta: {
           title: '评价',
-          keepAlive: false,
+          keepAlive: true,
         },
       },
       {
         path: 'invoice/:id',
+        name: 'invoice',
         component: () => import('/@/views/detail/invoice.vue'),
         meta: {
           title: '申请开票',
-          keepAlive: false,
-        },
-      },{
-        path: 'list',
-        component: () => import('/@/views/list/index.vue'),
-        meta: {
-          title: 'tabbar.list',
-          keepAlive: false,
-        },
-      },
-      {
-        path: 'member',
-        component: () => import('/@/views/member/index.vue'),
-        meta: {
-          title: 'tabbar.member',
-          keepAlive: false,
-        },
-      },
-      {
-        path: 'demo',
-        component: () => import('/@/views/demo/index.vue'),
-        meta: {
-          title: 'tabbar.demo',
-          keepAlive: false,
+          keepAlive: true,
         },
-      },
+      }
     ],
-  },
-  {
-    name: 'login',
-    path: '/login',
-    component: () => import('/@/views/login/index.vue'),
-    meta: {
-      title: '',
-      keepAlive: false,
-    },
-  },
+  }
 ];
 
 export default routes;

src/store/modules/user.ts

@@ -16,7 +16,7 @@ export const useUserStore = defineStore({
   id: 'user',
   state: (): StoreUser => ({
     token: token,
-    wxOpenId:'',
+    wxOpenId:'o3S0L1Hyd3O0vYI2Kr1lFDEtEO2k',
     info: {
       name:'test',
       wxOpenId:'test1',

src/utils/request.ts

@@ -30,7 +30,6 @@ const request = async <T = any>(
   // 请求前加上 token
   service.interceptors.request.use((config) => {
     addToast()
-    console.log('confige',config)
     if (config?.headers) {
       config.headers.wxOpenId = token || "";
     }
@@ -73,13 +72,11 @@ function addToast(){
       duration: 0,
     });
     loadingCount++
-    console.log('loadingCount+',loadingCount)
   }
 function reduce(){
     loadingCount--
     if (loadingCount == 0) {
       closeToast()
     }
-    console.log('loadingCount-',loadingCount)
 }
 export default request;

src/views/detail/index.vue

@@ -66,7 +66,7 @@
         </div>
       </div>
     </div>
-    <div class="page_custinfo item_content">
+    <div class="page_custinfo item_content" v-if="detailData.priceList.length">
       <div class="title">费用明细</div>
       <div class="content">
         <div class="cost_list">
@@ -77,7 +77,7 @@
         </div>
         <div class="cell" style="border: none">
           <span>维修费用</span>
-          <span class="colortext">¥{{ priceCount(detailData?.priceList || []) }}</span>
+          <span>¥{{ priceCount(detailData?.priceList || []) }}</span>
         </div>
       </div>
     </div>
@@ -170,7 +170,7 @@ function priceCount(list){
   list.map(ele => {
     price = (ele.price * ele.count) + price
   })
-  return price
+  return price.toFixed(2)
 }
 const getDetaile = async () => {
   const { response } = await repairDetails(id);
@@ -203,7 +203,7 @@ const goRoute = (path) => {
     .title {
       font-size: 14px;
       font-family: PingFang SC-Medium, PingFang SC;
-      font-weight: 500;
+      font-weight: 600;
       color: #000000;
       padding: 15px 0;
       margin: 0 15px;

src/views/detail/invoice.vue

@@ -12,11 +12,11 @@
     </div>
     <div class="form invoiceForm">
       <van-form @submit="onSubmit" style="margin-top: 10px; background: #fff">
-          <van-field name="radio" label="发票类型" input-align="right">
+        <van-field name="radio" label="发票类型" input-align="right">
           <template #input>
             <van-radio-group v-model="formData.invoiceType" direction="horizontal">
-              <van-radio :name="0">普通发票</van-radio>
-              <van-radio :name="1">专用发票</van-radio>
+              <van-radio :name="0" checked-color="#00B3EC">普通发票</van-radio>
+              <van-radio :name="1" checked-color="#00B3EC">专用发票</van-radio>
             </van-radio-group>
           </template>
         </van-field>
@@ -69,7 +69,8 @@
             placeholder="请填写企业电话"
             :rules="[{ required: true, message: '请填写企业电话' }]"
           />
-          <van-field v-if="formData.invoiceType == 0"
+          <van-field
+            v-if="formData.invoiceType == 0"
             v-model="formData.invoiceEmail"
             input-align="right"
             name="电子邮箱"
@@ -77,7 +78,8 @@
             placeholder="请填写接收发票邮箱"
             :rules="[{ required: true, message: '请填写接收发票邮箱' }]"
           />
-          <van-field v-if="formData.invoiceType == 1"
+          <van-field
+            v-if="formData.invoiceType == 1"
             v-model="formData.getAddress"
             input-align="right"
             name="收件地址"
@@ -85,7 +87,8 @@
             placeholder="请填写收件地址"
             :rules="[{ required: true, message: '请填写收件地址' }]"
           />
-          <van-field  v-if="formData.invoiceType == 1"
+          <van-field
+            v-if="formData.invoiceType == 1"
             v-model="formData.getAddrName"
             input-align="right"
             name="收件人"
@@ -93,24 +96,28 @@
             placeholder="请填写收件人姓名"
             :rules="[{ required: true, message: '请填写收件人姓名' }]"
           />
-          <van-field v-if="formData.invoiceType == 1"
+          <van-field
+            v-if="formData.invoiceType == 1"
             v-model="formData.getAddrPhone"
             input-align="right"
             name="收件人电话"
             label="收件人电话"
             placeholder="请填写收件人电话"
-            :rules="[{ required: true, message: '请填写手机号' }, {
-  // 自定义校验规则
-  validator: (value) => {
-    return /^(0|86|17951)?(13[0-9]|15[012356789]|166|17[3678]|18[0-9]|14[57])[0-9]{8}$/.test(value);
-  },
-  message: '请输入正确格式的手机号码',
-  trigger: 'onBlur',
-}]"
+            :rules="[
+              { required: true, message: '请填写手机号' },
+              {
+                // 自定义校验规则
+                validator: (value) => {
+                  return /^(0|86|17951)?(13[0-9]|15[012356789]|166|17[3678]|18[0-9]|14[57])[0-9]{8}$/.test(value);
+                },
+                message: '请输入正确格式的手机号码',
+                trigger: 'onBlur',
+              },
+            ]"
           />
         </van-cell-group>
-      <div class="but">
-          <van-button round block type="primary" native-type="submit"> 提交 </van-button>
+        <div class="but" style="background-color: #f5f5f5">
+          <van-button block type="primary" native-type="submit"> 提交 </van-button>
         </div>
       </van-form>
     </div>
@@ -119,7 +126,7 @@
   
   <script lang="ts" setup name="detailPage">
 import { ref, onMounted, unref } from 'vue';
-import { getInvoiceAddress, invoiceApply } from '/@/api'
+import { getInvoiceAddress, invoiceApply } from '/@/api';
 import { useRouter } from 'vue-router';
 const router = useRouter();
 const { id } = unref(router.currentRoute)?.params;
@@ -132,64 +139,67 @@ const formData = ref({
   invoiceHead: '',
   checked: '1',
   checkeds: '1',
-  invoiceAmount:0,
-  invoiceType:0,
-  phone:'',
-  getAddrName:'',
-  getAddrPhone:'',
-  getAddress:'',
+  invoiceAmount: 0,
+  invoiceType: 0,
+  phone: '',
+  getAddrName: '',
+  getAddrPhone: '',
+  getAddress: '',
+});
+onMounted(async () => {
+  let { data } = await getInvoiceAddress('20230227175908840');
+  formData.value.invoiceAmount = data.payAmount;
+  formData.value.getAddrName = data.getAddrName;
+  formData.value.getAddrPhone = data.getAddrPhone;
+  formData.value.getAddress = data.getAddress;
 });
-onMounted( async ()=>{
-  let { data } = await getInvoiceAddress('20230227175908840')
-  console.log('payAmount',data)
-  formData.value.invoiceAmount = data.payAmount
-  formData.value.getAddrName = data.getAddrName
-  formData.value.getAddrPhone = data.getAddrPhone
-  formData.value.getAddress = data.getAddress
-})
 async function onSubmit() {
   const res = await invoiceApply({
     ...formData.value,
-    repairId:id,
-  })
-  console.log(res)
+    repairId: id,
+  });
+  console.log(res);
 }
 </script>
  <style lang="scss" >
- .van-cell-group{
-  margin: 0 !important;
- }
-.evaluate {
-  min-height: 100vh;
-  background-color: #f5f5f5;
-  .invoiceForm{
-    .van-field__error-message{
-      text-align: right;
+  .evaluate {
+    
+    .van-cell-group {
+      margin: 0 !important;
+    }
+    .van-radio--horizontal {
+      margin: 0 0 0 20px;
     }
-  }
-  .evaluate_top {
-    background-color: #fff;
-    .border {
-      border-top: 1px solid #e7e7e7;
+    min-height: 100vh;
+    background-color: #f5f5f5;
+    .invoiceForm {
+      .van-field__error-message {
+        text-align: right;
+      }
     }
-    .colortext {
-      color: #e34d59;
+    .evaluate_top {
+      background-color: #fff;
+      .border {
+        border-top: 1px solid #e7e7e7;
+      }
+      .colortext {
+        color: #e34d59;
+      }
+      .cell {
+        height: 48px;
+        padding: 0 15px;
+        display: flex;
+        justify-content: space-between;
+        align-items: center;
+        font-size: 14px;
+        font-family: PingFang SC-Regular, PingFang SC;
+        font-weight: 400;
+        color: #333333;
+      }
     }
-    .cell {
-      height: 48px;
-      padding: 0 15px;
-      display: flex;
-      justify-content: space-between;
-      align-items: center;
-      font-size: 14px;
-      font-family: PingFang SC-Regular, PingFang SC;
-      font-weight: 400;
-      color: #333333;
+    .but {
+      padding: 25px 15px;
     }
-  }
-  .but {
-    padding: 25px 15px;
-  }
 }
 </style>
   

src/views/detail/repair.vue

@@ -24,14 +24,14 @@
         </div>
       </div>
       <div class="cell" style="border: none">
-        <span>维修费用</span>
-        <span class="colortext">¥{{ detail.amount }}</span>
+        <span>合计</span>
+        <span class="colortext">¥{{ detail.amount?.toFixed(2) || '0.00' }}</span>
       </div>
     </div>
     <div class="but">
       <span class="tips">确认维修后，将直接开始维修。维修费用待维修完成后支付</span>
       <van-button type="primary" color="#00B3EC" @click="hanldConfirm(0)" block>确认维修</van-button>
-      <van-button type="primary" color="#00B3EC" @click="hanldConfirm(1)" plain block>取消维修</van-button>
+      <van-button type="primary" style="background: none;" color="#00B3EC" @click="hanldConfirm(1)" plain block>取消维修</van-button>
     </div>
   </div>
 </template>
@@ -71,7 +71,7 @@ const hanldConfirm = async (confirm) => {
   }
 };
 </script>
- <style lang="scss" >
+ <style lang="scss" scoped>
 .page {
   min-height: 100vh;
   background-color: #f5f5f5;

src/views/home/index.vue

@@ -1,6 +1,6 @@
 <template>
   <div class="page">
-    <van-tabs v-model:active="active" @click-tab="onClickTab">
+    <van-tabs v-model:active="active" color="#00B3EC" title-active-color="#00B3EC">
       <van-tab title="设备报修">
         <SubmitPage @setActive="changeActive"/>
       </van-tab>
@@ -11,27 +11,18 @@
   </div>
 </template>
 
-<script lang="ts" setup name="HomePage">
-import { computed, ref } from 'vue';
+<script lang="ts" setup name="homePage">
+import { computed, ref, onActivated } from 'vue';
 import { useUserStore } from '/@/store/modules/user';
-// import { setLang } from '/@/i18n';
-// import store from '/@/store';
 import SubmitPage from './submit.vue'
 import List from './list.vue'
-// import { useI18n } from 'vue-i18n';
-// const { locale } = useI18n();
 const active = ref(0);
 const userStore = useUserStore();
 const getUserInfo = computed(() => {
   const { name = '' } = userStore.getUserInfo() || {};
   return name;
 });
-// const onSubmit = () => {
-//   console.log('onSubmit');
-// };
 const onClickTab = (title) => {
-  console.log('title',title,active.value)
-  console.log('store',userStore,getUserInfo)
 }
 const changeActive = (type) => {
   document.documentElement.scrollTo({ top: 0, behavior: 'smooth' });

src/views/home/list.vue

@@ -32,7 +32,7 @@
   </div>
 </template>
 <script lang="ts" setup name="HomeList">
-import { reactive, ref, toRefs, watch, computed, onMounted } from 'vue';
+import { reactive, ref, onActivated, toRefs, watch, computed, onMounted } from 'vue';
 import { useRouter } from 'vue-router';
 import { useUserStore } from '/@/store/modules/user';
 import { useHomeStore } from '/@/store/modules/home';
@@ -75,6 +75,9 @@ watch(
 onMounted(()=>{
   onLoad()
 })
+onActivated(()=>{
+  getList()
+})
 const myData = reactive({
   cameraType:{
     0:'四维看看',
@@ -90,16 +93,15 @@ const myData = reactive({
   },
 });
 const onLoad = async () => {
+  getList()
+};
+const getList = async (item) => {
   loading.value = false;
   const {data} = await repairList({wxOpenId:wxOpenId.value});
   console.log('data',data)
   list.value = data || []
   loading.value = true;
-};
-// const onDetail = (item) => {
-//     console.log('onDetail',item)
-//     router.push(`detail/${item}`);
-// }
+}
 const goRoute = (path) => {
   if (!path) return;
   router.push(path);
@@ -149,7 +151,7 @@ const goRoute = (path) => {
       display: flex;
       justify-content: space-between;
       align-items: center;
-      height: 80px;
+      height: 60px;
       border-top: 1px solid #E7E7E7;
 
       .butList {

src/views/home/submit.vue

@@ -1,6 +1,6 @@
 <template>
   <van-form @submit="onSubmit" style="margin-top: 10px; background: #fff">
-    <van-cell-group inset>
+    <van-cell-group style="margin:none" inset>
       <van-field
         v-model="formData.companyName"
         label-align="top"
@@ -60,8 +60,8 @@
       <van-field name="radio" label="送修方式" label-align="top">
         <template #input>
           <van-radio-group v-model="formData.sendType" direction="horizontal">
-            <van-radio :name="0">前台送修</van-radio>
-            <van-radio :name="1">快递寄送</van-radio>
+            <van-radio :name="0" checked-color="#00B3EC">前台送修</van-radio>
+            <van-radio :name="1" checked-color="#00B3EC">快递寄送</van-radio>
           </van-radio-group>
         </template>
       </van-field>
@@ -78,8 +78,8 @@
       <van-field name="radio" label="取回方式" label-align="top">
         <template #input>
           <van-radio-group v-model="formData.getType" direction="horizontal">
-            <van-radio :name="0">前台送修</van-radio>
-            <van-radio :name="1">快递寄送</van-radio>
+            <van-radio :name="0" checked-color="#00B3EC">前台取回</van-radio>
+            <van-radio :name="1" checked-color="#00B3EC">快递寄回</van-radio>
           </van-radio-group>
         </template>
       </van-field>
@@ -131,8 +131,8 @@
         show-word-limit
       />
     </van-cell-group>
-    <div style="margin: 16px">
-      <van-button round block color="#00B3EC" type="primary" native-type="submit"> 提交 </van-button>
+    <div style="margin: 16px;background-color:#f5f5f5">
+      <van-button block color="#00B3EC" type="primary" native-type="submit"> 提交 </van-button>
     </div>
   </van-form>
 </template>
@@ -254,8 +254,19 @@ function clzpAfterRead(file) {
 .btn-wrap {
   margin: 20px;
 }
-.btn-confirm {
+.page{
+  .btn-confirm {
   @include main-lang-bg(302px, 82px, '/@/assets/button', 'confirm.png');
+  }
+  .van-cell{
+    padding: 20px 0;
+  }
+  .van-cell__title{
+    margin-bottom: 10px;
+  }
+  .van-radio--horizontal{
+    margin-right: 60px;
+  }
 }
 </style>