From 137910cf4fc73a3a2787a3a02718f1e1f637c368 Mon Sep 17 00:00:00 2001
From: zhouwx <1175765986@qq.com>
Date: 星期五, 14 六月 2024 16:01:17 +0800
Subject: [PATCH] bug修改

---
 src/views/components/publish.vue |  148 +++++++++++++++++++++++++++++++++++++++++--------
 1 files changed, 124 insertions(+), 24 deletions(-)

diff --git a/src/views/components/publish.vue b/src/views/components/publish.vue
index aff26e1..420d203 100644
--- a/src/views/components/publish.vue
+++ b/src/views/components/publish.vue
@@ -3,29 +3,37 @@
     <div class="main-content">
       <div class="filters">
         <el-form :model="state.querys" style="display:flex;">
-          <el-form-item label="机构名称" style="width: 300px;margin-bottom: 0;margin-right: 20px">
+          <el-form-item label="机构名称:" class="nameInput"  style="width: 300px;margin-bottom: 0;margin-right: 20px;">
             <el-input v-model="state.querys.name" />
           </el-form-item>
-          <el-form-item label="所在地市" style="margin-bottom: 0;margin-right: 20px">
-            <el-select v-model="state.querys.area">
-              <el-option label="Zone one" value="shanghai" />
-              <el-option label="Zone two" value="beijing" />
-            </el-select>
+          <el-form-item label="所在地市:"  style="margin-bottom: 0;margin-right: 20px">
+              <el-cascader
+                  ref="myCascader"
+                  v-model="state.querys.area"
+                  :options="state.areaList"
+                  :props="props"
+                  @change="handleChange"
+                  style="width: 100%"
+              />
           </el-form-item>
-          <el-form-item label="业务范围" style="margin-bottom: 0;margin-right: 20px">
-            <el-select v-model="state.querys.business">
-              <el-option label="Zone one" value="shanghai" />
-              <el-option label="Zone two" value="beijing" />
-            </el-select>
+          <el-form-item label="业务范围:" style="margin-bottom: 0;margin-right: 20px">
+              <el-select  v-model="state.querys.business" placeholder="请选择业务范围" clearable  style="width: 100%">
+                  <el-option
+                      v-for="item in state.busList"
+                      :key="item.id"
+                      :label="item.label"
+                      :value="item.id"
+                  />
+              </el-select>
           </el-form-item>
         </el-form>
-        <el-button type="primary" :icon="Search" class="searchBtn">搜索</el-button>
-        <el-button type="primary" :icon="Refresh" class="resetBtn">重置</el-button>
+        <el-button type="primary" :icon="Search" class="searchBtn" @click="search">搜索</el-button>
+        <el-button type="primary" :icon="Refresh" class="resetBtn" @click="reset">重置</el-button>
       </div>
       <div class="list">
         <div v-for="item in state.dataList" @click="openDetails('机构公示',item.id)">
           <div>
-            <div><img src="src/assets/images/article.png"></div>
+            <div><img :src="articlePng"></div>
             <div>{{item.name}}</div>
           </div>
           <span>
@@ -35,7 +43,9 @@
       </div>
       <div class="pag-container" v-if="state.total&&state.total>0">
         <el-pagination
-            :page-sizes="[10,15,20,25]"
+            v-model:current-page="state.querys.pageNum"
+            v-model:page-size="state.querys.pageSize"
+            :page-sizes="[10,15,20]"
             layout="total, sizes, prev, pager, next, jumper"
             :total="state.total"
             @size-change="handleSizeChange"
@@ -51,26 +61,43 @@
 import { getPublish } from '@/api/home/homePage'
 import { Search, Refresh } from '@element-plus/icons-vue'
 import {ElMessage} from "element-plus";
+import {getRegionTree} from "@/api/area";
+import {getDict} from "@/api/login";
+import articlePng from "@/assets/images/article.png"
 const emit = defineEmits(['openDetails'])
 const route = useRoute()
 const router = useRouter()
+const myCascader = ref();
 
 const state = reactive({
   dataList: [],
   querys:{
     name: '',
-    area: '',
-    bussiness: '',
+    area: [],
+    business: '',
+      province:'',
+      city:'',
+      district:'',
     pageNum: 1,
     pageSize: 10
   },
-  total: null
+  total: null,
+    busList: [],
+    areaList: [],
+    attribute: 0
 })
 
+const props = {
+    expandTrigger: 'hover',
+    value: 'name',
+    label: 'name'
+}
 const redirect = ref(undefined);
 
 onMounted(()=>{
   getData()
+    getArea()
+    getBusiness()
 })
 
 onUnmounted(()=>{
@@ -82,22 +109,89 @@
 }, { immediate: true });
 
 const getData = async ()=>{
-  const res = await getPublish(state.querys)
+   const param = {
+       name: state.querys.name,
+       business: state.querys.business,
+       province: state.querys.province,
+       city: state.querys.city,
+       district: state.querys.district,
+       pageNum: state.querys.pageNum,
+       pageSize: state.querys.pageSize
+   }
+  const res = await getPublish(param)
   if(res.code == 200){
-    state.dataList = res.data.list.filter(item => item.publication == 0)
+    state.dataList = res.data.list
     state.total = res.data.total
   }else{
     ElMessage.warning(res.message)
   }
 }
 
+const getArea = async ()=>{
+    const res = await getRegionTree({name: '',parentId: null,regionType: state.attribute})
+    if(res.code == 200){
+        state.areaList = res.data
+        state.areaList.unshift(
+            {
+                id: '',
+                name: '全部'
+            }
+        )
+    }else{
+        ElMessage.warning(res.message)
+    }
+}
+
+
+const getBusiness = async ()=>{
+    const res = await getDict({dictType: 'sys_business_scope'})
+    if(res.code == 200){
+        state.busList = res.data
+    }else{
+        ElMessage.warning(res.message)
+    }
+}
+const handleChange = (value) => {
+    if(value && value[0] === '全部'){
+        state.querys.province = ''
+        state.querys.city = ''
+        state.querys.district = ''
+    }else if(value && state.attribute == 0){
+        state.querys.province = '新疆维吾尔自治区'
+        state.querys.city = value[0]?value[0]:''
+        state.querys.district  = value[1]?value[1]:''
+    }
+    // else{
+    //     state.querys.province = value[0]?value[0]:''
+    //     state.querys.city = value[1]?value[1]:''
+    //     state.querys.district  = value[2]?value[2]:''
+    // }
+}
 const handleSizeChange = (val) => {
+    state.querys.pageNum = 1;
   state.querys.pageSize = val
   getData()
 }
 const handleCurrentChange = (val) => {
   state.querys.pageNum = val
   getData()
+}
+const search = () => {
+    state.querys.pageNum = 1;
+    getData()
+}
+const reset = () => {
+    state.querys = {
+        name: '',
+        area: [],
+        province:'',
+        city:'',
+        district:'',
+        bussiness: '',
+        pageNum: 1,
+        pageSize: 10
+    }
+    getData()
 }
 
 const openDetails = (type,id)=>{
@@ -115,11 +209,17 @@
   width: 100%;
   display: flex;
   justify-content: center;
-  margin-top: 170px;
+  margin-top: 150px;
+    :deep(.el-form .el-form-item__label) {
+        font-size: 16px;
+    }
+    :deep(.el-form-item){
+        align-items: center;
+    }
 
   .main-content{
     width: 1200px;
-    margin: 20px 0;
+    margin: 15px 0;
     background: #fff;
     border-radius: 4px;
     box-shadow: 1px 1px 3px rgba(0,0,0,.04);
@@ -156,7 +256,7 @@
 
     .list{
       padding: 15px 0;
-      max-height: calc(100vh - 402px);
+      height: calc(100vh - 332px);
       overflow-y: auto;
 
       &>div{
@@ -209,7 +309,7 @@
 
     .pag-container{
       width: 100%;
-      height: 80px;
+      height: 60px;
       display: flex;
       align-items: center;
       justify-content: right;

--
Gitblit v1.9.2