From 961e24e3f2ea183857314be6cd3f1b040d53278e Mon Sep 17 00:00:00 2001
From: tuxiu21 <zhangyufan709@gmail.com　>
Date: Wed, 13 Mar 2024 22:58:15 +0800
Subject: [PATCH] =?UTF-8?q?=E6=88=91=E8=B4=9F=E8=B4=A3=E7=9A=84=20?=
 =?UTF-8?q?=E4=BB=A5=E5=8F=8A=20request.js=20=E6=96=87=E4=BB=B6=E4=BF=AE?=
 =?UTF-8?q?=E6=94=B9?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/js/request.js                        |  19 ++-
 src/views/WorkLoadPage/I_Responsible.vue | 189 ++++++++++++++++++++++-
 2 files changed, 206 insertions(+), 2 deletions(-)

diff --git a/src/js/request.js b/src/js/request.js
index 8acac42..07ed8dc 100644
--- a/src/js/request.js
+++ b/src/js/request.js
@@ -546,7 +546,24 @@ const messageGet = (token) => {
     })
 }
 
+/**
+ * 得到tag列表
+ * @param token
+ */
+const  getTagsProjectList
+= (token) =>{
+    return axios({
+        url:api+ "/tags/project/list",
+        method: "get",
+        headers:{
+            'Authorization':'Bearer '+token,
+            'Timestamp': getCurrentTimestamp()
+        }
+    })
+}
+
 export default {
+
     login,
     register,
     logout,
@@ -582,7 +599,7 @@ export default {
     projectGet,
     projectGetCustom,
 
-
+    getTagsProjectList,
 
     messageGet
 
diff --git a/src/views/WorkLoadPage/I_Responsible.vue b/src/views/WorkLoadPage/I_Responsible.vue
index 41a40c8..49e8cac 100644
--- a/src/views/WorkLoadPage/I_Responsible.vue
+++ b/src/views/WorkLoadPage/I_Responsible.vue
@@ -1 +1,188 @@
-<template></template>
\ No newline at end of file
+<template>
+
+    <a-breadcrumb>
+        <a-breadcrumb-item>我负责的</a-breadcrumb-item>
+        <!-- <a-breadcrumb-item><a href="">Application Center</a></a-breadcrumb-item>
+        <a-breadcrumb-item><a href="">Application List</a></a-breadcrumb-item>
+        <a-breadcrumb-item>An Application</a-breadcrumb-item> -->
+    </a-breadcrumb>
+    <div class="flex flex-row justify-between">
+        <div>
+            <!-- 第一个是 全部 所以独立出来 -->
+            <a-checkable-tag
+            v-model:checked="tagAll"
+            @change="checked => handleClickAll(checked)"
+            >
+            全部
+            </a-checkable-tag>
+            <a-checkable-tag
+            v-for="(tag, index) in tagsData"
+            :key="tag.id"
+            v-model:checked="selectTags[index]"
+            @change="checked => handleChange(tag, checked)"
+            >
+            {{ tag.name }}
+            </a-checkable-tag>
+        </div>
+        <div>
+            <a-checkbox-group v-model:value="projStatus" :options="['进行中','已完成']" />
+        </div>
+    </div>
+    <div>
+        <a-card hoverable style="width: 240px">
+          <template #cover>
+            <img alt="example" src="https://os.alipayobjects.com/rmsportal/QBnOOoLaAfKPirc.png" />
+          </template>
+          <a-card-meta title="Europe Street beat">
+            <template #description>www.instagram.com</template>
+          </a-card-meta>
+        </a-card>
+
+    </div>
+    <a-tooltip title="添加" class="fixed bottom-0 right-0 m-16">
+      <!-- 这里显示错位 只好用flex  -->
+        <a-button
+         size="large"
+         class="bg-sky-300 flex flex-row items-center justify-center"
+         shape="circle"
+         @click="open = true"
+         >
+         <template #icon>
+          <PlusOutlined class=""/>
+        </template>
+        </a-button>
+        <a-modal v-model:open="open" title="添加项目" @ok="handleOk">
+          <a-form
+            :label-col="labelCol"
+            :wrapper-col="wrapperCol"
+            layout="horizontal"
+            style="max-width: 600px"
+          >
+            <a-form-item label="项目名称">
+              <a-input />
+            </a-form-item>
+            <a-form-item label="周期">
+              <a-input />
+            </a-form-item>   
+            <a-form-item label="工作量">
+              <a-input />
+            </a-form-item>          
+            <a-form-item label="Checkbox">
+              <a-checkbox>checkbox</a-checkbox>
+            </a-form-item>
+            <a-form-item label="Radio">
+              <a-radio-group v-model:value="radioValue">
+                <a-radio value="apple">Apple</a-radio>
+                <a-radio value="pear">Pear</a-radio>
+              </a-radio-group>
+            </a-form-item>
+
+            <a-form-item label="Select">
+              <a-select>
+                <a-select-option value="demo">Demo</a-select-option>
+              </a-select>
+            </a-form-item>
+            <a-form-item label="TreeSelect">
+              <a-tree-select :tree-data="treeData" />
+            </a-form-item>
+            <a-form-item label="Cascader">
+              <a-cascader :options="options" />
+            </a-form-item>
+            <a-form-item label="DatePicker">
+              <a-date-picker />
+            </a-form-item>
+            <a-form-item label="RangePicker">
+              <a-range-picker />
+            </a-form-item>
+            <a-form-item label="InputNumber">
+              <a-input-number />
+            </a-form-item>
+            <a-form-item label="TextArea">
+              <a-textarea :rows="4" />
+            </a-form-item>
+            <a-form-item label="Switch">
+              <a-switch v-model:checked="checked" />
+            </a-form-item>
+            <a-form-item label="Upload">
+              <a-upload action="/upload.do" list-type="picture-card">
+                <div>
+                  <PlusOutlined />
+                  <div style="margin-top: 8px">Upload</div>
+                </div>
+              </a-upload>
+            </a-form-item>
+            <a-form-item label="Button">
+              <a-button>Button</a-button>
+            </a-form-item>
+          </a-form>
+        </a-modal>
+    </a-tooltip>
+</template>
+<script setup lang="">
+import { reactive, ref ,computed,onMounted} from 'vue';
+import { h } from 'vue';
+import { SearchOutlined,StarOutlined,PlusOutlined } from '@ant-design/icons-vue';
+
+import request from '@/js/request';
+
+const tagsData = ref([]);
+const selectTags = ref([false, false, false, false]);
+
+const projStatus = ref();
+const tagAll=ref(true)
+
+const token = window.localStorage.getItem('token')
+
+const projList=ref([])
+
+
+
+
+//当选中全部时，其他的都不选中
+const handleClickAll=(checked)=>{
+  if(checked){
+    selectTags.value.forEach((item,index)=>{
+      selectTags.value[index]=false
+    })
+    // 发送获取全部数据的请求
+    request.projectGet(token).then(res=>{
+      console.log(res.data.data)
+    })
+  }
+
+}
+// 当选中其他的时候， 全部 不选中
+const handleChange = (tag, checked) => {
+  if(checked){
+    tagAll.value=false
+  }
+  else{
+    let flag=true
+    selectTags.value.forEach((item,index)=>{
+      if(item){
+        flag=false
+      }
+    })
+    if(flag){
+      tagAll.value=true
+    }
+  }
+};
+
+// 当组件挂载时 请求tag数据
+onMounted(
+  ()=>{
+  
+    // 设置标签
+    request.getTagsProjectList(token).then(res=>{
+      console.log(res.data.data)
+      tagsData.value=res.data.data
+    })
+    // 默认获取全部数据
+    request.projectGet(token).then(res=>{
+      console.log(res)
+
+    })
+  }
+)
+</script>
\ No newline at end of file