hz/fe-manage
1
0
Fork 0
mirror of https://codeup.aliyun.com/67762337eccfc218f6110e0e/vue/fe-manage.git synced 2025-12-12 12:26:47 +08:00
Code Issues Packages Projects Releases Wiki Activity

feat:新增添加直播添加外链添加讨论添加活动添加测评添加调研添加投票创建投票

Browse Source
This commit is contained in:
dongwug
2022-10-19 18:31:07 +08:00
parent b20c05e8d5
commit 36308af437
15 changed files with 3011 additions and 618 deletions
Download Patch File Download Diff File Expand all files Collapse all files

396
src/components/drawers/AddVote.vue
View File

@@ -1,8 +1,8 @@
<template>
<a-drawer
:visible="addvoteVisible"
class="drawerStyle"
width="70%"
class="drawerStyle addvoteDrawer"
width="80%"
title="添加投票"
placement="right"
@after-visible-change="afterVisibleChange"
@@ -17,129 +17,120 @@
/>
</div>
<div class="contentMain">
<!-- 投票名称 -->
<div class="vote">
<div class="votebox">
<img
class="voteimg"
src="../../assets/images/basicinfo/asterisk.png"
/>
<div class="votename">投票名称：</div>
<div class="main_left">
<div class="main_item">
<div class="signbox">
<div class="sign">
<img
src="@/assets/images/coursewareManage/asterisk.png"
alt=""
/>
</div>
<span style="margin-right: 3px">投票名称：</span>
</div>
<div class="btnbox">
<a-input
v-model:value="inputV1"
style="width: 424px; height: 32px"
placeholder="请输入投票名称"
/>
</div>
</div>
<div style="width: 424px">
<a-input v-model:value="value" placeholder="请输入投票名称" />
<div class="main_item">
<div class="signbox">
<div class="sign">
<img
src="@/assets/images/coursewareManage/asterisk.png"
alt=""
/>
</div>
<span style="margin-right: 3px">创建投票：</span>
</div>
<div class="btnbox" @click="showDrawerCreVote">
<button class="xkbtn">创建投票</button>
</div>
<!-- 创建投票侧弹窗 -->
<div>
<cre-vote v-model:crevoteVisible="crevotevisible" />
</div>
<!-- 创建投票侧弹窗 -->
</div>
<div class="main_item">
<div class="signbox">
<span style="margin-right: 3px">起止时间：</span>
</div>
<div class="btnbox">
<a-range-picker
style="width: 424px"
:placeholder="[' 开始时间', ' 结束时间']"
/>
</div>
</div>
<div class="main_item">
<div class="signbox">
<span style="margin-right: 3px">基础投票数：</span>
</div>
<div class="btnbox">
<button class="xkbtn">点击上传</button>
</div>
</div>
<div class="main_item" style="margin-top: -25px">
<div class="signbox"></div>
<div class="btnbox">
<span style="color: #999999">支持：xls.xlsx</span>
</div>
</div>
<div class="main_item2">
<div class="signbox">
<span style="margin-right: 3px">投票说明：</span>
</div>
<div class="textarea">
<a-textarea
v-model:value="textV1"
placeholder="请输入投票说明"
allow-clear
/>
</div>
</div>
</div>
<!-- 投票名称 -->
<!-- 创建投票 -->
<div class="vote">
<div class="votebox">
<img
class="voteimg"
src="../../assets/images/basicinfo/asterisk.png"
/>
<div class="votename">创建投票：</div>
</div>
<div class="votebtn">创建投票</div>
</div>
<!-- 创建投票 -->
<!-- 起止时间 -->
<div class="vote">
<div class="votebox">
<div class="voteimg"></div>
<div class="votename">起止时间：</div>
</div>
<div class="votedate">
<a-range-picker />
</div>
</div>
<!-- 起止时间 -->
<!-- 基础投票数 -->
<div class="vote" style="align-items: flex-start">
<div class="votebox" style="margin-top: 10px">
<div class="voteimg"></div>
<div class="votename">基础投票数：</div>
</div>
<div>
<div class="votebtn">点击上传</div>
<div class="voteclassify">支持：xls.xlsx</div>
</div>
</div>
<!-- 基础投票数 -->
<!-- 投票说明 -->
<div class="vote" style="align-items: flex-start">
<div class="votebox" style="margin-top: 10px">
<div class="voteimg"></div>
<div class="votename">投票说明：</div>
</div>
<div style="width: 500px">
<a-textarea :rows="4" placeholder="请输入投票说明" :maxlength="6" />
</div>
</div>
<!-- 投票说明 -->
<!-- 投票说明 -->
<div class="vote" style="align-items: flex-start">
<div class="votebox" style="margin-top: 10px">
<div class="voteimg"></div>
<div class="votename">投票说明：</div>
</div>
<div style="width: 500px">
<a-textarea :rows="4" placeholder="请输入投票说明" :maxlength="6" />
</div>
</div>
<!-- 投票说明 -->
<!-- 投票说明 -->
<div class="vote" style="align-items: flex-start">
<div class="votebox" style="margin-top: 10px">
<div class="voteimg"></div>
<div class="votename">投票说明：</div>
</div>
<div style="width: 500px">
<a-textarea :rows="4" placeholder="请输入投票说明" :maxlength="6" />
</div>
</div>
<!-- 投票说明 -->
<!-- 投票说明 -->
<div class="vote" style="align-items: flex-start">
<div class="votebox" style="margin-top: 10px">
<div class="voteimg"></div>
<div class="votename">投票说明：</div>
</div>
<div style="width: 500px">
<a-textarea :rows="4" placeholder="请输入投票说明" :maxlength="6" />
</div>
</div>
<!-- 投票说明 -->
<!-- 投票说明 -->
<div class="vote" style="align-items: flex-start">
<div class="votebox" style="margin-top: 10px">
<div class="voteimg"></div>
<div class="votename">投票说明：</div>
</div>
<div style="width: 500px">
<a-textarea :rows="4" placeholder="请输入投票说明" :maxlength="6" />
</div>
</div>
<!-- 投票说明 -->
<!-- 投票说明 -->
<div class="vote" style="align-items: flex-start">
<div class="votebox" style="margin-top: 10px">
<div class="voteimg"></div>
<div class="votename">投票说明：</div>
</div>
<div style="width: 500px">
<a-textarea :rows="4" placeholder="请输入投票说明" :maxlength="6" />
</div>
</div>
<!-- 投票说明 -->
</div>
<div class="main_btns">
<button class="btn1">取消</button>
<button class="btn2">确定</button>
</div>
</div>
</a-drawer>
</template>
<script>
import { reactive, toRefs } from "vue";
<script>
import { reactive, toRefs, ref } from "vue";
import CreVote from "../../components/drawers/CreVote.vue";
const options1 = ref([
{
value: "value1",
label: "请选择状态",
},
]);
const rowSelection = ref({
checkStrictly: false,
onChange: (selectedRowKeys, selectedRows) => {
console.log(
`selectedRowKeys: ${selectedRowKeys}`,
"selectedRows: ",
selectedRows
);
},
onSelect: (record, selected, selectedRows) => {
console.log(record, selected, selectedRows);
},
onSelectAll: (selected, selectedRows, changeRows) => {
console.log(selected, selectedRows, changeRows);
},
});
export default {
name: "AddVote",
components: {
CreVote,
},
props: {
addvoteVisible: {
type: Boolean,
@@ -147,33 +138,36 @@ export default {
},
},
setup(props, ctx) {
const state = reactive({});
const state = reactive({
inputV1: "",
textV1: "",
crevotevisible: false,
});
const closeDrawer = () => {
ctx.emit("update:addvoteVisible", false);
};
const afterVisibleChange = (bool) => {
console.log("state", bool);
};
const showDrawer = () => {
state.visible = true;
const showDrawerCreVote = () => {
state.crevotevisible = true;
};
return {
...toRefs(state),
showDrawerCreVote,
afterVisibleChange,
showDrawer,
closeDrawer,
// change,
rowSelection,
options1,
};
},
};
</script>
<style lang="scss">
.addvote {
<style lang="scss">
.ant-table-striped :deep(.table-striped) td {
background-color: #fafafa !important;
}
.drawerStyle {
.addvoteDrawer {
.drawerMain {
.header {
height: 73px;
@@ -190,56 +184,122 @@ export default {
}
}
.contentMain {
.vote {
display: flex;
align-items: center;
margin-top: 32px;
margin-left: 20px;
.votebox {
width: 100px;
display: flex;
justify-content: space-between;
.main_left {
padding-right: 30px;
flex: 1;
border-right: 1px solid #e8e8e8;
.main_item {
display: flex;
align-items: center;
justify-content: flex-end;
// background-color: pink;
.voteimg {
width: 10px;
height: 10px;
margin-right: 5px;
margin-bottom: 32px;
.signbox {
width: 120px;
display: flex;
justify-content: end;
align-items: center;
.sign {
margin-right: 5px;
}
}
.votename {
font-size: 14px;
font-weight: 400;
color: #333333;
line-height: 20px;
.btnbox {
display: flex;
flex: 1;
align-items: center;
.xkbtn {
cursor: pointer;
width: 130px;
height: 40px;
background: #388be1;
border-radius: 8px;
border: 0;
margin-right: 8px;
color: #fff;
}
}
}
.votebtn {
width: 130px;
height: 40px;
background: #388be1;
border-radius: 8px;
.main_item2 {
display: flex;
align-items: center;
justify-content: center;
cursor: pointer;
font-size: 14px;
font-weight: 400;
color: #ffffff;
line-height: 20px;
}
.voteclassify {
font-size: 14px;
font-weight: 400;
color: #999999;
line-height: 20px;
margin-top: 16px;
}
.ant-picker {
width: 424px;
align-items: flex-start;
margin-bottom: 32px;
.signbox {
width: 120px;
display: flex;
justify-content: end;
align-items: center;
.sign {
margin-right: 5px;
}
}
.kqszbox {
.qdqtbox {
margin-left: 56px;
}
.setbox {
display: flex;
flex-wrap: wrap;
margin-top: 10px;
margin-bottom: 24px;
.timerbox {
margin-top: 6px;
margin-right: 32px;
display: flex;
align-items: center;
flex-wrap: nowrap;
}
}
}
.btnbox2 {
display: flex;
flex-direction: column;
justify-content: flex-start;
.xkbtn {
cursor: pointer;
width: 130px;
height: 40px;
background: #388be1;
border-radius: 8px;
border: 0;
margin-right: 16px 8px 32px 0;
color: #fff;
margin-top: 16px;
margin-bottom: 60px;
}
}
}
}
}
.main_btns {
height: 72px;
width: 100%;
bottom: 0;
left: 0;
display: flex;
align-items: center;
justify-content: center;
box-shadow: 0px 1px 35px 0px rgba(118, 136, 166, 0.16);
.btn1 {
width: 100px;
height: 40px;
border: 1px solid #4ea6ff;
border-radius: 8px;
color: #4ea6ff;
background-color: #fff;
cursor: pointer;
}
.btn2 {
cursor: pointer;
width: 100px;
height: 40px;
background: #4ea6ff;
border-radius: 8px;
border: 0;
margin-left: 15px;
color: #fff;
}
}
}
}
</style>