enable tag search

src/js/request.js

@@ -502,10 +502,11 @@ const infoEditSettingHeaderImage = (showType, token) => {
 /**
  * 展示我负责的项目
  * @param token
+ * @param url
  */
-const projectGet =(token) => {
+const projectGet =(token,url) => {
     return axios({
-        url:api+ "/project/get",
+        url:api+ "/project/get"+url,
         method: "get",
         headers:{
             'Authorization':'Bearer '+token,

src/views/WorkLoadPage/I_Responsible.vue

@@ -25,7 +25,9 @@
             </a-checkable-tag>
         </div>
         <div>
-            <a-checkbox-group v-model:value="projStatus" :options="['进行中','已完成']" />
+            <a-checkbox-group 
+            v-model:value="projCheckbox" 
+            :options="checkboxOptions" />
         </div>
     </div>
     <div class="flex flex-row flex-wrap justify-around">
@@ -63,10 +65,11 @@
          shape="circle"
          @click="addModalOpen = true"
          >
-         <template #icon>
+          <template #icon>
-          <PlusOutlined class=""/>
+            <PlusOutlined class=""/>
-        </template>
+          </template>
         </a-button>
+        <a-button @click="setupProj">999</a-button>
         <a-modal v-model:open="addModalOpen" title="添加项目" @ok="handleOk">
           <a-form
             :label-col="labelCol"
@@ -124,22 +127,32 @@
 </template>
 <script setup>
 import { reactive, ref ,computed,onMounted} from 'vue';
-import { h } from 'vue';
+import { h,watchEffect } from 'vue';
 import { SearchOutlined,StarOutlined,PlusOutlined } from '@ant-design/icons-vue';
 import {useRouter} from "vue-router";
 
 import request from '@/js/request';
 const router=useRouter()
-const tagsData = ref([]);
-const selectTags = ref([false, false, false, false]);
 
-const projStatus = ref();
+// 完整的标签列表
+const tagsData = ref([]);
+// 选中的标签
+const selectTags = ref([]);
+
+const projCheckbox = ref([0,2,1]);
 const tagAll=ref(true)
 
 const token = window.localStorage.getItem('token')
 
 const projList=ref([])
 
+const checkboxOptions = [
+  { label: '未开始', value: 0 },
+  { label: '进行中', value:  2},
+  { label: '已结束', value:  1},
+];
+
+
 const addModalOpen=ref(false)
  // 得到用户信息
  const uinfo=JSON.parse(window.localStorage.getItem('uinfo'))
@@ -158,6 +171,7 @@ const addForm=ref({
 
 //当选中全部时，其他的都不选中
 const handleClickAll=(checked)=>{
+  
   if(checked){
     selectTags.value.forEach((item,index)=>{
       selectTags.value[index]=false
@@ -171,6 +185,7 @@ const handleClickAll=(checked)=>{
 }
 // 当选中其他的时候， 全部 不选中
 const handleChange = (tag, checked) => {
+  
   if(checked){
     tagAll.value=false
   }
@@ -189,7 +204,6 @@ const handleChange = (tag, checked) => {
 
 
 
-
 const handleAdd=(publish)=>{
   console.log(addForm.value)
   //添加是否发布 和 负责人id
@@ -212,6 +226,44 @@ const handleCardClick=(id)=>{
 }
 
 
+const setupProj=()=>{
+  let tags=[] //taglist 全为string
+  selectTags.value.map((item,index)=>{
+    if(item){
+      tags.push(tagsData.value[index].name)
+    }
+  })
+  console.log(tags);
+  // 如果全选
+  if(tagAll.value){
+    tags=tagsData.value.map((item,index)=>{
+      return item.name
+    })
+  }
+  const encodedTags = tags.map(tag => encodeURIComponent(tag));
+
+  // 判断状态
+  let status=[]
+  projCheckbox.value.map((item,index)=>{
+    if(item){
+      status.push(index)
+    }
+  })
+  const encoedStatus=status.map(item=>encodeURIComponent(item))
+
+  const url = `?tags=${encodedTags}&status=${encoedStatus}`
+  request.projectGet(token,url).then(res=>{
+    console.log(res)
+    projList.value=res.data.data
+
+  })
+}
+
+watchEffect(()=>{
+  setupProj()
+})
+
+
 // 当组件挂载时 请求tag数据
 onMounted(
   ()=>{
@@ -221,12 +273,8 @@ onMounted(
       console.log(res.data.data)
       tagsData.value=res.data.data
     })
-    // 默认获取全部数据
+    setupProj()
-    request.projectGet(token).then(res=>{
-      console.log(res)
-      projList.value=res.data.data
 
-    })
   }
 )
 </script>