diff --git a/src/api/charge.js b/src/api/charge.js index 4032ace..38a58fe 100644 --- a/src/api/charge.js +++ b/src/api/charge.js @@ -12,7 +12,7 @@ const api = 'http://nbxt.oa.x-lf.cn' * @param token 访问令牌 * @returns {Promise> | *} */ -const getChargeProjectList = (token)=> { +export const getChargeProjectList = (token)=> { return axios({ method: 'get', url: `${api}/project/participate/get`, @@ -21,4 +21,7 @@ const getChargeProjectList = (token)=> { 'Timestamp':getCurrentTimestamp() } }) -} \ No newline at end of file +} + + + diff --git a/src/views/personal/project/charge.vue b/src/views/personal/project/charge.vue index 5d9af37..607a418 100644 --- a/src/views/personal/project/charge.vue +++ b/src/views/personal/project/charge.vue @@ -5,15 +5,15 @@
名称 - +
状态 - +
- 查询 - 重置 + 查询 + 重置
@@ -23,17 +23,17 @@ - + - - - - - - + + + + + + @@ -51,16 +51,11 @@ import { ref } from 'vue'; import { ElTable } from 'element-plus'; import { useRouter } from 'vue-router'; -import { getManageList } from '@/api/manage.js'; +import { getChargeProjectList } from '@/api/charge.js'; import { getToken } from '@/utils/auth'; const router = useRouter(); -// 路由跳转 -const toChildSystem = () => { - router.push({ name: 'ChildSysCharge' }); // 跳转到子系统详情页面 -}; -const input = ref(''); @@ -68,17 +63,85 @@ const input = ref(''); interface User { - id: number - cycle: number - name: string - description: string - workLoad: number - card: string - isFinish: number - principalUser: string - dateline: string + id: number; + cycle: number; + name: string; + description: string; + workLoad: number; + card: string; + isFinish: number; + principalUser: string; + dateline: string; } +// 响应式数据 +const input1 = ref(''); +const input2 = ref(''); +const tableData = ref([ + { + id: 4, + cycle: 2, + name: "项目2", + description: "xxxxxxx", + workLoad: 12, + card: "java", + isFinish: 3, + principalUser: "teacher_user", + dateline: "2021-12-31" + }, + { + id: 4, + cycle: 2, + name: "项目2", + description: "xxxxxxx", + workLoad: 12, + card: "java", + isFinish: 1, + principalUser: "teacher_user", + dateline: "2021-12-31" + } + +]); +const initialTableData = ref([]); + +// 处理接口数据 +const fetchData = () => { + const project = getChargeProjectList(getToken()); + project.then(res => { + const data = res.data; + if (data) { + // 假设 data 是从接口返回的数据,这里做一个示例 + const dataProject: User = { + id: 4, + cycle: 2, + name: "项目3", + description: "xxxxxxx", + workLoad: 12, + card: "java", + isFinish: 2, + principalUser: "teacher_user", + dateline: "2021-12-31" + }; + + tableData.value.push(dataProject); + initialTableData.value = tableData.value.slice(); // 将tableData的内容赋值给initialTableData + } else { + console.log("没有数据"); + } + }).catch(err => { + console.log(err); + }); +}; + +// 调用获取数据的函数 +fetchData(); + +// 处理路由跳转 +const toChildSystem = () => { + router.push({ name: 'ChildSysCharge' }); +}; + +// 监听表格行选择事件 const multipleTableRef = ref>(); const multipleSelection = ref([]); @@ -86,69 +149,32 @@ const handleSelectionChange = (val: User[]) => { multipleSelection.value = val; }; -//获取数据 -const project = getManageList(getToken()); +// 统一检索函数 +const search = () => { + const keyword = input1.value.trim().toLowerCase(); + const status = parseInt(input2.value); -//响应式 -const tableData = ref([ - //测试用例 - { - id: 4, - cycle: 2, - name: "项目2", - description: "xxxxxxx", - workLoad: 12, - card: "java", - isFinish: 2, - principalUser: "teacher_user", - dateline: "2021-12-31" - }, - { - id: 4, - cycle: 2, - name: "项目2", - description: "xxxxxxx", - workLoad: 12, - card: "java", - isFinish: 2, - principalUser: "teacher_user", - dateline: "2021-12-31" - }, - - - -]); - - -// 处理接口数据 -project.then(res => { - - const data = res.data; - console.log(data); - if (data) { - const dataProject: User = { - id: 4, - cycle: 2, - name: "项目2", - description: "xxxxxxx", - workLoad: 12, - card: "java", - isFinish: 2, - principalUser: "teacher_user", - dateline: "2021-12-31" - }; - // 使用 tableData.value 进行添加 - tableData.value.push(dataProject); - - - } else { - console.log("没有数据"); + // 如果搜索关键词和状态都为空,则恢复初始数据 + if (keyword === '' && isNaN(status)) { + tableData.value = initialTableData.value.slice(); + return; } -}) -.catch(err => { - console.log(err); - }); + // 根据关键词和状态进行检索 + tableData.value = initialTableData.value.filter(item => { + const matchKeyword = (keyword === '' || item.name.toLowerCase().includes(keyword)); + const matchStatus = (isNaN(status) || item.isFinish === status); + return matchKeyword && matchStatus; + }); +}; + + +// 重置检索条件 +const reset = () => { + input1.value = ''; + input2.value = ''; + tableData.value = initialTableData.value.slice(); // 恢复初始数据 +};