feats

src/router.js

@@ -77,7 +77,23 @@ const routes = [
             title: '关闭房源'
         }
     },
-
+    {
+        path: '/followup',
+        name: 'followup',
+        component: () => import('./view/followup'),
+        meta: {
+            title: '跟进房源'
+        }
+    },
+    {
+        path: '/lookRecord',
+        name: 'lookRecord',
+        component: () => import('./view/lookRecord'),
+        meta: {
+            title: '添加空看'
+        }
+    },
+    
     {
         path: '/secondhand/edit',
         name: 'secondhand.edit',

src/store/index.js

@@ -4,6 +4,7 @@ import shiro from './models/shiro'
 import dicts from './models/dicts'
 import user from './models/user'
 import room from './models/room'
+import renting from './models/renting'
 
 const store = createStore({
   loading,
@@ -11,6 +12,7 @@ const store = createStore({
   dicts,
   user,
   room,
+  renting,
 })
 
 export default store

src/store/models/dicts.js

@@ -109,6 +109,21 @@ const lockRoom = [
   },
 ]
 
+//租房类型
+const leaseWay = [
+  {
+    text: '整租',
+    value: '0',
+  },
+  {
+    text: '合租',
+    value: '1',
+  },
+]
+
+
+
+
 
 export default () => {
   const dicts = reactive({
@@ -119,6 +134,7 @@ export default () => {
     elevator,
     lookTimes,
     lockRoom,
+    leaseWay,
   })
 
   const getDict = key => {

src/view/followup/index.vue

@@ -0,0 +1,114 @@
+<template>
+  <div class="closehouse">
+    <van-form @submit="onSubmit">
+      <van-field
+        v-model="state.id"
+        name="id"
+        label="房源编号"
+        readonly
+        placeholder="房源编号"
+      />
+      <van-field
+        v-model="state.building"
+        name="building"
+        label="所属楼盘"
+        readonly
+        placeholder="所属楼盘"
+       
+      />
+      <van-field
+        v-model="pickerState.value"
+        readonly
+        clickable
+        required
+        name="address"
+        label="跟进类型"
+        placeholder="跟进类型"
+        @click="pickerState.showPicker = true"
+        :rules="[{ required: true, message: '请选择跟进类型' }]"
+      />
+      <van-popup v-model:show="pickerState.showPicker" position="bottom">
+        <van-picker
+          :columns="columns"
+          @confirm="onConfirm"
+          @cancel="pickerState.showPicker = false"
+        />
+      </van-popup>
+      <!-- <van-field
+        v-model="state.building"
+        required
+        name="type"
+        label="关闭类型"
+        placeholder="请选择"
+        :rules="[{ required: true, message: '请填写密码' }]"
+      /> -->
+      <van-field
+        v-model="state.explain"
+        required
+        name="explain"
+        label="跟进描述"
+        placeholder="跟进描述"
+        rows="3"
+        autosize
+        type="textarea"
+        :rules="[{ required: true, message: '请填写跟进描述' }]"
+      />
+      <div style="margin: 16px;">
+        <van-button round block type="primary" native-type="submit">
+          提交
+        </van-button>
+      </div>
+    </van-form>
+  </div>
+</template>
+
+<script>
+import { reactive } from "vue";
+import { Form, Button, Field, Picker, Popup } from "vant";
+
+export default {
+  name: "closehouse",
+  components: {
+    [Form.name]: Form,
+    [Button.name]: Button,
+    [Field.name]: Field,
+    [Popup.name]: Popup,
+    [Picker.name]: Picker,
+    // Secondhand:secondhand,
+  },
+  data() {
+    return {};
+  },
+  setup() {
+    const state = reactive({
+      id: "",
+      building: "",
+    });
+    const onSubmit = (values) => {
+      console.log("submit", values);
+    };
+
+    const pickerState = reactive({
+      value: "",
+      showPicker: false,
+    });
+    const columns = ["杭州", "宁波", "温州", "嘉兴", "湖州"];
+
+    const onConfirm = (value) => {
+      pickerState.value = value;
+      pickerState.showPicker = false;
+    };
+
+    return {
+      state,
+      pickerState,
+      columns,
+      onConfirm,
+      onSubmit,
+    };
+  },
+};
+</script>
+
+<!-- Add "scoped" attribute to limit CSS to this component only -->
+<style lang="less" scoped></style>

src/view/lookRecord/index.vue

@@ -0,0 +1,127 @@
+<template>
+  <div class="lookrecord">
+    <van-form @submit="onSubmit">
+      <van-field
+        v-model="state.id"
+        name="id"
+        label="房源编号"
+        readonly
+        placeholder="房源编号"
+      />
+      <van-field
+        v-model="state.building"
+        name="building"
+        label="所属楼盘"
+        readonly
+        placeholder="所属楼盘"
+      />
+      <van-field
+        v-model="pickerState.value"
+        readonly
+        clickable
+        required
+        name="address"
+        label="看房时间"
+        placeholder=""
+        @click="pickerState.showPicker = true"
+        :rules="[{ required: true, message: '请选择' }]"
+      />
+      <van-popup v-model:show="pickerState.showPicker" position="bottom">
+        <van-datetime-picker
+          type="datetime"
+          @confirm="onConfirm"
+          @cancel="state.showPicker = false"
+        />
+      </van-popup>
+      <!-- <van-field
+        v-model="state.building"
+        required
+        name="type"
+        label="关闭类型"
+        placeholder="请选择"
+        :rules="[{ required: true, message: '请填写密码' }]"
+      /> -->
+      <van-field
+        v-model="state.explain"
+        required
+        name="explain"
+        label="看房记录"
+        placeholder="看房记录"
+        rows="3"
+        autosize
+        type="textarea"
+        :rules="[{ required: true, message: '请填写跟进描述' }]"
+      />
+
+      <van-field name="uploader" label="文件上传">
+  <template #input>
+    <van-uploader v-model="state.image" />
+  </template>
+</van-field>
+      <div style="margin: 16px;">
+        <van-button round block type="primary" native-type="submit">
+          提交
+        </van-button>
+      </div>
+    </van-form>
+  </div>
+</template>
+
+<script>
+import { reactive, ref } from "vue";
+import { Form, Button, Field, Picker, Popup, DatetimePicker,Uploader } from "vant";
+
+export default {
+  name: "lookrecord",
+  components: {
+    [Form.name]: Form,
+    [Button.name]: Button,
+    [Field.name]: Field,
+    [Popup.name]: Popup,
+    [Picker.name]: Picker,
+    [DatetimePicker.name]: DatetimePicker,
+    [Uploader.name]: Uploader,
+    
+    // Secondhand:secondhand,
+  },
+  data() {
+    return {};
+  },
+  setup() {
+    const state = reactive({
+      id: "",
+      building: "",
+      image:[],
+    });
+
+    const currentDate = ref(null);
+    const onSubmit = (values) => {
+      console.log("submit", values);
+    };
+
+    const pickerState = reactive({
+      value: "",
+      showPicker: false,
+    });
+    const columns = ["杭州", "宁波", "温州", "嘉兴", "湖州"];
+
+    const onConfirm = (value) => {
+      console.log(value,'value')
+      pickerState.value = value;
+      pickerState.showPicker = false;
+    };
+
+    return {
+      currentDate,
+      state,
+      pickerState,
+      columns,
+      onConfirm,
+      onSubmit,
+    };
+  },
+};
+</script>
+
+<!-- Add "scoped" attribute to limit CSS to this component only -->
+<style lang="less" scoped></style>

src/view/renting/components/rentingcard/index.vue

@@ -1,32 +1,159 @@
 <template>
   <div class="secondhandcard">
-    <div class="card" >
+    <div class="card">
       <div class="card-left">
         <van-image
           width="120"
           height="96"
-          src="https://img.yzcdn.cn/vant/cat.jpeg"
+          :src="data.imgUrl || 'https://img.yzcdn.cn/vant/empty-image-default.png'"
         />
       </div>
       <div class="card-right">
         <p class="card-right-1">
-          <span style="font-size:16px;color:#101010;font-weight:500"
-            >楼盘名称</span
-          ><span style="font-size:12px;color:#AEAEAE;">在租</span>
+          <span style="font-size:16px;color:#101010;font-weight:500">{{
+            data.title
+          }}</span
+          ><span style="font-size:12px;color:#AEAEAE;min-width: 25px;">{{
+            data.rentingStatus
+          }}</span>
         </p>
-        <p class="card-right-2">三室一厅 107.1㎡ 6/6层 南北</p>
-        <p class="card-right-2">录入时间：</p>
-        <p class="card-right-2">录入人</p>
-        <!-- <p class="card-right-2">维护人</p> -->
-        <div class="card-right-end" style="margin-top:6px">
-          <van-tag class="card-right-end-tag" type="primary">标签</van-tag>
-          <van-tag class="card-right-end-tag" type="primary">标签</van-tag>
-          <van-tag class="card-right-end-tag" type="primary">标签</van-tag>
+        <p class="card-right-2">
+          {{ (data.roomType || [])[0] || 0 }}室{{
+            data.roomType[1] || [] || 0
+          }}厅 {{ data.acreage || 0 }}㎡ {{ data.roomFloor[0] || [] || 0 }}/{{
+            data.roomFloor[0] || [] || 0
+          }}层 {{ data.aspect }}
+        </p>
+        <p class="card-right-2">录入时间：{{ data.recordTime }}</p>
+        <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>
         </div>
 
         <div class="card-right-price">
-          <p>1233万元</p>
-          <p>整租</p>
+          <p>{{ data.totalPrice }}元/月</p>
+          <p>{{ data.leaseWay=='0'?'整租':"合租" }}</p>
         </div>
       </div>
     </div>
@@ -44,23 +171,43 @@ export default {
     [Tag.name]: Tag,
   },
   props: {
-    datas: {},
-  },
-  data() {
-    return {};
+    datas: {
+      type: Object,
+      default: () => {},
+    },
   },
-  mounted() {},
 
-  setup() {
+  setup(props) {
+    
+    const data = {
+      title: props.datas.estateName, //标题
+      roomType: props.datas.roomType.split(","), //户型
+      acreage: Number(props.datas.acreage || 0).toFixed(2), //面积
+      roomFloor: props.datas.roomFloor.split(","), //楼层
+      aspect: props.datas.aspect, //方向
+      recordTime: props.datas.recordTime, //录入时间
+      recordName: props.datas.recordName, //录入人
+      belongName: props.datas.belongName, //维护人
+      rentingStatus: props.datas.rentingStatus, //状态
+      totalPrice: props.datas.totalPrice, //总价
+      unitPrice: Number(
+        (props.datas.totalPrice * 10000) / props.datas.acreage || 0
+      ).toFixed(2),
+      leaseWay:props.datas.leaseWay,
+    };
+
+    // const tag = ()=>{
 
+    // }
 
-   const toDetail = ()=>{
-console.log('222')
-   }
+    const toDetail = () => {
+      console.log("222");
+    };
 
-   return {
-     toDetail,
-   }
+    return {
+      data,
+      toDetail,
+    };
   },
 };
 </script>
@@ -70,7 +217,7 @@ console.log('222')
 .card {
   //   height: 200px;
 
-border-bottom:1px solid #DCDCDC;
+  border-bottom: 1px solid #dcdcdc;
 
   display: flex;
   padding: 10px;
@@ -78,6 +225,7 @@ border-bottom:1px solid #DCDCDC;
   &-left {
     width: 130px;
     padding: 5px;
+    margin: auto;
   }
   &-right {
     flex: 1;
@@ -100,15 +248,30 @@ border-bottom:1px solid #DCDCDC;
         margin-right: 3px;
       }
     }
-    &-price{
-        position: absolute;
-        bottom: 0;
-        right: 0;
-        color: #ff9800;
-        p{
-            margin: 0;
-        }
+    &-price {
+      position: absolute;
+      bottom: 0;
+      right: 0;
+      color: #ff9800;
+      p {
+        margin: 0;
+      }
     }
   }
+
+  .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/view/renting/components/rentingmorescreen/index.vue

@@ -1,7 +1,7 @@
 <template>
   <div class="secondhandmorescreen">
     <van-search
-      v-model="serchValue"
+      v-model="searchValue"
       placeholder="请输入搜索关键词"
       :actions="searchActions"
       @select="onSearchSelect"
@@ -18,48 +18,109 @@
         </van-popover>
       </template>
       <template #left>
-        <van-icon name="revoke" style="margin-right: 20px;" />
+        <van-icon name="revoke" @click="onBack" style="margin-right: 20px;" />
       </template>
     </van-search>
 
     <div>
       <van-form @submit="onSubmit">
         <van-cell-group title="区位">
-          <AreaQuery name="area.b" label=""></AreaQuery>
+        <van-row :gutter="12">
+          <van-col span="12">
+            <van-field label="区县">
+              <template #input>
+                <Picker
+                  placeholder="选择区县"
+                  :options="roomDistrictOptions"
+                  v-model="formData.roomDistrict"
+                />
+              </template>
+            </van-field>
+          </van-col>
+          <van-col span="12">
+            <van-field label="商圈">
+              <template #input>
+                <Picker
+                  placeholder="选择商圈"
+                  :options="roomBussinesOptions"
+                  v-model="formData.roomBussines"
+                />
+              </template>
+            </van-field>
+          </van-col>
+        </van-row>
         </van-cell-group>
         <van-cell-group title="房间要求">
-          <van-field name="number">
+          <van-field label="楼层" ex>
             <template #input>
-              <DemandQuery></DemandQuery>
+              <NumberRange v-model="roomFloors" />
+            </template>
+          </van-field>
+          <van-field label="面积">
+            <template #input>
+              <NumberRange v-model="roomSQ" />
+            </template>
+            <template #extra>㎡</template>
+          </van-field>
+          <van-field label="租金">
+            <template #input>
+              <NumberRange v-model="roomPrices" />
+            </template>
+            <template #extra>元</template>
+          </van-field>
+          <van-field label="户型">
+            <template #input>
+              <Picker
+                placeholder="请选择户型"
+                :options="roomTypeOptions"
+                v-model="formData.roomType"
+              />
+            </template>
+          </van-field>
+          <!-- <van-field label="装修">
+            <template #input>
+              <Picker
+                placeholder="请选择装修类型"
+                :options="decorationOptions"
+                v-model="formData.decoration"
+              />
+            </template>
+          </van-field> -->
+          <van-field label="房源状态">
+            <template #input>
+              <Picker
+                placeholder="请选择房源状态"
+                :options="rentingStatusOptions"
+                v-model="formData.operateType"
+              />
+            </template>
+          </van-field>
+          <van-field label="租房类型">
+            <template #input>
+              <Picker
+                placeholder="请选择实勘状态"
+                :options="leaseWayOptions"
+                v-model="formData.leaseWay"
+              />
             </template>
           </van-field>
-        </van-cell-group>
-        <van-cell-group title="户型">
-          <CheeckButtomQuery
-            v-model="state.housetype"
-            :options="housetypeoptions"
-          ></CheeckButtomQuery>
-        </van-cell-group>
-        <van-cell-group title="装修">
-          <CheeckButtomQuery
-            v-model="state.renovation"
-            :options="housetypeoptions"
-          ></CheeckButtomQuery>
-        </van-cell-group>
-        <van-cell-group title="房源状态">
-          <CheeckButtomQuery
-            v-model="state.housetype"
-            :options="housetypeoptions"
-          ></CheeckButtomQuery>
-        </van-cell-group>
-        <van-cell-group title="实勘状态">
-          <CheeckButtomQuery
-            v-model="state.housetype"
-            :options="housetypeoptions"
-          ></CheeckButtomQuery>
         </van-cell-group>
         <van-cell-group title="房间位置">
-          <PositionQuery></PositionQuery>
+          <van-row :gutter="12">
+            <van-col span="12">
+              <van-field label="楼栋" v-model="formData.roomBuild" placeholder="请输入" />
+            </van-col>
+            <van-col span="12">
+              <van-field label="单元" v-model="formData.roomUnit" placeholder="请输入" />
+            </van-col>
+          </van-row>
+          <van-row :gutter="12">
+            <van-col span="12">
+              <van-field label="房号" v-model="formData.roomFloor" placeholder="请输入" />
+            </van-col>
+            <van-col span="12">
+            </van-col>
+          </van-row>
         </van-cell-group>
 
         <div style="margin-top: 16px;">
@@ -67,7 +128,7 @@
             <van-action-bar-icon
               icon="replay"
               text="重置"
-              @click="onClickIcon"
+              @click="handleReset"
             />
 
             <van-action-bar-button
@@ -76,18 +137,6 @@
               native-type="submit"
             />
           </van-action-bar>
-          <!-- <van-row justify="center">
-            <van-col span="6">
-              <van-button block icon="replay" type="primary"
-                >重置</van-button
-              ></van-col
-            >
-            <van-col span="18">
-              <van-button round block type="primary" native-type="submit"
-                >确定</van-button
-              ></van-col
-            >
-          </van-row> -->
         </div>
       </van-form>
     </div>
@@ -98,7 +147,7 @@
 </template>
 
 <script>
-import { reactive, ref } from "vue";
+import { computed, reactive, ref, watch } from "vue";
 import {
   Col,
   Row,
@@ -116,12 +165,10 @@ import {
   Icon,
   Popover,
 } from "vant";
-import {
-  AreaQuery,
-  DemandQuery,
-  CheeckButtomQuery,
-  PositionQuery,
-} from "../../../../components/queryCompents";
+import { useModel } from '@zjxpcyc/vue-tiny-store'
+
+import Picker from "@/components/Picker";
+import NumberRange from "@/components/NumberRange";
 
 export default {
   name: "secondhandmorescreen",
@@ -141,11 +188,8 @@ export default {
     [ActionBarButton.name]: ActionBarButton,
     [Icon.name]: Icon,
     [Popover.name]: Popover,
-
-    AreaQuery,
-    DemandQuery,
-    CheeckButtomQuery,
-    PositionQuery,
+    Picker,
+    NumberRange,
   },
   props: {
     // options: [],
@@ -153,16 +197,150 @@ export default {
   data() {
     return {};
   },
+  emits:["back", 'search'],
+  setup(props,{emit}) {
+    const formData = reactive({
+      // 楼盘
+      estateName: undefined,
+      // 房源
+      roomCodeId: undefined,
+      // 业主电话
+      ownerTel: undefined,
+      // 区县
+      roomDistrict: undefined,
+      // 商圈
+      roomBussines: undefined,
+      // 楼层1
+      floorMin: undefined,
+      // 楼层2
+      floorMax: undefined,
+      // 面积1
+      sqMin: undefined,
+      // 面积2
+      sqMax: undefined,
+      // 总价1 -- 注意单词拼写
+      pirceMin: undefined,
+      // 总价2 -- 注意单词拼写
+      priceMax: undefined,
+      // 户型
+      roomType: undefined,
+      // 装修
+      // decoration: undefined,
+      // 房源状态
+      operateType: undefined,
+      // 租房类型
+      leaseWay:undefined,
+      // 实勘状态
+      // rescStatus: undefined,
+      // 楼栋
+      roomBuild: undefined,
+      // 单元
+      roomUnit: undefined,
+      // 房号
+      roomFloor: undefined,
+    })
+
+    const { dicts, getBusinessCity, getDict } = useModel('dicts')
+    // 区县
+    const roomDistrictOptions = computed(() => {
+      const roomDistrictDict = dicts.roomDistrict
+      if (!roomDistrictDict) {
+        getBusinessCity(1)
+      }
+      return (roomDistrictDict || []).map(x => ({...x, text: x.label}))
+    })
+    // 商圈 - 依据区县联动
+    const roomBussinesOptions = computed(() => {
+      if (!formData.roomDistrict) {
+        return []
+      }
+
+      const roomBussinesDict = dicts.roomBussines
+      return (roomBussinesDict || []).map(x => ({...x, text: x.label}))
+    })
+    
+    watch(
+      () => formData.roomDistrict,
+      (nw) => {
+        dicts.roomBussines = []
+        formData.roomBussines = undefined
+        getBusinessCity(2, nw)
+      }
+    )
+
+    // 楼层
+    const roomFloors = computed({
+      get: () => [formData.floorMin, formData.floorMax],
+      set: (nw) => {
+        formData.floorMin = nw[0]
+        formData.floorMax = nw[1]
+      }
+    })
+
+    // 面积
+    const roomSQ = computed({
+      get: () => [formData.sqMin, formData.sqMax],
+      set: (nw) => {
+        formData.sqMin = nw[0]
+        formData.sqMax = nw[1]
+      }
+    })
+
+    // 总价
+    const roomPrices = computed({
+      get: () => [formData.pirceMin, formData.priceMax],
+      set: (nw) => {
+        formData.pirceMin = nw[0]
+        formData.priceMax = nw[1]
+      }
+    })
+
+    // 户型
+    const roomTypeOptions = computed(() => {
+      return dicts.roomType
+    })
+
+// 租房类型
+    const leaseWayOptions = computed(() => {
+      return dicts.leaseWay
+    })
+
+    
+
+    // 装修
+    const decorationOptions = computed(() => {
+      const decorationDict = dicts.decoration || []
+      if (!decorationDict.length) {
+        getDict('decoration')
+      }
 
-  setup() {
+      return decorationDict
+    })
+
+    // 房源状态
+    const rentingStatusOptions = computed(() => {
+      const rentingStatusDict = dicts.rentingStatus || []
+      if (!rentingStatusDict.length) {
+        getDict('rentingStatus')
+      }
+
+      return rentingStatusDict
+    })
+
+    // 实勘状态
+    const rescStatusOptions = computed(() => {
+      return dicts.rescStatus
+    })
+    
     const state = reactive({
       housetype: [],
       renovation: [],
     });
-    const serchValue = ref("");
+
+    const searchValue = ref("");
     const searchType = ref("楼盘");
     const showPopover = ref(false);
-     const phoneShow = ref(false);
+    const phoneShow = ref(false);
 
     // 通过 actions 属性来定义菜单选项
     const searchActions = [
@@ -170,55 +348,64 @@ export default {
       { text: "房源", value: "2" },
       { text: "业主电话", value: "3" },
     ];
-    const onSearchSelect = (action) => {
-      console.log("housetypeChange", action);
 
+    const onSearchSelect = (action) => {
       searchType.value = action.text;
+      searchValue.value = undefined
+      formData.estateName = undefined
+      formData.roomCodeId = undefined
+      formData.ownerTel = undefined
     };
 
-    const onHousetypeChange = (values) => {
-      console.log("housetypeChange", values);
+    watch(searchValue, (nw) => {
+      switch(searchType.value) {
+        case '楼盘':
+          formData.estateName = nw
+          break
+        case '房源':
+          formData.roomCodeId = nw
+          break
+        default:
+          formData.ownerTel = nw
+      }
+    })
 
-      state.housetype = values;
-    };
-    const onSubmit = (values) => {
-      console.log(state, "submit", values);
+    const onSubmit = () => {
+      emit('search', formData)
     };
 
-    const housetypeoptions = [
-      {
-        title: "1室",
-        value: "a",
-      },
-      {
-        title: "2室",
-        value: "b",
-      },
-      {
-        title: "3室",
-        value: "c",
-      },
-      {
-        title: "3室及以上",
-        value: "d",
-      },
-      {
-        title: "全部",
-        value: "all",
-      },
-    ];
+   const onBack = ()=>{
+     emit("back");
+   }
+
+   const handleReset = () => {
+     Object.keys(formData).forEach(k => {
+       formData[k] = undefined
+     })
+   }
 
     return {
+      formData,
+      roomDistrictOptions,
+      roomBussinesOptions,
+      roomFloors,
+      roomSQ,
+      roomPrices,
+      roomTypeOptions,
+      decorationOptions,
+      rentingStatusOptions,
+      rescStatusOptions,
+      leaseWayOptions,
       phoneShow,
-      serchValue,
+      searchValue,
       searchType,
       state,
       onSubmit,
-      housetypeoptions,
-      onHousetypeChange,
       showPopover,
       searchActions,
       onSearchSelect,
+      onBack,
+      handleReset,
     };
   },
 };
@@ -230,4 +417,8 @@ export default {
   text-align: left;
   background-color: #f4f4f4;
 }
+
+:deep(.van-field__label) {
+  width: 4.8em;
+}
 </style>

src/view/renting/components/rentingscreen.vue

@@ -7,8 +7,9 @@
             v-for="item in options"
             :key="item.id"
             :title="item.title"
-            v-model="item.value"
+            v-model="state[item.value]"
             :options="item.option"
+            @change="(e) => onChange(e)"
           />
         </van-dropdown-menu>
       </van-col>
@@ -20,18 +21,15 @@
           @click="onMore"
       /></van-col>
     </van-row>
-
-    
   </div>
 </template>
 
 <script>
-
-
+import { computed, onMounted, reactive } from "vue";
 import { DropdownMenu, DropdownItem, row, col, cell } from "vant";
-
+import { useModel } from "@zjxpcyc/vue-tiny-store";
 export default {
-  name: "secondhandscreen",
+  name: "rentingscreen",
   components: {
     [cell.name]: cell,
     // [popup.name]: popup,
@@ -41,7 +39,7 @@ export default {
     [DropdownItem.name]: DropdownItem,
   },
   props: {
-    options: [],
+    // options: [],
   },
   data() {
     return {
@@ -91,21 +89,75 @@ export default {
   },
   mounted() {},
 
-  setup(props,cex) {
+  setup(props, cex) {
+    const { dicts, getDict, getBusinessCity } = useModel("dicts");
+    console.log(dicts.roomType, getDict, getBusinessCity);
+
+    // const roomDistrict = dicts.roomDistrict;
+    const state = reactive({
+      districtCode: null,
+      price: null,
+      roomType: null,
+      pirceMin: null,
+      priceMax: null,
+    });
+    onMounted(() => {
+      if (!dicts.roomDistrict) {
+        getBusinessCity(1);
+      }
+    });
 
-    const onMore=()=>{
-      console.log(props,cex,'3332')
-      cex.emit('onShowMore',333)
-      
-    }
+    const options = computed(() => [
+      {
+        id: 0,
+        value: "districtCode",
+        title: "区域",
+        option: (dicts.roomDistrict || []).map((x) => {
+          return {
+            text: x.label,
+            ...x,
+          };
+        }),
+      },
+      {
+        id: 2,
+        value: "price",
+        title: "价格",
+        option: [
+          { text: "0-1000", value: "0-1000" },
+          { text: "1001-2000", value: "1001-2000" },
+          { text: "2001-3000", value: "2001-3000" },
+          { text: "3001-4000", value: "3001-4000" },
+          { text: "4000以上", value: "4000" },
+        ],
+      },
+      {
+        id: 3,
+        value: "roomType",
+        title: "户型",
+        option: dicts.roomType,
+      },
+    ]);
 
+    const onMore = () => {
+      console.log(props, cex, "3332");
+      cex.emit("onShowMore", 333);
+    };
 
+    const onChange = (e) => {
+      console.log(state, e, "3ss332333");
+      if (state.price) {
+        const price = state.price.split("-");
+        state.pirceMin = Number(price[0]);
+        state.priceMax = Number(price[1]);
+      }
+      cex.emit("onChange", state);
+    };
     return {
-    
       onMore,
-      // options,
-      // onConfirm,
-      props
+      options,
+      onChange,
+      state,
     };
   },
 };

src/view/renting/index.vue

@@ -1,19 +1,25 @@
 <template>
   <div class="renting">
-    <RentingScreen :options="options" @onShowMore="onShowMore" />
-    <div >
+    <RentingScreen @onChange="(e) => onSearch(e)" @onShowMore="onShowMore" />
+    <div>
+      <van-progress
+        color="#d75e3a"
+        :show-pivot="false"
+        :stroke-width="1"
+        :percentage="percent"
+      />
       <van-list
         class="renting-main"
-        v-model:loading="state.loading"
-        :finished="state.finished"
+        v-model:loading="loading"
+        :finished="finished"
         finished-text="没有更多了"
         @load="onLoad"
       >
         <RentingCard
-          v-for="item in state.list"
+          v-for="item in list"
           :key="item.id"
-          :datas="item.datas"
-          @click="toDetail()"
+          :datas="item"
+          @click="toDetail(item)"
         ></RentingCard>
       </van-list>
     </div>
@@ -21,19 +27,20 @@
       v-model:show="moreShow"
       position="right"
       :style="{ width: '100%', height: '100%' }"
-    ><RentingMoreScreen />
+      ><RentingMoreScreen @back="moreShow = false" @search="handleMoreSearch" />
     </van-popup>
   </div>
 </template>
 
 <script>
 // import Vue from 'vue';
-import { DropdownMenu, DropdownItem, List, Popup } from "vant";
+import { useModel } from "@zjxpcyc/vue-tiny-store";
+import { DropdownMenu, DropdownItem, List, Popup, Progress } from "vant";
 import rentingscreen from "./components/rentingscreen";
 import rentingmorescreen from "./components/rentingmorescreen";
 import rentingcard from "./components/rentingcard";
-import { reactive, ref } from "vue";
-import {router} from '../../router'
+import { computed, ref } from "vue";
+import { router } from "../../router";
 
 export default {
   name: "renting",
@@ -42,106 +49,73 @@ export default {
     [DropdownItem.name]: DropdownItem,
     [List.name]: List,
     [Popup.name]: Popup,
+    [Progress.name]: Progress,
     RentingScreen: rentingscreen,
     RentingCard: rentingcard,
     RentingMoreScreen: rentingmorescreen,
   },
   data() {
-    return {
-      options: [
-        {
-          id: 0,
-          value: 0,
-          title: "区域",
-          option: [],
-        },
-        {
-          id: 2,
-          value: "a",
-          title: "价格",
-          option: [
-            { text: "0-100", value: "a" },
-            { text: "101-200", value: "b" },
-            { text: "201-300", value: "c" },
-            { text: "301-400", value: "e" },
-            { text: "400以上", value: "f" },
-          ],
-        },
-        {
-          id: 3,
-          value: "a",
-          title: "户型",
-          mode: "multiple",
-          option: [
-            { text: "1室", value: "1" },
-            { text: "2室", value: "2" },
-            { text: "3室", value: "3" },
-            { text: "3室以上", value: "4" },
-          ],
-        },
-        // {
-        //   id: 4,
-        //   value: "a",
-        //   title: "更多",
-        //   mode: "multiple",
-        //   option: [
-        //     { text: "默认排序", value: "a" },
-        //     { text: "好评排序", value: "b" },
-        //     { text: "销量排序", value: "c" },
-        //   ],
-        // },
-      ],
-    };
+    return {};
   },
 
-  setup(props) {
+  setup() {
     const moreShow = ref(false);
 
+    const { list, loading, page, getList } = useModel("renting");
+    const rentParams = ref({});
+
+    const finished = computed(() => page.pageNo && page.pageNo === page.endRow);
+    const percent = computed(() =>
+      page.pageNo ? (page.pageNo * 100) / page.endRow : 100
+    );
+
     const onShowMore = () => {
-      console.log("22");
       moreShow.value = true;
-      console.log(moreShow, "22");
     };
-    const state = reactive({
-      list: [],
-      loading: false,
-      finished: false,
-    });
 
     const onLoad = () => {
-      // 异步更新数据
-      // setTimeout 仅做示例，真实场景中一般为 ajax 请求
-      setTimeout(() => {
-        for (let i = 0; i < 10; i++) {
-          state.list.push({
-            id: state.list.length + 1,
-            datas: {
-              name: "",
-            },
-          });
-        }
+      getList({
+        pageNo: page.pageNo + 1,
+        ...rentParams.value,
+      });
+    };
+
+    const toDetail = (item) => {
+      router.push(`/renting/detail?roomId=${item.id}`);
+    };
 
-        // 加载状态结束
-        state.loading = false;
+    const onSearch = (data) => {
+      rentParams.value = data;
+      list.value = [];
 
-        // 数据全部加载完成
-        if (state.list.length >= 40) {
-          state.finished = true;
-        }
-      }, 1000);
+      getList({
+        pageNo: 1,
+        ...data,
+      });
     };
-const toDetail = () => {
-    console.log(props,router,'333')
-    router.push('/renting/detail')
+
+    const handleMoreSearch = (params) => {
+      moreShow.value = false;
+      rentParams.value = params;
+      list.value = [];
+      getList({
+        pageNo: 1,
+        ...params,
+      });
     };
-    
 
     return {
-      state,
+      list,
+      loading,
+      percent,
+      page,
+      finished,
       onLoad,
       moreShow,
       onShowMore,
       toDetail,
+      onSearch,
+      handleMoreSearch,
     };
   },
 };

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

@@ -91,7 +91,7 @@
               <Picker
                 placeholder="请选择房源状态"
                 :options="roomStatusOptions"
-                v-model="formData.roomStatus"
+                v-model="formData.operateType"
               />
             </template>
           </van-field>
@@ -227,7 +227,7 @@ export default {
       // 装修
       decoration: undefined,
       // 房源状态
-      roomStatus: undefined,
+      operateType: undefined,
       // 实勘状态
       rescStatus: undefined,
       // 楼栋