feats

src/components/RoomTag/index.vue

@@ -0,0 +1,141 @@
+<template>
+  <van-tag
+    v-show="roomInfo.metroNear == '1'"
+    class="room-tag labelItem0"
+    type="primary"
+    >铁</van-tag
+  >
+  <van-tag
+    v-show="roomInfo.schoolNear == '1'"
+    class="room-tag labelItem1"
+    type="primary"
+    >学</van-tag
+  >
+  <van-tag
+    v-show="roomInfo.keyStatus == '0'"
+    class="room-tag labelItem2"
+    type="primary"
+    >钥</van-tag
+  >
+  <van-tag
+    v-show="roomInfo.rescStatus == '0'"
+    class="room-tag labelItem0"
+    type="primary"
+    >勘</van-tag
+  >
+  <van-tag
+    v-show="roomInfo.authStatus == '0'"
+    class="room-tag labelItem1"
+    type="primary"
+    >委</van-tag
+  >
+  <van-tag
+    v-show="roomInfo.buildTime == '4'"
+    class="room-tag labelItem2"
+    type="primary"
+    >满五减一</van-tag
+  >
+  <van-tag
+    v-show="roomInfo.buildTime == '3'"
+    class="room-tag labelItem2"
+    type="primary"
+    >满五</van-tag
+  >
+  <van-tag
+    v-show="roomInfo.buildTime == '2'"
+    class="room-tag labelItem2"
+    type="primary"
+    >满二</van-tag
+  >
+  <van-tag
+    v-show="roomInfo.status == '7'"
+    class="room-tag labelItem2"
+    type="primary"
+    >锁</van-tag
+  >
+  <van-tag
+    v-show="roomInfo.souFangHouseId != null && roomInfo.souFangHouseId != ''"
+    class="room-tag labelItem0"
+    type="primary"
+    >关</van-tag
+  >
+  <van-tag v-show="roomInfo.status == '7'" class="room-tag" type="primary">
+    <img src="~@/assets/favicon.png" style="height: 16px" alt="" srcset="" />
+  </van-tag>
+  <van-tag
+    v-show="
+      roomInfo.fiveEightHouseId != null && roomInfo.fiveEightHouseId != ''
+    "
+    class="room-tag"
+    type="primary"
+  >
+    <img src="~@/assets/58.png" style="height: 16px" alt="" srcset="" />
+  </van-tag>
+  <van-tag
+    v-show="
+      roomInfo.threeSixFiveHouseId != null && roomInfo.threeSixFiveHouseId != ''
+    "
+    class="room-tag"
+    type="primary"
+  >
+    <img src="~@/assets/365.png" style="height: 16px" alt="" srcset="" />
+  </van-tag>
+  <van-tag
+    v-show="roomInfo.toutiaoHouseId != null && roomInfo.toutiaoHouseId != ''"
+    class="room-tag"
+    type="primary"
+  >
+    <img src="~@/assets/toutiao.png" style="height: 16px" alt="" srcset="" />
+  </van-tag>
+  <van-tag
+    v-show="roomInfo.protectionFlag == '1'"
+    class="room-tag labelItem0"
+    type="primary"
+    >保</van-tag
+  >
+  <van-tag v-show="roomInfo.collectFlag == '1'" class="room-tag" type="primary">
+    <img src="~@/assets/collect.png" style="height: 16px" alt="" srcset="" />
+  </van-tag>
+</template>
+
+<script>
+import { Tag } from 'vant'
+
+export default {
+  components: {
+    [Tag.name]: Tag,
+  },
+  props: {
+    roomInfo: {
+      type: Object,
+      default: () => ({}),
+    },
+  },
+  setup() {
+    // todo
+  },
+}
+</script>
+
+<style lang="less" scoped>
+.room-tag {
+  & + & {
+    margin-left: 3px;
+  }
+}
+
+.labelItem0 {
+  background-color: rgba(89, 171, 253, 0.15);
+  color: rgb(89, 171, 253);
+}
+
+.labelItem1 {
+  background-color: rgba(242, 161, 47, 0.15);
+  color: rgb(242, 161, 47);
+}
+
+.labelItem2 {
+  background-color: rgba(51, 190, 133, 0.15);
+  color: rgb(51, 190, 133);
+}
+</style>

src/store/models/room.js

@@ -13,7 +13,7 @@ export default () => {
 
   const getList = (data) => {
     loading.value = true
-    request({
+    return request({
       loadingId: 'room.list',
       url: '/room/list',
       data: {
@@ -23,18 +23,16 @@ export default () => {
       },
     })
       .then((res) => {
-        const { pageNo, pageSize, endRow, result } = res || {}
-        Object.assign(page, {
-          pageNo,
-          pageSize,
-          endRow,
-        })
-        list.value = pageNo <= 1 ? result : list.value.concat(list.value)
+        const { result, ...pageInfo } = res || {}
+        Object.assign(page, pageInfo)
+        list.value = pageInfo.pageNo <= 1 ? result : list.value.concat(list.value)
         loading.value = false
+        return res
       })
       .catch((e) => {
         console.error(e)
         loading.value = false
+        return Promise.reject(e)
       })
   }
 

src/utils/request/index.js

@@ -1,12 +1,12 @@
-import axios from "axios"
-import { Toast } from "vant"
-import { router } from "@/router"
-import store from "@/store"
-import { showDanger } from "../"
+import axios from 'axios'
+import { Toast } from 'vant'
+import { router } from '@/router'
+import store from '@/store'
+import { showDanger } from '../'
 
 // request 拦截器
 const requestInterceptor = (config) => {
-  const loading = store.getState("loading")
+  const loading = store.getState('loading')
 
   if (config.loadingId) {
     config.setLoading = (state) => loading.setLoading(config.loadingId, state)
@@ -28,8 +28,8 @@ const requestInterceptor = (config) => {
 // response 拦截器
 const responseInterceptor = (response) => {
   const { data, headers } = response
-  const contentType = headers["Content-Type"] || headers["content-type"] || ""
-  console.log(headers, "headers")
+  const contentType = headers['Content-Type'] || headers['content-type'] || ''
+  console.log(headers, 'headers')
 
   if (response.config.setLoading) {
     response.config.setLoading(false)
@@ -40,23 +40,23 @@ const responseInterceptor = (response) => {
   }
 
   if (/json/.test(contentType)) {
-    if ("0" === data.code) {
+    if ('0' === data.code) {
       return data.data
-    } else if ("-1" === data.code) {
-      router.push("/login")
+    } else if ('-1' === data.code) {
+      router.push('/login')
       // return Promise.reject(data.message)
     } else {
       return Promise.reject(data)
     }
   } else {
-    console.log(data, "router1")
-    if ("-1" === data.code) {
-      console.log(router, "router")
-      router.push("/login")
+    console.log(data, 'router1')
+    if ('-1' === data.code) {
+      console.log(router, 'router')
+      router.push('/login')
       // return
       return Promise.reject(data.message)
     }
-    return Promise.reject("账号未登录或没有权限")
+    return Promise.reject('账号未登录或没有权限')
   }
 }
 
@@ -84,14 +84,14 @@ const handleError = (type) => (error) => {
 
 const request = axios.create({
   // 通用前缀
-  baseURL: "/mp",
+  baseURL: '/mp',
   // 允许 cookie
   withCredentials: true,
   // 全部都是 post 请求
-  method: "post",
+  method: 'post',
 })
 
-request.interceptors.request.use(requestInterceptor, handleError("REQUEST"))
-request.interceptors.response.use(responseInterceptor, handleError("RESPONSE"))
+request.interceptors.request.use(requestInterceptor, handleError('REQUEST'))
+request.interceptors.response.use(responseInterceptor, handleError('RESPONSE'))
 
 export default request

src/view/secondhand/components/secondhandcard/index.vue

@@ -24,132 +24,7 @@
         <p class="card-right-2">录入人：{{ data.recordName }}</p>
         <p class="card-right-2">维护人：{{ data.belongName }}</p>
         <div class="card-right-end">
-          <van-tag
-            v-show="datas.metroNear == '1'"
-            class="card-right-end-tag labelItem0"
-            type="primary"
-            >铁</van-tag
-          >
-          <van-tag
-            v-show="datas.schoolNear == '1'"
-            class="card-right-end-tag labelItem1"
-            type="primary"
-            >学</van-tag
-          >
-          <van-tag
-            v-show="datas.keyStatus == '0'"
-            class="card-right-end-tag labelItem2"
-            type="primary"
-            >钥</van-tag
-          >
-          <van-tag
-            v-show="datas.rescStatus == '0'"
-            class="card-right-end-tag labelItem0"
-            type="primary"
-            >勘</van-tag
-          >
-          <van-tag
-            v-show="datas.authStatus == '0'"
-            class="card-right-end-tag labelItem1"
-            type="primary"
-            >委</van-tag
-          >
-          <van-tag
-            v-show="datas.buildTime == '4'"
-            class="card-right-end-tag labelItem2"
-            type="primary"
-            >满五减一</van-tag
-          >
-          <van-tag
-            v-show="datas.buildTime == '3'"
-            class="card-right-end-tag labelItem2"
-            type="primary"
-            >满五</van-tag
-          >
-          <van-tag
-            v-show="datas.buildTime == '2'"
-            class="card-right-end-tag labelItem2"
-            type="primary"
-            >满二</van-tag
-          >
-          <van-tag
-            v-show="datas.status == '7'"
-            class="card-right-end-tag labelItem2"
-            type="primary"
-            >锁</van-tag
-          >
-          <van-tag
-            v-show="datas.souFangHouseId != null && datas.souFangHouseId != ''"
-            class="card-right-end-tag labelItem0"
-            type="primary"
-            >关</van-tag
-          >
-          <van-tag
-            v-show="data.status == '7'"
-            class="card-right-end-tag"
-            type="primary"
-          >
-            <img
-              src="~@/assets/favicon.png"
-              style="height: 16px"
-              alt=""
-              srcset=""
-            />
-          </van-tag>
-          <van-tag
-            v-show="
-              datas.fiveEightHouseId != null && datas.fiveEightHouseId != ''
-            "
-            class="card-right-end-tag"
-            type="primary"
-          >
-            <img src="~@/assets/58.png" style="height: 16px" alt="" srcset="" />
-          </van-tag>
-          <van-tag
-            v-show="
-              datas.threeSixFiveHouseId != null &&
-              datas.threeSixFiveHouseId != ''
-            "
-            class="card-right-end-tag"
-            type="primary"
-          >
-            <img
-              src="~@/assets/365.png"
-              style="height: 16px"
-              alt=""
-              srcset=""
-            />
-          </van-tag>
-          <van-tag
-            v-show="datas.toutiaoHouseId != null && datas.toutiaoHouseId != ''"
-            class="card-right-end-tag"
-            type="primary"
-          >
-            <img
-              src="~@/assets/toutiao.png"
-              style="height: 16px"
-              alt=""
-              srcset=""
-            />
-          </van-tag>
-          <van-tag
-            v-show="datas.protectionFlag == '1'"
-            class="card-right-end-tag labelItem0"
-            type="primary"
-            >保</van-tag
-          >
-          <van-tag
-            v-show="datas.collectFlag == '1'"
-            class="card-right-end-tag"
-            type="primary"
-          >
-            <img
-              src="~@/assets/collect.png"
-              style="height: 16px"
-              alt=""
-              srcset=""
-            />
-          </van-tag>
+          <RoomTag :room-info="datas" />
         </div>
 
         <div class="card-right-price">
@@ -162,15 +37,16 @@
 </template>
 
 <script>
-import { computed } from "vue"
-import { cell, Image as VanImage, Tag } from "vant"
+import { computed } from 'vue'
+import { cell, Image as VanImage } from 'vant'
+import RoomTag from '@/components/RoomTag'
 
 export default {
-  name: "secondhandcard",
+  name: 'secondhandcard',
   components: {
     [cell.name]: cell,
     [VanImage.name]: VanImage,
-    [Tag.name]: Tag,
+    RoomTag,
   },
   props: {
     datas: {
@@ -182,9 +58,9 @@ export default {
   setup(props) {
     const data = computed(() => ({
       title: props.datas.estateName, //标题
-      roomType: props.datas.roomType.split(","), //户型
+      roomType: props.datas.roomType.split(','), //户型
       acreage: Number(props.datas.acreage || 0).toFixed(2), //面积
-      roomFloor: props.datas.roomFloor.split(","), //楼层
+      roomFloor: props.datas.roomFloor.split(','), //楼层
       aspect: props.datas.aspect, //方向
       recordTime: props.datas.recordTime, //录入时间
       recordName: props.datas.recordName, //录入人
@@ -196,7 +72,7 @@ export default {
       ).toFixed(2),
       imgUrl:
         props.datas.imgUrl ||
-        "https://img.yzcdn.cn/vant/empty-image-default.png",
+        'https://img.yzcdn.cn/vant/empty-image-default.png',
     }))
 
     return {

src/view/secondhand/index.vue

@@ -37,16 +37,16 @@
 
 <script>
 // import Vue from 'vue';
-import { useModel } from "@zjxpcyc/vue-tiny-store"
-import { DropdownMenu, DropdownItem, List, Popup, Progress } from "vant"
-import secondhandscreen from "./components/secondhandscreen"
-import secondhandmorescreen from "./components/secondhandmorescreen"
-import secondhandcard from "./components/secondhandcard"
-import { computed, onMounted, ref } from "vue"
-import { router } from "../../router"
+import { useModel } from '@zjxpcyc/vue-tiny-store'
+import { DropdownMenu, DropdownItem, List, Popup, Progress, Toast } from 'vant'
+import secondhandscreen from './components/secondhandscreen'
+import secondhandmorescreen from './components/secondhandmorescreen'
+import secondhandcard from './components/secondhandcard'
+import { computed, onMounted, ref } from 'vue'
+import { router } from '../../router'
 
 export default {
-  name: "secondhand",
+  name: 'secondhand',
   components: {
     [DropdownMenu.name]: DropdownMenu,
     [DropdownItem.name]: DropdownItem,
@@ -63,12 +63,14 @@ export default {
 
   setup() {
     const moreShow = ref(false)
-    const { list, loading, page, getList } = useModel("room")
+    const { list, loading, page, getList } = useModel('room')
     const searchParams = ref({})
 
-    const finished = computed(() => page.pageNo && page.pageNo === page.endRow)
+    const finished = computed(() => {
+      return page.currentPage ? page.currentPage >= page.totalPages : true
+    })
     const percent = computed(() =>
-      page.pageNo ? (page.pageNo * 100) / page.endRow : 100
+      page.currentPage ? (page.currentPage * 100) / page.totalPages : 100
     )
 
     const onShowMore = () => {
@@ -76,12 +78,27 @@ export default {
     }
 
     const onLoad = () => {
-      getList({
+      return getList({
         pageNo: page.pageNo + 1,
         ...searchParams.value,
       })
     }
 
+    onMounted(() => {
+      const loadInst = Toast.loading({
+        message: '请稍候...',
+        forbidClick: true,
+        overlay: true,
+        duration: 0,
+      })
+
+      onLoad()
+        .then(() => {
+          loadInst.clear()
+        })
+        .catch(() => loadInst.clear())
+    })
+
     const toDetail = (item) => {
       router.push(`/secondhand/detail?roomId=${item.id}`)
     }

src/view/user/Header.vue

@@ -0,0 +1,55 @@
+<template>
+  <div>
+    <van-cell>
+      <template #title>
+        <van-image
+          width="64"
+          height="64"
+          :src="user.headImg || 'https://img.yzcdn.cn/vant/cat.jpeg'"
+        />
+      </template>
+      <template #default>
+        <div class="page-mine-body">
+          <div class="user-name">{{ user.userName }}</div>
+          <div>{{ user.departmentName }}</div>
+          <div>工号: {{ user.employeeNum }}</div>
+        </div>
+      </template>
+    </van-cell>
+  </div>
+</template>
+
+<script>
+import { Cell, Image } from 'vant'
+
+export default {
+  components: {
+    [Cell.name]: Cell,
+    [Image.name]: Image,
+  },
+  props: {
+    user: {
+      type: Object,
+      default: () => ({}),
+    },
+  },
+}
+</script>
+
+<style lang="less" scoped>
+.page-mine-body {
+  text-align: left;
+  padding: 0 1.5em;
+  line-height: 1.6em;
+
+  .user-name {
+    font-size: 1.2em;
+    font-weight: 500;
+    color: #000;
+  }
+}
+
+:deep(.van-cell__title) {
+  flex: none;
+}
+</style>

src/view/user/index.vue

@@ -1,15 +1,46 @@
 <template>
-  <div class="user">123123</div>
+  <div class="page-mine">
+    <van-cell-group title=" ">
+      <x-loading x-id="user.info">
+        <Header :user="user" />
+      </x-loading>
+    </van-cell-group>
+    <van-cell-group title=" ">
+      <van-empty description="客官请稍候, 新功能马上就来 ~" />
+    </van-cell-group>
+  </div>
 </template>
 
 <script>
-// import Vue from 'vue';
+import { ref } from 'vue'
+import { CellGroup, Empty } from 'vant'
+import request from '@/utils/request'
+import Header from './Header'
 
 export default {
-  name: "user",
-  components: {},
+  components: {
+    [CellGroup.name]: CellGroup,
+    [Empty.name]: Empty,
+    Header,
+  },
+  setup() {
+    const user = ref()
+    request({
+      url: '/user/current',
+      loadingId: 'user.info',
+    }).then((res) => {
+      user.value = res
+    })
+
+    return {
+      user,
+    }
+  },
 }
 </script>
 
-<!-- Add "scoped" attribute to limit CSS to this component only -->
-<style scoped></style>
+<style lang="less" scoped>
+.page-mine {
+  letter-spacing: 1px;
+}
+</style>