去除警告

package-lock.json

@@ -22,8 +22,8 @@
         "vue": "^3.5.13",
         "vue-router": "^4.5.0",
         "vuedraggable": "4.1.0",
-        "vxe-pc-ui": "^4.8.20",
-        "vxe-table": "^4.15.9"
+        "vxe-pc-ui": "~4.8.20",
+        "vxe-table": "~4.15.9"
       },
       "devDependencies": {
         "@vitejs/plugin-vue": "^5.2.1",

src/views/areabuildmanage/onefloor/index.vue

@@ -33,9 +33,9 @@ import { message } from 'ant-design-vue';
 // import Operation from 'ant-design-vue/es/transfer/operation';
 // 定义一个名为searchShowData的ref变量，它是一个数组，数组中的每个元素都是一个对象，对象中包含了label、placeholder、type、content和options等属性
 const searchShowData = ref([
-  { label: '用户姓名', placeholder: "请输入", type: 'input',content:'' ,isShow: false },
-  { label: '用户状态', placeholder: "请选择", type: 'select',content:'' ,isShow: false, options: [{label:'启用', value:'启用'}, {label:'禁用', value:'禁用'}] },
-  { label: '用户角色', placeholder: "请选择", type: 'select', content:'' ,isShow: false,options: [{label:'管理员', value:'管理员'}, {label:'巡查员', value:'巡查员'}]},
+  { label: '用户姓名', placeholder: "请输入", type: 'input', content: '', isShow: false },
+  { label: '用户状态', placeholder: "请选择", type: 'select', content: '', isShow: false, options: [{ label: '启用', value: '启用' }, { label: '禁用', value: '禁用' }] },
+  { label: '用户角色', placeholder: "请选择", type: 'select', content: '', isShow: false, options: [{ label: '管理员', value: '管理员' }, { label: '巡查员', value: '巡查员' }] },
 ])
 // 响应式布局配置
 const layoutConfig = reactive({
@@ -76,7 +76,7 @@ const editData = (data) => {
   // 设置要编辑的数据
   rowData.value = data
 
-  console.log("000000-------1-----0000000000",data)
+  console.log("000000-------1-----0000000000", data)
 }
 
 /**
@@ -85,7 +85,7 @@ const editData = (data) => {
  * 显示确认对话框，用户确认后执行删除操作
  */
 const deleteData = (data) => {
-  console.log("000000---2---------0000000000",data)
+  console.log("000000---2---------0000000000", data)
   ElMessageBox.confirm(
     '删除操作不可逆，是否继续?',
     '删除',
@@ -97,9 +97,9 @@ const deleteData = (data) => {
     }
   )
     .then(() => {
-          console.log("000000---1-456464564------0000000000","我是确认")
+      console.log("000000---1-456464564------0000000000", "我是确认")
       try {
-            const res = staffRemoveInfoApi({id:data.id}); 
+        const res = staffRemoveInfoApi({ id: data.id });
         if (res.code === 200) {
           ElMessage({ type: 'success', message: '已删除' });
           tableDataRefresh();
@@ -143,50 +143,50 @@ const isResetPasswordDialogVisible = ref(false); // 控制重置密码弹窗的
 
 const resetPasswordData = ref({});
 const resetData = (data) => {
-  console.log("000000-----3-------0000000000",data)
+  console.log("000000-----3-------0000000000", data)
   isResetPasswordDialogVisible.value = true;
   resetPasswordData.value = data;
 }
 
 const showuserinfodata = ref({})
 const userData = (data) => {
-  console.log("000000------4------0000000000",data)
+  console.log("000000------4------0000000000", data)
   isUserInfoDialogVisible.value = true
   showuserinfodata.value = data
 }
 const tableShowData = ref([{
-  tableHeader:[
-  {label: '姓名', prop: 'name'},
-  {label: '电话', prop: 'phone'},
-  {label: '是否可用', prop: 'status'},
-  {label: '用户权限', prop: 'role'},
-  {label: '创建时间', prop: 'createTime'},
-  {label: '更新时间', prop: 'updateTime'},
-  {label: '操作', prop: 'Operation'}
-],
-  tableBody:[
+  tableHeader: [
+    { label: '姓名', prop: 'name' },
+    { label: '电话', prop: 'phone' },
+    { label: '是否可用', prop: 'status' },
+    { label: '用户权限', prop: 'role' },
+    { label: '创建时间', prop: 'createTime' },
+    { label: '更新时间', prop: 'updateTime' },
+    { label: '操作', prop: 'Operation' }
+  ],
+  tableBody: [
 
   ]
 }
 ])
 
-const Operation = ref( [ { label: '编辑', type: 'primary', icon: 'EditPen', click: editData },
-              { label: '删除', type: 'danger', icon: 'Delete', click: deleteData },
-              { label: '用户信息', type: 'primary', icon: 'EditPen', click: userData },
-              { label: '重置密码', type: 'primary', icon: 'EditPen', click: resetData }]
+const Operation = ref([{ label: '编辑', type: 'primary', icon: 'EditPen', click: editData },
+{ label: '删除', type: 'danger', icon: 'Delete', click: deleteData },
+{ label: '用户信息', type: 'primary', icon: 'EditPen', click: userData },
+{ label: '重置密码', type: 'primary', icon: 'EditPen', click: resetData }]
 
-            )
+)
 const initTableData = () => {
   staffGetPageInfoApi({
     "currentPageNum": 1,
     "currentPageSize": 10,
 
   }).then(res => {
-      if(res.code === 200){
+    if (res.code === 200) {
       let tempData = res.data.list
       tableShowData.value[0].tableBody = []
       //获取未逻辑删除的数据
-        console.log(res.data,"--------999999999----")
+      console.log(res.data, "--------999999999----")
       tempData = tempData.filter(element => {
         return element.isDeleted === 0;
       });
@@ -287,9 +287,11 @@ const containerStyle = computed(() => ({
   padding: 10px;
 
 }
-.title{
+
+.title {
   width: 70%;
 }
+
 .card-actions {
   display: flex;
   flex: 1;
@@ -301,10 +303,12 @@ const containerStyle = computed(() => ({
   padding: 1.5rem;
 
 }
+
 .operation-button {
   width: 15%;
 
 }
+
 .card-tabs-footer {
   display: flex;
 
@@ -322,28 +326,34 @@ const containerStyle = computed(() => ({
   align-items: center;
 
 }
+
 /* 文本样式 */
 .page-text {
   color: #606266;
   font-size: 14px;
-  white-space: nowrap; /* 防止文本换行 */
+  white-space: nowrap;
+  /* 防止文本换行 */
 }
+
 /* 修复 Element Plus 分页组件默认的块级布局问题 */
-:deep .el-pagination {
+:deep(.el-pagination) {
   display: flex;
   align-items: center;
-  margin: 0; /* 清除默认外边距 */
+  margin: 0;
+  /* 清除默认外边距 */
 }
-.pagination-block{
+
+.pagination-block {
 
   height: 8%;
 }
-.card-table{
+
+.card-table {
   width: 100%;
 
   /* display: flex; */
   /* background-color: #000000; */
-  flex:1;
+  flex: 1;
   overflow: hidden;
   border-radius: 8PX;
 }

src/views/areafiremanage/historyfire/components/floordetail.vue

@@ -8,7 +8,7 @@
           <!-- 区域信息概览 -->
           <div class="info-card region-overview">
             <div class="card-tabs">
-                <span class="title" >历史火情详情</span>
+              <span class="title">历史火情详情</span>
             </div>
             <div class="first-card-content">
               <img src="https://picsum.photos/300/200" alt="">
@@ -19,27 +19,25 @@
         <!-- 左侧下部分：统计区域 -->
         <div class="info-card stats-alerts">
           <div class="card-tabs">
-            <span class="title" >火情汇报列表</span>
+            <span class="title">火情汇报列表</span>
             <div class="card-actions">
               <!-- <el-button type="danger" plain>Danger</el-button> -->
-               <el-button class="operation-button" type="danger" plain @click="fireInfoDataDeleteFn" >撤销归档</el-button>
-              <el-button class="operation-button" type="danger" plain @click="fireInfoDataDeleteFn" >删除</el-button>
-              <el-button class="operation-button" type="primary"  @click="addFireInfoDataImportFn" >新增</el-button>
+              <el-button class="operation-button" type="danger" plain @click="fireInfoDataDeleteFn">撤销归档</el-button>
+              <el-button class="operation-button" type="danger" plain @click="fireInfoDataDeleteFn">删除</el-button>
+              <el-button class="operation-button" type="primary" @click="addFireInfoDataImportFn">新增</el-button>
             </div>
           </div>
           <div class="card-table">
             <!-- 表格 -->
-             <Tableshowdetail :tableShowData="tableShowData" @fireInfoDataImportBackcallFn="fireInfoDataImportBackcallFn"></Tableshowdetail>
+            <Tableshowdetail :tableShowData="tableShowData"
+              @fireInfoDataImportBackcallFn="fireInfoDataImportBackcallFn"></Tableshowdetail>
           </div>
 
         </div>
       </div>
     </main>
     <!-- 新增添加框 -->
-    <el-drawer
-      v-model="addFireInfoDataImportFndrawer"
-      :with-header="false" 
-    >
+    <el-drawer v-model="addFireInfoDataImportFndrawer" :with-header="false">
       <addFireInfo></addFireInfo>
     </el-drawer>
   </div>
@@ -65,19 +63,19 @@ const fireInfoDataImportBackcallFn = (info) => {
 }
 
 const fireInfoDataDeleteFn = () => {
-  if ( fireInfoDataImport ===undefined ||fireInfoDataImport.value===null || fireInfoDataImport.value.length<=0 ) {
+  if (fireInfoDataImport === undefined || fireInfoDataImport.value === null || fireInfoDataImport.value.length <= 0) {
     ElMessage.warning("没有勾选数据")
-  }else { 
-    console.log("删除数据",fireInfoDataImport.value)
+  } else {
+    console.log("删除数据", fireInfoDataImport.value)
     fireInfoDataImport.value = null
   }
 
 }
 const fireInfoDataImportFn = () => {
-  if ( fireInfoDataImport ===undefined ||fireInfoDataImport.value===null || fireInfoDataImport.value.length<=0 ) {
+  if (fireInfoDataImport === undefined || fireInfoDataImport.value === null || fireInfoDataImport.value.length <= 0) {
     ElMessage.warning("没有勾选数据")
-  }else { 
-    console.log("导入数据",fireInfoDataImport.value)
+  } else {
+    console.log("导入数据", fireInfoDataImport.value)
     fireInfoDataImport.value = null
   }
 
@@ -86,9 +84,9 @@ const fireInfoDataImportFn = () => {
 // import Operation from 'ant-design-vue/es/transfer/operation';
 // 定义一个名为searchShowData的ref变量，它是一个数组，数组中的每个元素都是一个对象，对象中包含了label、placeholder、type、content和options等属性
 const searchShowData = ref([
-  { label: '用户姓名', placeholder: "请输入", type: 'input',content:'' ,isShow: true},
-  { label: '用户状态', placeholder: "请选择", type: 'select',content:'' ,isShow: true, options: [{label:'启用', value:'启用'}, {label:'禁用', value:'禁用'}] },
-  { label: '用户角色', placeholder: "请选择", type: 'select', content:'' ,isShow: true,options: [{label:'管理员', value:'管理员'}, {label:'巡查员', value:'巡查员'}]},
+  { label: '用户姓名', placeholder: "请输入", type: 'input', content: '', isShow: true },
+  { label: '用户状态', placeholder: "请选择", type: 'select', content: '', isShow: true, options: [{ label: '启用', value: '启用' }, { label: '禁用', value: '禁用' }] },
+  { label: '用户角色', placeholder: "请选择", type: 'select', content: '', isShow: true, options: [{ label: '管理员', value: '管理员' }, { label: '巡查员', value: '巡查员' }] },
 ])
 // 响应式布局配置
 const layoutConfig = reactive({
@@ -132,7 +130,7 @@ const editData = (data) => {
   // 设置要编辑的数据
   rowData.value = data
 
-  console.log("000000-------1-----0000000000",data)
+  console.log("000000-------1-----0000000000", data)
 }
 
 /**
@@ -141,7 +139,7 @@ const editData = (data) => {
  * 显示确认对话框，用户确认后执行删除操作
  */
 const deleteData = (data) => {
-  console.log("000000---2---------0000000000",data)
+  console.log("000000---2---------0000000000", data)
   ElMessageBox.confirm(
     '删除操作不可逆，是否继续?',
     '删除',
@@ -153,9 +151,9 @@ const deleteData = (data) => {
     }
   )
     .then(() => {
-          console.log("000000---1-456464564------0000000000","我是确认")
+      console.log("000000---1-456464564------0000000000", "我是确认")
       try {
-            const res = staffRemoveInfoApi({id:data.id}); 
+        const res = staffRemoveInfoApi({ id: data.id });
         if (res.code === 200) {
           ElMessage({ type: 'success', message: '已删除' });
           tableDataRefresh();
@@ -201,48 +199,48 @@ const closeResetPasswordDialogFn = () => {
 }
 const resetPasswordData = ref({});
 const resetData = (data) => {
-  console.log("000000-----3-------0000000000",data)
+  console.log("000000-----3-------0000000000", data)
   isResetPasswordDialogVisible.value = true;
   resetPasswordData.value = data;
 }
 
 const showuserinfodata = ref({})
 const userData = (data) => {
-  console.log("000000------4------0000000000",data)
+  console.log("000000------4------0000000000", data)
   isUserInfoDialogVisible.value = true
   showuserinfodata.value = data
 }
-const tableShowData =[ {
+const tableShowData = [{
   id: 1,
-    fireNo:12,
-    updataTime:'2016-05-04',
+  fireNo: 12,
+  updataTime: '2016-05-04',
   name: 'Aleyna Kutzner',
   floorcount: 'Lohrbergstr. 86c, Süd Lilli, Saarland',
-    reporter:"张三",
+  reporter: "张三",
   discription: 'Lorem ipsum dolor sit ametisl nisl nisl nisl nisl nisl nisl nisl nis',
   fireLevel: '1级',
   firePoint: '厨房',
 
-  },
-  {
+},
+{
   id: 1,
-    fireNo:12,
-    updataTime:'2016-05-04',
+  fireNo: 12,
+  updataTime: '2016-05-04',
   name: 'Aleyna Kutzner',
   floorcount: 'Lohrbergstr. 86c, Süd Lilli, Saarland',
-    reporter:"张三",
+  reporter: "张三",
   discription: 'Lorem ipsum dolor sit ametisl nisl nisl nisl nisl nisl nisl nisl nis',
   fireLevel: '1级',
   firePoint: '厨房',
 
-  }]
+}]
 
-const Operation = ref( [ { label: '编辑', type: 'primary', icon: 'EditPen', click: editData },
-              { label: '删除', type: 'danger', icon: 'Delete', click: deleteData },
-              { label: '用户信息', type: 'primary', icon: 'EditPen', click: userData },
-              { label: '重置密码', type: 'primary', icon: 'EditPen', click: resetData }]
+const Operation = ref([{ label: '编辑', type: 'primary', icon: 'EditPen', click: editData },
+{ label: '删除', type: 'danger', icon: 'Delete', click: deleteData },
+{ label: '用户信息', type: 'primary', icon: 'EditPen', click: userData },
+{ label: '重置密码', type: 'primary', icon: 'EditPen', click: resetData }]
 
-            )
+)
 const initTableData = () => {
   // staffGetPageInfoApi({
   //   "currentPageNum": 1,
@@ -354,16 +352,19 @@ const containerStyle = computed(() => ({
   padding: 1rem;
 
 }
-.first-card-content{
+
+.first-card-content {
 
   width: 100%;
   height: 100%;
-  padding-top: 1rem ;
+  padding-top: 1rem;
 }
-.title{
+
+.title {
   /* width: 100%; */
   /* background-color: #000000; */
 }
+
 .card-actions {
   display: flex;
   /* flex: 1; */
@@ -375,11 +376,13 @@ const containerStyle = computed(() => ({
   padding: 1.5rem;
 
 }
+
 .operation-button {
   /* width: 15%; */
   width: 100%;
 
 }
+
 .card-tabs-footer {
   display: flex;
 
@@ -397,23 +400,29 @@ const containerStyle = computed(() => ({
   align-items: center;
 
 }
+
 /* 文本样式 */
 .page-text {
   color: #606266;
   font-size: 14px;
-  white-space: nowrap; /* 防止文本换行 */
+  white-space: nowrap;
+  /* 防止文本换行 */
 }
+
 /* 修复 Element Plus 分页组件默认的块级布局问题 */
-:deep .el-pagination {
+:deep(.el-pagination) {
   display: flex;
   align-items: center;
-  margin: 0; /* 清除默认外边距 */
+  margin: 0;
+  /* 清除默认外边距 */
 }
-.pagination-block{
+
+.pagination-block {
 
   height: 8%;
 }
-.card-table{
+
+.card-table {
   width: 100%;
 
   /* display: flex; */

src/views/commentcomponents/searchtop/index.vue

@@ -2,46 +2,21 @@
   <div class="fire-search-container">
     <div class="search-row">
       <!-- 火情描述输入框 -->
-      <div class="search-item" v-for="(items, index) in searchShowData" :key="index" >
-        <label class="search-label">{{items.label}}</label>
-        <el-input v-if="items.type === 'input'"
-          v-model="items.content" 
-          clearable
-          :disabled="!isShow"
-          :placeholder="items.placeholder"
-        />
-        <el-select v-else-if="items.type === 'select'"
-          v-model="items.content" 
-          :placeholder="items.placeholder"
-          clearable
-        >
-          <el-option 
-            v-for="building in items.options" 
-            :key="building.value" 
-            :label="building.label" 
-            :value="building.value"
-          />
+      <div class="search-item" v-for="(items, index) in searchShowData" :key="index">
+        <label class="search-label">{{ items.label }}</label>
+        <el-input v-if="items.type === 'input'" v-model="items.content" clearable :disabled="!isShow"
+          :placeholder="items.placeholder" />
+        <el-select v-else-if="items.type === 'select'" v-model="items.content" :placeholder="items.placeholder"
+          clearable>
+          <el-option v-for="building in items.options" :key="building.value" :label="building.label"
+            :value="building.value" />
         </el-select>
-         <el-autocomplete v-else-if="items.type === 'autocomplete'"
-          v-model="items.content"
-          :fetch-suggestions="querySearch"
-          :trigger-on-focus="false"
-          clearable
-          class="inline-input w-50"
-          placeholder="请输入"
-          @input="getAllListInfoFn(items)"
-        
-        />
-        <el-date-picker v-else
-          v-model="items.content"
-          type="daterange"
-          start-placeholder="开始日期"
-          end-placeholder="结束日期"
-          :default-value="defaultDateRange"
-          @change="getAllListInfoFn"
-           :disabled-date="disableFutureDates"
-           style="max-width: 220px;"
-        />
+        <el-autocomplete v-else-if="items.type === 'autocomplete'" v-model="items.content"
+          :fetch-suggestions="querySearch" :trigger-on-focus="false" clearable class="inline-input w-50"
+          placeholder="请输入" @input="getAllListInfoFn(items)" />
+        <el-date-picker v-else v-model="items.content" type="daterange" start-placeholder="开始日期" end-placeholder="结束日期"
+          :default-value="defaultDateRange" @change="getAllListInfoFn" :disabled-date="disableFutureDates"
+          style="max-width: 220px;" />
 
       </div>
     </div>
@@ -49,18 +24,10 @@
       <!-- 操作按钮组 -->
 
       <div class="search-buttons">
-        <el-button 
-          type="default" 
-          style="width: 45%;"
-          @click="resetSearchForm"
-        >
+        <el-button type="default" style="width: 45%;" @click="resetSearchForm">
           重置
         </el-button>
-        <el-button 
-          type="primary" 
-          style="width: 45%;"
-          @click="submitSearch"
-        >
+        <el-button type="primary" style="width: 45%;" @click="submitSearch">
           查询
         </el-button>
       </div>
@@ -71,17 +38,17 @@
 <script setup>
 import { computed, reactive, ref, watch } from 'vue';
 import { ElInput, ElSelect, ElOption, ElButton, ElMessage, dayjs } from 'element-plus';
-import { buildingGetBuildCodeListApi,buildingGetBuildListByBuildNameApi,buildingGetTotalFloorNumListApi,buildingGetBuildNameListApi } from '../../../api/build'
+import { buildingGetBuildCodeListApi, buildingGetBuildListByBuildNameApi, buildingGetTotalFloorNumListApi, buildingGetBuildNameListApi } from '../../../api/build'
 import { floorGetFloorNoListAPI } from '../../../api/floor'
 import useAppStore from '../../../store/module/app';
 const useAppStoreInstance = useAppStore()
 const props = defineProps(["searchShowData"])
 
 const isShow = computed(() => {
-  console.log("按钮操作显示标识",props.searchShowData)
+  console.log("按钮操作显示标识", props.searchShowData)
   if (props.searchShowData.length > 0) {
     return props.searchShowData[0].isShow
-  }else{
+  } else {
     ElMessage.error('按钮操作显示标识错误')
   }
 
@@ -156,27 +123,27 @@ const getAllListInfoFn = (item) => {
 }
 const buildingGetBuildListByBuildNameFn = (item) => {
   // console.log(item,'buildingGetBuildCodeListFn被触发')
-  buildingGetBuildListByBuildNameApi({buildName:item.content}).then(res => { 
+  buildingGetBuildListByBuildNameApi({ buildName: item.content }).then(res => {
     // console.log(res,'buildingGetBuildCodeListFn返回数据')
-    if(res.code == 200) {
+    if (res.code == 200) {
       restaurants.value = res.data
       // console.log(restaurants.value,'buildingGetBuildCodeListFn8999999999999返回数据')
     }
   })
 };
 
-const buildCodeTraverse = (item)=>{ 
+const buildCodeTraverse = (item) => {
   let buildCodeList = []
   item.forEach(item => {
     // console.log(item,'buildCodeTraverse被触发')
-    buildCodeList.push({value:item})
+    buildCodeList.push({ value: item })
   })
   return buildCodeList
 }
 const buildingGetBuildCodeListApiFn = (item) => {
-  buildingGetBuildCodeListApi({buildCode:item.content}).then(res => { 
+  buildingGetBuildCodeListApi({ buildCode: item.content }).then(res => {
     // console.log(res,'buildingGetBuildCodeListFn返回数据')
-    if(res.code == 200) {
+    if (res.code == 200) {
       restaurants.value = buildCodeTraverse(res.data)
       // console.log(restaurants.value,'buildingGetBuildCodeListFn8999999999999返回数据')
     }
@@ -184,19 +151,19 @@ const buildingGetBuildCodeListApiFn = (item) => {
 };
 // 返回的数据不对应当[楼层数]不是【建筑名称】
 const buildingGetTotalFloorNumListFn = (item) => {
-  buildingGetTotalFloorNumListApi({totalFloorNum:item.content}).then(res => { 
-    console.log(res,'buildingGetTotalFloorNumListFn返回数据')
-    if(res.code == 200) {
+  buildingGetTotalFloorNumListApi({ totalFloorNum: item.content }).then(res => {
+    console.log(res, 'buildingGetTotalFloorNumListFn返回数据')
+    if (res.code == 200) {
       restaurants.value = buildCodeTraverse(res.data)
-      console.log(restaurants.value,'buildingGetTotalFloorNumListFn8999999999999返回数据')
+      console.log(restaurants.value, 'buildingGetTotalFloorNumListFn8999999999999返回数据')
     }
   })
 }
 
 const buildingGetBuildNameListFn = (item) => {
-  buildingGetBuildNameListApi({buildName:item.content}).then(res => { 
+  buildingGetBuildNameListApi({ buildName: item.content }).then(res => {
     // console.log(res,'buildingGetBuildNameListFn返回数据')
-    if(res.code == 200) {
+    if (res.code == 200) {
       restaurants.value = buildCodeTraverse(res.data)
       // console.log(restaurants.value,'buildingGetBuildNameListFn8999999999999返回数据')
     }
@@ -204,9 +171,9 @@ const buildingGetBuildNameListFn = (item) => {
 }
 
 const floorGetFloorNoListFn = (item) => {
-  floorGetFloorNoListAPI({buildId: useAppStoreInstance.PUSHPARAMETER.buildId,floorNo:item.content}).then(res => { 
+  floorGetFloorNoListAPI({ buildId: useAppStoreInstance.PUSHPARAMETER.buildId, floorNo: item.content }).then(res => {
     // console.log(res,'floorGetFloorNoListFn返回数据')
-    if(res.code == 200) {
+    if (res.code == 200) {
       restaurants.value = buildCodeTraverse(res.data)
       // console.log(restaurants.value,'floorGetFloorNoListFn8999999999999返回数据')
     }
@@ -277,8 +244,8 @@ const resetSearchForm = () => {
 }
 
 /* 使用深度选择器覆盖Element Plus默认样式 */
-:deep .el-input__wrapper,
-:deep .el-select__wrapper {
+:deep(.el-input__wrapper),
+:deep(.el-select__wrapper) {
   border-radius: 4px;
 }
 
@@ -291,9 +258,10 @@ const resetSearchForm = () => {
   justify-content: space-between;
 
 }
+
 .operation-buttons {
-width: 20%;
-padding-left: 5%;
+  width: 20%;
+  padding-left: 5%;
 
 
 }

src/views/uavshowdate/uavmanage/index.vue

@@ -7,20 +7,24 @@
         <div class="left-top">
           <!-- 区域信息概览 -->
           <div class="info-card region-overview">
-              <searchtop :searchShowData="searchShowData" ></searchtop>
+            <searchtop :searchShowData="searchShowData"></searchtop>
           </div>
         </div>
 
         <!-- 左侧下部分：统计区域 -->
         <div class="info-card stats-alerts">
           <div class="card-tabs">
-            <span class="title" >用户列表</span>
+            <span class="title">用户列表</span>
             <div class="card-actions">
               <el-button class="operation-button" type="primary" size="small" style="width: 15%;">导入</el-button>
               <el-button class="operation-button" type="primary" size="small">导出</el-button>
               <el-button class="operation-button" type="primary" size="small" @click="handleAddInfoFn">新增</el-button>
-              <el-button class="operation-button" type="primary" size="small" @click="tableDataRefresh"><el-icon><RefreshRight /></el-icon></el-button>
-              <el-button class="operation-button" type="primary" size="small"><el-icon><FullScreen /></el-icon></el-button>
+              <el-button class="operation-button" type="primary" size="small" @click="tableDataRefresh"><el-icon>
+                  <RefreshRight />
+                </el-icon></el-button>
+              <el-button class="operation-button" type="primary" size="small"><el-icon>
+                  <FullScreen />
+                </el-icon></el-button>
 
             </div>
           </div>
@@ -48,9 +52,9 @@ import { message } from 'ant-design-vue';
 // import Operation from 'ant-design-vue/es/transfer/operation';
 // 定义一个名为searchShowData的ref变量，它是一个数组，数组中的每个元素都是一个对象，对象中包含了label、placeholder、type、content和options等属性
 const searchShowData = ref([
-  { label: '用户姓名', placeholder: "请输入", type: 'input',content:'',isShow: true },
-  { label: '用户状态', placeholder: "请选择", type: 'select',content:'' ,isShow: true, options: [{label:'启用', value:'启用'}, {label:'禁用', value:'禁用'}] },
-  { label: '用户角色', placeholder: "请选择", type: 'select', content:'',isShow: true ,options: [{label:'管理员', value:'管理员'}, {label:'巡查员', value:'巡查员'}]},
+  { label: '用户姓名', placeholder: "请输入", type: 'input', content: '', isShow: true },
+  { label: '用户状态', placeholder: "请选择", type: 'select', content: '', isShow: true, options: [{ label: '启用', value: '启用' }, { label: '禁用', value: '禁用' }] },
+  { label: '用户角色', placeholder: "请选择", type: 'select', content: '', isShow: true, options: [{ label: '管理员', value: '管理员' }, { label: '巡查员', value: '巡查员' }] },
 ])
 // 响应式布局配置
 const layoutConfig = reactive({
@@ -67,7 +71,7 @@ const isUserInfoDialogVisible = ref(false); // 控制用户信息弹窗的显示
  * 控制添加抽屉的显示状态
  * @type {Ref<boolean>} - 响应式布尔值，用于控制添加抽屉的显示
  */
-const isAddDrawer= ref(false)
+const isAddDrawer = ref(false)
 const closeAddDrawer = () => {
   console.log("000000-------3-----0000000000")
   // 关闭添加抽屉
@@ -106,7 +110,7 @@ const editData = (data) => {
   // 设置要编辑的数据
   rowData.value = data
 
-  console.log("000000-------1-----0000000000",data)
+  console.log("000000-------1-----0000000000", data)
 }
 /**
  * 关闭编辑抽屉的方法
@@ -124,7 +128,7 @@ const closeEditDrawer = () => {
  * 显示确认对话框，用户确认后执行删除操作
  */
 const deleteData = (data) => {
-  console.log("000000---2---------0000000000",data)
+  console.log("000000---2---------0000000000", data)
   ElMessageBox.confirm(
     '删除操作不可逆，是否继续?',
     '删除',
@@ -136,9 +140,9 @@ const deleteData = (data) => {
     }
   )
     .then(() => {
-          console.log("000000---1-456464564------0000000000","我是确认")
+      console.log("000000---1-456464564------0000000000", "我是确认")
       try {
-            const res = staffRemoveInfoApi({id:data.id}); 
+        const res = staffRemoveInfoApi({ id: data.id });
         if (res.code === 200) {
           ElMessage({ type: 'success', message: '已删除' });
           tableDataRefresh();
@@ -184,20 +188,20 @@ const closeResetPasswordDialogFn = () => {
 }
 const resetPasswordData = ref({});
 const resetData = (data) => {
-  console.log("000000-----3-------0000000000",data)
+  console.log("000000-----3-------0000000000", data)
   isResetPasswordDialogVisible.value = true;
   resetPasswordData.value = data;
 }
 
 const showuserinfodata = ref({})
 const userData = (data) => {
-  console.log("000000------4------0000000000",data)
+  console.log("000000------4------0000000000", data)
   isUserInfoDialogVisible.value = true
   showuserinfodata.value = data
 }
 
 const uavseedetails = (data) => {
-  console.log(data,'---------5---------')
+  console.log(data, '---------5---------')
   // router.push({
   //   path: '/dialog_infoShow_img_vid/uavseedetails',
   //   query: { data: JSON.stringify(data) },
@@ -205,23 +209,23 @@ const uavseedetails = (data) => {
 }
 
 const tableShowData = ref([{
-  tableHeader:[
-  {label: '序号', prop: 'id'},
-  {label: '无人机编号', prop: 'uavid'},
-  {label: '无人机机型', prop: 'uavtype'},
-  {label: '无人机状态', prop: 'uavstate'},
-  {label: '无人机载弹数量', prop: 'uavpayloadcapacity'},
-  {label: '上次维护时间', prop: 'premaintenancetime'},
-  {label: '弹药信息', prop: 'ammunitioninfo'},
-  {label: '操作', prop: 'Operation'}
-],
-  tableBody:[
-    {id: 1, uavid: 'UAV-0001', uavtype: 'UAV-M100', uavstate: '正常', uavpayloadcapacity: '10', premaintenancetime: '2023-05-01', ammunitioninfo: '弹药数量：1000',Operation:[ { label: '查看详情', type: 'primary', icon: 'EditPen', click: uavseedetails }]}
+  tableHeader: [
+    { label: '序号', prop: 'id' },
+    { label: '无人机编号', prop: 'uavid' },
+    { label: '无人机机型', prop: 'uavtype' },
+    { label: '无人机状态', prop: 'uavstate' },
+    { label: '无人机载弹数量', prop: 'uavpayloadcapacity' },
+    { label: '上次维护时间', prop: 'premaintenancetime' },
+    { label: '弹药信息', prop: 'ammunitioninfo' },
+    { label: '操作', prop: 'Operation' }
+  ],
+  tableBody: [
+    { id: 1, uavid: 'UAV-0001', uavtype: 'UAV-M100', uavstate: '正常', uavpayloadcapacity: '10', premaintenancetime: '2023-05-01', ammunitioninfo: '弹药数量：1000', Operation: [{ label: '查看详情', type: 'primary', icon: 'EditPen', click: uavseedetails }] }
   ]
 }
 ])
 
-const Operation = ref( [ { label: '查看详情', type: 'primary', icon: 'EditPen', click: uavseedetails }])
+const Operation = ref([{ label: '查看详情', type: 'primary', icon: 'EditPen', click: uavseedetails }])
 const initTableData = () => {
   // 这里要使用无人机列表接口
   // staffGetPageInfoApi({
@@ -332,9 +336,11 @@ const containerStyle = computed(() => ({
   padding: 10px;
 
 }
-.title{
+
+.title {
   width: 70%;
 }
+
 .card-actions {
   display: flex;
   flex: 1;
@@ -346,10 +352,12 @@ const containerStyle = computed(() => ({
   padding: 1.5rem;
 
 }
+
 .operation-button {
   width: 15%;
 
 }
+
 .card-tabs-footer {
   display: flex;
 
@@ -367,28 +375,34 @@ const containerStyle = computed(() => ({
   align-items: center;
 
 }
+
 /* 文本样式 */
 .page-text {
   color: #606266;
   font-size: 14px;
-  white-space: nowrap; /* 防止文本换行 */
+  white-space: nowrap;
+  /* 防止文本换行 */
 }
+
 /* 修复 Element Plus 分页组件默认的块级布局问题 */
-:deep .el-pagination {
+:deep(.el-pagination) {
   display: flex;
   align-items: center;
-  margin: 0; /* 清除默认外边距 */
+  margin: 0;
+  /* 清除默认外边距 */
 }
-.pagination-block{
+
+.pagination-block {
 
   height: 8%;
 }
-.card-table{
+
+.card-table {
   width: 100%;
 
   /* display: flex; */
   /* background-color: #000000; */
-  flex:1;
+  flex: 1;
   overflow: hidden;
   border-radius: 8PX;
 }

vite.config.js

@@ -25,7 +25,7 @@ export default defineConfig({
     open: true,//自动在默认浏览器上打开
     proxy: {
       '/api': {
-        target: 'http://117.89.29.251:18083/api',  //test----------------------尾部214,2,31,12,11都可以,登不上时换个试试
+        target: 'http://117.89.29.251:18083/api',  //
         // target: 'http://172.16.34.76:18088',
         ws: false,//代理websocked
         changeOrigin: true,  //是否跨域