场所消防搜索功能修改

src/views/placeManage/placeFirefighting/placeFirefightingList.vue

@@ -15,56 +15,54 @@
 
   <div class="main">
     <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
+      <van-row>
+        <van-col span="12" align="center">
+          <div class="typebox">
+            <div class="type-left">
+              <van-cell-group>
+                <van-field
+                  v-model="typeOfEmployeesName"
+                  readonly
+                  border="false"
+                  label="设备类型"
+                  clearable
+                  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>
+        </van-col>
+        <van-col span="12" align="center">
+          <van-search
+            v-model="active"
+            show-action
+            placeholder="请输入场所名称关键字"
           >
-        </div>
-      </div>
+            <template #action>
+              <div @click="onClickSearch">搜索</div>
+            </template>
+          </van-search>
+        </van-col>
+      </van-row>
     </div>
     <van-list
       v-model:loading="loading"
@@ -99,14 +97,14 @@
           </div>
         </div>
         <template #right>
-            <van-button
-              square
-              text="删除"
-              type="danger"
-              @click="del(item.id)"
-              class="delete-button"
-            />
-          </template>
+          <van-button
+            square
+            text="删除"
+            type="danger"
+            @click="del(item.id)"
+            class="delete-button"
+          />
+        </template>
       </van-swipe-cell>
     </van-list>
   </div>
@@ -215,6 +213,7 @@ export default {
     const onClickSearch = () => {
       if (active.value == "") {
         list.value = [];
+        inputForm.value.siteName = '';
         onLoad();
       } else {
         list.value = [];
@@ -261,13 +260,7 @@ html {
     .typebox {
       width: 100%;
       .type-left {
-        width: 70%;
-        float: left;
-      }
-      .type-right {
-        width: 30%;
-        float: left;
-
+        width: 100%;
       }
     }
   }