“我的“主页完成

src/components/Mine/Branch/branch.vue

 <template>
-  <div class=" bg-white pt-4 px-5">
-  <!-- 网点位置 -->
-  <div class=" pb-4">
-      <div class=" mb-3">
-        <img src="../../../assets/img/bank_logo.png" class=" w-6 h-6 inline-block m-auto">
-        <span class="ml-2 text-gray-800 font-semibold text-base">杭州文辉支行</span>
-        <p class=" bg-branch-bg text-branch-font text-sm px-2 py-1 rounded inline float-right">网点</p>
+  <div class=" bg-white pt-4 rounded-2xl overflow-hidden">
+    <div class=" px-5">
+      <!-- 网点位置 -->
+      <div class=" pb-2">
+          <div class=" mb-2">
+            <img src="../../../assets/img/bank_logo.png" class=" w-6 h-6 inline-block m-auto align-text-bottom">
+            <span class="ml-2 text-gray-800 font-semibold text-base">杭州文辉支行</span>
+            <p class=" bg-branch-bg text-branch-font text-sm px-2 rounded inline-block align-middle float-right">网点</p>
+          </div>
+          <span class=" text-gray-400 text-sm mt-2">浙江省杭州市文三路49号</span>
+          <span class=" text-gray-400 text-sm float-right">1.16KM</span>
       </div>
-      <span class=" text-gray-400 text-sm mt-2">浙江省杭州市文三路49号</span>
-      <span class=" text-gray-400 text-sm float-right">1.16KM</span>
-  </div>
-  <div class=" border border-gray-100"></div>
-  <!-- 营业时间 -->
-  <div>
-    
-  </div>
+      <div class=" border border-gray-100"></div>
+      <!-- 营业时间 -->
+      <div class=" mt-2 pb-3">
+        <icon
+          name="icon-yingye"
+          color="#1B1F37"
+          size="14"
+          class=" inline-block align-middle mr-3"
+        />
+        <span class=" text-app-blue border border-app-blue bg-indigo-100 text-sm px-2 rounded">营业中</span>
+        <div class=" text-right h-3 ">
+          <icon
+            name="icon-ditu"
+            color="#3E4FAF"
+            size="14"
+            class="inline-block align-top"
+          />
+        </div>
+        <icon
+          name="icon-a-shijian"
+          color="#1B1F37"
+          size="14"
+          class=" inline-block align-text-top mr-3"
+        />
+        <span class=" text-gray-400 text-sm inline-block align-top">周一至周五 丨 08:30-17:00 </span>
+      </div>
+    </div>
   <!-- 底部操作 -->
+  <div class=" flex text-center py-3 text-gray-800 bg-gray-50">
+    <p class=" w-1/2 border-r border-gray-300">联系客服</p>
+    <p class=" w-1/2">电话咨询</p>
+  </div>
   </div>
 </template>
 
 <script lang="ts">
 import { defineComponent } from 'vue'
+import Icon from "@/components/common/Icon.vue"
 
 export default defineComponent({
+  components:{
+    Icon
+  },
   setup () {
     
 

src/router/index.ts

@@ -71,6 +71,14 @@ const routes: Array<RouteRecordRaw> = [
       name: 'Home',
     },
   },
+  {
+    path: '/setting',
+    name: 'Setting',
+    component: () =>
+      import(
+        /* webpackChunkName: "mine" */ '@/views/withMenu/Mine/setting.vue'
+      ),
+  },
 ]
 
 const router = createRouter({

src/views/withMenu/Mine/setting.vue

+<template>
+  <div>
+    <nav-bar title="个人中心"/>
+    <!-- 头像 -->
+    <div>
+      <span>头像</span>
+    </div>
+    <!-- 手机号码 -->
+    <div>
+
+    </div>
+    <!-- 登陆密码 -->
+    <div>
+
+    </div>
+  </div>
+</template>
+
+<script lang="ts">
+import { defineComponent } from 'vue'
+import NavBar from "@/components/NavBar/index.vue"
+
+export default defineComponent({
+  components:{
+    NavBar
+  },
+  setup () {
+    
+
+    return {}
+  }
+})
+</script>
+
+<style scoped>
+
+</style>
\ No newline at end of file