mirror of
https://codeup.aliyun.com/67762337eccfc218f6110e0e/vue/fe-manage.git
synced 2025-12-06 17:36:44 +08:00
feat:合并
This commit is contained in:
李晓鸽
@@ -48,13 +48,11 @@
|
||||
></a-select>
|
||||
</div>
|
||||
<div class="select fitems">
|
||||
<a-time-range-picker />
|
||||
<!-- <a-date-picker
|
||||
v-model="selectTime"
|
||||
type="date"
|
||||
placeholder="创建时间"
|
||||
style="width: 286px"
|
||||
/> -->
|
||||
<a-range-picker
|
||||
v-model:value="value2"
|
||||
separator="至"
|
||||
:placeholder="[' 开始时间', ' 结束时间']"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@@ -380,13 +378,33 @@
|
||||
|
||||
<!-- 表格 -->
|
||||
<div class="tableBox">
|
||||
<a-table :columns="columns" :data-source="data" :scroll="{ x: 800 }">
|
||||
<template #bodyCell="{ column }">
|
||||
<template v-if="column.key === 'operation'">
|
||||
<a>action</a>
|
||||
</template>
|
||||
</template>
|
||||
</a-table>
|
||||
<a-table
|
||||
:columns="tableDataFunc()"
|
||||
:data-source="tableData"
|
||||
:loading="tableDataTotal === -1 ? true : false"
|
||||
:scroll="{ x: 800 }"
|
||||
expandRowByClick="true"
|
||||
@expand="expandTable"
|
||||
:pagination="{
|
||||
showSizeChanger: true,
|
||||
showQuickJumper: true,
|
||||
hideOnSinglePage: true,
|
||||
pageSizeOptions: [],
|
||||
pageSize: pageSize,
|
||||
current: currentPage,
|
||||
total: tableDataTotal,
|
||||
onChange: (page, pageSize) => {
|
||||
currentPage = page;
|
||||
// console.log('page', page)
|
||||
// 加翻页查找代码
|
||||
// this.setState({
|
||||
// currentPage: page,
|
||||
// }, () => {
|
||||
// this.getMilitaryDeployment()
|
||||
// })
|
||||
},
|
||||
}"
|
||||
/>
|
||||
</div>
|
||||
<!-- 表格 -->
|
||||
</div>
|
||||
@@ -395,141 +413,6 @@
|
||||
import { reactive, toRefs, defineComponent, ref } from "vue";
|
||||
import { PlusOutlined, LoadingOutlined } from "@ant-design/icons-vue";
|
||||
import { message } from "ant-design-vue";
|
||||
const columns = [
|
||||
{
|
||||
title: "序号",
|
||||
width: 200,
|
||||
dataIndex: "num",
|
||||
key: "num",
|
||||
align: "center",
|
||||
},
|
||||
{
|
||||
title: "名称",
|
||||
width: 200,
|
||||
dataIndex: "name",
|
||||
key: "name",
|
||||
},
|
||||
{
|
||||
title: "内容分类",
|
||||
width: 200,
|
||||
dataIndex: "content",
|
||||
key: "1",
|
||||
align: "center",
|
||||
},
|
||||
{
|
||||
title: "课程形式",
|
||||
width: 200,
|
||||
dataIndex: "courseform",
|
||||
key: "2",
|
||||
align: "center",
|
||||
},
|
||||
{
|
||||
title: " 所属项目",
|
||||
width: 300,
|
||||
dataIndex: "project",
|
||||
key: "3",
|
||||
align: "center",
|
||||
},
|
||||
{
|
||||
title: "学习人数",
|
||||
width: 200,
|
||||
dataIndex: "stunum",
|
||||
key: "4",
|
||||
align: "center",
|
||||
},
|
||||
{
|
||||
title: "评分",
|
||||
width: 200,
|
||||
dataIndex: "grade",
|
||||
key: "5",
|
||||
align: "center",
|
||||
},
|
||||
{
|
||||
title: "状态",
|
||||
width: 200,
|
||||
dataIndex: "status",
|
||||
key: "6",
|
||||
align: "center",
|
||||
},
|
||||
{
|
||||
title: "是否发布",
|
||||
width: 200,
|
||||
dataIndex: "ynpub",
|
||||
key: "7",
|
||||
align: "center",
|
||||
},
|
||||
{
|
||||
title: "创建人",
|
||||
width: 200,
|
||||
dataIndex: "creator",
|
||||
key: "8",
|
||||
align: "center",
|
||||
},
|
||||
{
|
||||
title: "创建时间",
|
||||
width: 280,
|
||||
dataIndex: "createtime",
|
||||
key: "9",
|
||||
align: "center",
|
||||
},
|
||||
{
|
||||
title: "上线时间",
|
||||
width: 280,
|
||||
dataIndex: "pubtime",
|
||||
key: "10",
|
||||
align: "center",
|
||||
},
|
||||
{
|
||||
title: "是否停用",
|
||||
width: 200,
|
||||
key: "either",
|
||||
dataIndex: "ynuse",
|
||||
align: "center",
|
||||
},
|
||||
{
|
||||
title: "操作",
|
||||
width: 400,
|
||||
key: "operation",
|
||||
fixed: "right",
|
||||
align: "center",
|
||||
},
|
||||
];
|
||||
const data = [
|
||||
{
|
||||
key: "1",
|
||||
num: 1,
|
||||
name: "时间管理",
|
||||
content: "领导力",
|
||||
courseform: "线上",
|
||||
project: "管理者进阶-腾飞班1",
|
||||
stunum: "50",
|
||||
grade: "5",
|
||||
status: "未提交",
|
||||
ynpub: "未发布",
|
||||
creator: "管理员",
|
||||
createtime: "2022-07-20 9:30",
|
||||
pubtime: "2022-07-20 9:30",
|
||||
ynuse: "启用",
|
||||
kkty: false,
|
||||
},
|
||||
{
|
||||
key: "2",
|
||||
num: 2,
|
||||
name: "智能制造初级课程",
|
||||
content: "专业力",
|
||||
courseform: "线上",
|
||||
project: "-",
|
||||
stunum: "200",
|
||||
grade: "5",
|
||||
status: "待审核",
|
||||
ynpub: "未发布",
|
||||
creator: "管理员",
|
||||
createtime: "2022-07-20 9:30",
|
||||
pubtime: "2022-07-20 9:30",
|
||||
ynuse: "启用",
|
||||
kkty: true,
|
||||
},
|
||||
];
|
||||
|
||||
function getBase64(img, callback) {
|
||||
const reader = new FileReader();
|
||||
@@ -543,6 +426,285 @@ export default defineComponent({
|
||||
},
|
||||
|
||||
setup() {
|
||||
const state = reactive({
|
||||
tableData: [
|
||||
{
|
||||
key: "1",
|
||||
num: 1,
|
||||
name: "时间管理",
|
||||
content: "领导力",
|
||||
courseform: "线上",
|
||||
project: "管理者进阶-腾飞班1",
|
||||
stunum: "50",
|
||||
grade: "5",
|
||||
status: "未提交",
|
||||
ynpub: "未发布",
|
||||
creator: "管理员",
|
||||
createtime: "2022-07-20 9:30",
|
||||
pubtime: "2022-07-20 9:30",
|
||||
ynuse: "启用",
|
||||
kkty: false,
|
||||
},
|
||||
{
|
||||
key: "2",
|
||||
num: 2,
|
||||
name: "智能制造初级课程",
|
||||
content: "专业力",
|
||||
courseform: "线上",
|
||||
project: "-",
|
||||
stunum: "200",
|
||||
grade: "5",
|
||||
status: "待审核",
|
||||
ynpub: "未发布",
|
||||
creator: "管理员",
|
||||
createtime: "2022-07-20 9:30",
|
||||
pubtime: "2022-07-20 9:30",
|
||||
ynuse: "启用",
|
||||
kkty: true,
|
||||
},
|
||||
{
|
||||
key: "3",
|
||||
num: 3,
|
||||
name: "产业必备技能",
|
||||
content: "专业力",
|
||||
courseform: "线上",
|
||||
project: "-",
|
||||
stunum: "200",
|
||||
grade: "5",
|
||||
status: "已审核",
|
||||
ynpub: "已发布",
|
||||
creator: "管理员",
|
||||
createtime: "2022-07-20 9:30",
|
||||
pubtime: "2022-07-20 9:30",
|
||||
ynuse: "启用",
|
||||
kkty: true,
|
||||
},
|
||||
{
|
||||
key: "4",
|
||||
num: 4,
|
||||
name: "B11入模培训",
|
||||
content: "专业力",
|
||||
courseform: "线上",
|
||||
project: "-",
|
||||
stunum: "200",
|
||||
grade: "5",
|
||||
status: "审核未通过",
|
||||
ynpub: "未发布",
|
||||
creator: "管理员",
|
||||
createtime: "2022-07-20 9:30",
|
||||
pubtime: "2022-07-20 9:30",
|
||||
ynuse: "停用",
|
||||
kkty: true,
|
||||
},
|
||||
{
|
||||
key: "5",
|
||||
num: 5,
|
||||
name: "入职培训",
|
||||
content: "通用力",
|
||||
courseform: "面授",
|
||||
project: "-",
|
||||
stunum: "5",
|
||||
grade: "5",
|
||||
status: "未提交",
|
||||
ynpub: "未发布",
|
||||
creator: "管理员",
|
||||
createtime: "2022-07-20 9:30",
|
||||
pubtime: "2022-07-20 9:30",
|
||||
ynuse: "启用",
|
||||
kkty: true,
|
||||
},
|
||||
{
|
||||
key: "6",
|
||||
num: 6,
|
||||
name: "入职培训",
|
||||
content: "通用力",
|
||||
courseform: "面授",
|
||||
project: "-",
|
||||
stunum: "5",
|
||||
grade: "6",
|
||||
status: "已审核",
|
||||
ynpub: "已发布",
|
||||
creator: "管理员",
|
||||
createtime: "2022-07-20 9:30",
|
||||
pubtime: "2022-07-20 9:30",
|
||||
ynuse: "启用",
|
||||
kkty: true,
|
||||
},
|
||||
],
|
||||
});
|
||||
const tableDataFunc = () => {
|
||||
const columns = [
|
||||
{
|
||||
title: "序号",
|
||||
width: 200,
|
||||
dataIndex: "num",
|
||||
key: "num",
|
||||
align: "center",
|
||||
},
|
||||
{
|
||||
title: "名称",
|
||||
width: 200,
|
||||
dataIndex: "name",
|
||||
key: "name",
|
||||
},
|
||||
{
|
||||
title: "内容分类",
|
||||
width: 200,
|
||||
dataIndex: "content",
|
||||
key: "1",
|
||||
align: "center",
|
||||
},
|
||||
{
|
||||
title: "课程形式",
|
||||
width: 200,
|
||||
dataIndex: "courseform",
|
||||
key: "2",
|
||||
align: "center",
|
||||
},
|
||||
{
|
||||
title: " 所属项目",
|
||||
width: 300,
|
||||
dataIndex: "project",
|
||||
key: "3",
|
||||
align: "center",
|
||||
},
|
||||
{
|
||||
title: "学习人数",
|
||||
width: 200,
|
||||
dataIndex: "stunum",
|
||||
key: "4",
|
||||
align: "center",
|
||||
},
|
||||
{
|
||||
title: "评分",
|
||||
width: 200,
|
||||
dataIndex: "grade",
|
||||
key: "5",
|
||||
align: "center",
|
||||
},
|
||||
{
|
||||
title: "状态",
|
||||
width: 200,
|
||||
dataIndex: "status",
|
||||
key: "6",
|
||||
align: "center",
|
||||
},
|
||||
{
|
||||
title: "是否发布",
|
||||
width: 200,
|
||||
dataIndex: "ynpub",
|
||||
key: "7",
|
||||
align: "center",
|
||||
},
|
||||
{
|
||||
title: "创建人",
|
||||
width: 200,
|
||||
dataIndex: "creator",
|
||||
key: "8",
|
||||
align: "center",
|
||||
},
|
||||
{
|
||||
title: "创建时间",
|
||||
width: 280,
|
||||
dataIndex: "createtime",
|
||||
key: "9",
|
||||
align: "center",
|
||||
},
|
||||
{
|
||||
title: "上线时间",
|
||||
width: 280,
|
||||
dataIndex: "pubtime",
|
||||
key: "10",
|
||||
align: "center",
|
||||
},
|
||||
{
|
||||
title: "是否停用",
|
||||
width: 200,
|
||||
key: "either",
|
||||
dataIndex: "ynuse",
|
||||
align: "center",
|
||||
},
|
||||
{
|
||||
title: "操作",
|
||||
width: 400,
|
||||
className: "h",
|
||||
dataIndex: "opacation",
|
||||
key: "operation",
|
||||
fixed: "right",
|
||||
align: "center",
|
||||
scopedSlots: { customRender: "action" },
|
||||
customRender: (text) => {
|
||||
// console.log(text);
|
||||
return (
|
||||
<div class="op_box">
|
||||
<div class="opacation">
|
||||
<span
|
||||
class={
|
||||
text.record.courseform === "面授"
|
||||
? "activecls"
|
||||
: "errorCls"
|
||||
}
|
||||
style={{ "margin-left": "25px" }}
|
||||
>
|
||||
开课
|
||||
</span>
|
||||
<span
|
||||
class={
|
||||
text.record.ynuse === "停用" ? "activecls" : "errorCls"
|
||||
}
|
||||
style={{ "margin-left": "25px" }}
|
||||
>
|
||||
停用
|
||||
</span>
|
||||
<span
|
||||
class={
|
||||
text.record.status === "未提交" ||
|
||||
text.record.status === "审核未通过"
|
||||
? "activecls"
|
||||
: "errorCls"
|
||||
}
|
||||
style={{ "margin-left": "25px" }}
|
||||
>
|
||||
编辑
|
||||
</span>
|
||||
<span
|
||||
class={
|
||||
text.record.status === "已审核" ? "activecls" : "errorCls"
|
||||
}
|
||||
style={{ "margin-left": "25px" }}
|
||||
>
|
||||
管理
|
||||
</span>
|
||||
<span
|
||||
class={
|
||||
text.record.status === "待审核" ? "errorCls" : "activecls"
|
||||
}
|
||||
style={{ "margin-left": "25px" }}
|
||||
>
|
||||
复制
|
||||
</span>
|
||||
<span style={{ "margin-left": "25px" }} class="more">
|
||||
<span>授权</span>
|
||||
<div class="moreArrow"></div>
|
||||
<div class="moreItems"></div>
|
||||
</span>
|
||||
<span
|
||||
style={{ "margin-left": "21px", "margin-right": "30px" }}
|
||||
class="more"
|
||||
>
|
||||
<span>更多</span>
|
||||
<div class="moreArrow"></div>
|
||||
<div class="moreItems"></div>
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
},
|
||||
},
|
||||
];
|
||||
return columns;
|
||||
};
|
||||
|
||||
const fileList = ref([]);
|
||||
const loading = ref(false);
|
||||
const imageUrl = ref("");
|
||||
@@ -585,9 +747,11 @@ export default defineComponent({
|
||||
};
|
||||
|
||||
return {
|
||||
...toRefs(state),
|
||||
fileList,
|
||||
loading,
|
||||
imageUrl,
|
||||
tableDataFunc,
|
||||
handleChange,
|
||||
beforeUpload,
|
||||
};
|
||||
@@ -647,7 +811,6 @@ export default defineComponent({
|
||||
state.of_hs = true;
|
||||
}
|
||||
};
|
||||
|
||||
const hideShow = () => {
|
||||
if (state.hideshow == false) {
|
||||
state.hideshow = true;
|
||||
@@ -655,7 +818,6 @@ export default defineComponent({
|
||||
state.hideshow = false;
|
||||
}
|
||||
};
|
||||
|
||||
const bs_hShow = () => {
|
||||
if (state.bs_hs == true) {
|
||||
state.bs_hs = false;
|
||||
@@ -670,8 +832,6 @@ export default defineComponent({
|
||||
};
|
||||
return {
|
||||
...toRefs(state),
|
||||
data,
|
||||
columns,
|
||||
options1,
|
||||
options2,
|
||||
of_hShow,
|
||||
@@ -938,7 +1098,7 @@ export default defineComponent({
|
||||
}
|
||||
|
||||
.faceteach {
|
||||
// display: none;
|
||||
display: none;
|
||||
z-index: 1000;
|
||||
width: 1358px;
|
||||
min-width: 1000px;
|
||||
@@ -1090,6 +1250,53 @@ export default defineComponent({
|
||||
|
||||
.tableBox {
|
||||
margin: 20px 38px 30px;
|
||||
.op_box {
|
||||
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;
|
||||
}
|
||||
}
|
||||
.more:hover .moreArrow {
|
||||
background-image: url("@/assets/images/navtop/up.png");
|
||||
}
|
||||
.more:hover .moreItems {
|
||||
display: block;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
||||
@@ -134,7 +134,10 @@
|
||||
</div>
|
||||
</a-tab-pane>
|
||||
<a-tab-pane key="2" tab="学员管理" force-render
|
||||
><div class="sametab">
|
||||
><div class="sametab"></div
|
||||
></a-tab-pane>
|
||||
<a-tab-pane key="3" tab="设置">
|
||||
<div class="sametab">
|
||||
<div class="Gcon">
|
||||
<div class="pad"></div>
|
||||
<div class="Gin">
|
||||
@@ -143,14 +146,111 @@
|
||||
<div class="onetitle">关卡内容可见可学设置</div>
|
||||
<div class="oneedi">编辑</div>
|
||||
</div>
|
||||
<div class="onemain">fewfew</div>
|
||||
<div class="onemain clearfix">
|
||||
<div class="checkcon">
|
||||
<input
|
||||
type="checkbox"
|
||||
name="cb1"
|
||||
value="yulan"
|
||||
class="in"
|
||||
/>
|
||||
<span class="yulan">预览其他关卡</span><br />
|
||||
<div style="width: 10px; height: 4px"></div>
|
||||
<span class="yulan2">学员可预览第</span
|
||||
><span style="color: #4ea6ff">1</span><span>关-第</span
|
||||
><span style="color: #4ea6ff">4</span><span>关内容</span>
|
||||
</div>
|
||||
<div class="checkcon" style="margin-top: 20px">
|
||||
<input
|
||||
type="checkbox"
|
||||
name="cb1"
|
||||
value="xuexi"
|
||||
class="in"
|
||||
/>
|
||||
<span class="yulan">学习其他关卡</span><br />
|
||||
<div style="width: 10px; height: 4px"></div>
|
||||
<span class="yulan2">学员可预览第</span
|
||||
><span style="color: #4ea6ff">1</span><span>关-第</span
|
||||
><span style="color: #4ea6ff">4</span><span>关内容</span>
|
||||
</div>
|
||||
|
||||
<br />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="Gcon">
|
||||
<div class="pad"></div>
|
||||
<div class="Gin" style="margin-top: 0px">
|
||||
<div class="headone">
|
||||
<div class="box"></div>
|
||||
<div class="onetitle">关卡晋级规则</div>
|
||||
</div>
|
||||
<div class="twomain">
|
||||
<a-switch size="small" v-model:checked="checked2" />
|
||||
<span class="info">启用关卡自动规则加入</span>
|
||||
<div class="infor">
|
||||
若开启“新建/编辑关卡-添加学员”支持设定自动加入规则，将于每日8点同步数据
|
||||
</div>
|
||||
<div :class="[checked2 ? 'chooseshow' : 'choo']">
|
||||
<div class="fane">选择范围</div>
|
||||
<div class="select">
|
||||
<a-select
|
||||
v-model:value="projectName"
|
||||
style="
|
||||
width: 250px;
|
||||
border-radius: 8px;
|
||||
margin-top: 15px;
|
||||
"
|
||||
placeholder="请选择部门"
|
||||
:options="projectNameList"
|
||||
@change="selectProjectName"
|
||||
allowClear
|
||||
showSearch
|
||||
></a-select>
|
||||
</div>
|
||||
<div class="select">
|
||||
<a-select
|
||||
v-model:value="projectName2"
|
||||
style="
|
||||
width: 250px;
|
||||
border-radius: 8px;
|
||||
margin-top: 15px;
|
||||
"
|
||||
placeholder="请选择岗位"
|
||||
:options="projectNameList2"
|
||||
@change="selectProjectName2"
|
||||
allowClear
|
||||
showSearch
|
||||
></a-select>
|
||||
</div>
|
||||
</div>
|
||||
<div class="btm">
|
||||
<div class="bmo">关卡学习方案展示设置</div>
|
||||
<div class="bmt">仅支持移动端</div>
|
||||
<div class="chosecon">
|
||||
<div class="chose">
|
||||
<input
|
||||
type="checkbox"
|
||||
name="cb1"
|
||||
value="lieb"
|
||||
class="inl"
|
||||
/><span class="sh">列表展示</span>
|
||||
</div>
|
||||
<div class="chose" style="margin-left: 20px">
|
||||
<input
|
||||
type="checkbox"
|
||||
name="cb1"
|
||||
value="lieb"
|
||||
class="inl"
|
||||
/><span class="sh">路径展示</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div></a-tab-pane
|
||||
>
|
||||
<a-tab-pane key="3" tab="设置">
|
||||
<div class="sametab">eee</div></a-tab-pane
|
||||
>
|
||||
</a-tabs>
|
||||
</div>
|
||||
</div>
|
||||
@@ -164,8 +264,53 @@ export default {
|
||||
methods: {},
|
||||
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: "项目四",
|
||||
},
|
||||
],
|
||||
activeKey: ref("1"),
|
||||
value: ref(" "),
|
||||
checked2: false,
|
||||
level: [
|
||||
{
|
||||
id: 1,
|
||||
@@ -191,8 +336,16 @@ export default {
|
||||
},
|
||||
],
|
||||
});
|
||||
const selectProjectName = (value, index) => {
|
||||
console.log("value", value, index);
|
||||
};
|
||||
const selectProjectName2 = (value, index) => {
|
||||
console.log("value", value, index);
|
||||
};
|
||||
return {
|
||||
...toRefs(state),
|
||||
selectProjectName,
|
||||
selectProjectName2,
|
||||
};
|
||||
},
|
||||
};
|
||||
@@ -571,8 +724,7 @@ export default {
|
||||
width: 40px;
|
||||
}
|
||||
.Gin {
|
||||
background-color: #bfa;
|
||||
|
||||
// background-color: #bfa;
|
||||
margin-top: 30px;
|
||||
.headone {
|
||||
// background-color: red;
|
||||
@@ -595,8 +747,86 @@ export default {
|
||||
}
|
||||
}
|
||||
.onemain {
|
||||
margin-top: 30px;
|
||||
margin-top: 20px;
|
||||
margin-left: 55px;
|
||||
|
||||
color: #6f6f6f;
|
||||
font-size: 14px;
|
||||
.checkcon {
|
||||
position: relative;
|
||||
.in {
|
||||
position: absolute;
|
||||
// margin-top: 10px;
|
||||
left: 0;
|
||||
top: 5px;
|
||||
}
|
||||
.yulan {
|
||||
// color: yellow;
|
||||
margin-left: 22px;
|
||||
// display: inline-block;
|
||||
}
|
||||
.yulan2 {
|
||||
margin-left: 22px;
|
||||
}
|
||||
}
|
||||
}
|
||||
.twomain {
|
||||
margin-left: 20px;
|
||||
margin-top: 20px;
|
||||
.info {
|
||||
margin-left: 10px;
|
||||
color: #6f6f6f;
|
||||
font-size: 14px;
|
||||
}
|
||||
.infor {
|
||||
margin-left: 38px;
|
||||
margin-top: 10px;
|
||||
color: #c7cbd2;
|
||||
font-size: 14px;
|
||||
}
|
||||
.chooseshow {
|
||||
// background-color: red;
|
||||
margin-left: 38px;
|
||||
margin-top: 12px;
|
||||
.fane {
|
||||
color: #6f6f6f;
|
||||
font-size: 14px;
|
||||
}
|
||||
.select {
|
||||
}
|
||||
}
|
||||
.choo {
|
||||
display: none;
|
||||
}
|
||||
.btm {
|
||||
margin-left: 38px;
|
||||
margin-top: 20px;
|
||||
.bmo {
|
||||
color: #6f6f6f;
|
||||
font-size: 14px;
|
||||
}
|
||||
.bmt {
|
||||
color: #c7cbd2;
|
||||
font-size: 14px;
|
||||
margin-top: 3px;
|
||||
}
|
||||
.chosecon {
|
||||
display: flex;
|
||||
margin-top: 6px;
|
||||
margin-bottom: 20px;
|
||||
.chose {
|
||||
position: relative;
|
||||
.inl {
|
||||
position: absolute;
|
||||
top: 5px;
|
||||
}
|
||||
.sh {
|
||||
margin-left: 23px;
|
||||
color: #6f6f6f;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@@ -1,16 +1,113 @@
|
||||
<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">
|
||||
<img class="pictureimg" src=""/>
|
||||
<div class="picturename">图片名称1.jpg</div>
|
||||
</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 +116,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 +161,111 @@
|
||||
}
|
||||
.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 {
|
||||
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 +277,6 @@
|
||||
cursor: pointer;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
</style>
|
||||
Reference in New Issue
Block a user