hz/fe-manage
1
0
Fork 0
mirror of https://codeup.aliyun.com/67762337eccfc218f6110e0e/vue/fe-manage.git synced 2025-12-15 22:06:45 +08:00
Code Issues Packages Projects Releases Wiki Activity
Files
ed9d952566005004a6d1ddbef9f48c9308bd3240
fe-manage/src/views/projectcenter/ProjectManage.vue

4027 lines
124 KiB
Vue
Raw Blame History

This file contains ambiguous Unicode characters
This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.
<!-- 项目页面 -->
<template>
<div class="projectManage">
<!-- 搜索框及按钮 -->
<div class="filter">
<div class="filterItems">
<div class="select">
<a-input v-model:value="sProjectName" style="width: 270px; height: 40px; border-radius: 8px;"
placeholder="请输入项目名称" @change="sProjectNameChange" allowClear showSearch>
</a-input>
</div>
<div class="select">
<a-input v-model:value="sProjectOrder" style="width: 270px; height: 40px; border-radius: 8px;"
placeholder="请输入项目经理" @change="sProjectOrderChange" allowClear showSearch>
</a-input>
</div>
<div class="select">
<a-select v-model:value="sProjectState" style="width: 270px" placeholder="请选择状态" :options="sProjectStateList"
@change="sProjectStateChange" allowClear showSearch></a-select>
</div>
<div class="select">
<a-date-picker v-model:value="sProjectTime" @change="sProjectTimeChange" type="date" placeholder="创建时间"
style="width: 270px" />
</div>
<div style="display: flex; margin-bottom: 20px">
<div class="btnn btn1">
<div class="search"></div>
<div class="btnText" v-on:click="searchSubmit">搜索</div>
</div>
<div class="btn btn2">
<div class="search"></div>
<div class="btnText" v-on:click="searchReset">重置</div>
</div>
</div>
</div>
<div class="btns">
<div class="btn btn3" @click="showModal1">
<div class="search"></div>
<div class="btnText">创建项目</div>
</div>
</div>
</div>
<!-- 搜索框及按钮 -->
<!-- 表格 -->
<div class="tableBox">
<a-table :columns="columns" :data-source="tableData" :loading="tableDataTotal === -1 ? true : false"
:scroll="{ x: 700 }" @expand="expandTable" :pagination="false">
<!-- <template #bodyCell="{ column }">
<template v-if="column.key === 'operation'">
<div class="operation">
<span>编辑</span>
<span style="margin-left: 21px">授权</span>
<span style="margin-left: 21px">创建子项目</span>
<span style="margin-left: 21px" class="more">
<span>更多</span>
<div class="moreArrow"></div>
<div class="moreItems"></div>
</span>
</div>
</template>
</template> -->
</a-table>
<div class="tableBox">
<div class="pa">
<a-pagination v-if="tableDataTotal > 10" showSizeChanger="true" showQuickJumper="true" hideOnSinglePage="true"
:pageSize="pageSize" v-model:current="currentPage" :total="tableDataTotal" class="pagination"
@change="changePagination" />
</div>
</div>
</div>
<!-- 表格 -->
<!-- 无项目 -->
<div class="tableBox" style="display: none">
<div class="taskbox" @click="showModal1" style="background: linear-gradient(180deg, #ddeaff, #f0f8fe)">
<div class="leftt">
<img src="../../assets/images/taskpage/left2.png" />
</div>
<div class="photo">
<img src="../../assets/images/projectadd/nopro.png" />
</div>
<div class="rightt">
<img src="../../assets/images/taskpage/right2.png" />
</div>
<div class="centerbox" style="color: rgba(78, 166, 255, 1)">
创建项目
</div>
<div class="centermain">点击创建项目任务</div>
</div>
</div>
<!-- 创建子项目弹窗 -->
<div>
<a-modal v-model:visible="sonproject" :title="null" @ok="closeModal" :footer="null" :closable="false"
wrapClassName="sonproject" width="764px" height="356px">
<div class="modalHeader" style="
width: 100%;
height: 68px;
display: flex;
align-items: center;
justify-content: space-between;
">
<div class="headerLeft" style="margin-left: 32px">
<span class="headerLeftText" style="font-size: 16px">请选择项目类别</span>
</div>
<div style="cursor: pointer; margin-right: 32px" @click="closeModal">
<img style="width: 22px; height: 22px" src="../../assets/images/basicinfo/close22.png" />
</div>
</div>
<div class="modalMain">
<div @click="createChildProject" class="taskbox" style="
margin-right: 24px;
background: linear-gradient(180deg, #ddeaff 0%, #f0f8fe 100%);
">
<div class="leftt">
<img src="../../assets/images/taskpage/left2.png" />
</div>
<div class="photo">
<img src="../../assets/images/taskpage/picture4.png" />
</div>
<div class="rightt">
<img src="../../assets/images/taskpage/right2.png" />
</div>
<div class="centerbox" style="color: rgba(78, 166, 255, 1)">
单层子项目
</div>
</div>
<div class="taskbox" @click="showModal3" style="
background: linear-gradient(180deg, #fef3dd 0%, #fffaf0 100%);
">
<div class="leftt">
<img src="../../assets/images/taskpage/left1.png" />
</div>
<div class="photo">
<img src="../../assets/images/taskpage/picture5.png" />
</div>
<div class="rightt">
<img src="../../assets/images/taskpage/right1.png" />
</div>
<div class="centerbox" style="color: rgba(255, 182, 78, 1)">
多层子项目
</div>
</div>
</div>
</a-modal>
</div>
<!-- 创建子项目弹窗 -->
<!-- 创建项目弹窗 -->
<div>
<div>
<a-modal v-model:visible="estabish" :title="null" @ok="closeModal1" :footer="null" :closable="false"
wrapClassName="estabish" width="638px" height="468px">
<div class="modalHeader" style="
width: 100%;
height: 68px;
display: flex;
align-items: center;
justify-content: space-between;
">
<div class="headerLeft" style="margin-left: 32px">
<span class="headerLeftText" style="font-size: 16px">请选择项目类别</span>
</div>
<div style="cursor: pointer; margin-right: 32px" @click="closeModal1">
<img style="width: 22px; height: 22px" src="../../assets/images/basicinfo/close22.png" />
</div>
</div>
<div class="modalMain">
<router-link to="/projectadd">
<div class="taskbox" style="
background: linear-gradient(180deg, #ddeaff 0%, #f0f8fe 100%);
">
<div class="leftt">
<img src="../../assets/images/taskpage/left2.png" />
</div>
<div class="photo">
<img src="../../assets/images/taskpage/picture6.png" />
</div>
<div class="rightt">
<img src="../../assets/images/taskpage/right2.png" />
</div>
<div class="centerbox" style="color: rgba(78, 166, 255, 1)">
单层项目
</div>
<div class="centermain">
不包含子项目，直接填写项目基础信息后创建任务
</div>
</div>
</router-link>
<div class="taskbox" @click="showModal2" style="
margin-bottom: 40px;
background: linear-gradient(180deg, #e5f6ec 0%, #eef9f3 100%);
">
<div class="leftt">
<img src="../../assets/images/taskpage/left3.png" />
</div>
<div class="photo">
<img src="../../assets/images/taskpage/picture7.png" />
</div>
<div class="rightt">
<img src="../../assets/images/taskpage/right3.png" />
</div>
<div class="centerbox1" style="color: rgba(93, 201, 136, 1)">
多层项目
</div>
<div class="centermain1">
包含子项目，分为多层子项目和单层子项目，多层子项目可创建班级，通过班级填写基础信息并创建任务
</div>
</div>
</div>
</a-modal>
</div>
</div>
<!-- 创建项目弹窗 -->
<!-- 创建多层项目弹窗 -->
<div>
<a-modal v-model:visible="doublepro" :title="null" @ok="closeModal2" :footer="null" :closable="false"
wrapClassName="doublepro" width="624px" height="476px">
<div class="modalHeader" style="
width: 100%;
height: 68px;
display: flex;
align-items: center;
justify-content: space-between;
">
<div class="headerLeft" style="margin-left: 32px">
<span class="headerLeftText" style="font-size: 16px">创建多层项目</span>
</div>
<div style="cursor: pointer; margin-right: 32px" @click="closeModal2">
<img style="width: 22px; height: 22px" src="../../assets/images/basicinfo/close22.png" />
</div>
</div>
<div class="modalMain">
<div class="name">
<div class="star" style="margin-top: -4px">
<img style="width: 10px; height: 10px" src="../../assets/images/basicinfo/asterisk.png" />
</div>
<div class="inname">项目名称:</div>
<div class="in">
<a-input v-model:value="value1" show-count :maxlength="30" placeholder="请输入项目名称"
style="border-radius: 8px" />
</div>
</div>
<div class="name">
<div class="star" style="margin-top: -4px">
<img style="width: 10px; height: 10px" src="../../assets/images/basicinfo/asterisk.png" />
</div>
<div class="inname">分类:</div>
<div class="in select">
<a-select v-model:value="value2" placeholder="四个养成" :options="classifyList" @change="classificationChange"
style="border-radius: 8px; height: 40px" />
</div>
</div>
<div class="name">
<div class="star" style="margin-top: -4px">
<img style="width: 10px; height: 10px" src="../../assets/images/basicinfo/asterisk.png" />
</div>
<div class="inname">项目经理:</div>
<div class="in">
<a-select v-model:value="value3" mode="multiple" placeholder="请选择项目经理" :options="classifyList1"
@change="classificationChange1" style="border-radius: 8px; height: 40px" />
</div>
</div>
<div class="name">
<div class="star" style="margin-top: -4px">
<img style="width: 10px; height: 10px" src="../../assets/images/basicinfo/asterisk.png" />
</div>
<div class="inname">资源归属:</div>
<div class="in select">
<a-select v-model:value="value5" placeholder="请选择资源归属" :options="classifyList5"
@change="classificationChange5" style="border-radius: 8px; height: 40px" />
</div>
</div>
<div class="pubtn">
<a-button class="pubtn1" @click="closeModal2">取消</a-button>
<a-button class="pubtn2" @click="createStoreyProject">确定</a-button>
</div>
</div>
</a-modal>
</div>
<!-- 创建多层项目弹窗 -->
<!-- 创建多层子项目弹窗 -->
<div>
<a-modal v-model:visible="doublesonpro" :title="null" @ok="closeModal3" :footer="null" :closable="false"
wrapClassName="doublesonpro" width="624px" height="476px">
<div class="modalHeader" style="
width: 100%;
height: 68px;
display: flex;
align-items: center;
justify-content: space-between;
">
<div class="headerLeft" style="margin-left: 32px">
<span class="headerLeftText" style="font-size: 16px">创建多层子项目</span>
</div>
<div style="cursor: pointer; margin-right: 32px" @click="closeModal3">
<img style="width: 22px; height: 22px" src="../../assets/images/basicinfo/close22.png" />
</div>
</div>
<div class="modalMain">
<div style="margin-left: 40px; margin-top: 40px">
<span style="color: #000000; font-size: 14px">项目归属：</span>
<span style="color: #999999; font-size: 14px; margin-left: 10px">{{ currentProjectName }}</span>
</div>
<div class="name">
<div class="star" style="margin-top: -4px">
<img style="width: 10px; height: 10px" src="../../assets/images/basicinfo/asterisk.png" />
</div>
<div class="inname">子项目名称:</div>
<div class="in">
<a-input v-model:value="value6" placeholder="请输入项目名称" style="border-radius: 8px; height: 40px" />
</div>
</div>
<div class="name">
<div class="star" style="margin-top: -4px">
<img style="width: 10px; height: 10px" src="../../assets/images/basicinfo/asterisk.png" />
</div>
<div class="inname">分类:</div>
<div class="in select">
<a-select v-model:value="value7" @change="classificationChange2" :options="classifyList2"
placeholder="四个养成" style="border-radius: 8px; height: 40px" />
</div>
</div>
<div class="name">
<div class="star" style="margin-top: -4px">
<img style="width: 10px; height: 10px" src="../../assets/images/basicinfo/asterisk.png" />
</div>
<div class="inname">子项目经理:</div>
<div class="in">
<a-select v-model:value="value8" mode="multiple" @change="classificationChange3" :options="classifyList3"
placeholder="自动带出 可编辑" style="border-radius: 8px; height: 40px" />
</div>
</div>
<div class="name">
<div class="star" style="margin-top: -4px">
<img style="width: 10px; height: 10px" src="../../assets/images/basicinfo/asterisk.png" />
</div>
<div class="inname">资源归属:</div>
<div class="in select">
<a-select v-model:value="value9" @change="classificationChange4" :options="classifyList4"
placeholder="请选择资源归属" style="border-radius: 8px; height: 40px" />
</div>
</div>
<div class="pubtn">
<a-button class="pubtn1" @click="closeModal3">取消</a-button>
<a-button class="pubtn2" @click="createChildsProject">确定</a-button>
</div>
</div>
</a-modal>
</div>
<!-- 创建多层子项目弹窗 -->
<!-- 复制路径弹窗 -->
<a-modal v-model:visible="copyModal" :footer="null" :closable="closeCopy" wrapClassName="CopyModal" centered="true">
<div class="delete">
<div class="del_header"></div>
<div class="del_main">
<div class="header">
<div class="icon"></div>
<span>提示</span>
<div class="close_exit" @click="closeCopyModal"></div>
</div>
<div class="body">
<span>您确定要复制此路径吗</span>
</div>
<div class="del_btnbox">
<div class="del_btn btn1">
<div class="btnText" @click="delete_exit">取消</div>
</div>
<div class="del_btn btn2">
<div class="btnText" @click="delete_exit">确定</div>
</div>
</div>
</div>
</div>
</a-modal>
<!-- 结束项目弹窗 -->
<a-modal v-model:visible="stopModal" :footer="null" :closable="closeStop" wrapClassName="CopyModal" centered="true">
<div class="delete">
<div class="del_header"></div>
<div class="del_main">
<div class="header">
<div class="icon"></div>
<span>提示</span>
<div class="close_exit" @click="closeStopModal"></div>
</div>
<div class="body">
<span>是否结束项目</span>
<div class="back">
（项目结束后学员将无法继续学习，此操作不可逆）
</div>
</div>
<div class="del_btnbox">
<div class="del_btn btn1">
<div class="btnText" @click="delete_exit">取消</div>
</div>
<div class="del_btn btn2">
<div class="btnText" @click="delete_exit">确定</div>
</div>
</div>
</div>
</div>
</a-modal>
<!-- 删除项目弹窗 -->
<a-modal v-model:visible="deleteModal" :footer="null" :closable="closeDelete" wrapClassName="CopyModal"
centered="true">
<div class="delete">
<div class="del_header"></div>
<div class="del_main">
<div class="header">
<div class="icon"></div>
<span>提示</span>
<div class="close_exit" @click="closeDeleteModal"></div>
</div>
<div class="body">
<span>您确定要删除此项目吗</span>
</div>
<div class="del_btnbox">
<div class="del_btn btn1">
<div class="btnText" @click="delete_exit">取消</div>
</div>
<div class="del_btn btn2">
<div class="btnText" @click="delete_exit">确定</div>
</div>
</div>
</div>
</div>
</a-modal>
<!-- 存为模板弹窗 -->
<a-modal v-model:visible="startModal" :footer="null" :closable="closeStart" wrapClassName="CopyModal"
centered="true">
<div class="delete">
<div class="del_header"></div>
<div class="del_main">
<div class="header">
<div class="icon"></div>
<span>提示</span>
<div class="close_exit" @click="closeStartModal"></div>
</div>
<div class="body">
<span>您确定要存为模板吗</span>
</div>
<div class="del_btnbox">
<div class="del_btn btn1">
<div class="btnText" @click="delete_exit">取消</div>
</div>
<div class="del_btn btn2">
<div class="btnText" @click="delete_exit">确定</div>
</div>
</div>
</div>
</div>
</a-modal>
<!-- 撤回路径弹窗 -->
<a-modal v-model:visible="backModal" :footer="null" :closable="closeBack" wrapClassName="CopyModal" centered="true">
<div class="delete">
<div class="del_header"></div>
<div class="del_main">
<div class="header">
<div class="icon"></div>
<span>提示</span>
<div class="close_exit" @click="closeBackModal"></div>
</div>
<div class="body">
<span>是否撤回项目</span>
<div class="back">（项目撤回后学员进度保留，发布后可继续学习）</div>
</div>
<div class="del_btnbox">
<div class="del_btn btn1">
<div class="btnText" @click="delete_exit">取消</div>
</div>
<div class="del_btn btn2">
<div class="btnText" @click="delete_exit">确定</div>
</div>
</div>
</div>
</div>
</a-modal>
<!-- 归属权抽屉 -->
<proj-owner-ship v-model:ProjOwnervisible="ProjOwnervisible" />
<!-- 授权名单抽屉 -->
<proj-power-list v-model:ProjPvisible="ProjPvisible" />
<!-- 查看权抽屉 -->
<proj-check-ship v-model:ProjCheckvisible="ProjCheckvisible" />
<!-- 管理权抽屉 -->
<proj-manage-ship v-model:ProjManagevisible="ProjManagevisible" />
</div>
</template>
<script>
import { reactive, toRefs, onMounted, ref } from "vue";
import { message } from 'ant-design-vue';
import { useRouter } from "vue-router";
import ProjOwnerShip from "../../components/drawers/ProjectOwn";
import ProjPowerList from "../../components/drawers/ProjPowerList";
import ProjCheckShip from "../../components/drawers/ProjCheckPower";
import ProjManageShip from "../../components/drawers/ProjManagePower";
import * as api from "../../api/index";
import { toDate } from "../../api/method";
export default {
name: "projectManage",
components: { ProjOwnerShip, ProjPowerList, ProjCheckShip, ProjManageShip },
setup() {
const state = reactive({
value6: "",
value7: "",
value8: "",
projectNameList: [
{
id: 1,
value: "项目一",
label: "项目一",
},
{
id: 2,
value: "项目二",
label: "项目二",
},
{
id: 3,
value: "项目三",
label: "项目三",
},
{
id: 4,
value: "项目四",
label: "项目四",
},
],
projectName: null,
selectTime: null,
sonproject: false,
estabish: false,
doublepro: false,
doublesonpro: false,
copyModal: false, //复制弹窗
closeCopy: false, //复制弹窗关闭图标
stopModal: false, //停用弹窗
closeStop: false, //停用弹窗关闭图标
deleteModal: false, //删除弹窗
closeDelete: false, //删除弹窗关闭图标
startModal: false, //启用弹窗
closeStart: false, //启用弹窗关闭图标
backModal: false, //撤回弹窗
closeBack: false, //撤回弹窗关闭图标
ProjOwnervisible: false,
ProjPvisible: false,
ProjCheckvisible: false,
ProjManagevisible: false,
currentProjectId: '',
currentProjectName: '',
});
// 数据接入 - start -
const router = useRouter();
// 搜索数据
const sProjectName = ref('');
const sProjectOrder = ref('');
const sProjectState = ref('');
const sProjectTime = ref('');
const sProjectStateList = ref([
{ value: 0, label: '草稿' },
{ value: 1, label: '进行中' },
{ value: 2, label: '未开始' },
{ value: 3, label: '已结束' },
]);
let name = '';
const sProjectNameChange = (key) => {
console.log('项目名称', key.target.value)
name = key.target.value
}
let managerid = '';
const sProjectOrderChange = (key) => {
console.log('项目经理', key.target.value)
managerid = key.target.value;
}
let status = '';
const sProjectStateChange = (key) => {
console.log('项目状态', key)
status = key;
}
let beginTime = '';
let endTime = '';
const sProjectTimeChange = (key, value) => {
console.log('项目时间', key)
console.log('项目时间', value)
console.log(new Date('2019-10-08 18:22:37').getTime())
beginTime = Math.ceil(new Date(value + ' ' + '00:00:00').getTime() / 1000);
endTime = Math.ceil(new Date(value + ' ' + '23:59:59').getTime() / 1000);
}
const searchReset = () => {
sProjectName.value = "";
sProjectOrder.value = "";
sProjectState.value = null;
sProjectTime.value = null;
name = "";
beginTime = "";
endTime = "";
status = null;
managerid = "";
getTableDate();
}
const searchSubmit = () => {
const obj = {
pageNo: 1,
pageSize: 10,
beginTime: beginTime,
endTime: endTime,
status: status,
name: name,
manager: managerid
}
let searchList = [];
for (let i in obj) {
if (obj[i] !== "") {
if (obj[i] !== null) {
searchList.push(1);
} else {
searchList.push(0);
}
} else {
searchList.push(0);
}
}
if (searchList.toString().indexOf("1") == -1) {
message.destroy();
message.warning("请输入搜索条件后进行搜索");
}
console.log('搜索的数据筛选条件', obj, searchList.toString())
getTableDate(obj);
}
// 项目分类
const classifyList = ref([
{ value: 1, label: "管理者" },
{ value: 2, label: "领军者" },
{ value: 3, label: "产业人" },
]);
const classifyList1 = ref([
{ value: 1, label: "李俊国" },
{ value: 2, label: "将小米" },
{ value: 3, label: "刘孟君" },
]);
const value1 = ref("");
const value2 = ref([]);
const value3 = ref([]);
const value4 = ref("");
const value5 = ref([]);
const classifyList5 = ref([
{ value: 1, label: '项目一' },
{ value: 2, label: '项目二' },
{ value: 3, label: '项目三' },
]);
let sourceBelongId = '';
const classificationChange5 = (key) => {
console.log(`selected ${key}`);
sourceBelongId = key;
}
let type = "";
const classificationChange = (key) => {
console.log(`selected ${key}`);
console.log(classifyList.value[key - 1].label);
type = key;
};
let manager = "";
let managerId = "";
const classificationChange1 = (key) => {
console.log(`selected ${key}`, classifyList1);
let mstr = '';
let midstr = '';
for (let i = 0; i < key.length; i++) {
if (key.length - 1 !== i) {
midstr += key[i] + ',';
mstr += classifyList1.value[i].label + ',';
} else {
midstr += key[i];
mstr += classifyList1.value[i].label;
}
}
console.log(mstr, midstr)
manager = mstr;
managerId = midstr;
};
// 创建多层项目
const createStoreyProject = () => {
// 接口需要传递的参数信息
const errorMsgs = {
"name": "请输入项目名称",
"category": "请选择项目分类",
"manager": "请选择项目经理",
"sourceBelongId": "请选择资源归属"
}
let obj = {
name: value1.value,
type: 1,
category: type,
manager: manager,
managerId: managerId,
sourceBelongId: sourceBelongId,
};
console.log('创建多层项目提交的数据格式', obj);
for (let i in errorMsgs) {
console.log(obj[i])
if (obj[i] === "" || obj[i] === undefined) {
message.destroy()
message.warning(errorMsgs[i])
return
}
}
api.createProject(obj).then(res => {
console.log(res)
if (res.status == 200 && res.data.code == 200) {
// 创建成功 隐藏弹出框
value1.value = "";
type = "";
manager = "";
managerId = "";
sourceBelongId = "";
value2.value = [];
value3.value = [];
value4.value = "";
value5.value = [];
state.doublepro = false;
}
}).catch(err => {
console.log(err)
})
};
// 取消按钮 清空输入的数据
const closeModal2 = () => {
value1.value = "";
type = "";
manager = "";
managerId = "";
sourceBelongId = "";
value2.value = [];
value3.value = [];
value4.value = "";
value5.value = [];
state.doublepro = false;
};
// 创建单层子项目 (需要传入多层项目的ProjectID)
const createChildProject = () => {
console.log(state.currentProjectId)
router.push({
path: '/sonproject',
query: { projectId: state.currentProjectId, name: state.currentProjectName }
});
}
// 创建多层子项目
const value6 = ref("");
const value7 = ref([]);
const value8 = ref([]);
const value9 = ref([]);
const classifyList2 = ref([
{ value: 1, label: '管理者' },
{ value: 2, label: '领军者' },
{ value: 3, label: '产业人' },
]);
let categoryT = '';
const classificationChange2 = (key) => {
console.log(`selected ${key}`);
categoryT = key;
};
const classifyList3 = ref([
{ value: 1, label: '李俊国' },
{ value: 2, label: '将小米' },
{ value: 3, label: '刘孟君' },
]);
let managerT = '';
let managerIdT = '';
const classificationChange3 = (key) => {
console.log(`selected ${key}`);
console.log(`selected ${key}`, classifyList3);
let mstr = '';
let midstr = '';
for (let i = 0; i < key.length; i++) {
if (key.length - 1 !== i) {
midstr += key[i] + ',';
mstr += classifyList3.value[i].label + ',';
} else {
midstr += key[i];
mstr += classifyList3.value[i].label;
}
}
console.log(mstr, midstr)
managerT = mstr;
managerIdT = midstr;
};
const classifyList4 = ref([
{ value: 1, label: '项目一' },
{ value: 2, label: '项目二' },
{ value: 3, label: '项目三' },
]);
let sourceBelongIdT = '';
const classificationChange4 = (key) => {
console.log(`selected ${key}`);
sourceBelongIdT = key;
};
// 取消按钮 清空数据
const closeModal3 = () => {
value6.value = "";
categoryT = "";
managerT = "";
managerIdT = "";
sourceBelongIdT = "";
value7.value = [];
value8.value = [];
value9.value = [];
state.doublesonpro = false;
};
const createChildsProject = () => {
const errorMsgs = {
"name": "请输入子项目名称",
"category": "请选择子项目分类",
"manager": "请选择子项目经理",
"sourceBelongId": "请选择资源归属"
}
let obj = {
name: value6.value,
type: 2,
category: categoryT,
manager: managerT,
managerId: managerIdT,
sourceBelongId: sourceBelongIdT,
};
console.log('创建多层子项目提交的数据格式', obj);
for (let i in errorMsgs) {
console.log(obj[i])
if (obj[i] === "" || obj[i] === undefined) {
message.destroy()
message.warning(errorMsgs[i])
return
}
}
value6.value = "";
categoryT = "";
managerT = "";
managerIdT = "";
sourceBelongIdT = "";
value7.value = [];
value8.value = [];
value9.value = [];
state.doublesonpro = false;
}
// 数据接入 - end -
onMounted(() => {
// console.log("执行");
});
const selectProjectName = (value, index) => {
console.log("value", value, index);
};
const expandTable = (e, a) => {
// console.log("惦记了");
console.log("e", e, a);
};
// 获取项目列表信息
let tableData = ref([]);
let currentPage = ref(1);
let tableDataTotal = ref('');
let pageSize = ref(10);
const columns = ref([
{
title: "项目名称",
dataIndex: "name",
key: "name",
width: 280,
// align: "center",
ellipsis: true,
// scopedSlots: { customRender: "action" }, //引入的插槽
// customRender: (text, record) => {
// console.log(text, record);
// return <span>{text.text}</span>;
// },
},
{
title: "项目经理",
dataIndex: "manager",
key: "manager",
width: 100,
align: "center",
},
{
title: "状态",
dataIndex: "status",
// width: "30%",
key: "status",
width: 100,
align: "center",
customRender: (value) => {
return (
<div>
{
value.record.status == 0 ?
"草稿" :
value.record.status == 1 ?
"进行中" :
value.record.status == 2 ?
"未开始" : "已结束"
}
</div>
)
}
},
{
title: "创建人",
dataIndex: "createName",
// width: "30%",
key: "createName",
width: 100,
align: "center",
},
{
title: "创建时间",
dataIndex: "createTime",
key: "createTime",
width: 180,
align: "center",
customRender: (value) => {
return (
<div>{toDate(value.record.createTime, "Y-M-D h:m:s")}</div>
)
}
},
{
title: "操作",
dataIndex: "operation",
key: "operation",
width: 300,
align: "center",
fixed: "right",
customRender: (value) => {
// console.log("value", value.record.type, value.record.status);
return value.record.type === 1 ? (
value.record.status === 0 ? (
<div class="operation">
<span class="operation1">编辑</span>
<div class="tableSelect">
<a-select
style="width: 50px"
value="授权"
// options={state.projectNameList}
dropdownClassName="tabledropdown"
>
<a-select-option value="权限名单" label="权限名单">
<div
onClick={() => {
showProjPrower();
}}
>
权限名单
</div>
</a-select-option>
<a-select-option value="归属权" label="归属权">
<div
onClick={() => {
console.log("点击了111");
showProjOwner();
}}
>
归属权
</div>
</a-select-option>
<a-select-option value="查看权" label="查看权">
<div
onClick={() => {
console.log("点击了111");
showProjCheck();
}}
>
查看权
</div>
</a-select-option>
<a-select-option value="管理权" label="管理权">
<div
onClick={() => {
showProjManage();
}}
>
管理权
</div>
</a-select-option>
</a-select>
</div>
<span
class="operation3"
style="cursor: pointer"
onClick={() => {
state.currentProjectId = value.record.projectId;
state.currentProjectName = value.record.name;
state.sonproject = true;
}}
>
创建子项目
</span>
<div class="tableSelect">
<a-select
style="width: 50px"
value="更多"
// options={state.projectNameList}
dropdownClassName="tabledropdown"
>
<a-select-option value="基础信息" label="基础信息">
<router-link to="/taskpage">基础信息</router-link>
</a-select-option>
<a-select-option value="存为模板" label="存为模板">
<div
onClick={() => {
showStartModal();
}}
>
存为模板
</div>
</a-select-option>
</a-select>
</div>
</div>
) : value.record.status === "进行中" ? (
<div class="operation">
<span class="operation1">查看</span>
<div class="tableSelect">
<a-select
style="width: 50px"
value="授权"
// options={state.projectNameList}
dropdownClassName="tabledropdown"
>
<a-select-option value="权限名单" label="权限名单">
<div
onClick={() => {
showProjPrower();
}}
>
权限名单
</div>
</a-select-option>
<a-select-option value="归属权" label="归属权">
<div
onClick={() => {
console.log("点击了111");
showProjOwner();
}}
>
归属权
</div>
</a-select-option>
<a-select-option value="查看权" label="查看权">
<div
onClick={() => {
console.log("点击了111");
showProjCheck();
}}
>
查看权
</div>
</a-select-option>
<a-select-option value="管理权" label="管理权">
<div
onClick={() => {
showProjManage();
}}
>
管理权
</div>
</a-select-option>
</a-select>
</div>
<span
class="operation3"
onClick={() => {
showCopyModal();
}}
>
复制
</span>
<span class="more"></span>
</div>
) : value.record.status === -1 ? (
<div class="operation">
<span class="operation1">查看</span>
<div class="tableSelect">
<a-select
style="width: 50px"
value="授权"
// options={state.projectNameList}
dropdownClassName="tabledropdown"
>
<a-select-option value="权限名单" label="权限名单">
<div
onClick={() => {
showProjPrower();
}}
>
权限名单
</div>
</a-select-option>
<a-select-option value="归属权" label="归属权">
<div
onClick={() => {
console.log("点击了111");
showProjOwner();
}}
>
归属权
</div>
</a-select-option>
<a-select-option value="查看权" label="查看权">
<div
onClick={() => {
console.log("点击了111");
showProjCheck();
}}
>
查看权
</div>
</a-select-option>
<a-select-option value="管理权" label="管理权">
<div
onClick={() => {
showProjManage();
}}
>
管理权
</div>
</a-select-option>
</a-select>
</div>
<span
class="operation3"
onClick={() => {
showCopyModal();
}}
>
复制
</span>
<span
class="more"
onClick={() => {
showDeleteModal();
}}
>
删除
</span>
</div>
) : (
<div></div>
)
) : value.record.type === 2 ? (
value.record.status === 0 ? (
<div class="operation">
<span class="operation1">编辑</span>
<div class="tableSelect">
<a-select
style="width: 50px"
value="授权"
// options={state.projectNameList}
dropdownClassName="tabledropdown"
>
<a-select-option value="权限名单" label="权限名单">
<div
onClick={() => {
showProjPrower();
}}
>
权限名单
</div>
</a-select-option>
<a-select-option value="归属权" label="归属权">
<div
onClick={() => {
console.log("点击了111");
showProjOwner();
}}
>
归属权
</div>
</a-select-option>
<a-select-option value="查看权" label="查看权">
<div
onClick={() => {
console.log("点击了111");
showProjCheck();
}}
>
查看权
</div>
</a-select-option>
<a-select-option value="管理权" label="管理权">
<div
onClick={() => {
showProjManage();
}}
>
管理权
</div>
</a-select-option>
</a-select>
</div>
<router-link to="/classadd" class="operation3">
创建班级
</router-link>
<div class="tableSelect">
<a-select
style="width: 50px"
value="更多"
// options={state.projectNameList}
dropdownClassName="tabledropdown"
>
<a-select-option value="复制" label="复制">
<div
onClick={() => {
showCopyModal();
}}
>
复制
</div>
</a-select-option>
<a-select-option value="删除" label="删除">
<div
onClick={() => {
showDeleteModal();
}}
>
删除
</div>
</a-select-option>
</a-select>
</div>
</div>
) : value.record.status === "进行中" ? (
<div class="operation">
<span class="operation1">查看</span>
<div class="tableSelect">
<a-select
style="width: 50px"
value="授权"
// options={state.projectNameList}
dropdownClassName="tabledropdown"
>
<a-select-option value="权限名单" label="权限名单">
<div
onClick={() => {
showProjPrower();
}}
>
权限名单
</div>
</a-select-option>
<a-select-option value="归属权" label="归属权">
<div
onClick={() => {
console.log("点击了111");
showProjOwner();
}}
>
归属权
</div>
</a-select-option>
<a-select-option value="查看权" label="查看权">
<div
onClick={() => {
console.log("点击了111");
showProjCheck();
}}
>
查看权
</div>
</a-select-option>
<a-select-option value="管理权" label="管理权">
<div
onClick={() => {
showProjManage();
}}
>
管理权
</div>
</a-select-option>
</a-select>
</div>
<router-link to="/classadd" class="operation3">
创建班级
</router-link>
<span
class="more"
onClick={() => {
showCopyModal();
}}
>
复制
</span>
</div>
) : value.record.status === -1 ? (
<div class="operation">
<span class="operation1">查看</span>
<div class="tableSelect">
<a-select
style="width: 50px"
value="授权"
// options={state.projectNameList}
dropdownClassName="tabledropdown"
>
<a-select-option value="权限名单" label="权限名单">
<div
onClick={() => {
showProjPrower();
}}
>
权限名单
</div>
</a-select-option>
<a-select-option value="归属权" label="归属权">
<div
onClick={() => {
console.log("点击了111");
showProjOwner();
}}
>
归属权
</div>
</a-select-option>
<a-select-option value="查看权" label="查看权">
<div
onClick={() => {
console.log("点击了111");
showProjCheck();
}}
>
查看权
</div>
</a-select-option>
<a-select-option value="管理权" label="管理权">
<div
onClick={() => {
showProjManage();
}}
>
管理权
</div>
</a-select-option>
</a-select>
</div>
<span
class="operation3"
onClick={() => {
showCopyModal();
}}
>
复制
</span>
<span
class="more"
onClick={() => {
showDeleteModal();
}}
>
删除
</span>
</div>
) : (
<div></div>
)
) : (
<div class="operation">
{value.record.status === 0 ? (
<span class="operation1">编辑</span>
) : (
<span class="operation1"></span>
)}
<div class="tableSelect">
<a-select
style="width: 50px"
value="授权"
// options={state.projectNameList}
dropdownClassName="tabledropdown"
>
<a-select-option value="权限名单" label="权限名单">
<div
onClick={() => {
showProjPrower();
}}
>
权限名单
</div>
</a-select-option>
<a-select-option value="归属权" label="归属权">
<div
onClick={() => {
console.log("点击了111");
showProjOwner();
}}
>
归属权
</div>
</a-select-option>
<a-select-option value="查看权" label="查看权">
<div
onClick={() => {
console.log("点击了111");
showProjCheck();
}}
>
查看权
</div>
</a-select-option>
<a-select-option value="管理权" label="管理权">
<div
onClick={() => {
showProjManage();
}}
>
管理权
</div>
</a-select-option>
</a-select>
</div>
{value.record.status === 0 ? (
<span class="operation3">发布</span>
) : (
<span
class="operation3"
onClick={() => {
showCopyModal();
}}
>
复制
</span>
)}
<div class="tableSelect">
{value.record.status === 0 ? (
<a-select
style="width: 50px"
value="更多"
// options={state.projectNameList}
dropdownClassName="tabledropdown"
>
<a-select-option value="复制" label="复制">
<div
onClick={() => {
showCopyModal();
}}
>
复制
</div>
</a-select-option>
<a-select-option value="删除" label="删除">
<div
onClick={() => {
showDeleteModal();
}}
>
删除
</div>
</a-select-option>
<a-select-option value="存为模板" label="存为模板">
<div
onClick={() => {
showStartModal();
}}
>
存为模板
</div>
</a-select-option>
<a-select-option value="基础信息" label="基础信息">
<router-link to="/taskpage">基础信息</router-link>
</a-select-option>
</a-select>
) : value.record.status === "进行中" ? (
<a-select
style="width: 50px"
value="更多"
// options={state.projectNameList}
dropdownClassName="tabledropdown"
>
<a-select-option value="存为模板" label="存为模板">
<div
onClick={() => {
showStartModal();
}}
>
存为模板
</div>
</a-select-option>
<a-select-option value="结束" label="结束">
<div
onClick={() => {
showStopModal();
}}
>
结束
</div>
</a-select-option>
<a-select-option value="撤回" label="撤回">
<div
onClick={() => {
showBackModal();
}}
>
撤回
</div>
</a-select-option>
<a-select-option value="基础信息" label="基础信息">
<router-link to="/taskpage">基础信息</router-link>
</a-select-option>
</a-select>
) : value.record.status === -1 ? (
<a-select
style="width: 50px"
value="更多"
// options={state.projectNameList}
dropdownClassName="tabledropdown"
>
<a-select-option value="存为模板" label="存为模板">
<div
onClick={() => {
showStartModal();
}}
>
存为模板
</div>
</a-select-option>
<a-select-option value="删除" label="删除">
<div
onClick={() => {
showDeleteModal();
}}
>
删除
</div>
</a-select-option>
<a-select-option value="基础信息" label="基础信息">
<router-link to="/taskpage">基础信息</router-link>
</a-select-option>
</a-select>
) : value.record.status === "未开始" ? (
<a-select
style="width: 50px"
value="更多"
// options={state.projectNameList}
dropdownClassName="tabledropdown"
>
<a-select-option value="存为模板" label="存为模板">
<div
onClick={() => {
showStartModal();
}}
>
存为模板
</div>
</a-select-option>
<a-select-option value="撤回" label="撤回">
<div
onClick={() => {
// showDeleteModal();
}}
>
撤回
</div>
</a-select-option>
<a-select-option value="结束" label="结束">
<div
onClick={() => {
// showDeleteModal();
}}
>
结束
</div>
</a-select-option>
<a-select-option value="基础信息" label="基础信息">
<router-link to="/taskpage">基础信息</router-link>
</a-select-option>
</a-select>
) : (
<div></div>
)}
</div>
</div>
);
},
},
]);
const getTableDate = (pagedata) => {
let obj = {
pageNo: 1,
pageSize: 10,
};
api
.getProjectList(pagedata ? pagedata : obj)
.then((res) => {
console.log(res);
if (res.status == 200 && res.data.code == 200) {
tableDataTotal.value = Number(res.data.data.total);
let data = res.data.data.rows;
// let data = state.tableData;
console.log("1266", data);
data.map((value) => {
value.children = value.subList;
value.key = value.projectId;
console.log("map-value", value.subList, value.children,);
// if (value.subList.length !== 0) {
// //多层项目
// value.operation =
// value.status === "草稿" ? (
// <div class="operation">
// <span class="operation1">编辑</span>
// <div class="tableSelect">
// <a-select
// style="width: 50px"
// value="授权"
// // options={state.projectNameList}
// dropdownClassName="tabledropdown"
// >
// <a-select-option value="权限名单" label="权限名单">
// <div
// onClick={() => {
// showProjPrower();
// }}
// >
// 权限名单
// </div>
// </a-select-option>
// <a-select-option value="归属权" label="归属权">
// <div
// onClick={() => {
// console.log("点击了111");
// showProjOwner();
// }}
// >
// 归属权
// </div>
// </a-select-option>
// <a-select-option value="查看权" label="查看权">
// <div
// onClick={() => {
// console.log("点击了111");
// showProjCheck();
// }}
// >
// 查看权
// </div>
// </a-select-option>
// <a-select-option value="管理权" label="管理权">
// <div
// onClick={() => {
// showProjManage();
// }}
// >
// 管理权
// </div>
// </a-select-option>
// </a-select>
// </div>
// <span
// class="operation3"
// style="cursor: pointer"
// onClick={() => {
// state.sonproject = true;
// }}
// >
// 创建子项目
// </span>
// <div class="tableSelect">
// <a-select
// style="width: 50px"
// value="更多"
// // options={state.projectNameList}
// dropdownClassName="tabledropdown"
// >
// <a-select-option value="基础信息" label="基础信息">
// <router-link to="/taskpage">基础信息</router-link>
// </a-select-option>
// <a-select-option value="存为模板" label="存为模板">
// <div
// onClick={() => {
// showStartModal();
// }}
// >
// 存为模板
// </div>
// </a-select-option>
// </a-select>
// </div>
// </div>
// ) : value.status === "进行中" ? (
// <div class="operation">
// <span class="operation1">查看</span>
// <div class="tableSelect">
// <a-select
// style="width: 50px"
// value="授权"
// // options={state.projectNameList}
// dropdownClassName="tabledropdown"
// >
// <a-select-option value="权限名单" label="权限名单">
// <div
// onClick={() => {
// showProjPrower();
// }}
// >
// 权限名单
// </div>
// </a-select-option>
// <a-select-option value="归属权" label="归属权">
// <div
// onClick={() => {
// console.log("点击了111");
// showProjOwner();
// }}
// >
// 归属权
// </div>
// </a-select-option>
// <a-select-option value="查看权" label="查看权">
// <div
// onClick={() => {
// console.log("点击了111");
// showProjCheck();
// }}
// >
// 查看权
// </div>
// </a-select-option>
// <a-select-option value="管理权" label="管理权">
// <div
// onClick={() => {
// showProjManage();
// }}
// >
// 管理权
// </div>
// </a-select-option>
// </a-select>
// </div>
// <span
// class="operation3"
// onClick={() => {
// showCopyModal();
// }}
// >
// 复制
// </span>
// <span class="more"></span>
// </div>
// ) : value.status === "已结束" ? (
// <div class="operation">
// <span class="operation1">查看</span>
// <div class="tableSelect">
// <a-select
// style="width: 50px"
// value="授权"
// // options={state.projectNameList}
// dropdownClassName="tabledropdown"
// >
// <a-select-option value="权限名单" label="权限名单">
// <div
// onClick={() => {
// showProjPrower();
// }}
// >
// 权限名单
// </div>
// </a-select-option>
// <a-select-option value="归属权" label="归属权">
// <div
// onClick={() => {
// console.log("点击了111");
// showProjOwner();
// }}
// >
// 归属权
// </div>
// </a-select-option>
// <a-select-option value="查看权" label="查看权">
// <div
// onClick={() => {
// console.log("点击了111");
// showProjCheck();
// }}
// >
// 查看权
// </div>
// </a-select-option>
// <a-select-option value="管理权" label="管理权">
// <div
// onClick={() => {
// showProjManage();
// }}
// >
// 管理权
// </div>
// </a-select-option>
// </a-select>
// </div>
// <span
// class="operation3"
// onClick={() => {
// showCopyModal();
// }}
// >
// 复制
// </span>
// <span
// class="more"
// onClick={() => {
// showDeleteModal();
// }}
// >
// 删除
// </span>
// </div>
// ) : (
// <div></div>
// );
// value.subList.map((item) => {
// if (item.children) {
// //多层子项目
// item.operation =
// item.state === "草稿" ? (
// <div class="operation">
// <span class="operation1">编辑</span>
// <div class="tableSelect">
// <a-select
// style="width: 50px"
// value="授权"
// // options={state.projectNameList}
// dropdownClassName="tabledropdown"
// >
// <a-select-option
// value="权限名单"
// label="权限名单"
// >
// <div
// onClick={() => {
// showProjPrower();
// }}
// >
// 权限名单
// </div>
// </a-select-option>
// <a-select-option value="归属权" label="归属权">
// <div
// onClick={() => {
// console.log("点击了111");
// showProjOwner();
// }}
// >
// 归属权
// </div>
// </a-select-option>
// <a-select-option value="查看权" label="查看权">
// <div
// onClick={() => {
// console.log("点击了111");
// showProjCheck();
// }}
// >
// 查看权
// </div>
// </a-select-option>
// <a-select-option value="管理权" label="管理权">
// <div
// onClick={() => {
// showProjManage();
// }}
// >
// 管理权
// </div>
// </a-select-option>
// </a-select>
// </div>
// <router-link to="/classadd" class="operation3">
// 创建班级
// </router-link>
// <div class="tableSelect">
// <a-select
// style="width: 50px"
// value="更多"
// // options={state.projectNameList}
// dropdownClassName="tabledropdown"
// >
// <a-select-option value="复制" label="复制">
// <div
// onClick={() => {
// showCopyModal();
// }}
// >
// 复制
// </div>
// </a-select-option>
// <a-select-option value="删除" label="删除">
// <div
// onClick={() => {
// showDeleteModal();
// }}
// >
// 删除
// </div>
// </a-select-option>
// </a-select>
// </div>
// </div>
// ) : item.state === "进行中" ? (
// <div class="operation">
// <span class="operation1">查看</span>
// <div class="tableSelect">
// <a-select
// style="width: 50px"
// value="授权"
// // options={state.projectNameList}
// dropdownClassName="tabledropdown"
// >
// <a-select-option
// value="权限名单"
// label="权限名单"
// >
// <div
// onClick={() => {
// showProjPrower();
// }}
// >
// 权限名单
// </div>
// </a-select-option>
// <a-select-option value="归属权" label="归属权">
// <div
// onClick={() => {
// console.log("点击了111");
// showProjOwner();
// }}
// >
// 归属权
// </div>
// </a-select-option>
// <a-select-option value="查看权" label="查看权">
// <div
// onClick={() => {
// console.log("点击了111");
// showProjCheck();
// }}
// >
// 查看权
// </div>
// </a-select-option>
// <a-select-option value="管理权" label="管理权">
// <div
// onClick={() => {
// showProjManage();
// }}
// >
// 管理权
// </div>
// </a-select-option>
// </a-select>
// </div>
// <router-link to="/classadd" class="operation3">
// 创建班级
// </router-link>
// <span
// class="more"
// onClick={() => {
// showCopyModal();
// }}
// >
// 复制
// </span>
// </div>
// ) : item.state === "已结束" ? (
// <div class="operation">
// <span class="operation1">查看</span>
// <div class="tableSelect">
// <a-select
// style="width: 50px"
// value="授权"
// // options={state.projectNameList}
// dropdownClassName="tabledropdown"
// >
// <a-select-option
// value="权限名单"
// label="权限名单"
// >
// <div
// onClick={() => {
// showProjPrower();
// }}
// >
// 权限名单
// </div>
// </a-select-option>
// <a-select-option value="归属权" label="归属权">
// <div
// onClick={() => {
// console.log("点击了111");
// showProjOwner();
// }}
// >
// 归属权
// </div>
// </a-select-option>
// <a-select-option value="查看权" label="查看权">
// <div
// onClick={() => {
// console.log("点击了111");
// showProjCheck();
// }}
// >
// 查看权
// </div>
// </a-select-option>
// <a-select-option value="管理权" label="管理权">
// <div
// onClick={() => {
// showProjManage();
// }}
// >
// 管理权
// </div>
// </a-select-option>
// </a-select>
// </div>
// <span
// class="operation3"
// onClick={() => {
// showCopyModal();
// }}
// >
// 复制
// </span>
// <span
// class="more"
// onClick={() => {
// showDeleteModal();
// }}
// >
// 删除
// </span>
// </div>
// ) : (
// <div></div>
// );
// item.children.map((a) => {
// //班级
// a.operation =
// a.state === "草稿" ? (
// <div class="operation">
// <span class="operation1">编辑</span>
// <div class="tableSelect">
// <a-select
// style="width: 50px"
// value="授权"
// // options={state.projectNameList}
// dropdownClassName="tabledropdown"
// >
// <a-select-option
// value="权限名单"
// label="权限名单"
// >
// <div
// onClick={() => {
// showProjPrower();
// }}
// >
// 权限名单
// </div>
// </a-select-option>
// <a-select-option value="归属权" label="归属权">
// <div
// onClick={() => {
// console.log("点击了111");
// showProjOwner();
// }}
// >
// 归属权
// </div>
// </a-select-option>
// <a-select-option value="查看权" label="查看权">
// <div
// onClick={() => {
// console.log("点击了111");
// showProjCheck();
// }}
// >
// 查看权
// </div>
// </a-select-option>
// <a-select-option value="管理权" label="管理权">
// <div
// onClick={() => {
// showProjManage();
// }}
// >
// 管理权
// </div>
// </a-select-option>
// </a-select>
// </div>
// <span class="operation3">发布</span>
// <div class="tableSelect">
// <a-select
// style="width: 50px"
// value="更多"
// // options={state.projectNameList}
// dropdownClassName="tabledropdown"
// >
// <a-select-option value="复制" label="复制">
// <div
// onClick={() => {
// showCopyModal();
// }}
// >
// 复制
// </div>
// </a-select-option>
// <a-select-option value="删除" label="删除">
// <div
// onClick={() => {
// showDeleteModal();
// }}
// >
// 删除
// </div>
// </a-select-option>
// <a-select-option
// value="存为模板"
// label="存为模板"
// >
// <div
// onClick={() => {
// showStartModal();
// }}
// >
// 存为模板
// </div>
// </a-select-option>
// <a-select-option
// value="基础信息"
// label="基础信息"
// >
// <router-link to="/taskpage">
// 基础信息
// </router-link>
// </a-select-option>
// </a-select>
// </div>
// </div>
// ) : a.state === "进行中" ? (
// <div class="operation">
// <span class="operation1"></span>
// <div class="tableSelect">
// <a-select
// style="width: 50px"
// value="授权"
// // options={state.projectNameList}
// dropdownClassName="tabledropdown"
// >
// <a-select-option
// value="权限名单"
// label="权限名单"
// >
// <div
// onClick={() => {
// showProjPrower();
// }}
// >
// 权限名单
// </div>
// </a-select-option>
// <a-select-option value="归属权" label="归属权">
// <div
// onClick={() => {
// console.log("点击了111");
// showProjOwner();
// }}
// >
// 归属权
// </div>
// </a-select-option>
// <a-select-option value="查看权" label="查看权">
// <div
// onClick={() => {
// console.log("点击了111");
// showProjCheck();
// }}
// >
// 查看权
// </div>
// </a-select-option>
// <a-select-option value="管理权" label="管理权">
// <div
// onClick={() => {
// showProjManage();
// }}
// >
// 管理权
// </div>
// </a-select-option>
// </a-select>
// </div>
// <span
// class="operation3"
// onClick={() => {
// showCopyModal();
// }}
// >
// 复制
// </span>
// <div class="tableSelect">
// <a-select
// style="width: 50px"
// value="更多"
// // options={state.projectNameList}
// dropdownClassName="tabledropdown"
// >
// <a-select-option value="撤回" label="撤回">
// <div
// onClick={() => {
// showBackModal();
// }}
// >
// 撤回
// </div>
// </a-select-option>
// <a-select-option value="结束" label="结束">
// <div
// onClick={() => {
// showStopModal();
// }}
// >
// 结束
// </div>
// </a-select-option>
// <a-select-option
// value="存为模板"
// label="存为模板"
// >
// <div
// onClick={() => {
// showStartModal();
// }}
// >
// 存为模板
// </div>
// </a-select-option>
// <a-select-option
// value="基础信息"
// label="基础信息"
// >
// <router-link to="/taskpage">
// 基础信息
// </router-link>
// </a-select-option>
// </a-select>
// </div>
// </div>
// ) : a.state === "已结束" ? (
// <div class="operation">
// <span class="operation1"></span>
// <div class="tableSelect">
// <a-select
// style="width: 50px"
// value="授权"
// // options={state.projectNameList}
// dropdownClassName="tabledropdown"
// >
// <a-select-option
// value="权限名单"
// label="权限名单"
// >
// <div
// onClick={() => {
// showProjPrower();
// }}
// >
// 权限名单
// </div>
// </a-select-option>
// <a-select-option value="归属权" label="归属权">
// <div
// onClick={() => {
// console.log("点击了111");
// showProjOwner();
// }}
// >
// 归属权
// </div>
// </a-select-option>
// <a-select-option value="查看权" label="查看权">
// <div
// onClick={() => {
// console.log("点击了111");
// showProjCheck();
// }}
// >
// 查看权
// </div>
// </a-select-option>
// <a-select-option value="管理权" label="管理权">
// <div
// onClick={() => {
// showProjManage();
// }}
// >
// 管理权
// </div>
// </a-select-option>
// </a-select>
// </div>
// <span
// class="operation3"
// onClick={() => {
// showCopyModal();
// }}
// >
// 复制
// </span>
// <span
// class="operation3"
// onClick={() => {
// showCopyModal();
// }}
// >
// 复制
// </span>
// <div class="tableSelect">
// <a-select
// style="width: 50px"
// value="更多"
// // options={state.projectNameList}
// dropdownClassName="tabledropdown"
// >
// <a-select-option value="删除" label="删除">
// <div
// onClick={() => {
// showDeleteModal();
// }}
// >
// 删除
// </div>
// </a-select-option>
// <a-select-option
// value="存为模板"
// label="存为模板"
// >
// <div
// onClick={() => {
// showStartModal();
// }}
// >
// 存为模板
// </div>
// </a-select-option>
// <a-select-option
// value="基础信息"
// label="基础信息"
// >
// <router-link to="/taskpage">
// 基础信息
// </router-link>
// </a-select-option>
// </a-select>
// </div>
// </div>
// ) : a.state === "未开始" ? (
// <div class="operation">
// <span class="operation1"></span>
// <div class="tableSelect">
// <a-select
// style="width: 50px"
// value="授权"
// // options={state.projectNameList}
// dropdownClassName="tabledropdown"
// >
// <a-select-option
// value="权限名单"
// label="权限名单"
// >
// <div
// onClick={() => {
// showProjPrower();
// }}
// >
// 权限名单
// </div>
// </a-select-option>
// <a-select-option value="归属权" label="归属权">
// <div
// onClick={() => {
// console.log("点击了111");
// showProjOwner();
// }}
// >
// 归属权
// </div>
// </a-select-option>
// <a-select-option value="查看权" label="查看权">
// <div
// onClick={() => {
// console.log("点击了111");
// showProjCheck();
// }}
// >
// 查看权
// </div>
// </a-select-option>
// <a-select-option value="管理权" label="管理权">
// <div
// onClick={() => {
// showProjManage();
// }}
// >
// 管理权
// </div>
// </a-select-option>
// </a-select>
// </div>
// <span
// class="operation3"
// onClick={() => {
// showCopyModal();
// }}
// >
// 复制
// </span>
// <div class="tableSelect">
// <a-select
// style="width: 50px"
// value="更多"
// // options={state.projectNameList}
// dropdownClassName="tabledropdown"
// >
// <a-select-option value="结束" label="结束">
// <div
// onClick={() => {
// showStopModal();
// }}
// >
// 结束
// </div>
// </a-select-option>
// <a-select-option value="撤回" label="撤回">
// <div
// onClick={() => {
// showBackModal();
// }}
// >
// 撤回
// </div>
// </a-select-option>
// <a-select-option
// value="存为模板"
// label="存为模板"
// >
// <div
// onClick={() => {
// showStartModal();
// }}
// >
// 存为模板
// </div>
// </a-select-option>
// <a-select-option
// value="基础信息"
// label="基础信息"
// >
// <router-link to="/taskpage">
// 基础信息
// </router-link>
// </a-select-option>
// </a-select>
// </div>
// </div>
// ) : (
// <div></div>
// );
// });
// } else {
// //单层子项目
// item.operation =
// item.state === "草稿" ? (
// <div class="operation">
// <span class="operation1">编辑</span>
// <div class="tableSelect">
// <a-select
// style="width: 50px"
// value="授权"
// // options={state.projectNameList}
// dropdownClassName="tabledropdown"
// >
// <a-select-option
// value="权限名单"
// label="权限名单"
// >
// <div
// onClick={() => {
// showProjPrower();
// }}
// >
// 权限名单
// </div>
// </a-select-option>
// <a-select-option value="归属权" label="归属权">
// <div
// onClick={() => {
// console.log("点击了111");
// showProjOwner();
// }}
// >
// 归属权
// </div>
// </a-select-option>
// <a-select-option value="查看权" label="查看权">
// <div
// onClick={() => {
// console.log("点击了111");
// showProjCheck();
// }}
// >
// 查看权
// </div>
// </a-select-option>
// <a-select-option value="管理权" label="管理权">
// <div
// onClick={() => {
// showProjManage();
// }}
// >
// 管理权
// </div>
// </a-select-option>
// </a-select>
// </div>
// <span class="operation3">发布</span>
// <div class="tableSelect">
// <a-select
// style="width: 50px"
// value="更多"
// // options={state.projectNameList}
// dropdownClassName="tabledropdown"
// >
// <a-select-option value="复制" label="复制">
// <div
// onClick={() => {
// showCopyModal();
// }}
// >
// 复制
// </div>
// </a-select-option>
// <a-select-option value="删除" label="删除">
// <div
// onClick={() => {
// showDeleteModal();
// }}
// >
// 删除
// </div>
// </a-select-option>
// <a-select-option
// value="存为模板"
// label="存为模板"
// >
// <div
// onClick={() => {
// showStartModal();
// }}
// >
// 存为模板
// </div>
// </a-select-option>
// <a-select-option
// value="基础信息"
// label="基础信息"
// >
// <router-link to="/taskpage">
// 基础信息
// </router-link>
// </a-select-option>
// </a-select>
// </div>
// </div>
// ) : item.state === "进行中" ? (
// <div class="operation">
// <span class="operation1"></span>
// <div class="tableSelect">
// <a-select
// style="width: 50px"
// value="授权"
// // options={state.projectNameList}
// dropdownClassName="tabledropdown"
// >
// <a-select-option
// value="权限名单"
// label="权限名单"
// >
// <div
// onClick={() => {
// showProjPrower();
// }}
// >
// 权限名单
// </div>
// </a-select-option>
// <a-select-option value="归属权" label="归属权">
// <div
// onClick={() => {
// console.log("点击了111");
// showProjOwner();
// }}
// >
// 归属权
// </div>
// </a-select-option>
// <a-select-option value="查看权" label="查看权">
// <div
// onClick={() => {
// console.log("点击了111");
// showProjCheck();
// }}
// >
// 查看权
// </div>
// </a-select-option>
// <a-select-option value="管理权" label="管理权">
// <div
// onClick={() => {
// showProjManage();
// }}
// >
// 管理权
// </div>
// </a-select-option>
// </a-select>
// </div>
// <span
// class="operation3"
// onClick={() => {
// showCopyModal();
// }}
// >
// 复制
// </span>
// <div class="tableSelect">
// <a-select
// style="width: 50px"
// value="更多"
// // options={state.projectNameList}
// dropdownClassName="tabledropdown"
// >
// <a-select-option value="撤回" label="撤回">
// <div
// onClick={() => {
// showBackModal();
// }}
// >
// 撤回
// </div>
// </a-select-option>
// <a-select-option value="结束" label="结束">
// <div
// onClick={() => {
// showStopModal();
// }}
// >
// 结束
// </div>
// </a-select-option>
// <a-select-option
// value="存为模板"
// label="存为模板"
// >
// <div
// onClick={() => {
// showStartModal();
// }}
// >
// 存为模板
// </div>
// </a-select-option>
// <a-select-option
// value="基础信息"
// label="基础信息"
// >
// <router-link to="/taskpage">
// 基础信息
// </router-link>
// </a-select-option>
// </a-select>
// </div>
// </div>
// ) : item.state === "已结束" ? (
// <div class="operation">
// <span class="operation1"></span>
// <div class="tableSelect">
// <a-select
// style="width: 50px"
// value="授权"
// // options={state.projectNameList}
// dropdownClassName="tabledropdown"
// >
// <a-select-option
// value="权限名单"
// label="权限名单"
// >
// <div
// onClick={() => {
// showProjPrower();
// }}
// >
// 权限名单
// </div>
// </a-select-option>
// <a-select-option value="归属权" label="归属权">
// <div
// onClick={() => {
// console.log("点击了111");
// showProjOwner();
// }}
// >
// 归属权
// </div>
// </a-select-option>
// <a-select-option value="查看权" label="查看权">
// <div
// onClick={() => {
// console.log("点击了111");
// showProjCheck();
// }}
// >
// 查看权
// </div>
// </a-select-option>
// <a-select-option value="管理权" label="管理权">
// <div
// onClick={() => {
// showProjManage();
// }}
// >
// 管理权
// </div>
// </a-select-option>
// </a-select>
// </div>
// <span
// class="operation3"
// onClick={() => {
// showCopyModal();
// }}
// >
// 复制
// </span>
// <div class="tableSelect">
// <a-select
// style="width: 50px"
// value="更多"
// // options={state.projectNameList}
// dropdownClassName="tabledropdown"
// >
// <a-select-option value="删除" label="删除">
// <div
// onClick={() => {
// showDeleteModal();
// }}
// >
// 删除
// </div>
// </a-select-option>
// <a-select-option value="结束" label="结束">
// <div
// onClick={() => {
// showStopModal();
// }}
// >
// 结束
// </div>
// </a-select-option>
// <a-select-option
// value="存为模板"
// label="存为模板"
// >
// <div
// onClick={() => {
// showStartModal();
// }}
// >
// 存为模板
// </div>
// </a-select-option>
// <a-select-option
// value="基础信息"
// label="基础信息"
// >
// <router-link to="/taskpage">
// 基础信息
// </router-link>
// </a-select-option>
// </a-select>
// </div>
// </div>
// ) : item.state === "未开始" ? (
// <div class="operation">
// <span class="operation1"></span>
// <div class="tableSelect">
// <a-select
// style="width: 50px"
// value="授权"
// // options={state.projectNameList}
// dropdownClassName="tabledropdown"
// >
// <a-select-option
// value="权限名单"
// label="权限名单"
// >
// <div
// onClick={() => {
// showProjPrower();
// }}
// >
// 权限名单
// </div>
// </a-select-option>
// <a-select-option value="归属权" label="归属权">
// <div
// onClick={() => {
// console.log("点击了111");
// showProjOwner();
// }}
// >
// 归属权
// </div>
// </a-select-option>
// <a-select-option value="查看权" label="查看权">
// <div
// onClick={() => {
// console.log("点击了111");
// showProjCheck();
// }}
// >
// 查看权
// </div>
// </a-select-option>
// <a-select-option value="管理权" label="管理权">
// <div
// onClick={() => {
// showProjManage();
// }}
// >
// 管理权
// </div>
// </a-select-option>
// </a-select>
// </div>
// <span
// class="operation3"
// onClick={() => {
// showCopyModal();
// }}
// >
// 复制
// </span>
// <div class="tableSelect">
// <a-select
// style="width: 50px"
// value="更多"
// // options={state.projectNameList}
// dropdownClassName="tabledropdown"
// >
// <a-select-option value="撤回" label="撤回">
// <div
// onClick={() => {
// showBackModal();
// }}
// >
// 撤回
// </div>
// </a-select-option>
// <a-select-option value="结束" label="结束">
// <div
// onClick={() => {
// showStopModal();
// }}
// >
// 结束
// </div>
// </a-select-option>
// <a-select-option
// value="存为模板"
// label="存为模板"
// >
// <div
// onClick={() => {
// showStartModal();
// }}
// >
// 存为模板
// </div>
// </a-select-option>
// <a-select-option
// value="基础信息"
// label="基础信息"
// >
// <router-link to="/taskpage">
// 基础信息
// </router-link>
// </a-select-option>
// </a-select>
// </div>
// </div>
// ) : (
// <div></div>
// );
// }
// });
// } else {
// //单层项目
// value.operation = (
// <div class="operation">
// {value.status === "草稿" ? (
// <span class="operation1">编辑</span>
// ) : (
// <span class="operation1"></span>
// )}
// <div class="tableSelect">
// <a-select
// style="width: 50px"
// value="授权"
// // options={state.projectNameList}
// dropdownClassName="tabledropdown"
// >
// <a-select-option value="权限名单" label="权限名单">
// <div
// onClick={() => {
// showProjPrower();
// }}
// >
// 权限名单
// </div>
// </a-select-option>
// <a-select-option value="归属权" label="归属权">
// <div
// onClick={() => {
// console.log("点击了111");
// showProjOwner();
// }}
// >
// 归属权
// </div>
// </a-select-option>
// <a-select-option value="查看权" label="查看权">
// <div
// onClick={() => {
// console.log("点击了111");
// showProjCheck();
// }}
// >
// 查看权
// </div>
// </a-select-option>
// <a-select-option value="管理权" label="管理权">
// <div
// onClick={() => {
// showProjManage();
// }}
// >
// 管理权
// </div>
// </a-select-option>
// </a-select>
// </div>
// {value.status === "草稿" ? (
// <span class="operation3">发布</span>
// ) : (
// <span
// class="operation3"
// onClick={() => {
// showCopyModal();
// }}
// >
// 复制
// </span>
// )}
// <div class="tableSelect">
// {value.status === "草稿" ? (
// <a-select
// style="width: 50px"
// value="更多"
// // options={state.projectNameList}
// dropdownClassName="tabledropdown"
// >
// <a-select-option value="复制" label="复制">
// <div
// onClick={() => {
// showCopyModal();
// }}
// >
// 复制
// </div>
// </a-select-option>
// <a-select-option value="删除" label="删除">
// <div
// onClick={() => {
// showDeleteModal();
// }}
// >
// 删除
// </div>
// </a-select-option>
// <a-select-option value="存为模板" label="存为模板">
// <div
// onClick={() => {
// showStartModal();
// }}
// >
// 存为模板
// </div>
// </a-select-option>
// <a-select-option value="基础信息" label="基础信息">
// <router-link to="/taskpage">基础信息</router-link>
// </a-select-option>
// </a-select>
// ) : value.status === "进行中" ? (
// <a-select
// style="width: 50px"
// value="更多"
// // options={state.projectNameList}
// dropdownClassName="tabledropdown"
// >
// <a-select-option value="存为模板" label="存为模板">
// <div
// onClick={() => {
// showStartModal();
// }}
// >
// 存为模板
// </div>
// </a-select-option>
// <a-select-option value="结束" label="结束">
// <div
// onClick={() => {
// showStopModal();
// }}
// >
// 结束
// </div>
// </a-select-option>
// <a-select-option value="撤回" label="撤回">
// <div
// onClick={() => {
// showBackModal();
// }}
// >
// 撤回
// </div>
// </a-select-option>
// <a-select-option value="基础信息" label="基础信息">
// <router-link to="/taskpage">基础信息</router-link>
// </a-select-option>
// </a-select>
// ) : value.status === "已结束" ||
// value.status === "未开始" ? (
// <a-select
// style="width: 50px"
// value="更多"
// // options={state.projectNameList}
// dropdownClassName="tabledropdown"
// >
// <a-select-option value="存为模板" label="存为模板">
// <div
// onClick={() => {
// showStartModal();
// }}
// >
// 存为模板
// </div>
// </a-select-option>
// <a-select-option value="删除" label="删除">
// <div
// onClick={() => {
// showDeleteModal();
// }}
// >
// 删除
// </div>
// </a-select-option>
// <a-select-option value="基础信息" label="基础信息">
// <router-link to="/taskpage">基础信息</router-link>
// </a-select-option>
// </a-select>
// ) : (
// <div></div>
// )}
// </div>
// </div>
// );
// }
});
tableData.value = data;
console.log("tableData", tableData);
}
})
.catch((err) => {
console.log(err);
});
};
getTableDate();
// 翻页
const changePagination = (page) => {
console.log(page)
currentPage.value = page;
let pagedata = {
pageNo: page,
pageSize: 10,
}
getTableDate(pagedata);
// getLearnPath();
};
const showModal = () => {
state.sonproject = true;
};
const closeModal = () => {
state.sonproject = false;
};
const showModal1 = () => {
state.estabish = true;
};
const closeModal1 = () => {
state.estabish = false;
};
const showModal2 = () => {
state.doublepro = true;
state.estabish = false;
};
const showModal3 = () => {
state.doublesonpro = true;
state.sonproject = false;
};
const showCopyModal = () => {
state.copyModal = true;
};
const closeCopyModal = () => {
state.copyModal = false;
};
const showStopModal = () => {
state.stopModal = true;
};
const closeStopModal = () => {
state.stopModal = false;
};
const showDeleteModal = () => {
state.deleteModal = true;
};
const closeDeleteModal = () => {
state.deleteModal = false;
};
const showStartModal = () => {
state.startModal = true;
};
const closeStartModal = () => {
state.startModal = false;
};
const showBackModal = () => {
state.backModal = true;
};
const closeBackModal = () => {
state.backModal = false;
};
const showProjOwner = () => {
state.ProjOwnervisible = true;
};
const showProjPrower = () => {
state.ProjPvisible = true;
};
const showProjCheck = () => {
state.ProjCheckvisible = true;
};
const showProjManage = () => {
state.ProjManagevisible = true;
};
return {
...toRefs(state),
selectProjectName,
expandTable,
showModal,
closeModal,
showModal1,
closeModal1,
showModal2,
closeModal2,
showModal3,
closeModal3,
showCopyModal,
closeCopyModal,
showStopModal,
closeStopModal,
showDeleteModal,
closeDeleteModal,
showStartModal,
closeStartModal,
showBackModal,
closeBackModal,
getTableDate,
showProjOwner,
showProjPrower,
showProjCheck,
showProjManage,
tableData,
currentPage,
tableDataTotal,
pageSize,
columns,
createStoreyProject,
classifyList,
classifyList1,
classifyList2,
classifyList3,
classifyList4,
classifyList5,
classificationChange,
classificationChange1,
classificationChange2,
classificationChange3,
classificationChange4,
classificationChange5,
changePagination,
value1,
value2,
value3,
value4,
value5,
value6,
value7,
value8,
value9,
sProjectName,
sProjectOrder,
sProjectState,
sProjectTime,
sProjectStateList,
sProjectNameChange,
sProjectOrderChange,
sProjectStateChange,
sProjectTimeChange,
searchReset,
searchSubmit,
createChildProject,
createChildsProject
};
},
};
</script>
<style lang="scss">
.projectManage {
width: 100%;
height: 100%;
display: flex;
flex-direction: column;
.filter {
margin-left: 38px;
margin-right: 38px;
margin-top: 30px;
display: flex;
justify-content: space-between;
flex-wrap: wrap;
.filterItems {
display: flex;
flex-wrap: wrap;
.select {
margin-right: 20px;
margin-bottom: 20px;
}
.btn {
padding: 0px 26px 0px 26px;
height: 38px;
background: rgba(64, 158, 255, 0);
border-radius: 8px;
border: 1px solid rgba(64, 158, 255, 1);
display: flex;
align-items: center;
justify-content: center;
margin-right: 14px;
flex-shrink: 0;
cursor: pointer;
.search {
background-size: 100%;
}
.btnText {
font-size: 14px;
font-weight: 400;
color: rgba(64, 158, 255, 1);
line-height: 36px;
margin-left: 5px;
}
}
.btnn {
padding: 0px 26px 0px 26px;
height: 38px;
background: #409eff;
border-radius: 8px;
border: 1px solid rgba(64, 158, 255, 1);
display: flex;
align-items: center;
justify-content: center;
margin-right: 14px;
flex-shrink: 0;
cursor: pointer;
.search {
background-size: 100%;
}
.btnText {
font-size: 14px;
font-weight: 400;
color: #ffffff;
line-height: 36px;
margin-left: 5px;
}
}
.btn1 {
.search {
width: 15px;
height: 17px;
background-image: url("../../assets/images/courseManage/search0.png");
}
}
.btn2 {
.search {
width: 16px;
height: 18px;
background-image: url("../../assets/images/courseManage/reset1.png");
}
}
.btn1:hover {
background: rgba(64, 158, 255, 0.76);
.search {
background-image: url("../../assets/images/courseManage/search0.png");
}
.btnText {
color: #ffffff;
}
}
.btn1:active {
background: #0982ff;
}
.btn2:hover {
background: rgba(64, 158, 255, 0.1);
}
.btn2:active {
background: rgba(64, 158, 255, 0.2);
}
}
.btns {
display: flex;
// flex-wrap: wrap;
.btn {
padding: 0px 26px 0px 26px;
height: 38px;
background: #409eff;
border-radius: 8px;
border: 1px solid rgba(64, 158, 255, 1);
display: flex;
align-items: center;
cursor: pointer;
justify-content: center;
margin-right: 14px;
flex-shrink: 0;
.search {
background-size: 100%;
}
.btnText {
font-size: 14px;
font-weight: 400;
color: #ffffff;
line-height: 36px;
margin-left: 5px;
}
}
.btn3 {
margin-right: 0px;
.search {
width: 17px;
height: 18px;
background-image: url("../../assets/images/courseManage/add0.png");
}
}
.btn3:hover {
background: rgba(64, 158, 255, 0.76);
}
.btn3:active {
background: #0982ff;
}
}
}
.tableBox {
margin: 20px 38px 30px;
.ant-table-thead>tr>th {
font-size: 14px;
font-weight: 400;
color: #999ba3;
line-height: 36px;
padding: 5px 16px;
background-color: #eff4fc;
}
}
.tableBox {
padding-bottom: 20px;
.pa {
// position: absolute;
// bottom: 20px;
// left: 0;
width: 100%;
// height: 20px;
// background-color: red;
display: flex;
justify-content: center;
// margin-bottom: 10px;
// position: absolute;
// bottom: -40px;
}
}
.operation {
font-size: 14px;
font-weight: 400;
color: #4ea6ff;
// line-height: 36px;
.operation1 {
margin-left: 21px;
width: 28px;
display: inline-block;
}
.operation3 {
margin-left: 21px;
width: 70px;
display: inline-block;
text-align: center;
}
.more {
width: 50px;
display: inline-block;
margin-left: 21px;
position: relative;
text-align: left;
// z-index: 99999;
.moreArrow {
width: 13px;
height: 7px;
display: inline-block;
background-image: url("../../assets/images/navtop/down.png");
background-size: 100%;
margin: 2px;
margin-left: 7px;
}
.moreItems {
width: 80px;
padding: 5px;
display: none;
background: #ffffff;
box-shadow: 2px 3px 9px 3px rgba(0, 0, 0, 0.05);
border-radius: 3px;
border: 0px solid #dcdcdc;
position: absolute;
left: 0px;
top: 28px;
z-index: 100;
text-align: center;
}
}
.more:hover .moreArrow {
background-image: url("../../assets/images/navtop/up.png");
}
.more:hover .moreItems {
display: block;
}
}
}
.doublesonpro {
.ant-modal {
.ant-modal-body {
.modalHeader {
background: linear-gradient(0deg,
rgba(78, 166, 255, 0) 0%,
rgba(78, 166, 255, 0.2) 100%);
}
padding: 0;
.modalMain {
display: flex;
flex-direction: column;
//align-items: center;
margin-left: 60px;
.name {
//width: 90%;
// background-color: lightcoral;
display: flex;
justify-content: right;
margin-top: 32px;
align-items: center;
height: 40px;
// border: 1px solid black;
.inname {
color: #000000;
font-size: 14px;
margin-left: 7px;
}
.in {
margin-left: 14px;
width: 80%;
.ant-input {
border-radius: 5px;
// height: 120%;
width: 80%;
height: 30px;
}
.ant-select {
border-radius: 5px;
// height: 120%;
width: 80%;
height: 40px;
.ant-select-selector {
border-radius: 8px;
// height: 120%;
width: 100%;
height: 40px;
}
}
}
}
.pubtn {
display: flex;
justify-content: center;
margin-top: 25px;
//margin-bottom: 29px;
.pubtn1 {
width: 100px;
height: 40px;
margin-right: 16px;
margin-bottom: 29px;
border: 1px solid #409eff;
border-radius: 4px;
color: rgba(78, 166, 255, 1);
font-size: 14px;
//line-height: 36px;
align-items: center;
background: rgba(255, 255, 255, 1);
}
.pubtn2 {
width: 100px;
height: 40px;
margin-bottom: 29px;
border: 1px solid #409eff;
border-radius: 4px;
color: #ffffff;
font-size: 14px;
align-items: center;
//line-height: 36px;
background: #409eff;
}
}
}
}
}
}
.doublepro {
.ant-modal {
.ant-modal-body {
.modalHeader {
background: linear-gradient(0deg,
rgba(78, 166, 255, 0) 0%,
rgba(78, 166, 255, 0.2) 100%);
}
padding: 0;
.modalMain {
display: flex;
flex-direction: column;
align-items: center;
.name {
width: 78%;
// background-color: lightcoral;
display: flex;
justify-content: right;
margin-top: 32px;
align-items: center;
height: 40px;
// border: 1px solid black;
.inname {
color: #000000;
font-size: 14px;
margin-left: 7px;
}
.in {
margin-left: 14px;
width: 81%;
.ant-input {
border-radius: 5px;
// height: 120%;
width: 100%;
height: 30px;
}
.ant-select {
border-radius: 5px;
// height: 120%;
width: 100%;
height: 40px;
.ant-select-selector {
border-radius: 8px;
// height: 120%;
width: 100%;
height: 40px;
}
}
}
}
.pubtn {
display: flex;
justify-content: center;
margin-top: 25px;
//margin-bottom: 29px;
.pubtn1 {
width: 100px;
height: 40px;
margin-right: 16px;
margin-bottom: 29px;
border: 1px solid #409eff;
border-radius: 4px;
color: rgba(78, 166, 255, 1);
font-size: 14px;
//line-height: 36px;
align-items: center;
background: rgba(255, 255, 255, 1);
}
.pubtn2 {
width: 100px;
height: 40px;
margin-bottom: 29px;
border: 1px solid #409eff;
border-radius: 4px;
color: #ffffff;
font-size: 14px;
align-items: center;
//line-height: 36px;
background: #409eff;
}
}
}
}
}
}
.sonproject {
.ant-modal {
.ant-modal-body {
padding: 0 !important;
.modalHeader {
background: linear-gradient(0deg,
rgba(78, 166, 255, 0) 0%,
rgba(78, 166, 255, 0.2) 100%);
}
.modalMain {
display: flex;
justify-content: center;
margin-top: 48px;
//margin-bottom: 40px;
.taskbox {
width: 310px;
height: 160px;
border-radius: 10px;
position: relative;
margin-bottom: 80px;
cursor: pointer;
.leftt {
position: absolute;
top: 18px;
left: 0;
}
.photo {
position: absolute;
top: 44px;
left: 40px;
}
.rightt {
position: absolute;
top: 69px;
right: 26px;
}
.centerbox {
position: absolute;
top: 66px;
left: 136px;
font-size: 20px;
font-weight: 700;
//line-height: 36px;
}
.centermain {
color: rgba(135, 139, 146, 1);
font-size: 14px;
position: absolute;
left: 144px;
bottom: 49px;
}
}
}
}
}
}
.estabish {
.ant-modal {
.ant-modal-body {
padding: 0 !important;
.modalHeader {
background: linear-gradient(0deg,
rgba(78, 166, 255, 0) 0%,
rgba(78, 166, 255, 0.2) 100%);
}
.modalMain {
display: flex;
flex-direction: column;
align-items: center;
margin-top: 48px;
//margin-bottom: 40px;
.taskbox {
width: 438px;
height: 160px;
border-radius: 10px;
position: relative;
margin-bottom: 24px;
cursor: pointer;
.leftt {
position: absolute;
top: 18px;
left: 0;
}
.photo {
position: absolute;
top: 44px;
left: 40px;
}
.rightt {
position: absolute;
top: 69px;
right: 26px;
}
.centerbox {
position: absolute;
top: 42px;
left: 120px;
font-size: 20px;
font-weight: 500;
//line-height: 36px;
}
.centerbox1 {
position: absolute;
top: 32px;
left: 120px;
font-size: 20px;
font-weight: 500;
//line-height: 36px;
}
.centermain {
color: rgba(135, 139, 146, 1);
font-size: 14px;
line-height: 20px;
position: absolute;
width: 252px;
left: 120px;
top: 78px;
}
.centermain1 {
color: rgba(135, 139, 146, 1);
font-size: 14px;
line-height: 20px;
position: absolute;
width: 252px;
left: 120px;
top: 68px;
}
}
}
}
}
}
.CopyModal {
.ant-modal {
width: 424px !important;
height: 258px !important;
.ant-modal-content {
width: 424px !important;
height: 258px !important;
.ant-modal-body {
width: 424px !important;
height: 258px !important;
padding: 0 !important;
.delete {
z-index: 999;
width: 424px;
height: 258px;
background: #ffffff;
box-shadow: 0px 1px 35px 0px rgba(118, 136, 166, 0.21);
border-radius: 4px;
// position: absolute;
// left: 50%;
// top: 10%;
// transform: translate(-50%, -50%);
.del_header {
position: absolute;
width: calc(100%);
height: 68px;
background: linear-gradient(rgba(78, 166, 255, 0.2) 0%,
rgba(78, 166, 255, 0) 100%);
}
.del_main {
width: 100%;
position: relative;
.header {
display: flex;
align-items: center;
padding-top: 20px;
padding-left: 26px;
font-size: 16px;
.icon {
width: 16px;
height: 16px;
margin-right: 10px;
background-image: url(@/assets/images/coursewareManage/QR.png);
background-size: 100% 100%;
}
.close_exit {
position: absolute;
right: 42px;
cursor: pointer;
width: 20px;
height: 20px;
background-image: url(@/assets/images/coursewareManage/close.png);
background-size: 100% 100%;
}
}
.body {
width: 100%;
margin: 34px auto 56px auto;
display: flex;
justify-content: center;
align-items: center;
flex-direction: column;
// background-color: red;
position: relative;
.back {
position: absolute;
top: 30px;
font-size: 12px;
font-weight: 400;
color: #666666;
}
}
.del_btnbox {
display: flex;
margin: 30px auto;
justify-content: center;
.del_btn {
width: 100px;
height: 40px;
background: rgba(64, 158, 255, 0);
border-radius: 8px;
display: flex;
align-items: center;
justify-content: center;
flex-shrink: 0;
cursor: pointer;
.btnText {
font-size: 14px;
font-weight: 400;
line-height: 40px;
}
}
.btn1 {
border: 1px solid rgba(64, 158, 255, 1);
color: #4ea6ff;
margin-right: 14px;
}
.btn2 {
background-color: #4ea6ff;
color: #ffffff;
}
}
}
}
}
}
}
}
</style>
Reference in New Issue View Git Blame Copy Permalink