WxxyDeveloper/JSL_OrganizeInternalOAWeb
9
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

获取子模块

Browse Source
This commit is contained in:
GUjiYN 2024-03-16 16:56:40 +08:00
parent eaa3039faf
commit b49493c795
6 changed files with 287 additions and 303 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

28
src/js/request.js
View File

@ -506,7 +506,7 @@ const infoEditSettingHeaderImage = (showType, token) => {
*/ */
const projectGet =(token,url) => { const projectGet =(token,url) => {
return axios({ return axios({
url:api+ "/project/get"+url, url:api+ "/project/get",
method: "get", method: "get",
headers:{ headers:{
'Authorization':'Bearer '+token, 'Authorization':'Bearer '+token,
@ -625,7 +625,7 @@ const projectWorkGet = (data,token) =>{
const queryTags = `tags=${encodedTags.join('&tags=')}`; const queryTags = `tags=${encodedTags.join('&tags=')}`;
const queryIsFinish = `isFinish=${encodedIsFinish.join('&isFinish=')}`; const queryIsFinish = `isFinish=${encodedIsFinish.join('&isFinish=')}`;
return axios({ return axios({
url:`${api}/project/work/get?${queryTags}&${queryIsFinish}`, url:`${api}/project/work/get?${queryTags}&${queryIsFinish}&is=1`,
method: "get", method: "get",
headers:{ headers:{
'content-type': 'application/json;charset=utf-8', 'content-type': 'application/json;charset=utf-8',
@ -675,18 +675,24 @@ const moduleGetByProjectId = (projectId, token) => {
} }
/*const moduleGetByProjectId = (projectId, token) => { /**
return axios ({ * 根据子系统id获取子模块信息
url:api + "/module/get", * @param sysId
methods:"get", * @param token
params:projectId, */
headers:{ const moduleGetBySysId = (sysId, token) => {
return axios({
url: api + "/module/get/min?sysId=" + sysId,
method:"get",
headers: {
'Authorization':'Bearer '+token, 'Authorization':'Bearer '+token,
'content-type': 'application/json;charset=utf-8', 'Content-Type': 'application/json;charset=utf-8',
'Timestamp': getCurrentTimestamp() 'Timestamp': getCurrentTimestamp()
} }
}) })
}*/ }
export default { export default {
login, login,
@ -730,7 +736,7 @@ export default {
projectWorkGet, projectWorkGet,
moduleGetByProjectId, moduleGetByProjectId,
moduleGetBySysId,
messageGet, messageGet,

199
src/router/index.js
View File

@ -4,174 +4,175 @@ const router = createRouter({
history: createWebHistory(import.meta.env.BASE_URL), history: createWebHistory(import.meta.env.BASE_URL),
routes: [ routes: [
{ {
path:'/', path: '/',
name:'app', name: 'app',
component:()=>import('../views/HomePage/IndexView.vue'), component: () => import('../views/HomePage/IndexView.vue'),
children:[ children: [
{ {
path: "/", path: "/",
component:() => import ('../views/HomePage/Main.vue') component: () => import ('../views/HomePage/Main.vue')
},{
path:'/Project',
name:'Project',
component:()=>import('@/views/ProjectPage/ProjectList.vue')
}, },
{ {
path:'/WorkLoad', path: '/Project',
name:'WorkLoad', name: 'Project',
component:()=>import('@/views/WorkLoadPage/WorkLoad.vue'), component: () => import('@/views/ProjectPage/ProjectList.vue')
children:[ },
{
path: '/WorkLoad',
name: 'WorkLoad',
component: () => import('@/views/WorkLoadPage/WorkLoad.vue'),
children: [
{ {
path: '/WorkLoad/PersonalInformation', path: '/WorkLoad/PersonalInformation',
name:'WorkLoadPersonalInformation', name: 'WorkLoadPersonalInformation',
component:() =>import('@/views/WorkLoadPage/PersonalInformation.vue') component: () => import('@/views/WorkLoadPage/PersonalInformation.vue')
}, },
{ {
path: '/WorkLoad/PersonalProject', path: '/WorkLoad/PersonalProject',
name:'WorkLoadPersonalProject', name: 'WorkLoadPersonalProject',
component:()=>import('@/views/WorkLoadPage/PersonalProject.vue') component: () => import('@/views/WorkLoadPage/PersonalProject.vue')
}, },
{ {
path: '/WorkLoad/PersonalBelongings', path: '/WorkLoad/PersonalBelongings',
name:'WorkLoadPersonalBelongings', name: 'WorkLoadPersonalBelongings',
component:()=>import('@/views/WorkLoadPage/PersonalBelongings.vue') component: () => import('@/views/WorkLoadPage/PersonalBelongings.vue')
}, },
{ {
path: '/WorkLoad/Message', path: '/WorkLoad/Message',
name:'WorkLoadMessage', name: 'WorkLoadMessage',
component:()=>import('@/views/WorkLoadPage/Message.vue') component: () => import('@/views/WorkLoadPage/Message.vue')
}, },
{ {
path: '/WorkLoad/DailyPaper', path: '/WorkLoad/DailyPaper',
name:'WorkLoadDailyPaper', name: 'WorkLoadDailyPaper',
component:() =>import('@/views/WorkLoadPage/DailyPaper.vue') component: () => import('@/views/WorkLoadPage/DailyPaper.vue')
}, },
{ {
path:'/WorkLoad/I_Manage', path: '/WorkLoad/I_Manage',
name:'WordLoadI_Manage', name: 'WordLoadI_Manage',
component:()=>import('@/views/WorkLoadPage/I_Manage.vue'), component: () => import('@/views/WorkLoadPage/I_Manage.vue'),
}, },
{ {
path: '/WorkLoad/I_Responsible', path: '/WorkLoad/I_Responsible',
name:'WorkLoadI_Responsible', name: 'WorkLoadI_Responsible',
component:() =>import('@/views/WorkLoadPage/I_Responsible.vue') component: () => import('@/views/WorkLoadPage/I_Responsible.vue')
}, },
{ {
path:'/WorkLoad/I_Responsible/:projId', path: '/WorkLoad/I_Responsible/:projId',
name:'WorkLoadI_ResponsibleProject', name: 'WorkLoadI_ResponsibleProject',
component:() =>import('@/views/WorkLoadPage/I_ResponsibleChild.vue') component: () => import('@/views/WorkLoadPage/I_ResponsibleChild.vue')
}, },
{ {
path:'/WorkLoad/I_Manage/ChildModule', path: '/WorkLoad/I_Manage/ChildModule',
name:'WorkLoad/I_Manage/ChildModule', name: 'WorkLoad/I_Manage/ChildModule',
component:()=>import('@/views/WorkLoadPage/ChildModule.vue') component: () => import('@/views/WorkLoadPage/ChildModule.vue')
}, },
{ {
path:'/WorkLoad/I_Manage/UserManageModule', path: '/WorkLoad/I_Manage/UserManageModule',
name:'WorkLoadI_ManageUserManageModule', name: 'WorkLoadI_ManageUserManageModule',
component:()=>import('@/views/WorkLoadPage/UserManageModule.vue') component: () => import('@/views/WorkLoadPage/UserManageModule.vue')
}, },
{ {
path:'/WorkLoad/I_Manage/LoginRegisterModule', path: '/WorkLoad/I_Manage/LoginRegisterModule',
name:'WorkLoadI_ManageLoginRegisterModule', name: 'WorkLoadI_ManageLoginRegisterModule',
component:()=>import('@/views/WorkLoadPage/LoginRegisterModule.vue') component: () => import('@/views/WorkLoadPage/LoginRegisterModule.vue')
}, },
{ {
path:'/WorkLoad/I_Manage/AuthorityManageModule', path: '/WorkLoad/I_Manage/AuthorityManageModule',
name:'WorkLoadI_ManageAuthorityManageModule', name: 'WorkLoadI_ManageAuthorityManageModule',
component:()=>import('@/views/WorkLoadPage/AuthorityManageModule.vue') component: () => import('@/views/WorkLoadPage/AuthorityManageModule.vue')
}, },
{ {
path:'/WorkLoad/I_Manage/ChildSystem', path: '/WorkLoad/I_Manage/ChildSystem',
name:'WorkLoad/I_Manage/ChildSystem', name: 'WorkLoad/I_Manage/ChildSystem',
component:() => import('@/views/WorkLoadPage/I_Manage_ChildSystem.vue') component: () => import('@/views/WorkLoadPage/I_Manage_ChildSystem.vue')
} }
] ]
}, },
{ {
path:'/ProjectMessage', path: '/ProjectMessage',
name:'MainMessageCustom', name: 'MainMessageCustom',
component:()=>import('@/views/ProjectPage/MainMessageCustom.vue') component: () => import('@/views/ProjectPage/MainMessageCustom.vue')
}, },
] ]
}, },
{ {
path:'/login', path: '/login',
name:'login', name: 'login',
component:()=>import('@/views/AuthPage/Login.vue') component: () => import('@/views/AuthPage/Login.vue')
}, },
{ {
path:'/register', path: '/register',
name:'register', name: 'register',
component:()=>import('../views/AuthPage/Register.vue') component: () => import('../views/AuthPage/Register.vue')
}, },
{ {
path:'/LoginRegister/Login', path: '/LoginRegister/Login',
name:'Login', name: 'Login',
component:() =>import('@/views/AuthPage/Login.vue') component: () => import('@/views/AuthPage/Login.vue')
}, },
{ {
path:'/Manager', path: '/Manager',
name:'Manager', name: 'Manager',
component:()=>import('@/views/ManagePage/Manager.vue'), component: () => import('@/views/ManagePage/Manager.vue'),
children:[ children: [
{ {
path:'/Manager/Main', path: '/Manager/Main',
component:() =>import('@/views/ManagePage/Main.vue') component: () => import('@/views/ManagePage/Main.vue')
}, },
{ {
path:'/Manager/User', path: '/Manager/User',
component:() =>import('@/views/ManagePage/User.vue') component: () => import('@/views/ManagePage/User.vue')
}, },
{ {
path:'/Manager/Role', path: '/Manager/Role',
component:() =>import('@/views/ManagePage/Role.vue') component: () => import('@/views/ManagePage/Role.vue')
}, },
{ {
path:'/Manager/Authority', path: '/Manager/Authority',
component:() =>import('@/views/ManagePage/Authority.vue') component: () => import('@/views/ManagePage/Authority.vue')
}, },
{ {
path:'/Manager/Log', path: '/Manager/Log',
component:() =>import('@/views/ManagePage/Log.vue') component: () => import('@/views/ManagePage/Log.vue')
}, },
{ {
path:'/Manager/Daily', path: '/Manager/Daily',
component:() =>import('@/views/ManagePage/Daily.vue') component: () => import('@/views/ManagePage/Daily.vue')
}, },
{ {
path:'/Manager/Message', path: '/Manager/Message',
component:() =>import('@/views/ManagePage/Message.vue') component: () => import('@/views/ManagePage/Message.vue')
}, },
{ {
path:'/Manager/Carousel', path: '/Manager/Carousel',
component:() =>import('@/views/ManagePage/Carousel.vue') component: () => import('@/views/ManagePage/Carousel.vue')
} ,{ }, {
path:'/Manager/TeamProfile', path: '/Manager/TeamProfile',
component:() =>import('@/views/ManagePage/TeamProfile.vue') component: () => import('@/views/ManagePage/TeamProfile.vue')
},{ }, {
path:'/Manager/ProjectRecommend', path: '/Manager/ProjectRecommend',
component:() =>import('@/views/ManagePage/ProjectRecommend.vue') component: () => import('@/views/ManagePage/ProjectRecommend.vue')
},{ }, {
path:'/Manager/NewsDisplay', path: '/Manager/NewsDisplay',
component:() =>import('@/views/ManagePage/NewsDisplay.vue') component: () => import('@/views/ManagePage/NewsDisplay.vue')
},{ }, {
path:'/Manager/UserRecommend', path: '/Manager/UserRecommend',
component:() =>import('@/views/ManagePage/UserRecommend.vue') component: () => import('@/views/ManagePage/UserRecommend.vue')
},{ }, {
path:'/Manager/ProjectInformation', path: '/Manager/ProjectInformation',
component:() =>import('@/views/ManagePage/ProjectInformation.vue') component: () => import('@/views/ManagePage/ProjectInformation.vue')
},{ }, {
path:'/Manager/TeamInformation', path: '/Manager/TeamInformation',
component:() =>import('@/views/ManagePage/TeamInformation.vue') component: () => import('@/views/ManagePage/TeamInformation.vue')
},{ }, {
path:'/Manager/NewsInformation', path: '/Manager/NewsInformation',
component:() =>import('@/views/ManagePage/NewsInformation.vue') component: () => import('@/views/ManagePage/NewsInformation.vue')
} }
] ]
} }

2
src/views/AuthPage/Login.vue
View File

@ -8,7 +8,7 @@
<a-form-item <a-form-item
:rules="[{ required: true, message: '请输入您的用户名！' }]" :rules="[{ required: true, message: '请输入您的用户名！' }]"
label="用户名" label="用户名"
name="username" name="user"
style="margin-top: 20px; margin-left: 1vw" style="margin-top: 20px; margin-left: 1vw"
> >
<a-input v-model:value="formState.user" class="h-10 w-64 border-gray-300 rounded-md" type="text"/> <a-input v-model:value="formState.user" class="h-10 w-64 border-gray-300 rounded-md" type="text"/>

72
src/views/WorkLoadPage/ChildModule.vue
View File

@ -22,10 +22,10 @@
</div> </div>
</div> </div>
<div class="flex space-x-9"> <div v-for="(ChildModule, index) in ChildModules" :key="index" class="flex space-x-9">
<a-card class="relative bg-blue-400 w-72 h-36 text-white rounded-xl"> <a-card class="relative bg-blue-400 w-72 h-36 text-white rounded-xl">
<div class="flex space-x-9"> <div class="flex space-x-9">
<p class="absolute left-4 top-4">登录注册模块</p> <p class="absolute left-4 top-4">{{ChildModule.name}}</p>
<p class="absolute right-4 top-4">负责人: 无</p> <p class="absolute right-4 top-4">负责人: 无</p>
</div> </div>
<div class="flex flex-col mt-8"> <div class="flex flex-col mt-8">
@ -48,56 +48,6 @@
</button> </button>
</div> </div>
</a-card> </a-card>
<a-card class="relative bg-teal-400 w-72 h-36 text-white rounded-xl">
<div class="flex space-x-9">
<p class="absolute left-4 top-4">用户管理模块</p>
<p class="absolute right-4 top-4">负责人: 无</p>
</div>
<div class="flex flex-col mt-8">
<p class="text-green-100">剩余 5 天</p>
<CaretUpOutlined class="absolute bottom-[32%] ml-2"/>
</div>
<div class="left-0 absolute bottom-0 h-[35%] w-full bg-white flex justify-center items-center space-x-3">
<div class="text-teal-300 flex absolute left-5">
<CheckOutlined class="mt-1"/>
<p >进行中</p>
</div>
<div class="flex absolute right-16">
<p class="text-teal-300 font-bold text-2xl">2</p>
<p class="text-teal-300 mt-2">人/天</p>
</div>
<button class="absolute right-8 w-6 h-6 flex items-center justify-center bg-teal-400 text-black rounded-full transition duration-300 ease-in-out transform hover:scale-105" @click="$router.push('/WorkLoad/I_Manage/UserManageModule')">
<svg aria-hidden="true" class="rtl:rotate-180 w-4 h-4 text-white" fill="none" viewBox="0 0 14 10" xmlns="http://www.w3.org/2000/svg">
<path d="M1 5h12m0 0L9 1m4 4L9 9" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2"/>
</svg>
</button>
</div>
</a-card>
<a-card class="relative bg-rose-400 w-72 h-36 text-white rounded-xl">
<div class="flex space-x-9">
<p class="absolute left-4 top-4">权限管理模块</p>
<p class="absolute right-4 top-4">负责人: 无</p>
</div>
<div class="flex flex-col mt-8">
<p class="text-green-100">剩余 1 天</p>
<CaretUpOutlined class="absolute bottom-[32%] ml-2"/>
</div>
<div class="left-0 absolute bottom-0 h-[35%] w-full bg-white flex justify-center items-center space-x-3">
<div class="text-rose-400 flex absolute left-5">
<CheckOutlined class="mt-1"/>
<p >进行中</p>
</div>
<div class="flex absolute right-16">
<p class="text-rose-400 font-bold text-2xl">2</p>
<p class="text-rose-400 mt-2">人/天</p>
</div>
<button class="absolute right-8 w-6 h-6 flex items-center justify-center bg-rose-400 text-black rounded-full transition duration-300 ease-in-out transform hover:scale-105" @click="$router.push('/WorkLoad/I_Manage/AuthorityManageModule')">
<svg aria-hidden="true" class="rtl:rotate-180 w-4 h-4 text-white" fill="none" viewBox="0 0 14 10" xmlns="http://www.w3.org/2000/svg">
<path d="M1 5h12m0 0L9 1m4 4L9 9" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2"/>
</svg>
</button>
</div>
</a-card>
</div> </div>
</div> </div>
<!--新增子模块对话框--> <!--新增子模块对话框-->
@ -133,10 +83,26 @@
</template> </template>
<script setup> <script setup>
import {CaretUpOutlined, CheckOutlined} from '@ant-design/icons-vue'; import {CaretUpOutlined, CheckOutlined} from '@ant-design/icons-vue';
import {ref} from 'vue'; import {onMounted, ref} from 'vue';
import request from "@/js/request.js";
const AddModule = ref(false) const AddModule = ref(false)
function showAddModal(){ function showAddModal(){
AddModule.value = true; AddModule.value = true;
} }
//根据子系统id获取子模块
const token = window.localStorage.getItem('token')
const ChildModules = ref([]);
const params = new URLSearchParams(window.location.search);
const sysId = params.get('id');
onMounted(() => {
request.moduleGetBySysId(sysId, token).then((res) => {
console.log("ChildModules:", res)
ChildModules.value = res.data.data
})
})
</script> </script>

76
src/views/WorkLoadPage/I_Manage.vue
View File

@ -23,23 +23,29 @@
</a-checkable-tag> </a-checkable-tag>
</div> </div>
<div> <div>
<a-checkbox-group v-model:value="data.isFinish" :options="options" /> <a-checkbox-group v-model:value="data.isFinish" :options="options"/>
</div> </div>
</div> </div>
</div> </div>
<div class="mt-12 ml-12 flex space-x-16 h-full"> <div class="mt-12 ml-12 flex space-x-16 h-full">
<div class="flex space-x-9"> <div class="flex space-x-9">
<a-card v-for="(ChildProject, index) in ChildProjects" :key="index" class="transition-transform transform-gpu hover:scale-105 relative w-[450px] h-64 rounded-none bg-cover bg-center bg-[url('@/assert/images/img23.jpg')]" @mouseleave="showButton[index]=false" @mouseover="showButton[index]=true"> <a-card v-for="(ChildProject, index) in ChildProjects" :key="index"
class="transition-transform transform-gpu hover:scale-105 relative w-[450px] h-64 rounded-none bg-cover bg-center bg-[url('@/assert/images/img23.jpg')]"
@mouseleave="showButton[index]=false" @mouseover="showButton[index]=true">
<div class="flex absolute left-0 bottom-0 min-h-[30%] w-full bg-white"> <div class="flex absolute left-0 bottom-0 min-h-[30%] w-full bg-white">
<p class="ml-6 mt-4 text-2xl font-bold tracking-tight text-gray-900">{{ChildProject.name}}</p> <p class="ml-6 mt-4 text-2xl font-bold tracking-tight text-gray-900">{{ ChildProject.name }}</p>
<div class="flex mt-7 space-x-3"> <div class="flex mt-7 space-x-3">
<p class="ml-14 text-lg">剩余</p> <p class="ml-14 text-lg">剩余</p>
<p class="text-xl text-green-400 font-bold">10天</p> <p class="text-xl text-green-400 font-bold">10天</p>
</div> </div>
<div class="ml-auto mr-10"> <div class="ml-auto mr-10">
<button v-if="showButton[index]" class="mt-8 w-6 h-6 flex items-center justify-center bg-green-400 text-black rounded-full transition duration-300 ease-in-out transform hover:scale-105" @click="$router.push('/WorkLoad/I_Manage/ChildSystem')"> <button v-if="showButton[index]"
<svg aria-hidden="true" class="rtl:rotate-180 w-4 h-4 text-white" fill="none" viewBox="0 0 14 10" xmlns="http://www.w3.org/2000/svg"> class="mt-8 w-6 h-6 flex items-center justify-center bg-green-400 text-black rounded-full transition duration-300 ease-in-out transform hover:scale-105"
<path d="M1 5h12m0 0L9 1m4 4L9 9" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2"/> @click="$router.push('/WorkLoad/I_Manage/ChildSystem?id=' + ChildProject.id)">
<svg aria-hidden="true" class="rtl:rotate-180 w-4 h-4 text-white" fill="none" viewBox="0 0 14 10"
xmlns="http://www.w3.org/2000/svg">
<path d="M1 5h12m0 0L9 1m4 4L9 9" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round"
stroke-width="2"/>
</svg> </svg>
</button> </button>
</div> </div>
@ -59,12 +65,13 @@ const showButton = reactive([]);
const token = window.localStorage.getItem('token') const token = window.localStorage.getItem('token')
const ChildProjects = ref([]); // 使用ref创建响应式数据 const ChildProjects = ref([]); // 使用ref创建响应式数据
const id = ref(2); const id = ref(2);
const tagAll=ref(true) const tagAll = ref(true)
const tagsData = ref([]); const tagsData = ref([]);
const selectTags = ref([false, false, false, false]); const selectTags = ref([false, false, false, false]);
const data =reactive({ const data = reactive({
tags:[], tags: [],
isFinish:[0,1,2,-1] isFinish: [0, 1, 2, -1],
is: 1
}) })
@ -86,30 +93,30 @@ const options = [
value: -1, value: -1,
}, },
] ]
watch(() =>data.isFinish, async (newValue, oldValue) =>{ watch(() => data.isFinish, async (newValue, oldValue) => {
console.log("data.isFinish", data.isFinish) console.log("data.isFinish", data.isFinish)
GetManageProject() GetManageProject()
}) })
onMounted(() =>{ onMounted(() => {
GetManageProject(); GetManageProject();
}) })
function GetManageProject(){ function GetManageProject() {
request.projectWorkGet(data, token).then((res) => { request.projectWorkGet(data, token).then((res) => {
ChildProjects.value = res.data.data; ChildProjects.value = res.data.data;
}) })
} }
const handleClickAll=(checked)=>{ const handleClickAll = (checked) => {
if(checked){ if (checked) {
selectTags.value.forEach((item,index)=>{ selectTags.value.forEach((item, index) => {
selectTags.value[index]=false selectTags.value[index] = false
}) })
// 发送获取全部数据的请求 // 发送获取全部数据的请求
request.projectGet(token).then(res=>{ request.projectGet(token).then(res => {
console.log(res.data.data) console.log(res.data.data)
}) })
} }
@ -117,45 +124,40 @@ const handleClickAll=(checked)=>{
} }
// 当选中其他的时候， 全部 不选中 // 当选中其他的时候， 全部 不选中
const handleChange = (tag, checked) => { const handleChange = (tag, checked) => {
if(checked){ if (checked) {
tagAll.value=false tagAll.value = false
} } else {
else{ let flag = true
let flag=true selectTags.value.forEach((item, index) => {
selectTags.value.forEach((item,index)=>{ if (item) {
if(item){ flag = false
flag=false
} }
}) })
if(flag){ if (flag) {
tagAll.value=true tagAll.value = true
} }
} }
}; };
// 有关新增 // 有关新增
const handleAdd=()=>{ const handleAdd = () => {
console.log('新增') console.log('新增')
} }
// 当组件挂载时 请求tag数据 // 当组件挂载时 请求tag数据
onMounted( onMounted(
()=>{ () => {
// 设置标签 // 设置标签
request.getTagsProjectList(token).then(res=>{ request.getTagsProjectList(token).then(res => {
console.log(res.data.data) console.log(res.data.data)
tagsData.value=res.data.data tagsData.value = res.data.data
}) })
// 默认获取全部数据 // 默认获取全部数据
request.projectGet(token).then(res=>{ request.projectGet(token).then(res => {
console.log(res) console.log(res)
}) })

67
src/views/WorkLoadPage/I_Manage_ChildSystem.vue
View File

@ -8,9 +8,9 @@
<button class="rounded-lg bg-green-400 hover:bg-green-500 p-1.5 text-white">编辑</button> <button class="rounded-lg bg-green-400 hover:bg-green-500 p-1.5 text-white">编辑</button>
<button class="rounded-lg bg-red-500 hover:bg-red-600 p-1.5 text-white" @click="showAddModal">新增子系统</button> <button class="rounded-lg bg-red-500 hover:bg-red-600 p-1.5 text-white" @click="showAddModal">新增子系统</button>
</div> </div>
<div class="mt-12 ml-8 flex space-x-16 h-full" > <div class="mt-12 ml-8 flex space-x-16 h-full">
<div class="flex flex-col space-y-6 border-r border-gray-200 w-80 h-full p-8"> <div class="flex flex-col space-y-6 border-r border-gray-200 w-80 h-full p-8">
<p class="text-lg">项目名称：梁溪区纪委大数据管理平台{{ChildSystems.name}}</p> <p class="text-lg">项目名称：梁溪区纪委大数据管理平台{{ ChildSystems.name }}</p>
<p>项目周期：3个月</p> <p>项目周期：3个月</p>
<p>项目开始时间：</p> <p>项目开始时间：</p>
<p>项目完成时间：</p> <p>项目完成时间：</p>
@ -21,16 +21,22 @@
</div> </div>
<div class="flex flex-row justify-start space-x-5 container"> <div class="flex flex-row justify-start space-x-5 container">
<div v-for="(ChildSystem, index) in ChildSystems" :key="index" class="flex flex-row justify-start space-x-5"> <div v-for="(ChildSystem, index) in ChildSystems" :key="index" class="flex flex-row justify-start space-x-5">
<a-card class="transition-transform transform-gpu hover:scale-105 relative w-[260px] h-[300px] bg-cover bg-center bg-[url('@/assert/images/img44.jpg')]" @mouseleave="showButton[index]=false" @mouseover="showButton[index]=true"> <a-card
class="transition-transform transform-gpu hover:scale-105 relative w-[260px] h-[300px] bg-cover bg-center bg-[url('@/assert/images/img44.jpg')]"
@mouseleave="showButton[index]=false" @mouseover="showButton[index]=true">
<div class="flex absolute left-0 bottom-0 min-h-[30%] w-full bg-white"> <div class="flex absolute left-0 bottom-0 min-h-[30%] w-full bg-white">
<div class="flex flex-col"> <div class="flex flex-col">
<p class="ml-6 mt-4 text-3xl font-bold tracking-tight text-gray-900">01</p> <p class="ml-6 mt-4 text-3xl font-bold tracking-tight text-gray-900">01</p>
<p class="ml-3 text-xl">{{ChildSystem.name}}</p> <p class="ml-3 text-xl">{{ ChildSystem.name }}</p>
</div> </div>
<div class="ml-auto mr-10"> <div class="ml-auto mr-10">
<button v-if="showButton[index]" class="mt-8 w-6 h-6 flex items-center justify-center bg-green-400 text-black rounded-full transition duration-300 ease-in-out transform hover:scale-105" @click="EnterChildModule(ChildSystem)" > <button v-if="showButton[index]"
<svg aria-hidden="true" class="rtl:rotate-180 w-4 h-4 text-white" fill="none" viewBox="0 0 14 10" xmlns="http://www.w3.org/2000/svg"> class="mt-8 w-6 h-6 flex items-center justify-center bg-green-400 text-black rounded-full transition duration-300 ease-in-out transform hover:scale-105"
<path d="M1 5h12m0 0L9 1m4 4L9 9" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2"/> @click="EnterChildModule(ChildSystem)">
<svg aria-hidden="true" class="rtl:rotate-180 w-4 h-4 text-white" fill="none" viewBox="0 0 14 10"
xmlns="http://www.w3.org/2000/svg">
<path d="M1 5h12m0 0L9 1m4 4L9 9" stroke="currentColor" stroke-linecap="round"
stroke-linejoin="round" stroke-width="2"/>
</svg> </svg>
</button> </button>
</div> </div>
@ -41,10 +47,13 @@
</div> </div>
</div> </div>
<!--新增子系统对话框--> <!--新增子系统对话框-->
<a-modal v-model:open="AddModule" :okButtonProps="{ style: { backgroundColor: '#347def',color: 'white'} }" cancel-text="取消" ok-text="确定" title="新增子系统"> <a-modal v-model:open="AddModule" :okButtonProps="{ style: { backgroundColor: '#347def',color: 'white'} }"
cancel-text="取消" ok-text="确定" title="新增子系统">
<a-form> <a-form>
<div class="flex space-x-5"> <div class="flex space-x-5">
<a-form-item class="my-4" label="子系统名称："><a-input class="h-8 w-36 border-gray-300 rounded-md"/></a-form-item> <a-form-item class="my-4" label="子系统名称：">
<a-input class="h-8 w-36 border-gray-300 rounded-md"/>
</a-form-item>
<a-form-item class="my-4" label="状态："> <a-form-item class="my-4" label="状态：">
<a-select <a-select
ref="select" ref="select"
@ -58,18 +67,24 @@
</a-form-item> </a-form-item>
</div> </div>
<div class="flex space-x-5"> <div class="flex space-x-5">
<a-form-item class="my-4" label="周期："><a-input class="ml-[43px] h-8 w-36 border-gray-300 rounded-md"/></a-form-item> <a-form-item class="my-4" label="周期：">
<a-form-item class="my-4" label="工作量："><a-input class="ml-[15px] h-8 w-36 border-gray-300 rounded-md"/></a-form-item> <a-input class="ml-[43px] h-8 w-36 border-gray-300 rounded-md"/>
</a-form-item>
<a-form-item class="my-4" label="工作量：">
<a-input class="ml-[15px] h-8 w-36 border-gray-300 rounded-md"/>
</a-form-item>
</div> </div>
<div class="flex space-x-5"> <div class="flex space-x-5">
<a-form-item class="my-4" label="负责人："><a-input class="ml-[30px] h-8 w-36 border-gray-300 rounded-md"/></a-form-item> <a-form-item class="my-4" label="负责人：">
<a-input class="ml-[30px] h-8 w-36 border-gray-300 rounded-md"/>
</a-form-item>
<a-form-item class="my-4" label="系统描述："> <a-form-item class="my-4" label="系统描述：">
<a-textarea :rows="1" class="w-36 h-8" /> <a-textarea :rows="1" class="w-36 h-8"/>
</a-form-item> </a-form-item>
</div> </div>
</a-form> </a-form>
</a-modal > </a-modal>
</template> </template>
<script setup> <script setup>
import {onMounted, reactive, ref} from "vue"; import {onMounted, reactive, ref} from "vue";
@ -79,32 +94,26 @@ import router from "@/router/index.js";
const showButton = reactive([]); const showButton = reactive([]);
const AddModule = ref(false) const AddModule = ref(false)
const token = window.localStorage.getItem('token') const token = window.localStorage.getItem('token')
const id = window.localStorage.getItem('id')
function showAddModal(){ function showAddModal() {
AddModule.value = true; AddModule.value = true;
} }
const ChildProjects = ref([]); // 使用ref创建响应式数据 const params = new URLSearchParams(window.location.search);
const getId = params.get('id');
const ChildSystems = ref([]); const ChildSystems = ref([]);
const data =reactive({
tags:[],
isFinish:[0,1,2,-1]
})
onMounted(() => { onMounted(() => {
request.projectWorkGet(data, token).then((res) => { request.moduleGetByProjectId(getId, token).then((res) => {
ChildProjects.value = res.data.data; console.log("childSystems:", res)
})
request.moduleGetByProjectId(id, token).then((res) => {
console.log("childModules:", res)
ChildSystems.value = res.data.data ChildSystems.value = res.data.data
}) })
}) })
function EnterChildModule(ChildSystem){ function EnterChildModule(ChildSystem) {
console.log(ChildSystem.id) console.log(ChildSystem.id)
window.localStorage.setItem('id',ChildSystem.id) router.push('/WorkLoad/I_Manage/ChildModule?id=' + ChildSystem.id)
router.push('/WorkLoad/I_Manage/ChildModule')
} }
</script> </script>