mirror of
https://codeup.aliyun.com/67762337eccfc218f6110e0e/vue/fe-manage.git
synced 2025-12-09 19:06:45 +08:00
feat:开课 新建开课 授权 在线课程管理 面授课学习记录、查看详情 合并
This commit is contained in:
dongwug
BIN
src/assets/images/leveladd/add.png
Normal file
BIN
src/assets/images/leveladd/add.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 781 B |
BIN
src/assets/images/leveladd/an.png
Normal file
BIN
src/assets/images/leveladd/an.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 950 B |
BIN
src/assets/images/leveladd/ce.png
Normal file
BIN
src/assets/images/leveladd/ce.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 1.0 KiB |
BIN
src/assets/images/leveladd/diao.png
Normal file
BIN
src/assets/images/leveladd/diao.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 1.4 KiB |
BIN
src/assets/images/leveladd/gan.png
Normal file
BIN
src/assets/images/leveladd/gan.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 352 B |
BIN
src/assets/images/leveladd/huo.png
Normal file
BIN
src/assets/images/leveladd/huo.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 1.1 KiB |
BIN
src/assets/images/leveladd/kao.png
Normal file
BIN
src/assets/images/leveladd/kao.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 1.0 KiB |
BIN
src/assets/images/leveladd/mian.png
Normal file
BIN
src/assets/images/leveladd/mian.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 1007 B |
BIN
src/assets/images/leveladd/tao.png
Normal file
BIN
src/assets/images/leveladd/tao.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 1.1 KiB |
BIN
src/assets/images/leveladd/tou.png
Normal file
BIN
src/assets/images/leveladd/tou.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 1.2 KiB |
BIN
src/assets/images/leveladd/wai.png
Normal file
BIN
src/assets/images/leveladd/wai.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 1.4 KiB |
BIN
src/assets/images/leveladd/xiang.png
Normal file
BIN
src/assets/images/leveladd/xiang.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 785 B |
BIN
src/assets/images/leveladd/z1.png
Normal file
BIN
src/assets/images/leveladd/z1.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 280 B |
BIN
src/assets/images/leveladd/z2.png
Normal file
BIN
src/assets/images/leveladd/z2.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 137 B |
BIN
src/assets/images/leveladd/zai.png
Normal file
BIN
src/assets/images/leveladd/zai.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 1.1 KiB |
BIN
src/assets/images/leveladd/zhi.png
Normal file
BIN
src/assets/images/leveladd/zhi.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 940 B |
BIN
src/assets/images/leveladd/zuo.png
Normal file
BIN
src/assets/images/leveladd/zuo.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 1.0 KiB |
BIN
src/assets/images/projectadd/picture.png
Normal file
BIN
src/assets/images/projectadd/picture.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 24 KiB |
BIN
src/assets/images/research/export.png
Normal file
BIN
src/assets/images/research/export.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 1.1 KiB |
BIN
src/assets/images/research/picture.png
Normal file
BIN
src/assets/images/research/picture.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 9.0 KiB |
@@ -78,7 +78,6 @@ border: 1px solid #C7CBD2 !important;
|
||||
|
||||
// 表格---------------------------------
|
||||
.tableBox{
|
||||
|
||||
.ant-table-row .ant-table-cell{
|
||||
height: 48px ;
|
||||
font-size: 14px;
|
||||
@@ -148,4 +147,48 @@ border: 1px solid #C7CBD2 !important;
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
// 表格---------------------------------
|
||||
//表格下拉框-------------------------------------------
|
||||
.tableSelect {
|
||||
margin-left: 21px;
|
||||
display: inline-block;
|
||||
.ant-select:not(.ant-select-customize-input)
|
||||
.ant-select-selector
|
||||
.ant-select-selection-search-input {
|
||||
background-color: rgba(255, 255, 255, 0);
|
||||
border: none;
|
||||
}
|
||||
.ant-select:not(.ant-select-customize-input) .ant-select-selector {
|
||||
background-color: rgba(255, 255, 255, 0);
|
||||
border: none;
|
||||
}
|
||||
.ant-select-single:not(.ant-select-customize-input) .ant-select-selector {
|
||||
padding: 0;
|
||||
}
|
||||
.ant-select-focused:not(.ant-select-disabled).ant-select:not(.ant-select-customize-input)
|
||||
.ant-select-selector {
|
||||
box-shadow: none;
|
||||
}
|
||||
.ant-select-arrow {
|
||||
right: 0px;
|
||||
color: rgba(0, 0, 0, 0.8);
|
||||
font-size: 14px;
|
||||
line-height: 36px;
|
||||
// top: 17px;
|
||||
top:14px;
|
||||
}
|
||||
.ant-select-selection-item {
|
||||
font-size: 14px;
|
||||
font-weight: 400;
|
||||
color: #4ea6ff;
|
||||
line-height: 36px;
|
||||
}
|
||||
.ant-select-single.ant-select-open .ant-select-selection-item{
|
||||
color: #4ea6ff;
|
||||
}
|
||||
}
|
||||
.tabledropdown {
|
||||
width: 100px !important;
|
||||
}
|
||||
//表格下拉框-------------------------------------------
|
||||
@@ -134,6 +134,19 @@ export default {
|
||||
},
|
||||
];
|
||||
}
|
||||
if (n === "/researchmanage" || n === "/ResearchManage") {
|
||||
state.list = [
|
||||
{
|
||||
name: "调研管理",
|
||||
href: "",
|
||||
// href: "#/researchmanage",
|
||||
},
|
||||
{
|
||||
name: "管理",
|
||||
href: "",
|
||||
}
|
||||
];
|
||||
}
|
||||
if (n === "/systemmanage" || n === "/SystemManage") {
|
||||
state.list = [
|
||||
{
|
||||
|
||||
@@ -112,7 +112,7 @@ export default {
|
||||
}
|
||||
.roleItems {
|
||||
width: 109px;
|
||||
height: 80px;
|
||||
height: 90px;
|
||||
padding-top: 10px;
|
||||
background: #ffffff;
|
||||
box-shadow: 0px 1px 35px 0px rgba(118, 136, 166, 0.21);
|
||||
@@ -121,6 +121,7 @@ export default {
|
||||
right: 0px;
|
||||
text-align: center;
|
||||
display: none;
|
||||
z-index: 100;
|
||||
}
|
||||
.roleItem {
|
||||
font-size: 14px;
|
||||
|
||||
@@ -49,10 +49,10 @@
|
||||
</div>
|
||||
<div class="select fitems">
|
||||
<a-range-picker
|
||||
v-model:value="value2"
|
||||
separator="至"
|
||||
:placeholder="[' 开始时间', ' 结束时间']"
|
||||
/>
|
||||
v-model:value="value2"
|
||||
separator="至"
|
||||
:placeholder="[' 开始时间', ' 结束时间']"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@@ -819,9 +819,9 @@
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
import { reactive, toRefs, defineComponent, ref } from 'vue';
|
||||
import { PlusOutlined, LoadingOutlined } from '@ant-design/icons-vue';
|
||||
import { message } from 'ant-design-vue';
|
||||
import { reactive, toRefs, defineComponent, ref } from "vue";
|
||||
import { PlusOutlined, LoadingOutlined } from "@ant-design/icons-vue";
|
||||
import { message } from "ant-design-vue";
|
||||
|
||||
function getBase64(img, callback) {
|
||||
const reader = new FileReader();
|
||||
@@ -1337,9 +1337,10 @@ export default defineComponent({
|
||||
</div>
|
||||
);
|
||||
},
|
||||
}];
|
||||
},
|
||||
];
|
||||
return columns;
|
||||
}
|
||||
};
|
||||
|
||||
const fileList = ref([]);
|
||||
const loading = ref(false);
|
||||
@@ -1468,7 +1469,7 @@ export default defineComponent({
|
||||
} else {
|
||||
state.hideshow = false;
|
||||
}
|
||||
}
|
||||
};
|
||||
const bs_hShow = () => {
|
||||
if (state.bs_hs == true) {
|
||||
state.bs_hs = false;
|
||||
@@ -1942,7 +1943,7 @@ export default defineComponent({
|
||||
|
||||
.tableBox {
|
||||
margin: 20px 38px 30px;
|
||||
.op_box{
|
||||
.op_box {
|
||||
display: flex;
|
||||
justify-content: right;
|
||||
.opacation {
|
||||
|
||||
@@ -185,8 +185,12 @@
|
||||
<div class="box"></div>
|
||||
<div class="onetitle">关卡晋级规则</div>
|
||||
</div>
|
||||
<div class="twomain">
|
||||
<a-switch size="small" v-model:checked="checked2" />
|
||||
<div class="twomain clearfix">
|
||||
<a-switch
|
||||
size="small"
|
||||
v-model:checked="checked2"
|
||||
style="margin-top: -5px"
|
||||
/>
|
||||
<span class="info">启用关卡自动规则加入</span>
|
||||
<div class="infor">
|
||||
若开启“新建/编辑关卡-添加学员”支持设定自动加入规则，将于每日8点同步数据
|
||||
@@ -351,7 +355,7 @@ export default {
|
||||
};
|
||||
</script>
|
||||
|
||||
<style scoped lang="scss" >
|
||||
<style scoped lang="scss">
|
||||
.clearfix:before,
|
||||
.clearfix:after {
|
||||
content: " ";
|
||||
@@ -758,7 +762,7 @@ export default {
|
||||
position: absolute;
|
||||
// margin-top: 10px;
|
||||
left: 0;
|
||||
top: 5px;
|
||||
top: 3px;
|
||||
}
|
||||
.yulan {
|
||||
// color: yellow;
|
||||
@@ -773,10 +777,14 @@ export default {
|
||||
.twomain {
|
||||
margin-left: 20px;
|
||||
margin-top: 20px;
|
||||
.ant-switch-checked {
|
||||
background-color: #5dc988;
|
||||
}
|
||||
.info {
|
||||
margin-left: 10px;
|
||||
color: #6f6f6f;
|
||||
font-size: 14px;
|
||||
// margin-top: 10px;
|
||||
}
|
||||
.infor {
|
||||
margin-left: 38px;
|
||||
@@ -818,7 +826,7 @@ export default {
|
||||
position: relative;
|
||||
.inl {
|
||||
position: absolute;
|
||||
top: 5px;
|
||||
top: 2px;
|
||||
}
|
||||
.sh {
|
||||
margin-left: 23px;
|
||||
@@ -832,4 +840,4 @@ export default {
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
</style>
|
||||
|
||||
@@ -1,12 +1,939 @@
|
||||
<template>
|
||||
<div>ddd</div>
|
||||
<div class="allCon">
|
||||
<div class="left clearfix">
|
||||
<div class="leftmain">
|
||||
<div class="tit">关卡</div>
|
||||
<div class="btn btn3">
|
||||
<div class="search"></div>
|
||||
<div class="btnText">添加关卡</div>
|
||||
</div>
|
||||
<div class="maincon">
|
||||
<div class="item" v-for="item in level" :key="item.id">
|
||||
<div class="itemle">
|
||||
<div class="tit">{{ item.tit }}</div>
|
||||
<div class="name">{{ item.name }}</div>
|
||||
</div>
|
||||
<div class="itemri">
|
||||
<img src="../../assets/images/leveladd/z1.png" />
|
||||
<img
|
||||
style="margin-top: 40px"
|
||||
src="../../assets/images/leveladd/z2.png"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="right">
|
||||
<div class="addhead">
|
||||
<div class="filt">
|
||||
<div class="le">
|
||||
<div class="leftimg">
|
||||
<img class="img" src="../../assets/px.jpg" />
|
||||
</div>
|
||||
<div class="imgfor">
|
||||
<div class="forz">产品经理进阶路径</div>
|
||||
<div class="fort">创建时间：2022-07-21 00:00</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="rightt">
|
||||
<div class="select">
|
||||
<a-select
|
||||
v-model:value="projectName"
|
||||
style="width: 270px"
|
||||
placeholder="自由学习模式"
|
||||
:options="projectNameList"
|
||||
@change="selectProjectName"
|
||||
allowClear
|
||||
showSearch
|
||||
></a-select>
|
||||
</div>
|
||||
<div class="line"></div>
|
||||
<img class="img2" src="../../assets/images/leveladd/pub.png" />
|
||||
<div class="pub">发布</div>
|
||||
<div class="line"></div>
|
||||
<img
|
||||
style="margin-right: 15px"
|
||||
class="img2"
|
||||
src="../../assets/images/leveladd/more.png"
|
||||
/>
|
||||
<div class="more">
|
||||
<span style="color: #7096e3">更多</span>
|
||||
<div class="moreArrow"></div>
|
||||
<div class="moreItems">
|
||||
<div class="sammo">撤回</div>
|
||||
<div class="sammo">复制</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="line"></div>
|
||||
<img class="img2" src="../../assets/images/leveladd/back.png" />
|
||||
<router-link to="/leveladd">
|
||||
<div class="return">返回</div></router-link
|
||||
>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="mid">
|
||||
<!-- <div class="item" v-for="(item, index) in mid" :key="item.id">
|
||||
<div class="itcon">
|
||||
<div class="img">
|
||||
<img :src="item.img" />
|
||||
</div>
|
||||
<div class="text">{{ item.title }}</div>
|
||||
</div>
|
||||
<div :class="[index === mid.length - 1 ? 'no' : 'lin']"></div>
|
||||
</div> -->
|
||||
<div class="item">
|
||||
<div class="itcon">
|
||||
<div class="img">
|
||||
<img src="../../assets/images/leveladd/zai.png" />
|
||||
</div>
|
||||
<div class="text">在线</div>
|
||||
</div>
|
||||
<div class="lin"></div>
|
||||
</div>
|
||||
<div class="item">
|
||||
<div class="itcon">
|
||||
<div class="img">
|
||||
<img src="../../assets/images/leveladd/mian.png" />
|
||||
</div>
|
||||
<div class="text">面授</div>
|
||||
</div>
|
||||
<div class="lin"></div>
|
||||
</div>
|
||||
<div class="item">
|
||||
<div class="itcon">
|
||||
<div class="img">
|
||||
<img src="../../assets/images/leveladd/an.png" />
|
||||
</div>
|
||||
<div class="text">案例</div>
|
||||
</div>
|
||||
<div class="lin"></div>
|
||||
</div>
|
||||
<div class="item">
|
||||
<div class="itcon">
|
||||
<div class="img">
|
||||
<img src="../../assets/images/leveladd/zuo.png" />
|
||||
</div>
|
||||
<div class="text">作业</div>
|
||||
</div>
|
||||
<div class="lin"></div>
|
||||
</div>
|
||||
<div class="item">
|
||||
<div class="itcon">
|
||||
<div class="img">
|
||||
<img src="../../assets/images/leveladd/kao.png" />
|
||||
</div>
|
||||
<div class="text">考试</div>
|
||||
</div>
|
||||
<div class="lin"></div>
|
||||
</div>
|
||||
<div class="item">
|
||||
<div class="itcon">
|
||||
<div class="img">
|
||||
<img src="../../assets/images/leveladd/zhi.png" />
|
||||
</div>
|
||||
<div class="text">直播</div>
|
||||
</div>
|
||||
<div class="lin"></div>
|
||||
</div>
|
||||
<div class="item">
|
||||
<div class="itcon">
|
||||
<div class="img">
|
||||
<img src="../../assets/images/leveladd/wai.png" />
|
||||
</div>
|
||||
<div class="text">外链</div>
|
||||
</div>
|
||||
<div class="lin"></div>
|
||||
</div>
|
||||
<div class="item">
|
||||
<div class="itcon">
|
||||
<div class="img">
|
||||
<img src="../../assets/images/leveladd/tao.png" />
|
||||
</div>
|
||||
<div class="text">讨论</div>
|
||||
</div>
|
||||
<div class="lin"></div>
|
||||
</div>
|
||||
<div class="item">
|
||||
<div class="itcon">
|
||||
<div class="img">
|
||||
<img src="../../assets/images/leveladd/huo.png" />
|
||||
</div>
|
||||
<div class="text">活动</div>
|
||||
</div>
|
||||
<div class="lin"></div>
|
||||
</div>
|
||||
<div class="item">
|
||||
<div class="itcon">
|
||||
<div class="img">
|
||||
<img src="../../assets/images/leveladd/ce.png" />
|
||||
</div>
|
||||
<div class="text">测评</div>
|
||||
</div>
|
||||
<div class="lin"></div>
|
||||
</div>
|
||||
<div class="item">
|
||||
<div class="itcon">
|
||||
<div class="img">
|
||||
<img src="../../assets/images/leveladd/diao.png" />
|
||||
</div>
|
||||
<div class="text">调研</div>
|
||||
</div>
|
||||
<div class="lin"></div>
|
||||
</div>
|
||||
<div class="item">
|
||||
<div class="itcon">
|
||||
<div class="img">
|
||||
<img src="../../assets/images/leveladd/tou.png" />
|
||||
</div>
|
||||
<div class="text">投票</div>
|
||||
</div>
|
||||
<div class="lin"></div>
|
||||
</div>
|
||||
<div class="item">
|
||||
<div class="itcon">
|
||||
<div class="img">
|
||||
<img
|
||||
src="../../assets/images/leveladd/xiang.png"
|
||||
@click="showDrawer"
|
||||
/>
|
||||
</div>
|
||||
<div class="text">项目</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="boom">
|
||||
<div class="boomcen">
|
||||
<div class="select">
|
||||
<a-select
|
||||
v-model:value="projectName"
|
||||
style="width: 270px"
|
||||
placeholder="移动任务到关卡"
|
||||
:options="projectNameList2"
|
||||
@change="selectProjectName2"
|
||||
allowClear
|
||||
showSearch
|
||||
></a-select>
|
||||
</div>
|
||||
<div class="talk">
|
||||
<img class="im" src="../../assets/images/leveladd/gan.png" />
|
||||
<div class="xu">
|
||||
<span class="yi">已选择</span>
|
||||
<div style="width: 5px; display: inline-block"></div>
|
||||
<span class="th">3</span>
|
||||
<div style="width: 5px; display: inline-block"></div>
|
||||
<span class="yi">项</span>
|
||||
<span class="zon">总数：</span>
|
||||
<span class="yi">5</span>
|
||||
<span class="yi">条</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="tableBox">
|
||||
<a-table
|
||||
style="border: 1px solid #f2f6fe"
|
||||
:columns="tableDataFunc()"
|
||||
:data-source="tableData"
|
||||
:loading="tableDataTotal === -1 ? true : false"
|
||||
expandRowByClick="true"
|
||||
:scroll="{ x: 1500, y: 300 }"
|
||||
@expand="expandTable"
|
||||
:pagination="false"
|
||||
/>
|
||||
<!-- :pagination= showSizeChanger: true, showQuickJumper: true,
|
||||
hideOnSinglePage: true, pageSizeOptions: [], pageSize: pageSize, current:
|
||||
currentPage, total: tableDataTotal, -->
|
||||
<div class="pa">
|
||||
<a-pagination
|
||||
showSizeChanger="true"
|
||||
showQuickJumper="true"
|
||||
hideOnSinglePage="true"
|
||||
:pageSize="pageSize"
|
||||
:current="currentPage"
|
||||
:total="tableDataTotal"
|
||||
class="pagination"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<a-drawer
|
||||
v-model:visible="visible"
|
||||
class="custom-class"
|
||||
title="关联项目"
|
||||
placement="right"
|
||||
width="50%"
|
||||
@after-visible-change="afterVisibleChange"
|
||||
>
|
||||
</a-drawer>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { reactive, toRefs } from "vue";
|
||||
export default {
|
||||
name: "LevelAddDetail",
|
||||
setup() {
|
||||
const state = reactive({
|
||||
projectNameList: [
|
||||
{
|
||||
id: 1,
|
||||
value: "项目一",
|
||||
label: "项目一",
|
||||
},
|
||||
{
|
||||
id: 2,
|
||||
value: "项目二",
|
||||
label: "项目二",
|
||||
},
|
||||
{
|
||||
id: 3,
|
||||
value: "项目三",
|
||||
label: "项目三",
|
||||
},
|
||||
{
|
||||
id: 4,
|
||||
value: "项目四",
|
||||
label: "项目四",
|
||||
},
|
||||
],
|
||||
projectNameList2: [
|
||||
{
|
||||
id: 1,
|
||||
value: "项目一",
|
||||
label: "项目一",
|
||||
},
|
||||
{
|
||||
id: 2,
|
||||
value: "项目二",
|
||||
label: "项目二",
|
||||
},
|
||||
{
|
||||
id: 3,
|
||||
value: "项目三",
|
||||
label: "项目三",
|
||||
},
|
||||
{
|
||||
id: 4,
|
||||
value: "项目四",
|
||||
label: "项目四",
|
||||
},
|
||||
],
|
||||
level: [
|
||||
{
|
||||
id: "1",
|
||||
tit: "关卡1关卡1关卡1关卡1关卡1关卡1",
|
||||
name: "初级产品经理fewfewfwefwefe",
|
||||
},
|
||||
{
|
||||
id: "2",
|
||||
tit: "关卡2",
|
||||
name: "中级产品经理",
|
||||
},
|
||||
],
|
||||
tableData: [
|
||||
{
|
||||
key: 1,
|
||||
lei: "在线",
|
||||
// state: "已发布",
|
||||
creater: "管理者课程",
|
||||
// pubtime: "2022-07-20 14:00:03",
|
||||
cretime: "60分钟",
|
||||
haspub: false,
|
||||
checked1: false,
|
||||
checkedd: false,
|
||||
},
|
||||
{
|
||||
key: 2,
|
||||
lei: "面授",
|
||||
// state: "草稿",
|
||||
creater: "管理者面授",
|
||||
// pubtime: "2022-07-20 14:00:03",
|
||||
cretime: "20分钟",
|
||||
haspub: true,
|
||||
checked1: false,
|
||||
checkedd: false,
|
||||
},
|
||||
{
|
||||
key: 3,
|
||||
lei: "作业",
|
||||
// state: "已停用",
|
||||
creater: "管理者作业",
|
||||
// pubtime: "2022-07-20 14:00:03",
|
||||
cretime: "60分钟",
|
||||
haspub: false,
|
||||
checked1: false,
|
||||
checkedd: false,
|
||||
},
|
||||
{
|
||||
key: 4,
|
||||
lei: "考试",
|
||||
// state: "草稿",
|
||||
creater: "管理者考试",
|
||||
// pubtime: "2022-07-20 14:00:03",
|
||||
cretime: "20分钟",
|
||||
haspub: true,
|
||||
checked1: false,
|
||||
checkedd: false,
|
||||
},
|
||||
{
|
||||
key: 5,
|
||||
lei: "案例",
|
||||
// state: "草稿",
|
||||
creater: "腾飞班1案例",
|
||||
// pubtime: "2022-07-20 14:00:03",
|
||||
cretime: "-",
|
||||
haspub: true,
|
||||
checked1: true,
|
||||
checkedd: false,
|
||||
},
|
||||
],
|
||||
currentPage: 1,
|
||||
tableDataTotal: 100,
|
||||
pageSize: 10,
|
||||
visible: false,
|
||||
});
|
||||
const selectProjectName = (value, index) => {
|
||||
console.log("value", value, index);
|
||||
};
|
||||
const selectProjectName2 = (value, index) => {
|
||||
console.log("value", value, index);
|
||||
};
|
||||
const showDrawer = () => {
|
||||
state.visible = true;
|
||||
};
|
||||
const afterVisibleChange = (bool) => {
|
||||
console.log("visible", bool);
|
||||
};
|
||||
const tableDataFunc = () => {
|
||||
const columns = [
|
||||
{
|
||||
title: "类型",
|
||||
dataIndex: "state",
|
||||
// width: "30%",
|
||||
key: "state",
|
||||
width: 90,
|
||||
align: "center",
|
||||
className: "h",
|
||||
scopedSlots: { customRender: "action" }, //引入的插槽
|
||||
customRender: (text) => {
|
||||
console.log(text.record.checked1);
|
||||
return (
|
||||
<div class="racona">
|
||||
<div class="img"></div>
|
||||
<a-checkbox class="ch" v-model:checked={text.record.checkedd}>
|
||||
{text.record.lei}
|
||||
</a-checkbox>
|
||||
</div>
|
||||
);
|
||||
},
|
||||
},
|
||||
{
|
||||
title: "任务名称",
|
||||
dataIndex: "creater",
|
||||
// width: "30%",
|
||||
key: "creater",
|
||||
width: 200,
|
||||
align: "center",
|
||||
className: "h",
|
||||
},
|
||||
{
|
||||
title: "必修/选修",
|
||||
dataIndex: "pubtime",
|
||||
key: "pubtime",
|
||||
width: 200,
|
||||
align: "center",
|
||||
className: "h",
|
||||
scopedSlots: { customRender: "action" }, //引入的插槽
|
||||
customRender: (text) => {
|
||||
console.log(text.record.checked1);
|
||||
return (
|
||||
<div class="opat">
|
||||
<div class="opacationt clearfix">
|
||||
<a-switch
|
||||
style="margin-left:-50px;margin-top:3px"
|
||||
v-model:checked={text.record.checked1}
|
||||
size="small"
|
||||
active-color="red"
|
||||
/>
|
||||
<div class="showt clearfix">
|
||||
<div
|
||||
class="bi"
|
||||
style={
|
||||
text.record.checked1 ? "z-index:999" : "z-index:998"
|
||||
}
|
||||
>
|
||||
必修
|
||||
</div>
|
||||
<div class="xuan">选修</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
},
|
||||
},
|
||||
{
|
||||
title: "时长",
|
||||
dataIndex: "cretime",
|
||||
key: "cretime",
|
||||
width: 100,
|
||||
align: "center",
|
||||
className: "h",
|
||||
},
|
||||
{
|
||||
title: "操作",
|
||||
className: "h",
|
||||
dataIndex: "opacation",
|
||||
key: "opacation",
|
||||
width: 100,
|
||||
align: "center",
|
||||
scopedSlots: { customRender: "action" }, //引入的插槽
|
||||
customRender: () => {
|
||||
return (
|
||||
<div class="opa">
|
||||
<div class="opacation">
|
||||
<span style="color:#4EA6FF;margin-right:25px;cursor:pointer">
|
||||
编辑
|
||||
</span>
|
||||
<span style="color:#4EA6FF;cursor:pointer">删除</span>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
},
|
||||
},
|
||||
];
|
||||
return columns;
|
||||
};
|
||||
|
||||
return {
|
||||
...toRefs(state),
|
||||
selectProjectName,
|
||||
selectProjectName2,
|
||||
tableDataFunc,
|
||||
showDrawer,
|
||||
afterVisibleChange,
|
||||
};
|
||||
},
|
||||
};
|
||||
</script>
|
||||
|
||||
<style scoped lang="scss" >
|
||||
<style lang="scss" >
|
||||
.clearfix:after,
|
||||
.clearfix:before {
|
||||
content: " ";
|
||||
display: block;
|
||||
clear: both;
|
||||
}
|
||||
|
||||
.allCon {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
background-color: #f1f4f8;
|
||||
display: flex;
|
||||
.left {
|
||||
margin-right: 20px;
|
||||
width: 208px;
|
||||
flex-shrink: 0;
|
||||
height: 100%;
|
||||
background: #ffffff;
|
||||
box-shadow: 0px 1px 35px 0px rgba(118, 136, 166, 0.21);
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
.leftmain {
|
||||
width: 86%;
|
||||
margin-top: 20px;
|
||||
.tit {
|
||||
font-size: 18px;
|
||||
color: #363636;
|
||||
}
|
||||
|
||||
// flex-wrap: wrap;
|
||||
.btn {
|
||||
margin-top: 20px;
|
||||
// padding: 0px 26px 0px 26px;
|
||||
height: 38px;
|
||||
background: #fff6e8;
|
||||
border-radius: 8px;
|
||||
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: #ffb64e;
|
||||
// line-height: 38px;
|
||||
margin-top: 4px;
|
||||
margin-left: 5px;
|
||||
}
|
||||
}
|
||||
|
||||
.btn3 {
|
||||
margin-right: 0px;
|
||||
.search {
|
||||
width: 17px;
|
||||
height: 18px;
|
||||
background-image: url("../../assets/images/leveladd/add.png");
|
||||
background-size: 100% 100%;
|
||||
}
|
||||
}
|
||||
.maincon {
|
||||
margin-top: 17px;
|
||||
width: 100%;
|
||||
// background-color: #bfa;
|
||||
.item {
|
||||
width: 100%;
|
||||
height: 83px;
|
||||
display: flex;
|
||||
background: rgba(255, 182, 78, 0.1);
|
||||
border: 1px solid #ffb64e;
|
||||
opacity: 0.45;
|
||||
border-radius: 8px;
|
||||
margin-bottom: 17px;
|
||||
align-items: center;
|
||||
position: relative;
|
||||
.itemle {
|
||||
margin-left: 17px;
|
||||
.tit {
|
||||
color: black;
|
||||
// color: red;
|
||||
font-size: 14px;
|
||||
margin-bottom: 8px;
|
||||
font-weight: bold;
|
||||
white-space: nowrap;
|
||||
text-overflow: ellipsis;
|
||||
overflow: hidden;
|
||||
width: 100px;
|
||||
}
|
||||
.name {
|
||||
font-size: 14px;
|
||||
color: #878b92;
|
||||
white-space: nowrap;
|
||||
text-overflow: ellipsis;
|
||||
overflow: hidden;
|
||||
width: 100px;
|
||||
}
|
||||
}
|
||||
.itemri {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
position: absolute;
|
||||
right: 16px;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
.right {
|
||||
flex: 1;
|
||||
height: 100%;
|
||||
width: 100%;
|
||||
// background-color: #fff;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
.addhead {
|
||||
width: 100%;
|
||||
// min-width: 500px;
|
||||
// height: 130px;
|
||||
|
||||
background-color: #fff;
|
||||
box-shadow: 0px 1px 35px 0px rgba(118, 136, 166, 0.07);
|
||||
display: flex;
|
||||
align-items: center;
|
||||
position: relative;
|
||||
.filt {
|
||||
margin: 16px 30px 16px 22px;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
width: 100%;
|
||||
align-items: center;
|
||||
flex-wrap: wrap;
|
||||
.le {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
// margin-bottom: 10px;
|
||||
.leftimg {
|
||||
width: 151px;
|
||||
height: 100px;
|
||||
border: 10px solid #e7f2ff;
|
||||
border-radius: 8px;
|
||||
margin-left: 20px;
|
||||
.img {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
}
|
||||
.imgfor {
|
||||
margin-left: 32px;
|
||||
.forz {
|
||||
color: #363636;
|
||||
font-size: 16px;
|
||||
}
|
||||
.fort {
|
||||
color: #878b92;
|
||||
font-size: 14px;
|
||||
margin-top: 20px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.rightt {
|
||||
// width: 500px;
|
||||
height: 100%;
|
||||
// background-color: red;
|
||||
// position: absolute;
|
||||
// right: 0;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
.select {
|
||||
margin-right: 50px;
|
||||
// margin-bottom: 20px;
|
||||
}
|
||||
.line {
|
||||
height: 60px;
|
||||
width: 1px;
|
||||
background-color: #e8effa;
|
||||
margin-right: 28px;
|
||||
}
|
||||
.img2 {
|
||||
width: 42px;
|
||||
height: 42px;
|
||||
margin-right: 22px;
|
||||
}
|
||||
.pub {
|
||||
color: #ffb64e;
|
||||
font-size: 14px;
|
||||
margin-top: 5px;
|
||||
margin-right: 30px;
|
||||
}
|
||||
.return {
|
||||
color: #4ea6ff;
|
||||
font-size: 14px;
|
||||
margin-top: 5px;
|
||||
margin-right: 20px;
|
||||
}
|
||||
|
||||
.more {
|
||||
position: relative;
|
||||
margin-right: 30px;
|
||||
|
||||
.moreArrow {
|
||||
width: 13px;
|
||||
height: 7px;
|
||||
display: inline-block;
|
||||
background-image: url("../../assets/images/navtop/down.png");
|
||||
background-size: 100%;
|
||||
margin: 2px;
|
||||
margin-left: 15px;
|
||||
}
|
||||
.moreItems {
|
||||
width: 110px;
|
||||
height: 80px;
|
||||
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: -48px;
|
||||
top: 28px;
|
||||
z-index: 100;
|
||||
.sammo {
|
||||
text-align: center;
|
||||
margin-top: 12px;
|
||||
}
|
||||
.sammo:hover {
|
||||
color: #4ea6ff;
|
||||
}
|
||||
}
|
||||
.moreItems:hover {
|
||||
display: block;
|
||||
}
|
||||
}
|
||||
|
||||
.more:hover .moreArrow {
|
||||
background-image: url("../../assets/images/navtop/up.png");
|
||||
}
|
||||
.more:hover .moreItems {
|
||||
display: block;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.mid {
|
||||
width: 100%;
|
||||
height: 130px;
|
||||
margin-top: 20px;
|
||||
margin-bottom: 20px;
|
||||
background-color: #fff;
|
||||
box-shadow: 0px 1px 35px 0px rgba(118, 136, 166, 0.07);
|
||||
display: flex;
|
||||
align-items: center;
|
||||
.item {
|
||||
height: 100%;
|
||||
width: 7.7%;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
.itcon {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
height: 100%;
|
||||
width: 100%;
|
||||
.img {
|
||||
cursor: pointer;
|
||||
}
|
||||
.text {
|
||||
font-size: 16px;
|
||||
color: #363636;
|
||||
margin-top: 5px;
|
||||
}
|
||||
}
|
||||
.lin {
|
||||
width: 1px;
|
||||
height: 60%;
|
||||
background-color: #e8effa;
|
||||
}
|
||||
.no {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
}
|
||||
.boom {
|
||||
position: relative;
|
||||
width: 100%;
|
||||
flex: 1;
|
||||
background-color: #fff;
|
||||
box-shadow: 0px 1px 35px 0px rgba(118, 136, 166, 0.07);
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
.boomcen {
|
||||
width: 95%;
|
||||
height: 100%;
|
||||
// background-color: #bfa;
|
||||
.select {
|
||||
margin-top: 30px;
|
||||
}
|
||||
.talk {
|
||||
margin-top: 24px;
|
||||
margin-bottom: 11px;
|
||||
width: 100%;
|
||||
height: 50px;
|
||||
background: #f5faff;
|
||||
border: 1px solid #4ea6ff;
|
||||
// opacity: 0.22;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
.im {
|
||||
width: 14px;
|
||||
height: 15px;
|
||||
margin-left: 27px;
|
||||
}
|
||||
.xu {
|
||||
height: 100%;
|
||||
line-height: 50px;
|
||||
margin-left: 13px;
|
||||
.yi {
|
||||
color: #4f5156;
|
||||
font-size: 14px;
|
||||
}
|
||||
.zon {
|
||||
color: #999ba3;
|
||||
font-size: 14px;
|
||||
margin-left: 34px;
|
||||
}
|
||||
.th {
|
||||
color: #4ea6ff;
|
||||
}
|
||||
}
|
||||
}
|
||||
.tableBox {
|
||||
// margin: 20px 38px 30px;
|
||||
th.h {
|
||||
background-color: #eff4fc !important;
|
||||
}
|
||||
|
||||
.ant-table-tbody
|
||||
> tr:hover:not(.ant-table-expanded-row):not(.ant-table-row-selected)
|
||||
> td {
|
||||
background: #f6f9fd;
|
||||
}
|
||||
.pa {
|
||||
left: 0;
|
||||
width: 100%;
|
||||
// height: 20px;
|
||||
// background-color: red;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
position: absolute;
|
||||
bottom: 20px;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
.opat {
|
||||
.opacationt {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
.ant-switch-checked {
|
||||
background-color: #5dc988;
|
||||
}
|
||||
.showt {
|
||||
// margin-top: 10px;
|
||||
display: flex;
|
||||
margin-left: 10px;
|
||||
height: 23px;
|
||||
.bi {
|
||||
// margin-top: 10px;
|
||||
width: 63px;
|
||||
height: 23;
|
||||
background-color: #5dc988;
|
||||
line-height: 23px;
|
||||
position: absolute;
|
||||
z-index: 998;
|
||||
color: #ffffff;
|
||||
border-radius: 4px;
|
||||
}
|
||||
.xuan {
|
||||
width: 63px;
|
||||
height: 23px;
|
||||
background-color: #f2f6fc;
|
||||
line-height: 23px;
|
||||
// display: none;
|
||||
position: absolute;
|
||||
z-index: 998;
|
||||
color: #5dc988;
|
||||
border-radius: 4px;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
.racona {
|
||||
// background-color: #bfa;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
height: 100%;
|
||||
.img {
|
||||
margin-left: -40px;
|
||||
margin-top: -2px;
|
||||
width: 17px;
|
||||
height: 14px;
|
||||
background-image: url("../../assets/images/leveladd/z1.png");
|
||||
}
|
||||
.ch {
|
||||
margin-left: 10px;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
File diff suppressed because it is too large
Load Diff
33
src/views/projectcenter/TaskPage.vue
Normal file
33
src/views/projectcenter/TaskPage.vue
Normal file
@@ -0,0 +1,33 @@
|
||||
<!-- 任务页面 -->
|
||||
<template>
|
||||
<div class="taskpage">
|
||||
<div class="header">
|
||||
<div class="box">
|
||||
<img src="../../assets/images/projectadd/picture.png"/>
|
||||
</div>
|
||||
</div>
|
||||
<div class="split"></div>
|
||||
<div>2</div>
|
||||
</div>
|
||||
</template>
|
||||
<style lang="scss">
|
||||
.taskpage {
|
||||
width: 100%;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
.header {
|
||||
width: 100%;
|
||||
display: flex;
|
||||
.box {
|
||||
border: 12px solid #E7F2FF;
|
||||
margin: 16px 0 16px 19px;
|
||||
border-radius: 8px;
|
||||
}
|
||||
}
|
||||
.split {
|
||||
width: 100%;
|
||||
height: 20px;
|
||||
background-color: #edf0f5;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
256
src/views/research/ManagePage.vue
Normal file
256
src/views/research/ManagePage.vue
Normal file
@@ -0,0 +1,256 @@
|
||||
<!-- 调研管理-管理页面 -->
|
||||
<template>
|
||||
<div class="managepage">
|
||||
<div class="up">
|
||||
<div class="header">
|
||||
<div style="width: 100%">
|
||||
<div class="export">
|
||||
<img src="../../assets/images/research/export.png"/>
|
||||
<span style="color: #4EA6FF;font-size: 14px;margin-left:3px">导出信息</span>
|
||||
</div>
|
||||
<div class="goback"><span class="return"></span><router-link class="returntext" to="/researchmanage">返回</router-link></div>
|
||||
</div>
|
||||
<div class="text">路径管理</div>
|
||||
</div>
|
||||
<div class="message">
|
||||
<div class="title">基本信息</div>
|
||||
<div class="messagebox">
|
||||
<div style="width: 186px;margin-right: 126px;float: left">
|
||||
<span class="name">调研名称:</span>
|
||||
<span class="descript">产品经理问卷调查</span>
|
||||
</div>
|
||||
<div style="width: 103px;margin-right: 126px;float:left">
|
||||
<span class="name">创建人:</span>
|
||||
<span class="descript">管理员</span>
|
||||
</div>
|
||||
<div style="width: 88px;margin-right: 126px;float:left">
|
||||
<span class="name">状态:</span>
|
||||
<span class="descript">已发布</span>
|
||||
</div>
|
||||
<div style="width: 192px;margin-right: 126px;float:left">
|
||||
<span class="name">创建时间:</span>
|
||||
<span class="descript">2022-07-22 9:30</span>
|
||||
</div>
|
||||
<div style="width: 192px;margin-right: 126px;float:left">
|
||||
<span class="name">创建时间:</span>
|
||||
<span class="descript">2022-07-22 9:30</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="split"></div>
|
||||
<div class="up down">
|
||||
<div class="header">
|
||||
<div class="text">学员情况</div>
|
||||
</div>
|
||||
<!-- 表格 -->
|
||||
<div class="tableBox">
|
||||
<a-table
|
||||
style="border: 1px solid #f2f6fe"
|
||||
:columns="columns"
|
||||
:data-source="dataSource"
|
||||
:loading="tableDataTotal === -1 ? true : false"
|
||||
expandRowByClick="true"
|
||||
:scroll="{ x: 1500, y: 800 }"
|
||||
@expand="expandTable"
|
||||
:pagination="false"
|
||||
/>
|
||||
</div>
|
||||
<!-- 表格 -->
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
name: "ManagePage",
|
||||
setup() {
|
||||
return {
|
||||
dataSource: [
|
||||
{
|
||||
key: '1',
|
||||
name: '张三',
|
||||
department: '产品部',
|
||||
post:'产品经理',
|
||||
project:'产品经理进阶-腾飞班1',
|
||||
learning:'产品经理学习路径',
|
||||
submit:'2022-07-22 9:30',
|
||||
},
|
||||
{
|
||||
key: '2',
|
||||
name: '李四',
|
||||
department: '产品部',
|
||||
post:'产品经理',
|
||||
project:'产品经理进阶-腾飞班1',
|
||||
learning:'高级产品经理学习路径',
|
||||
submit:'2022-07-22 9:30',
|
||||
},
|
||||
{
|
||||
key: '3',
|
||||
name: '王五',
|
||||
department: '产品部',
|
||||
post:'产品经理',
|
||||
project:'产品经理进阶-腾飞班1',
|
||||
learning:'-',
|
||||
submit:'2022-07-22 9:30',
|
||||
},
|
||||
{
|
||||
key: '4',
|
||||
name: '赵六',
|
||||
department: '产品部',
|
||||
post:'产品经理',
|
||||
project:'产品经理进阶-腾飞班1',
|
||||
learning:'HR学习路径',
|
||||
submit:'2022-07-22 9:30',
|
||||
},
|
||||
],
|
||||
|
||||
columns: [
|
||||
{
|
||||
title: '姓名',
|
||||
dataIndex: 'name',
|
||||
key: 'name',
|
||||
},
|
||||
{
|
||||
title: '部门',
|
||||
dataIndex: 'department',
|
||||
key: 'department',
|
||||
},
|
||||
{
|
||||
title: '岗位',
|
||||
dataIndex: 'post',
|
||||
key: 'post',
|
||||
},
|
||||
{
|
||||
title: '项目',
|
||||
dataIndex: 'project',
|
||||
key: 'project',
|
||||
},
|
||||
{
|
||||
title: '学习路径',
|
||||
dataIndex: 'learning',
|
||||
key: 'learning',
|
||||
},
|
||||
{
|
||||
title: '提交时间',
|
||||
dataIndex: 'submit',
|
||||
key: 'submit',
|
||||
},
|
||||
],
|
||||
};
|
||||
},
|
||||
};
|
||||
</script>
|
||||
|
||||
<style lang="scss" >
|
||||
.managepage {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
.up {
|
||||
width: 100%;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
.header {
|
||||
width: 100%;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
border-bottom: 1px solid #F2F6FC;
|
||||
.text {
|
||||
font-size: 16px;
|
||||
color: #363636;
|
||||
margin-top: 23px;
|
||||
margin-left: 38px;
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
.export {
|
||||
float: left;
|
||||
width: 130px;
|
||||
height: 40px;
|
||||
border: 1px solid #4EA6FF;
|
||||
border-radius: 8px;
|
||||
margin-top: 29px;
|
||||
margin-left: 38px;
|
||||
text-align: center;
|
||||
padding-top: 7px;
|
||||
}
|
||||
.goback {
|
||||
float: right;
|
||||
padding-right: 70px;
|
||||
//padding-top: 37px;
|
||||
position: relative;
|
||||
.return {
|
||||
display: inline-block;
|
||||
width: 42px;
|
||||
height: 42px;
|
||||
margin-top: 17px;
|
||||
margin-right: 10px;
|
||||
background-image: url("../../assets/images/projectadd/return.png");
|
||||
}
|
||||
.returntext {
|
||||
display: inline-block;
|
||||
position: absolute;
|
||||
top: 27px;
|
||||
color: #4EA6FF;
|
||||
font-size: 14px;
|
||||
}
|
||||
}
|
||||
}
|
||||
.message {
|
||||
width: 100%;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
.title {
|
||||
color: #4F5156;
|
||||
font-size: 14px;
|
||||
margin-left: 38px;
|
||||
margin-top: 20px;
|
||||
font-weight: 500;
|
||||
}
|
||||
.messagebox {
|
||||
width: 100%;
|
||||
//display: flex;
|
||||
margin-top: 20px;
|
||||
margin-left: 38px;
|
||||
margin-bottom: 20px;
|
||||
.name {
|
||||
color: #999BA3;
|
||||
font-size: 14px;
|
||||
}
|
||||
.descript {
|
||||
color: #4F5156;
|
||||
font-size:14px;
|
||||
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
.split {
|
||||
width: 100%;
|
||||
height: 20px;
|
||||
background-color: #edf0f5;
|
||||
}
|
||||
.down {
|
||||
width: 100%;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
.tableBox {
|
||||
margin: 20px 38px 30px ;
|
||||
th.ant-table-cell {
|
||||
background-color:#EFF4FC !important;
|
||||
text-align: center;
|
||||
color: #999BA3;
|
||||
}
|
||||
td.ant-table-cell {
|
||||
text-align: center;
|
||||
}
|
||||
.ant-table-tbody
|
||||
> tr:hover:not(.ant-table-expanded-row):not(.ant-table-row-selected)
|
||||
> td {
|
||||
background: #f6f9fd;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@@ -1,16 +1,117 @@
|
||||
<template>
|
||||
<div class="researchadd">
|
||||
<div class="header">
|
||||
<span class="title">创建调研</span>
|
||||
<div class="goback"><span class="return"></span><router-link class="returntext" to="/researchmanage">返回</router-link></div>
|
||||
</div>
|
||||
<div class="content">
|
||||
<div class="type"></div>
|
||||
<div class="name">
|
||||
<div class="star">*</div>
|
||||
<div class="namebox">
|
||||
<div class="inname">类型</div>
|
||||
</div>
|
||||
<div class="in">
|
||||
<input type="radio" name="type" id="single" checked="checked"/><label for="single" class="text" style="margin-left: 5px">单选</label>
|
||||
<input type="radio" name="type" id="double" style="margin-left: 10px"/><label for="double" class="text" style="margin-left: 5px">多选</label>
|
||||
<input type="radio" name="type" id="score" style="margin-left: 10px"/><label for="score" class="text" style="margin-left: 5px">评分题</label>
|
||||
</div>
|
||||
</div>
|
||||
<div class="name">
|
||||
<div class="namebox">
|
||||
<img
|
||||
class="nameimg"
|
||||
src="../../assets/images/basicinfo/asterisk.png"
|
||||
/>
|
||||
<div class="inname">提干</div>
|
||||
<div class="in">
|
||||
<a-input v-model:value="valueE" placeholder="请输入项目名称"/>
|
||||
</div>
|
||||
<div class="in">
|
||||
<a-input v-model:value="valueE" placeholder="请输入项目名称" />
|
||||
</div>
|
||||
</div>
|
||||
<div class="name">
|
||||
<div class="in" style="margin-left: 133px">
|
||||
<a-button type="primary" style="width: 100px;height: 40px;border-radius: 8px">添加选项</a-button>
|
||||
</div>
|
||||
</div>
|
||||
<div class="options">
|
||||
<div class="name" >
|
||||
<div class="namebox">
|
||||
<div class="inname">选项1</div>
|
||||
</div>
|
||||
<div class="in">
|
||||
<a-input v-model:value="valueE" />
|
||||
</div>
|
||||
</div>
|
||||
<div class="delete">删除</div>
|
||||
</div>
|
||||
<div class="name" >
|
||||
<div class="in" style="margin-left: 133px">
|
||||
<div class="addimg">+添加图片</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="options">
|
||||
<div class="name" >
|
||||
<div class="namebox">
|
||||
<div class="inname">选项1</div>
|
||||
</div>
|
||||
<div class="in">
|
||||
<a-input v-model:value="valueE" />
|
||||
</div>
|
||||
</div>
|
||||
<div class="delete">删除</div>
|
||||
</div>
|
||||
<div class="picture" style="position: relative">
|
||||
<img class="pictureimg" src="../../assets/images/research/picture.png"/>
|
||||
<div class="picturename">图片名称1.jpg</div>
|
||||
<img
|
||||
style="width: 20px; height: 20px;position: absolute;right: 0;top:0"
|
||||
src="../../assets/images/basicinfo/close.png"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
<div class="header">
|
||||
<span class="title" style="font-size: 14px">选项设置</span>
|
||||
</div>
|
||||
<div class="content">
|
||||
<div class="name" >
|
||||
<div class="namebox">
|
||||
<div class="inname">最低分</div>
|
||||
</div>
|
||||
<div class="in">
|
||||
<a-input v-model:value="valueE" />
|
||||
</div>
|
||||
<div class="namebox" style="margin-left: -50px">
|
||||
<div class="inname">最高分</div>
|
||||
</div>
|
||||
<div class="in">
|
||||
<a-input v-model:value="valueE" />
|
||||
</div>
|
||||
</div>
|
||||
<div class="scorebox">
|
||||
<div class="scoretext">非常满意</div>
|
||||
<div class="number">
|
||||
<a-button class="btn" style="margin-left:10px">1</a-button>
|
||||
<a-button class="btn">2</a-button>
|
||||
<a-button class="btn">3</a-button>
|
||||
<a-button class="btn">4</a-button>
|
||||
<a-button class="btn">5</a-button>
|
||||
<a-button class="btn">6</a-button>
|
||||
<a-button class="btn">7</a-button>
|
||||
<a-button class="btn">8</a-button>
|
||||
<a-button class="btn">9</a-button>
|
||||
<a-button class="btn" style="margin-right: 10px;">10</a-button>
|
||||
</div>
|
||||
<div class="scoretext">非常不满意</div>
|
||||
</div>
|
||||
<div class="name name2">
|
||||
<div class="namebox">
|
||||
<div class="inname" style="margin-top: 13px">备注</div>
|
||||
</div>
|
||||
<div class="in">
|
||||
<a-textarea
|
||||
v-model:value="valuei"
|
||||
style="height: 80px"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="footer">
|
||||
@@ -19,8 +120,16 @@
|
||||
<a-button type="primary" ghost style="width: 100px;height: 40px;margin-left: 14px;border-radius: 8px">取消</a-button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</template>
|
||||
<style>
|
||||
<script lang="ts">
|
||||
</script>
|
||||
<style lang="scss">
|
||||
.researchadd {
|
||||
width: 100%;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
.header {
|
||||
width: 100%;
|
||||
display: flex;
|
||||
@@ -56,8 +165,112 @@
|
||||
}
|
||||
.content {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
|
||||
flex-direction: column;
|
||||
.scorebox {
|
||||
display:flex;
|
||||
align-items: center;
|
||||
margin-top: 20px;
|
||||
margin-left:70px;
|
||||
.scoretext {
|
||||
font-size: 14px;
|
||||
color: #56A3F9;
|
||||
}
|
||||
.number {
|
||||
display: flex;
|
||||
border: 1px solid #D7E5FD;
|
||||
border-radius: 5px;
|
||||
margin: 0 10px;
|
||||
.btn {
|
||||
border: 1px solid #56A3F9;
|
||||
border-radius: 5px;
|
||||
width: 40px;
|
||||
height: 40px;
|
||||
color: #56A3F9;
|
||||
margin: 5px;
|
||||
}
|
||||
}
|
||||
}
|
||||
.picture {
|
||||
width: 100px;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
margin-top: 20px;
|
||||
margin-left: 133px;
|
||||
.pictureimg {
|
||||
width: 100px;
|
||||
height: 100px;
|
||||
}
|
||||
.picturename {
|
||||
color: #6F6F6F;
|
||||
font-size: 14px;
|
||||
}
|
||||
}
|
||||
.name2 {
|
||||
display: flex;
|
||||
align-items: flex-start;
|
||||
}
|
||||
.options {
|
||||
display:flex;
|
||||
}
|
||||
.delete {
|
||||
margin-top: 27px;
|
||||
margin-left: 20px;
|
||||
float: right;
|
||||
color: #4EA6FF;
|
||||
font-size: 14px;
|
||||
}
|
||||
.name {
|
||||
width: 50%;
|
||||
// background-color: lightcoral;
|
||||
display: flex;
|
||||
margin-top: 20px;
|
||||
align-items: center;
|
||||
//height: 40px;
|
||||
// border: 1px solid black;
|
||||
.namebox {
|
||||
width: 120px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: flex-end;
|
||||
flex-shrink: 0;
|
||||
.nameimg {
|
||||
width: 10px;
|
||||
height: 10px;
|
||||
}
|
||||
}
|
||||
.inname {
|
||||
color: #6f6f6f;
|
||||
font-size: 14px;
|
||||
margin-left: 7px;
|
||||
}
|
||||
.in {
|
||||
margin-left: 14px;
|
||||
flex: 1;
|
||||
.addimg {
|
||||
color: rgba(78, 166, 255, 1);
|
||||
font-size: 14px;
|
||||
}
|
||||
.text {
|
||||
color: rgba(109, 117, 132, 1);
|
||||
font-size: 14px;
|
||||
//line-height: 24px;
|
||||
}
|
||||
.ant-radio-wrapper {
|
||||
}
|
||||
.ant-input {
|
||||
border-radius: 5px;
|
||||
// height: 120%;
|
||||
width: 100%;
|
||||
height: 40px;
|
||||
}
|
||||
.ant-select-selector {
|
||||
border-radius: 5px;
|
||||
// height: 120%;
|
||||
width: 100%;
|
||||
height: 40px;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
.footer {
|
||||
width: 100%;
|
||||
@@ -69,4 +282,6 @@
|
||||
cursor: pointer;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
</style>
|
||||
@@ -1,174 +1,562 @@
|
||||
<!---- 项目调研页面 --->
|
||||
<!-- 调研管理页面 -->
|
||||
<template>
|
||||
<div class="researchmanage">
|
||||
<!-- 搜索框及按钮 -->
|
||||
<div class="filter">
|
||||
<div class="filterItems">
|
||||
<div class="select">
|
||||
<a-select
|
||||
v-model:value="projectName"
|
||||
style="width: 270px"
|
||||
placeholder="请输入调研名称"
|
||||
:options="projectNameList"
|
||||
@change="selectProjectName"
|
||||
allowClear
|
||||
showSearch
|
||||
></a-select>
|
||||
</div>
|
||||
<div class="researchmanage">
|
||||
<!-- 搜索框及按钮 -->
|
||||
<div class="filter">
|
||||
<div class="filterItems">
|
||||
<div class="select">
|
||||
<a-select
|
||||
v-model:value="projectName"
|
||||
style="width: 270px"
|
||||
placeholder="请输入调研名称"
|
||||
:options="projectNameList"
|
||||
@change="selectProjectName"
|
||||
allowClear
|
||||
showSearch
|
||||
></a-select>
|
||||
</div>
|
||||
|
||||
<div class="select">
|
||||
<a-select
|
||||
v-model:value="projectName"
|
||||
style="width: 270px"
|
||||
placeholder="请选择状态"
|
||||
:options="projectNameList"
|
||||
@change="selectProjectName"
|
||||
allowClear
|
||||
showSearch
|
||||
></a-select>
|
||||
</div>
|
||||
<div class="select">
|
||||
<!-- <a-date-picker
|
||||
v-model="selectTime"
|
||||
type="date"
|
||||
placeholder="时间"
|
||||
style="width: 270px"
|
||||
/> -->
|
||||
<a-range-picker
|
||||
v-model:value="value2"
|
||||
separator="至"
|
||||
:placeholder="['开始时间', '结束时间']"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
<div class="btns">
|
||||
<div class="btn btn1">
|
||||
<div class="search"></div>
|
||||
<div class="btnText">搜索</div>
|
||||
</div>
|
||||
<div class="btn btn2">
|
||||
<div class="search"></div>
|
||||
<div class="btnText">重置</div>
|
||||
</div>
|
||||
<div class="btn btn3" @click="handleOut">
|
||||
<div class="search"></div>
|
||||
<div class="btnText">创建调研</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="select">
|
||||
<a-select
|
||||
v-model:value="projectName"
|
||||
style="width: 270px"
|
||||
placeholder="请选择状态"
|
||||
:options="projectNameList"
|
||||
@change="selectProjectName"
|
||||
allowClear
|
||||
showSearch
|
||||
></a-select>
|
||||
</div>
|
||||
<!-- 搜索框及按钮 -->
|
||||
<!-- 表格 -->
|
||||
<div class="tableBox">
|
||||
|
||||
<div class="select">
|
||||
<!-- <a-date-picker
|
||||
v-model="selectTime"
|
||||
type="date"
|
||||
placeholder="时间"
|
||||
style="width: 270px"
|
||||
/> -->
|
||||
<a-range-picker
|
||||
v-model:value="value2"
|
||||
separator="至"
|
||||
:placeholder="['开始时间', '结束时间']"
|
||||
/>
|
||||
</div>
|
||||
<!-- 表格 -->
|
||||
<!-- 创建调研 -->
|
||||
|
||||
<!-- 创建调研 -->
|
||||
</div>
|
||||
<div class="btns">
|
||||
<div class="btn btn1">
|
||||
<div class="search"></div>
|
||||
<div class="btnText">搜索</div>
|
||||
</div>
|
||||
<div class="btn btn2">
|
||||
<div class="search"></div>
|
||||
<div class="btnText">重置</div>
|
||||
</div>
|
||||
<div class="btn btn3" @click="handleOut">
|
||||
<div class="search"></div>
|
||||
<div class="btnText">创建调研</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- 搜索框及按钮 -->
|
||||
<!-- 表格 -->
|
||||
<div class="tableBox">
|
||||
<a-table
|
||||
style="border: 1px solid #f2f6fe"
|
||||
:columns="tableDataFunc()"
|
||||
:data-source="tableData"
|
||||
:loading="tableDataTotal === -1 ? true : false"
|
||||
expandRowByClick="true"
|
||||
:scroll="{ x: 1500, y: 800 }"
|
||||
@expand="expandTable"
|
||||
:pagination="false"
|
||||
/>
|
||||
</div>
|
||||
<!-- 表格 -->
|
||||
<div :class="out ? 'out' : 'unout'">
|
||||
<div class="top">
|
||||
<img class="topimg" src="../../assets/images/courseManage/add1.png" />
|
||||
<div class="topc">创建调研</div>
|
||||
<div @click="handleOut" style="margin-left: 440px; cursor: pointer">
|
||||
<img
|
||||
style="width: 20px; height: 20px"
|
||||
src="../../assets/images/basicinfo/close.png"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
<div class="mid clearfix">
|
||||
<div class="name">
|
||||
<div class="d" 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="valueE" />
|
||||
</div>
|
||||
</div>
|
||||
<div class="btn">
|
||||
<button class="samtn btn1" @click="handleOut">取消</button>
|
||||
<button class="samtn btn2" @click="handleOut">确定</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
<script lang="ts">
|
||||
|
||||
<script>
|
||||
import { reactive, toRefs, onMounted, ref } from "vue";
|
||||
export default {
|
||||
name: "learningPath",
|
||||
setup() {
|
||||
const state = reactive({
|
||||
projectNameList: [
|
||||
{
|
||||
id: 1,
|
||||
value: "项目一",
|
||||
label: "项目一",
|
||||
},
|
||||
{
|
||||
id: 2,
|
||||
value: "项目二",
|
||||
label: "项目二",
|
||||
},
|
||||
{
|
||||
id: 3,
|
||||
value: "项目三",
|
||||
label: "项目三",
|
||||
},
|
||||
{
|
||||
id: 4,
|
||||
value: "项目四",
|
||||
label: "项目四",
|
||||
},
|
||||
],
|
||||
out: false,
|
||||
number: null,
|
||||
selectTime: null,
|
||||
tableData: [
|
||||
{
|
||||
key: 1,
|
||||
number: 1,
|
||||
manager: "产品经理问卷调查",
|
||||
state: "已发布",
|
||||
creater: "管理员",
|
||||
pubtime: "2022-07-20 9:03",
|
||||
cretime: "2022-07-20 9:03",
|
||||
haspub: false,
|
||||
},
|
||||
{
|
||||
key: 2,
|
||||
number: 2,
|
||||
manager: "高级产品经理问卷调查",
|
||||
state: "已发布",
|
||||
creater: "管理员",
|
||||
pubtime: "2022-07-20 9:03",
|
||||
cretime: "2022-07-20 9:03",
|
||||
haspub: false,
|
||||
},
|
||||
{
|
||||
key: 3,
|
||||
number: 3,
|
||||
manager: "管理者进阶腾飞班问卷调查",
|
||||
state: "待发布",
|
||||
creater: "管理员",
|
||||
pubtime: "2022-07-20 9:03",
|
||||
cretime: "2022-07-20 9:03",
|
||||
haspub: true,
|
||||
},
|
||||
{
|
||||
key: 4,
|
||||
number: 4,
|
||||
manager: "HR问卷",
|
||||
state: "已结束",
|
||||
creater: "管理员",
|
||||
pubtime: "2022-07-20 9:03",
|
||||
cretime: "2022-07-20 9:03",
|
||||
haspub: true,
|
||||
},
|
||||
],
|
||||
currentPage: 1,
|
||||
tableDataTotal: 20,
|
||||
pageSize: 10,
|
||||
value1: " ",
|
||||
value2: ref(),
|
||||
valueE: ref(" "),
|
||||
valueEE: ref(" "),
|
||||
valuei: ref(" "),
|
||||
});
|
||||
const tableDataFunc = () => {
|
||||
const columns = [
|
||||
{
|
||||
title: "序号",
|
||||
dataIndex: "number",
|
||||
key: "number",
|
||||
width: 100,
|
||||
align: "center",
|
||||
className: "h",
|
||||
// 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",
|
||||
ellipsis: true,
|
||||
className: "h",
|
||||
},
|
||||
{
|
||||
title: "状态",
|
||||
dataIndex: "state",
|
||||
// width: "30%",
|
||||
key: "state",
|
||||
width: 100,
|
||||
align: "center",
|
||||
className: "h",
|
||||
},
|
||||
{
|
||||
title: "创建人",
|
||||
dataIndex: "creater",
|
||||
// width: "30%",
|
||||
key: "creater",
|
||||
width: 100,
|
||||
align: "center",
|
||||
className: "h",
|
||||
},
|
||||
{
|
||||
title: "发布时间",
|
||||
dataIndex: "pubtime",
|
||||
key: "pubtime",
|
||||
width: 180,
|
||||
align: "center",
|
||||
className: "h",
|
||||
},
|
||||
{
|
||||
title: "创建时间",
|
||||
dataIndex: "cretime",
|
||||
key: "cretime",
|
||||
width: 180,
|
||||
align: "center",
|
||||
className: "h",
|
||||
},
|
||||
{
|
||||
title: "操作",
|
||||
className: "h",
|
||||
dataIndex: "opacation",
|
||||
key: "opacation",
|
||||
width: 200,
|
||||
align: "center",
|
||||
scopedSlots: { customRender: "action" }, //引入的插槽
|
||||
customRender: (text) => {
|
||||
console.log(text);
|
||||
return (
|
||||
<div class="opa">
|
||||
<div class="opacation">
|
||||
<router-link to="/researchadd" class={text.record.haspub ? "activecls" : "errorCls"}>
|
||||
基础信息
|
||||
</router-link>
|
||||
<router-link to="/managepage" style={{ "margin-left": "25px" }}>管理</router-link>
|
||||
<span style={{ "margin-left": "25px" }}>复制</span>
|
||||
<span style={{ "margin-left": "25px" }} >撤回</span>
|
||||
<span style={{ "margin-left": "21px", "margin-right": "30px" }} >结束</span>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
},
|
||||
},
|
||||
];
|
||||
return columns;
|
||||
};
|
||||
onMounted(() => {
|
||||
// console.log("执行");
|
||||
});
|
||||
const selectProjectName = (value, index) => {
|
||||
console.log("value", value, index);
|
||||
};
|
||||
const expandTable = (e, a) => {
|
||||
// console.log("惦记了");
|
||||
console.log("e", e, a);
|
||||
};
|
||||
const handleOut = () => {
|
||||
state.out = !state.out;
|
||||
};
|
||||
const chooseImg = (id) => {
|
||||
console.log(id);
|
||||
};
|
||||
return {
|
||||
...toRefs(state),
|
||||
selectProjectName,
|
||||
expandTable,
|
||||
handleOut,
|
||||
tableDataFunc,
|
||||
chooseImg,
|
||||
};
|
||||
},
|
||||
};
|
||||
</script>
|
||||
<style lang="scss">
|
||||
.researchmanage {
|
||||
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;
|
||||
}
|
||||
}
|
||||
.btns {
|
||||
display: flex;
|
||||
// flex-wrap: wrap;
|
||||
.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;
|
||||
}
|
||||
}
|
||||
.btn1 {
|
||||
.search {
|
||||
width: 15px;
|
||||
height: 17px;
|
||||
background-image: url("../../assets/images/courseManage/search1.png");
|
||||
}
|
||||
}
|
||||
.btn2 {
|
||||
.search {
|
||||
width: 16px;
|
||||
height: 18px;
|
||||
background-image: url("../../assets/images/courseManage/reset1.png");
|
||||
}
|
||||
}
|
||||
.btn3 {
|
||||
margin-right: 0px;
|
||||
.search {
|
||||
width: 17px;
|
||||
height: 18px;
|
||||
background-image: url("../../assets/images/courseManage/add1.png");
|
||||
}
|
||||
}
|
||||
.btn1:hover {
|
||||
background: rgba(64, 158, 255, 1);
|
||||
.search {
|
||||
background-image: url("../../assets/images/courseManage/search0.png");
|
||||
}
|
||||
.btnText {
|
||||
color: #ffffff;
|
||||
}
|
||||
}
|
||||
.btn2:hover {
|
||||
background: rgba(64, 158, 255, 1);
|
||||
.search {
|
||||
background-image: url("../../assets/images/courseManage/reset0.png");
|
||||
}
|
||||
.btnText {
|
||||
color: #ffffff;
|
||||
}
|
||||
}
|
||||
.btn3:hover {
|
||||
background: rgba(64, 158, 255, 1);
|
||||
.search {
|
||||
background-image: url("../../assets/images/courseManage/add0.png");
|
||||
}
|
||||
.btnText {
|
||||
color: #ffffff;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
.clearfix:before,
|
||||
.clearfix:after {
|
||||
content: " ";
|
||||
display: block;
|
||||
clear: both;
|
||||
}
|
||||
.researchmanage {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
position: relative;
|
||||
// position: relative;
|
||||
.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;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
.btns {
|
||||
display: flex;
|
||||
// flex-wrap: wrap;
|
||||
.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;
|
||||
}
|
||||
}
|
||||
.btn1 {
|
||||
.search {
|
||||
width: 15px;
|
||||
height: 17px;
|
||||
background-image: url("../../assets/images/courseManage/search1.png");
|
||||
}
|
||||
}
|
||||
.btn2 {
|
||||
.search {
|
||||
width: 16px;
|
||||
height: 18px;
|
||||
background-image: url("../../assets/images/courseManage/reset1.png");
|
||||
}
|
||||
}
|
||||
.btn3 {
|
||||
margin-right: 0px;
|
||||
.search {
|
||||
width: 17px;
|
||||
height: 18px;
|
||||
background-image: url("../../assets/images/courseManage/add1.png");
|
||||
}
|
||||
}
|
||||
.btn1:hover {
|
||||
background: rgba(64, 158, 255, 1);
|
||||
.search {
|
||||
background-image: url("../../assets/images/courseManage/search0.png");
|
||||
}
|
||||
.btnText {
|
||||
color: #ffffff;
|
||||
}
|
||||
}
|
||||
.btn2:hover {
|
||||
background: rgba(64, 158, 255, 1);
|
||||
.search {
|
||||
background-image: url("../../assets/images/courseManage/reset0.png");
|
||||
}
|
||||
.btnText {
|
||||
color: #ffffff;
|
||||
}
|
||||
}
|
||||
.btn3:hover {
|
||||
background: rgba(64, 158, 255, 1);
|
||||
.search {
|
||||
background-image: url("../../assets/images/courseManage/add0.png");
|
||||
}
|
||||
.btnText {
|
||||
color: #ffffff;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
.tableBox {
|
||||
margin: 20px 38px 30px ;
|
||||
th.h {
|
||||
background-color: #eff4fc !important;
|
||||
}
|
||||
|
||||
.ant-table-tbody
|
||||
> tr:hover:not(.ant-table-expanded-row):not(.ant-table-row-selected)
|
||||
> td {
|
||||
background: #f6f9fd;
|
||||
}
|
||||
}
|
||||
.out {
|
||||
display: block;
|
||||
position: absolute;
|
||||
top: 120px;
|
||||
width: 600px;
|
||||
// height: 525px;
|
||||
background-color: #fff;
|
||||
|
||||
box-shadow: 0 0 10px rgba(118, 136, 166, 0.21);
|
||||
left: 50%;
|
||||
top: 50%;
|
||||
transform: translate(-50%, -50%);
|
||||
.top {
|
||||
width: 100%;
|
||||
height: 68px;
|
||||
|
||||
background: linear-gradient(
|
||||
rgba(78, 166, 255, 0.2) 0%,
|
||||
rgba(78, 166, 255, 0) 100%
|
||||
);
|
||||
display: flex;
|
||||
align-items: center;
|
||||
.topimg {
|
||||
width: 18px;
|
||||
height: 18px;
|
||||
margin-left: 27px;
|
||||
}
|
||||
.topc {
|
||||
color: #000000;
|
||||
font-size: 16px;
|
||||
margin-left: 8px;
|
||||
}
|
||||
}
|
||||
.mid {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
background-color: #fff;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
.d {
|
||||
// margin-top: 8px;
|
||||
// color: #ff4e4e;
|
||||
margin-left: -5px;
|
||||
}
|
||||
.name {
|
||||
width: 78%;
|
||||
// background-color: lightcoral;
|
||||
display: flex;
|
||||
margin-top: 20px;
|
||||
align-items: center;
|
||||
height: 40px;
|
||||
// border: 1px solid black;
|
||||
|
||||
.inname {
|
||||
color: #6f6f6f;
|
||||
font-size: 14px;
|
||||
margin-left: 7px;
|
||||
}
|
||||
.in {
|
||||
margin-left: 14px;
|
||||
width: 81%;
|
||||
.ant-input {
|
||||
border-radius: 5px;
|
||||
// height: 120%;
|
||||
width: 100%;
|
||||
height: 40px;
|
||||
}
|
||||
}
|
||||
}
|
||||
.btn {
|
||||
width: 33%;
|
||||
margin-top: 30px;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
margin-bottom: 30px;
|
||||
.samtn {
|
||||
width: 100px;
|
||||
height: 40px;
|
||||
font-size: 14px;
|
||||
border: 1px solid #4ea6ff;
|
||||
border-radius: 8px;
|
||||
cursor: pointer;
|
||||
}
|
||||
.btn1 {
|
||||
background-color: #fff;
|
||||
color: #4ea6ff;
|
||||
}
|
||||
.btn2 {
|
||||
margin-left: 10px;
|
||||
background-color: #4ea6ff;
|
||||
color: #fff;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
.unout {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.opa {
|
||||
display: flex;
|
||||
justify-content: right;
|
||||
.opacation {
|
||||
font-size: 14px;
|
||||
font-weight: 400;
|
||||
color: #4ea6ff;
|
||||
// line-height: 36px;
|
||||
.activecls {
|
||||
display: inline-block;
|
||||
}
|
||||
.errorCls {
|
||||
display: none;
|
||||
}
|
||||
.more {
|
||||
position: relative;
|
||||
.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;
|
||||
height: 70px;
|
||||
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: 18px;
|
||||
z-index: 100;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
||||
Reference in New Issue
Block a user