代码提交

src/components/SelectItem/index.vue

@@ -0,0 +1,114 @@
+<template>
+  <div>
+    <el-popover
+      placement="bottom"
+      :width="200"
+      trigger="click"
+    >
+      <template #reference>
+        <el-input v-model="searchQuery" :placeholder="searchPlaceholder">
+          <template #prefix>
+            <el-icon class="el-input__icon"><search /></el-icon>
+          </template>
+        </el-input>
+      </template>
+      <el-checkbox v-if="!props.isCheckbox"  label="全选" v-model="checked1" @change="all"/>
+      <el-checkbox-group v-model="checkboxList" style="height: 300px;overflow-y: auto;" @change="changeCheckbox">
+        <el-checkbox v-for="item in filteredList" :label="item.as_code+' '+item.as_name" :value="item.as_code" />
+      </el-checkbox-group>
+    </el-popover>
+  </div>
+</template>
+
+<script setup lang="ts">
+import {defineProps, ref, computed, onMounted, watch} from "vue";
+const checkboxList = ref([])
+const searchPlaceholder = ref('请搜索')
+const checked1 = ref(false)
+const props = defineProps<{
+  selectList?: [];
+  selectData?: [];
+  isCheckbox?: boolean
+}>();
+
+const searchQuery = ref("");
+
+watch(() => props.selectData, (newVal) => {
+  checkboxList.value = newVal;
+
+  // 根据选中项更新 searchPlaceholder
+  if (checkboxList.value.length > 0) {
+    searchPlaceholder.value = checkboxList.value.join(', ');
+  } else {
+    searchPlaceholder.value = '请搜索';
+  }
+});
+
+const filteredList = computed(() => {
+  if (!searchQuery.value) {
+    return props.selectList || [];
+  }
+  return (props.selectList || []).filter(item =>
+    item.as_code.includes(searchQuery.value) ||
+    item.as_name.includes(searchQuery.value)
+  );
+});
+
+const all = () => {
+  const allCodes = props.selectList.map(item => item.as_code);
+  if (checkboxList.value.length === allCodes.length) {
+    checkboxList.value = []// 取消全选
+  } else {
+    checkboxList.value = [...allCodes]; // 全选
+  }
+
+  // 根据选中项更新 searchPlaceholder
+  if (checkboxList.value.length > 0) {
+    searchPlaceholder.value = checkboxList.value.join(', ');
+  } else {
+    searchPlaceholder.value = '请搜索';
+  }
+
+  emit("update:selectedItems", checkboxList.value);
+};
+
+const changeCheckbox = (newValue) => {
+  if(props.isCheckbox){
+    if (newValue.length > 1) {
+      checkboxList.value = [newValue[newValue.length - 1]];
+    } else {
+      checkboxList.value = newValue;
+    }
+    // 根据选中项更新 searchPlaceholder
+    if (checkboxList.value.length > 0) {
+      searchPlaceholder.value = checkboxList.value.join(', ');
+    } else {
+      searchPlaceholder.value = '请搜索';
+    }
+  }else {
+    const allCodes = props.selectList.map(item => item.as_code);
+    if (checkboxList.value.length === allCodes.length) {
+      checked1.value = true; // 全选
+    } else {
+      checked1.value = false// 取消全选
+    }
+
+    // 根据选中项更新 searchPlaceholder
+    if (checkboxList.value.length > 0) {
+      searchPlaceholder.value = checkboxList.value.join(', ');
+    } else {
+      searchPlaceholder.value = '请搜索';
+    }
+  }
+
+
+  emit("update:selectedItems", checkboxList.value);
+};
+const emit = defineEmits<{
+  "update:selectedItems": [value: []];
+}>();
+
+</script>
+
+<style scoped>
+</style>

src/stores/interface/index.ts

@@ -30,7 +30,8 @@ export interface GlobalState {
 export interface UserState {
   token: string;
   userInfo: user;
-  asInfo:Array <asInfos>
+  asInfo:Array <asInfos>,
+  stations: Array<any>
 }
 
 export interface user {

src/stores/modules/user.ts

@@ -7,7 +7,8 @@ export const useUserStore = defineStore({
   state: (): UserState => <UserState>({
     token: "",
     userInfo: {},
-    asInfo:[]
+    asInfo:[],
+    stations:[]
   }),
   getters: {},
   actions: {
@@ -22,11 +23,15 @@ export const useUserStore = defineStore({
     setAsInfo(asInfo: UserState["asInfo"]) {
       this.asInfo = asInfo;
     },
+    setStations(stations: UserState["asInfo"]){
+    this.stations = stations;
+    },
     // Clear all data
     clearAllData() {
       this.token = "";
       this.userInfo = {};
       this.asInfo = [];
+      this.stations =[]
     }
   },
   persist: piniaPersistConfig("atmosphere-user1")

src/views/alarm/allData/index.vue

@@ -6,17 +6,7 @@
         <div class="header-button-lf">
           <el-form :model="pageable" label-width="auto" :inline="true">
             <el-form-item label="自动站:">
-              <el-select v-model="pageable.as_code_list"  multiple collapse-tags   filterable placeholder="请搜索自动站" remote reserve-keyword clearable  style="width: 200px">
-                <el-option
-                  v-for="item in platformList"
-                  :key="item.as_code"
-                  :label="item.as_code +' '+item.as_name"
-                  :value="item.as_code"
-                />
-                <template #prefix>
-                  <el-icon class="el-input__icon"><search /></el-icon>
-                </template>
-              </el-select>
+              <SelectItem :select-data="selectedData" :select-list="platformList" :is-checkbox="false" @update:selectedItems="selectedItems" style="width: 200px"> </SelectItem>
             </el-form-item>
             <el-form-item>
               <el-button type="primary" @click="handleQuery"> 查询 </el-button>
@@ -197,11 +187,13 @@
 
 <script setup lang="ts" name="useProTable">
 import Pagination from "@/components/ProTable/components/Pagination.vue";
-import {ref, reactive, onMounted, onDeactivated, onActivated} from "vue";
+import SelectItem from "@/components/SelectItem/index.vue";
+import {ref, reactive, onMounted, onDeactivated, onActivated, computed} from "vue";
 import { ColumnProps } from "@/components/ProTable/interface";
 import {ElTable} from "element-plus";
 import {getDataItemList, getPlatformList, getRgDataList} from "@/api/modules/allData";
 import { Platform} from "@/api/interface";
+import {useUserStore} from "@/stores/modules/user";
 const tableRef = ref<InstanceType<typeof ElTable>>();
 const dialog = reactive<any>({
   visible: false,
@@ -267,8 +259,10 @@ const handleQuery = () => {
 
 //重置功能
 const resetQuery = () => {
+  const allCodes = platformList.value.map(item => item.as_code);
+  pageable.value.as_code_list = allCodes
+  selectedData.value = []
   pageable.value.pageNum = 1;
-  pageable.value.as_code_list = undefined
   pageable.value.time_order =0
   pageable.value.data_order =[]
   pageable.value.pageSize =20
@@ -518,20 +512,20 @@ const updateColumns = () => {
 //操作 自定义部分表头
 const copiedCustomizeColumns = ref<any>([...customizeColumns.value]);
 
-// 查询自动站列表
-const queryas = ref<Platform>({
-  pageSize: 10000,
-  pageNum: 1
-})
-
-const platformList =ref<any>([])
+const userStore = useUserStore();
+const platformList =ref<any>(computed(() => userStore.stations))
 
-const getPlatforms = async () => {
-  const { data } = await getPlatformList(queryas.value);
-  platformList.value = data.list
+//搜索站号
+const selectedData= ref([])
+const selectedItems =(data)=>{
+  if(data.length>0){
+    pageable.value.as_code_list = data
+  }else {
+    const allCodes = platformList.value.map(item => item.as_code);
+    pageable.value.as_code_list = allCodes
+  }
 };
 
-
 // 查询所有人工要素字典表
 const elementList =ref<any>([])
 const getAllRgDataList = async () => {
@@ -540,6 +534,12 @@ const getAllRgDataList = async () => {
 };
 
 const getList = async () => {
+  if(pageable.value.as_code_list===undefined||pageable.value.as_code_list.length===0){
+    // 没有站不给数据
+    processTableData.value = []
+    pageable.value.total=0
+    return;
+  }
   const { data } = await getDataItemList(pageable.value);
   processTableData.value = data.list
   pageable.value.total = data.total
@@ -597,9 +597,11 @@ function formatDate(timestamp) {
 }
 
 onMounted(() => {
+  const allCodes = platformList.value.map(item => item.as_code);
+  pageable.value.as_code_list = allCodes
+
   loadCustomizeColumns()
   updateColumns()
-  getPlatforms()
   getAllRgDataList()
 })
 

src/views/alarm/allWeather/index.vue

@@ -6,17 +6,7 @@
         <div class="header-button-lf">
           <el-form :model="pageable" label-width="auto"  :inline="true">
             <el-form-item label="站号:">
-              <el-select v-model="as_code_list" @change="changeCodeList" collapse-tags  filterable placeholder="请搜索自动站" remote reserve-keyword clearable  style="width: 200px">
-                <el-option
-                  v-for="item in platformList"
-                  :key="item.as_code"
-                  :label="item.as_code +' '+item.as_name"
-                  :value="item.as_code"
-                />
-                <template #prefix>
-                  <el-icon class="el-input__icon"><search /></el-icon>
-                </template>
-              </el-select>
+              <SelectItem :select-data="selectedData" :select-list="platformList" :is-checkbox="true" @update:selectedItems="selectedItems" style="width: 200px"> </SelectItem>
             </el-form-item>
             <el-form-item>
               <el-button type="primary" @click="handleQuery"> 查询 </el-button>
@@ -71,11 +61,13 @@
 
 <script setup lang="ts" name="useProTable">
 import Pagination from "@/components/ProTable/components/Pagination.vue";
-import {ref, reactive, onMounted, onActivated, onDeactivated} from "vue";
+import SelectItem from "@/components/SelectItem/index.vue";
+import {ref, reactive, onMounted, onActivated, onDeactivated, computed} from "vue";
 import { ColumnProps } from "@/components/ProTable/interface";
 import { getPlatformList, getTacRecordList} from "@/api/modules/allData";
 import {Platform} from "@/api/interface";
 import {ElTable} from "element-plus";
+import {useUserStore} from "@/stores/modules/user";
 const pageable = ref<any>({
   as_code_list: [],
   tact_state_on: true,
@@ -86,15 +78,6 @@ const pageable = ref<any>({
 });
 const tableRef = ref<InstanceType<typeof ElTable>>();
 const as_code_list = ref('')
-
-const changeCodeList =(value)=>{
-  if(value){
-    pageable.value.as_code_list = [value]
-  }else {
-    pageable.value.as_code_list= []
-  }
-}
-
 const timeBegin = ref()
 
 
@@ -180,16 +163,31 @@ const handleQuery = () => {
 
 //清空查询
 const resetQuery = () => {
+  const allCodes = platformList.value.map(item => item.as_code);
+  pageable.value.as_code_list = allCodes
+
+  selectedData.value = []
 
   as_code_list.value = '';
   pageable.value.pageNum = 1;
-  pageable.value.as_code_list= []
   pageable.value.pageSize =20
   pageable.value.total = 0
   timeBegin.value = undefined
   getList()
 };
 
+//搜索站号
+const selectedData= ref([])
+const selectedItems =(data)=>{
+  console.log(data)
+  if(data.length>0){
+    pageable.value.as_code_list = data
+  }else {
+    const firstCode = platformList.value[0]?.as_code ?? null;
+    pageable.value.as_code_list = firstCode ? [firstCode] : [];
+  }
+};
+
 /**
  * @description 每页条数改变
  * @param {Number} val 当前条数
@@ -228,6 +226,12 @@ const columns = reactive<ColumnProps[]>([
 
 
 const getList = async () => {
+  if(pageable.value.as_code_list===undefined||pageable.value.as_code_list.length===0){
+    // 没有站不给数据
+    processTableData.value = []
+    pageable.value.total=0
+    return;
+  }
   const { data } = await getTacRecordList(pageable.value);
   processTableData.value = data.list
   pageable.value.total = data.total
@@ -236,7 +240,8 @@ const getList = async () => {
 let intervalId;
 
 onMounted(() => {
-  getPlatforms();
+  const allCodes = platformList.value.map(item => item.as_code);
+  pageable.value.as_code_list = allCodes
   getList();
 
 });
@@ -251,20 +256,8 @@ onDeactivated(() => {
   clearInterval(intervalId);
 });
 
-
-
-const platformList =ref<any>([])
-// 查询自动站列表
-const queryas = ref<Platform>({
-  pageSize: 10000,
-  pageNum: 1
-})
-
-const getPlatforms = async () => {
-  const { data } = await getPlatformList(queryas.value);
-  platformList.value = data.list
-};
-
+const userStore = useUserStore();
+const platformList =ref<any>(computed(() => userStore.stations))
 
 function formatDate(timestamp) {
   const date = new Date(timestamp * 1000); // 将时间戳转换为毫秒

src/views/alarm/singleDevice/index.vue

@@ -10,17 +10,7 @@
       </div>
       <div class="container-main mt15">
         <div class="container-item container__label">站号：
-          <el-select v-model="as_code_list" @change="changeCodeList" collapse-tags  filterable placeholder="请搜索自动站" remote reserve-keyword clearable  style="width: 200px">
-            <el-option
-              v-for="item in platformList"
-              :key="item.as_code"
-              :label="item.as_code"
-              :value="item.as_code"
-            />
-            <template #prefix>
-              <el-icon class="el-input__icon"><search /></el-icon>
-            </template>
-          </el-select>
+          <SelectItem :select-data="selectedData" :select-list="platformList" :is-checkbox="true" @update:selectedItems="selectedItems" style="width: 200px"> </SelectItem>
         </div>
         <div class="container-item container__label">名称：{{selectedItem.as_name?selectedItem.as_name:'--'}}</div>
         <div class="container-item container__label">观测时间：{{processTableFrom.data_time?processTableFrom.data_time:'--'}}</div>
@@ -173,7 +163,6 @@
             </div>
           </div>
         </div>
-
       </div>
       <template #footer>
         <div class="dialog-footer">
@@ -181,13 +170,11 @@
         </div>
       </template>
     </el-dialog>
-
-
-
   </div>
 </template>
 
 <script setup lang="ts">
+import SelectItem from "@/components/SelectItem/index.vue";
 import img0 from "@/assets/images/single/0.png"
 import img100 from "@/assets/images/single/100.png"
 import img200 from "@/assets/images/single/200.png"
@@ -207,9 +194,10 @@ import img1500 from "@/assets/images/single/1500.png"
 import img1600 from "@/assets/images/single/1600.png"
 import img1700 from "@/assets/images/single/1700.png"
 import {getPlatformList, getQuerCertList, getStaitemList, getYallSensorList} from "@/api/modules/allData";
-import {onMounted, reactive, ref} from "vue";
+import {computed, onMounted, reactive, ref} from "vue";
 import {Platform} from "@/api/interface";
 import {ColumnProps} from "@/components/ProTable/interface";
+import {useUserStore} from "@/stores/modules/user";
 const radio1 =ref('1');
 const getCustomImg = (iconName: string) => {
   const icons = {
@@ -507,20 +495,27 @@ const updateColumns = () => {
 const as_code_list = ref('')
 const selectedItem =ref({})
 
-const changeCodeList =(value)=>{
-  if(value){
-    selectedItem.value = platformList.value.find(item => item.as_code === value);
-    pageable.value.as_code_list = [value]
-    querCert.value.asCode = value
-    getList()
-    getCertList()
+
+//搜索站号
+const selectedData= ref([])
+const selectedItems =(data)=>{
+  if(data.length>0){
+    pageable.value.as_code_list = data
+    const firstCode = data[0] ?? null;
+    selectedItem.value = platformList.value.find(item => item.as_code === firstCode);
+    querCert.value.asCode = firstCode
   }else {
-    selectedItem.value= {}
-    pageable.value.as_code_list= []
-    processTableFrom.value = {}
+    const firstCode = platformList.value[0]?.as_code ?? null;
+    pageable.value.as_code_list = firstCode ? [firstCode] : [];
+    selectedItem.value = platformList.value.find(item => item.as_code === firstCode);
+    querCert.value.asCode = firstCode
+    selectedData.value = [firstCode]
   }
-}
 
+  getList()
+  getCertList()
+
+};
 
 const cancel = () => {
   dialog.visible = false;
@@ -552,21 +547,17 @@ function loadCustomizeColumns() {
 }
 
 
-const platformList =ref<any>([])
-// 查询自动站列表
-const queryas = ref<Platform>({
-  pageSize: 10000,
-  pageNum: 1
-})
+const userStore = useUserStore();
+const platformList =ref<any>(computed(() => userStore.stations))
 
 const getPlatforms = async () => {
-  const { data } = await getPlatformList(queryas.value);
-  platformList.value = data.list
   if (platformList.value .length > 0) {
-    selectedItem.value= platformList.value[0]
-    as_code_list.value = platformList.value[0].as_code;
-    pageable.value.as_code_list = [as_code_list.value]
-    querCert.value.asCode = as_code_list.value
+    const firstCode = platformList.value[0]?.as_code ?? null;
+    pageable.value.as_code_list = firstCode ? [firstCode] : [];
+    selectedItem.value = platformList.value.find(item => item.as_code === firstCode);
+    as_code_list.value = firstCode;
+    querCert.value.asCode = firstCode
+    selectedData.value = [firstCode]
     await getList()
     await getCertList()
   }

src/views/login/components/LoginForm.vue

@@ -16,11 +16,11 @@
 </template>
 
 <script setup lang="ts">
-import { ref, reactive, onMounted, onBeforeUnmount } from "vue";
+import {ref, reactive, onMounted, onBeforeUnmount, computed} from "vue";
 import { useRouter } from "vue-router";
 import { HOME_URL } from "@/config";
 // import { getTimeState } from "@/utils";
-import { Login } from "@/api/interface";
+import {Login, Platform} from "@/api/interface";
 import { ElNotification } from "element-plus";
 import { loginApi } from "@/api/modules/login";
 import { useUserStore } from "@/stores/modules/user";
@@ -30,6 +30,7 @@ import { initDynamicRouter } from "@/routers/modules/dynamicRouter";
 import { CircleClose, UserFilled } from "@element-plus/icons-vue";
 import type { ElForm } from "element-plus";
 import md5 from "md5";
+import {getPlatformList} from "@/api/modules/allData";
 
 const router = useRouter();
 const userStore = useUserStore();
@@ -71,10 +72,20 @@ const login = (formEl: FormInstance | undefined) => {
     try {
       // 1.执行登录接口
       const { data } = await loginApi({ ...loginForm, password: loginForm.password });
+      if(!data.user){
+        ElNotification({
+          title: "提示",
+          message: "账号密码错误!",
+          type: "error",
+          duration: 5000
+        });
+        return;
+      }
 
       userStore.setToken(Date.now().toString());
       userStore.setUserInfo(data.user)
       userStore.setAsInfo(data.asInfo)
+      getStationsList();
 
       // 2.添加动态路由
       await initDynamicRouter();
@@ -97,6 +108,25 @@ const login = (formEl: FormInstance | undefined) => {
   });
 };
 
+// 站号列表更新
+const getStationsList = async () => {
+  const userStore = useUserStore();
+  const user = computed(() => userStore.userInfo);
+  const Info = computed(() => userStore.asInfo);
+
+  // 查询自动站列表
+  const queryas = ref<Platform>({ pageSize: 20000, pageNum: 1 });
+  const { data } = await getPlatformList(queryas.value);
+  const array2 = data.list;
+
+  if (user.value.role_id === '管理员') {
+    userStore.setStations(array2);
+  } else {
+    const codesToMatch = Info.value.map(item => item.as_code);
+    const filteredArray = array2.filter(item => codesToMatch.includes(item.as_code));
+    userStore.setStations(filteredArray);
+  }
+};
 const getLoginData = () => {
   const username = localStorage.getItem('username');
   const password = localStorage.getItem('password');

src/views/query/deviceHealth/index.vue

@@ -9,17 +9,7 @@
               <el-checkbox v-model="isStand" label="多站"/>
 
               <!--多站选择-->
-              <el-select v-if="isStand" v-model="pageable.as_code_list"  multiple collapse-tags   filterable placeholder="请搜索自动站" remote reserve-keyword clearable  style="width: 200px;margin: 0 10px">
-                <el-option
-                  v-for="item in platformList"
-                  :key="item.as_code"
-                  :label="item.as_code +' '+item.as_name"
-                  :value="item.as_code"
-                />
-                <template #prefix>
-                  <el-icon class="el-input__icon"><search /></el-icon>
-                </template>
-              </el-select>
+              <SelectItem v-show="isStand"   :select-data="selectedData" :select-list="platformList" :is-checkbox="false" @update:selectedItems="selectedItems" style="width: 200px;margin:0 10px"> </SelectItem>
               <el-form-item label="观测时间:" v-if="isStand">
                 <el-switch
                   v-model="hot"
@@ -53,17 +43,7 @@
               </el-form-item>
 
               <!--单站选择-->
-              <el-select v-if="!isStand"  v-model="as_code_list"  @change="changeAslist" collapse-tags   filterable placeholder="请搜索自动站"  remote reserve-keyword clearable  style="width: 200px;padding: 0px 10px">
-                <el-option
-                  v-for="item in platformList"
-                  :key="item.as_code"
-                  :label="item.as_code +' '+item.as_name"
-                  :value="item.as_code"
-                />
-                <template #prefix>
-                  <el-icon class="el-input__icon"><search /></el-icon>
-                </template>
-              </el-select>
+              <SelectItem v-show="!isStand"  :select-data="selectedData" :select-list="platformList" :is-checkbox="true" @update:selectedItems="selectedItems2" style="width: 200px;margin:0 10px"></SelectItem>
 
               <el-form-item label="观测时间:" v-if="!isStand">
                 <el-switch
@@ -201,12 +181,14 @@
 </template>
 
 <script setup lang="ts" name="useProTable">
+import SelectItem from "@/components/SelectItem/index.vue";
 import Pagination from "@/components/ProTable/components/Pagination.vue";
-import {ref, reactive, onMounted} from "vue";
+import {ref, reactive, onMounted, computed} from "vue";
 import { ColumnProps } from "@/components/ProTable/interface";
 import {getPlatformList, getStaitemList, getYallSensorList} from "@/api/modules/allData";
 import {Platform} from "@/api/interface";
 import {ElNotification} from "element-plus";
+import {useUserStore} from "@/stores/modules/user";
 
 
 const isStand =ref(true)
@@ -498,9 +480,11 @@ const cancel = () => {
 }
 
 onMounted(() => {
+  const allCodes = platformList.value.map(item => item.as_code);
+  pageable.value.as_code_list = allCodes
+
   loadCustomizeColumns()
   updateColumns()
-  getPlatforms()
   getSensorList()
 })
 
@@ -519,20 +503,16 @@ function loadCustomizeColumns() {
 }
 
 
-const platformList =ref<any>([])
-// 查询自动站列表
-const queryas = ref<Platform>({
-  pageSize: 10000,
-  pageNum: 1
-})
-
-const getPlatforms = async () => {
-  const { data } = await getPlatformList(queryas.value);
-  platformList.value = data.list
-};
-
+const userStore = useUserStore();
+const platformList =ref<any>(computed(() => userStore.stations))
 
 const getList = async () => {
+  if(pageable.value.as_code_list===undefined||pageable.value.as_code_list.length===0){
+    // 没有站不给数据
+    processTableData.value = []
+    pageable.value.total=0
+    return;
+  }
   const { data } = await getStaitemList(pageable.value);
   processTableData.value = transformData(data.list)
   pageable.value.total = data.total
@@ -575,8 +555,35 @@ const handleQuery = () => {
 
 };
 
+//搜索站号
+const selectedData= ref([])
+const selectedItems =(data)=>{
+  if(data.length>0){
+    pageable.value.as_code_list = data
+  }else {
+    const allCodes = platformList.value.map(item => item.as_code);
+    pageable.value.as_code_list = allCodes
+  }
+};
+
+
+
+//搜索站号
+const selectedItems2 =(data)=>{
+  if(data.length>0){
+    pageable.value.as_code_list = data
+  }else {
+    const allCodes = platformList.value.map(item => item.as_code);
+    pageable.value.as_code_list = allCodes
+  }
+};
+
+
 //重置功能
 const resetQuery = () => {
+  const allCodes = platformList.value.map(item => item.as_code);
+  pageable.value.as_code_list = allCodes
+  selectedData.value = []
 
   isStand.value = true
   as_code_list.value = undefined;
@@ -591,7 +598,6 @@ const resetQuery = () => {
   pageable.value.begin_time =undefined
   pageable.value.end_time = undefined
   pageable.value.data_type = false
-  pageable.value.as_code_list =[]
   pageable.value.state_list =[
     "STATE_PART",
     "STATE_SENSOR",

src/views/query/hazardousWeather/index.vue

@@ -6,17 +6,7 @@
         <div class="header-button-lf">
           <el-form :model="pageable" label-width="auto"  :inline="true">
             <el-form-item label="站号:">
-              <el-select v-model="as_code_list" @change="changeCodeList" collapse-tags  filterable placeholder="请搜索自动站" remote reserve-keyword clearable  style="width: 200px">
-                <el-option
-                  v-for="item in platformList"
-                  :key="item.as_code"
-                  :label="item.as_code +' '+item.as_name"
-                  :value="item.as_code"
-                />
-                <template #prefix>
-                  <el-icon class="el-input__icon"><search /></el-icon>
-                </template>
-              </el-select>
+              <SelectItem :select-data="selectedData" :select-list="platformList" :is-checkbox="true" @update:selectedItems="selectedItems" style="width: 200px"> </SelectItem>
             </el-form-item>
             <el-form-item label="告警类型:">
               <el-select v-model="tact_state" filterable placeholder="请选择" clearable style="width: 200px">
@@ -91,10 +81,12 @@
 
 <script setup lang="ts" name="useProTable">
 import Pagination from "@/components/ProTable/components/Pagination.vue";
-import {ref, reactive, onMounted} from "vue";
+import SelectItem from "@/components/SelectItem/index.vue";
+import {ref, reactive, onMounted, computed} from "vue";
 import { ColumnProps } from "@/components/ProTable/interface";
 import { getPlatformList, getTacRecordList} from "@/api/modules/allData";
 import {Platform} from "@/api/interface";
+import {useUserStore} from "@/stores/modules/user";
 const pageable = ref<any>({
   as_code_list: [],
   tact_state_on: false,
@@ -108,17 +100,6 @@ const pageable = ref<any>({
 });
 
 const as_code_list = ref('')
-
-const changeCodeList =(value)=>{
-  if(value){
-    pageable.value.as_code_list = [value]
-  }else {
-    pageable.value.as_code_list= []
-  }
-
-
-}
-
 const timeBegin = ref()
 
 function   changeBeginTime(value) {
@@ -214,8 +195,11 @@ const handleQuery = () => {
 
 //清空查询
 const resetQuery = () => {
+  const allCodes = platformList.value.map(item => item.as_code);
+  pageable.value.as_code_list = allCodes
+  selectedData.value = []
+
   pageable.value.pageNum = 1;
-  pageable.value.as_code_list = []
   pageable.value.begin_time=undefined
   pageable.value.end_time=undefined
   as_code_list.value = ''
@@ -223,6 +207,17 @@ const resetQuery = () => {
   getList()
 };
 
+//搜索站号
+const selectedData= ref([])
+const selectedItems =(data)=>{
+  if(data.length>0){
+    pageable.value.as_code_list = data
+  }else {
+    const allCodes = platformList.value.map(item => item.as_code);
+    pageable.value.as_code_list = allCodes
+  }
+};
+
 /**
  * @description 每页条数改变
  * @param {Number} val 当前条数
@@ -261,27 +256,25 @@ const columns = reactive<ColumnProps[]>([
 
 
 const getList = async () => {
+  if(pageable.value.as_code_list===undefined||pageable.value.as_code_list.length===0){
+    // 没有站不给数据
+    processTableData.value = []
+    pageable.value.total=0
+    return;
+  }
   const { data } = await getTacRecordList(pageable.value);
   processTableData.value = data.list
   pageable.value.total = data.total
 };
 
 onMounted(() => {
-  getPlatforms();
+  const allCodes = platformList.value.map(item => item.as_code);
+  pageable.value.as_code_list = allCodes
   getList()
 })
 
-const platformList =ref<any>([])
-// 查询自动站列表
-const queryas = ref<Platform>({
-  pageSize: 10000,
-  pageNum: 1
-})
-
-const getPlatforms = async () => {
-  const { data } = await getPlatformList(queryas.value);
-  platformList.value = data.list
-};
+const userStore = useUserStore();
+const platformList =ref<any>(computed(() => userStore.stations))
 
 
 function formatDate(timestamp) {

src/views/query/queryObservationData/index.vue

@@ -7,19 +7,7 @@
           <el-form :model="pageable" label-width="auto" :inline="true">
             <el-form-item label="自动站:">
               <el-checkbox v-model="isStand" @change="changeStand" label="多站"/>
-
-              <!--多站选择-->
-              <el-select v-if="isStand" v-model="pageable.as_code_list"  multiple collapse-tags   filterable placeholder="请搜索自动站" remote reserve-keyword clearable  style="width: 200px;margin: 0 10px">
-                <el-option
-                  v-for="item in platformList"
-                  :key="item.as_code"
-                  :label="item.as_code +' '+item.as_name"
-                  :value="item.as_code"
-                />
-                <template #prefix>
-                  <el-icon class="el-input__icon"><search /></el-icon>
-                </template>
-              </el-select>
+              <SelectItem v-show="isStand"   :select-data="selectedData" :select-list="platformList" :is-checkbox="false" @update:selectedItems="selectedItems" style="width: 200px;margin:0 10px"> </SelectItem>
               <el-form-item label="观测时间:" v-if="isStand">
                 <el-switch
                   v-model="hot"
@@ -53,18 +41,8 @@
               </el-form-item>
 
               <!--单站选择-->
-              <el-select v-if="!isStand"  v-model="as_code_list"  @change="changeAslist" collapse-tags   filterable placeholder="请搜索自动站"  remote reserve-keyword clearable  style="width: 200px;padding: 0px 10px">
-                <el-option
-                  v-for="item in platformList"
-                  :key="item.as_code"
-                  :label="item.as_code +' '+item.as_name"
-                  :value="item.as_code"
-                />
-                <template #prefix>
-                  <el-icon class="el-input__icon"><search /></el-icon>
-                </template>
-              </el-select>
 
+              <SelectItem v-show="!isStand"  :select-data="selectedData" :select-list="platformList" :is-checkbox="true" @update:selectedItems="selectedItems2" style="width: 200px;margin:0 10px"> </SelectItem>
               <el-form-item label="观测时间:" v-if="!isStand">
                 <el-switch
                   v-model="hot"
@@ -284,12 +262,14 @@
 </template>
 
 <script setup lang="ts" name="useProTable">
+import SelectItem from "@/components/SelectItem/index.vue";
 import Pagination from "@/components/ProTable/components/Pagination.vue";
-import {ref, reactive, onMounted, onDeactivated, onActivated} from "vue";
+import {ref, reactive, onMounted, onDeactivated, onActivated, computed} from "vue";
 import { ColumnProps } from "@/components/ProTable/interface";
 import {ElNotification, ElTable} from "element-plus";
 import {getDataItemList, getPlatformList, getRgDataList} from "@/api/modules/allData";
 import { Platform} from "@/api/interface";
+import {useUserStore} from "@/stores/modules/user";
 const tableRef = ref<InstanceType<typeof ElTable>>();
 const dialog = reactive<any>({
   visible: false,
@@ -538,8 +518,37 @@ const handleQuery = () => {
 
 };
 
+
+//搜索站号
+const selectedData= ref([])
+const selectedItems =(data)=>{
+  if(data.length>0){
+    pageable.value.as_code_list = data
+  }else {
+    const allCodes = platformList.value.map(item => item.as_code);
+    pageable.value.as_code_list = allCodes
+  }
+};
+
+
+
+//搜索站号
+const selectedItems2 =(data)=>{
+  if(data.length>0){
+    pageable.value.as_code_list = data
+  }else {
+    const allCodes = platformList.value.map(item => item.as_code);
+    pageable.value.as_code_list = allCodes
+  }
+};
+
+
 //重置功能
 const resetQuery = () => {
+  const allCodes = platformList.value.map(item => item.as_code);
+  pageable.value.as_code_list = allCodes
+  selectedData.value = []
+
   isStand.value = true
   as_code_list.value = undefined;
   hot.value = true;
@@ -550,7 +559,6 @@ const resetQuery = () => {
   pageable.value.time_space =60
   pageable.value.begin_time =undefined
   pageable.value.end_time = undefined
-  pageable.value.as_code_list =[]
   pageable.value.pageNum = 1
   pageable.value.pageSize =20
   pageable.value.total =0
@@ -747,18 +755,9 @@ const updateColumns = () => {
 //操作 自定义部分表头
 const copiedCustomizeColumns = ref<any>([...customizeColumns.value]);
 
-// 查询自动站列表
-const queryas = ref<Platform>({
-  pageSize: 10000,
-  pageNum: 1
-})
 
-const platformList =ref<any>([])
-
-const getPlatforms = async () => {
-  const { data } = await getPlatformList(queryas.value);
-  platformList.value = data.list
-};
+const userStore = useUserStore();
+const platformList =ref<any>(computed(() => userStore.stations))
 
 
 // 查询所有人工要素字典表
@@ -769,6 +768,12 @@ const getAllRgDataList = async () => {
 };
 
 const getList = async () => {
+  if(pageable.value.as_code_list===undefined||pageable.value.as_code_list.length===0){
+    // 没有站不给数据
+    processTableData.value = []
+    pageable.value.total=0
+    return;
+  }
   const { data } = await getDataItemList(pageable.value);
   processTableData.value = data.list
   pageable.value.total = data.total
@@ -826,9 +831,11 @@ function formatDate(timestamp) {
 }
 
 onMounted(() => {
+  const allCodes = platformList.value.map(item => item.as_code);
+  pageable.value.as_code_list = allCodes
+
   loadCustomizeColumns()
   updateColumns()
-  getPlatforms()
   getAllRgDataList()
 })