场所消防搜索功能更新

src/views/placeManage/placeFirefighting/placeFirefightingInfo.vue

@@ -103,7 +103,7 @@
           />
           <van-popup v-model:show="hs_typeOfEmployees" round position="bottom">
             <van-picker
-              title="任职情况"
+              title="设备类型"
               :columns="$dictUtils.getDictList('hs_site_fire_type')"
               :columns-field-names="{
                 text: 'label',

src/views/placeManage/placeFirefighting/placeFirefightingList.vue

@@ -14,17 +14,58 @@
   </van-nav-bar>
 
   <div class="main">
-    <van-search
-      v-model="active"
-      show-action
-      shape="round"
-      label="设备类型"
-      placeholder="请输入完整设备类型名称："
-    >
-      <template #action>
-        <div @click="onClickSearch">搜索</div>
-      </template>
-    </van-search>
+    <div class="search">
+      <van-search
+        v-model="active"
+        show-action
+        label="场所名称："
+        placeholder="请输入场所关键字"
+      >
+      </van-search>
+      <div class="typebox">
+        <div class="type-left">
+          <van-cell-group>
+            <van-field
+              v-model="typeOfEmployeesName"
+              label-width="7.2em"
+              readonly
+              border="false"
+              label="设备类型"
+              placeholder="请选择设备类型"
+              input-align="right"
+              right-icon="arrow-down"
+              @click="hs_typeOfEmployees = true"
+            />
+            <van-popup
+              v-model:show="hs_typeOfEmployees"
+              round
+              position="bottom"
+            >
+              <van-picker
+                title="设备类型"
+                :columns="$dictUtils.getDictList('hs_site_fire_type')"
+                :columns-field-names="{
+                  text: 'label',
+                  value: 'value',
+                }"
+                @cancel="hs_typeOfEmployees = false"
+                @confirm="gettypeOfEmployees"
+              />
+            </van-popup>
+          </van-cell-group>
+        </div>
+        <div class="type-right">
+          <van-button
+            plain
+            hairline
+            @click="onClickSearch"
+            type="primary"
+            style="width:100%"
+            >搜索</van-button
+          >
+        </div>
+      </div>
+    </div>
     <van-list
       v-model:loading="loading"
       :finished="finished"
@@ -69,7 +110,7 @@
 </template>
 
 <script>
-import { onMounted, ref } from "vue";
+import { ref } from "vue";
 import { useRouter } from "vue-router";
 import placeFirefighting from "@/api/placeFirefighting/placeFirefighting";
 export default {
@@ -88,7 +129,7 @@ export default {
       nextMaintenanceDate: "",
       position: "",
     });
-    const active = ref('');
+    const active = ref("");
     // 导航栏颜色
     const selectColor = ref(window.localStorage.getItem("MZ_COLOR"));
     //返回取消按钮
@@ -122,6 +163,17 @@ export default {
           index++;
         });
     };
+    // 设备类型
+    const typeOfEmployeesName = ref("");
+    let hs_typeOfEmployees = ref(false);
+    const gettypeOfEmployees = ({ selectedOptions }) => {
+      hs_typeOfEmployees.value = false;
+      const json = Object.assign(inputForm.value, {
+        equipmentType: selectedOptions[0].value,
+      });
+      inputForm.value = json;
+      typeOfEmployeesName.value = selectedOptions[0].label;
+    };
     // 进入消防设备添加页面
     let router = useRouter();
     const onClickright = () => {
@@ -135,30 +187,16 @@ export default {
         query: { id: data },
       });
     };
-    const onClickSearch = ()=>{
-      if(active.value ==''){
+    const onClickSearch = () => {
+      if (active.value == "") {
         list.value = [];
-        inputForm.value.equipmentType = '';
-        onLoad()
-      }else{
+        onLoad();
+      } else {
         list.value = [];
-        let type = {
-          '灭火器':0,
-          '消防栓':1,
-          '自动喷淋':2,
-          '消防排烟口':3,
-          '消防通道':4,
-          '安全出口标示牌':5,
-          '防火卷帘门':6,
-          '烟感器':7,
-          '温感器':8,
-          '报警钟':9,
-          '应急灯':10,
-        }
-        inputForm.value.equipmentType = type[active.value];
-        onLoad()
+        inputForm.value.siteName = active.value;
+        onLoad();
       }
-    }
+    };
     return {
       active,
       selectColor,
@@ -174,6 +212,10 @@ export default {
       //进入详情页
       placeFirefightingInfo,
       onClickSearch,
+      //设备类型
+      typeOfEmployeesName,
+      hs_typeOfEmployees,
+      gettypeOfEmployees,
     };
   },
 };
@@ -187,6 +229,22 @@ html {
   background-color: #f2f2f2;
 }
 .main {
+  .search {
+    border-bottom: 1px solid #f5f5f5;
+    overflow: hidden;
+    .typebox {
+      width: 100%;
+      .type-left {
+        width: 70%;
+        float: left;
+      }
+      .type-right {
+        width: 30%;
+        float: left;
+
+      }
+    }
+  }
   .list-item {
     background-color: #fff;
     padding-left: 10px;

src/views/placeManage/placeFirefighting/placeFirefightingView.vue

@@ -97,7 +97,7 @@
         />
         <van-popup v-model:show="hs_typeOfEmployees" round position="bottom">
           <van-picker
-            title="任职情况"
+            title="设备类型"
             :columns="$dictUtils.getDictList('hs_site_fire_type')"
             :columns-field-names="{
               text: 'label',