mirror of
https://codeup.aliyun.com/67762337eccfc218f6110e0e/vue/fe-manage.git
synced 2025-12-09 02:46:45 +08:00
Merge branch 'master' of ssh://gitlab.dongwu-inc.com:10022/BOE/fe-manage
This commit is contained in:
246
src/components/drawers/AddVote.vue
Normal file
246
src/components/drawers/AddVote.vue
Normal file
@@ -0,0 +1,246 @@
|
||||
<template>
|
||||
<a-drawer
|
||||
:visible="addvoteVisible"
|
||||
class="drawerStyle"
|
||||
style="color: red"
|
||||
width="80%"
|
||||
title="添加投票"
|
||||
placement="right"
|
||||
@after-visible-change="afterVisibleChange"
|
||||
>
|
||||
<div class="drawerMain">
|
||||
<div class="header">
|
||||
<div class="headerTitle">添加投票</div>
|
||||
<img
|
||||
style="width: 29px; height: 29px; cursor: pointer"
|
||||
src="../../assets/images/basicinfo/close.png"
|
||||
@click="closeDrawer"
|
||||
/>
|
||||
</div>
|
||||
<div class="contentMain">
|
||||
<!-- 投票名称 -->
|
||||
<div class="vote">
|
||||
<div class="votebox">
|
||||
<img
|
||||
class="voteimg"
|
||||
src="../../assets/images/basicinfo/asterisk.png"
|
||||
/>
|
||||
<div class="votename">投票名称:</div>
|
||||
</div>
|
||||
<div style="width: 424px">
|
||||
<a-input v-model:value="value" placeholder="请输入投票名称" />
|
||||
</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>
|
||||
</a-drawer>
|
||||
</template>
|
||||
<script>
|
||||
import { reactive, toRefs } from "vue";
|
||||
export default {
|
||||
name: "AddVote",
|
||||
props: {
|
||||
addvoteVisible: {
|
||||
type: Boolean,
|
||||
default: false,
|
||||
},
|
||||
},
|
||||
setup(props, ctx) {
|
||||
const state = reactive({});
|
||||
const closeDrawer = () => {
|
||||
ctx.emit("update:addvoteVisible", false);
|
||||
};
|
||||
|
||||
const afterVisibleChange = (bool) => {
|
||||
console.log("state", bool);
|
||||
};
|
||||
|
||||
const showDrawer = () => {
|
||||
state.visible = true;
|
||||
};
|
||||
|
||||
return {
|
||||
...toRefs(state),
|
||||
afterVisibleChange,
|
||||
showDrawer,
|
||||
closeDrawer,
|
||||
// change,
|
||||
};
|
||||
},
|
||||
};
|
||||
</script>
|
||||
<style lang="scss">
|
||||
.addvote {
|
||||
}
|
||||
.drawerStyle {
|
||||
.drawerMain {
|
||||
.header {
|
||||
height: 73px;
|
||||
border-bottom: 1px solid #e8e8e8;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
.headerTitle {
|
||||
font-size: 18px;
|
||||
font-weight: 600;
|
||||
color: #333333;
|
||||
line-height: 25px;
|
||||
margin-left: 24px;
|
||||
}
|
||||
}
|
||||
.contentMain {
|
||||
.vote {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
margin-top: 32px;
|
||||
margin-left: 20px;
|
||||
.votebox {
|
||||
width: 100px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: flex-end;
|
||||
// background-color: pink;
|
||||
.voteimg {
|
||||
width: 10px;
|
||||
height: 10px;
|
||||
margin-right: 5px;
|
||||
}
|
||||
.votename {
|
||||
font-size: 14px;
|
||||
font-weight: 400;
|
||||
color: #333333;
|
||||
line-height: 20px;
|
||||
}
|
||||
}
|
||||
|
||||
.votebtn {
|
||||
width: 130px;
|
||||
height: 40px;
|
||||
background: #388be1;
|
||||
border-radius: 8px;
|
||||
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;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@@ -291,23 +291,23 @@
|
||||
<div class="inname">阶段名称:</div>
|
||||
</div>
|
||||
<div class="in">
|
||||
<a-input v-model:value="valueE" show-count :maxlength="20" placeholder="请输入阶段名称" />
|
||||
<a-input v-model:value="valueE" show-count :maxlength="20" placeholder="请输入阶段名称" />
|
||||
</div>
|
||||
</div>
|
||||
<div class="name" style="display: flex; align-items: flex-start">
|
||||
<div class="namebox">
|
||||
<div class="inname">阶段说明:</div>
|
||||
</div>
|
||||
<div class="in">
|
||||
<div class="intext" style="margin-left: 14px">
|
||||
<a-textarea v-model:value="value" style="height: 88px" show-count :maxlength="100" placeholder="请输入阶段说明" />
|
||||
</div>
|
||||
</div>
|
||||
<div style="display: flex;width: 100%;justify-content: center;margin-top: 40px">
|
||||
<button @click="closeModal"
|
||||
style=" cursor: pointer;height: 40px;width: 100px;border: 1px solid #387DF7;border-radius: 4px;color: #387DF7;background-color: #FFFFFF"
|
||||
style=" cursor: pointer;height: 40px;width: 100px;border: 1px solid #409EFF;border-radius: 4px;color: #409EFF;background-color: #FFFFFF"
|
||||
>取消</button>
|
||||
<button @click="closeModal"
|
||||
style=" cursor: pointer;margin-left: 16px;margin-bottom: 40px;height: 40px;width: 100px;border: 1px solid #388BE1;border-radius: 4px;color: #FFFFFF;background-color: #388BE1"
|
||||
style=" cursor: pointer;margin-left: 16px;margin-bottom: 40px;height: 40px;width: 100px;border: 1px solid #409EFF;border-radius: 4px;color: #FFFFFF;background-color: #409EFF"
|
||||
>确定</button>
|
||||
</div>
|
||||
</div>
|
||||
@@ -791,7 +791,7 @@ export default {
|
||||
border-radius: 8px;
|
||||
// height: 120%;
|
||||
width: 384px;
|
||||
height: 40px;
|
||||
height: 88px;
|
||||
}
|
||||
.addstage {
|
||||
.ant-modal {
|
||||
@@ -806,7 +806,7 @@ export default {
|
||||
.ant-input-textarea-show-count::after {
|
||||
position: absolute;
|
||||
right: 10px;
|
||||
bottom: 10px;
|
||||
bottom: 5px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@@ -479,6 +479,7 @@
|
||||
}
|
||||
.progress {
|
||||
width: 168px;
|
||||
margin-left: 10px;
|
||||
margin-right: 50px;
|
||||
flex-grow: 1;
|
||||
.progresstext {
|
||||
|
||||
@@ -209,7 +209,7 @@ export default {
|
||||
font-weight: 500;
|
||||
}
|
||||
.messagebox {
|
||||
width: 100%;
|
||||
//width: 100%;
|
||||
//display: flex;
|
||||
margin-top: 20px;
|
||||
margin-left: 38px;
|
||||
|
||||
@@ -64,7 +64,7 @@
|
||||
<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"
|
||||
style="cursor: pointer; width: 20px; height: 20px;position: absolute;right: 0;top:0"
|
||||
src="../../assets/images/basicinfo/close.png"
|
||||
/>
|
||||
</div>
|
||||
@@ -91,15 +91,16 @@
|
||||
<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>
|
||||
<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="display: flex;align-items:center;margin-right: 10px;justify-content: center">10</a-button>
|
||||
|
||||
</div>
|
||||
<div class="scoretext">非常不满意</div>
|
||||
</div>
|
||||
@@ -181,6 +182,7 @@
|
||||
border: 1px solid #D7E5FD;
|
||||
border-radius: 5px;
|
||||
margin: 0 10px;
|
||||
padding: 5px;
|
||||
.btn {
|
||||
border: 1px solid #56A3F9;
|
||||
border-radius: 5px;
|
||||
@@ -214,7 +216,8 @@
|
||||
display:flex;
|
||||
}
|
||||
.delete {
|
||||
margin-top: 27px;
|
||||
cursor: pointer;
|
||||
margin-top: 32px;
|
||||
margin-left: 20px;
|
||||
float: right;
|
||||
color: #4EA6FF;
|
||||
@@ -225,7 +228,7 @@
|
||||
// background-color: lightcoral;
|
||||
display: flex;
|
||||
margin-top: 20px;
|
||||
align-items: center;
|
||||
//align-items: center;
|
||||
//height: 40px;
|
||||
// border: 1px solid black;
|
||||
.namebox {
|
||||
@@ -248,6 +251,7 @@
|
||||
margin-left: 14px;
|
||||
flex: 1;
|
||||
.addimg {
|
||||
cursor:pointer;
|
||||
color: rgba(78, 166, 255, 1);
|
||||
font-size: 14px;
|
||||
}
|
||||
|
||||
@@ -21,195 +21,30 @@
|
||||
添加投票
|
||||
</div>
|
||||
<div>
|
||||
<a-drawer
|
||||
v-model:visible="visible"
|
||||
class="drawerStyle"
|
||||
style="color: red"
|
||||
width="80%"
|
||||
title="添加投票"
|
||||
placement="right"
|
||||
@after-visible-change="afterVisibleChange"
|
||||
>
|
||||
<div class="drawerMain">
|
||||
<div class="header">
|
||||
<div class="headerTitle">添加投票</div>
|
||||
<img
|
||||
style="width: 29px; height: 29px; cursor: pointer"
|
||||
src="../../assets/images/basicinfo/close.png"
|
||||
@click="closeDrawer"
|
||||
/>
|
||||
</div>
|
||||
<div class="contentMain">
|
||||
<!-- 投票名称 -->
|
||||
<div class="vote">
|
||||
<div class="votebox">
|
||||
<img
|
||||
class="voteimg"
|
||||
src="../../assets/images/basicinfo/asterisk.png"
|
||||
/>
|
||||
<div class="votename">投票名称:</div>
|
||||
</div>
|
||||
<div style="width: 424px">
|
||||
<a-input v-model:value="value" placeholder="请输入投票名称" />
|
||||
</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>
|
||||
</a-drawer>
|
||||
<add-vote v-model:addvoteVisible="visible" />
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
import { reactive, toRefs } from "vue";
|
||||
|
||||
import AddVote from "../../components/drawers/AddVote";
|
||||
export default {
|
||||
name: "SystemManage",
|
||||
components: {
|
||||
AddVote,
|
||||
},
|
||||
setup() {
|
||||
const state = reactive({
|
||||
visible: true,
|
||||
visible: false,
|
||||
});
|
||||
|
||||
const afterVisibleChange = (bool) => {
|
||||
console.log("visible", bool);
|
||||
};
|
||||
|
||||
const showDrawer = () => {
|
||||
state.visible = true;
|
||||
};
|
||||
const closeDrawer = () => {
|
||||
state.visible = false;
|
||||
};
|
||||
|
||||
return {
|
||||
...toRefs(state),
|
||||
afterVisibleChange,
|
||||
showDrawer,
|
||||
closeDrawer,
|
||||
};
|
||||
},
|
||||
};
|
||||
@@ -217,6 +52,14 @@ export default {
|
||||
<style lang="scss">
|
||||
.systemManage {
|
||||
width: 100%;
|
||||
.ant-input-textarea-show-count {
|
||||
position: relative;
|
||||
}
|
||||
.ant-input-textarea-show-count::after {
|
||||
position: absolute;
|
||||
right: 0px;
|
||||
bottom: 0px;
|
||||
}
|
||||
}
|
||||
.drawerStyle {
|
||||
.drawerMain {
|
||||
|
||||
Reference in New Issue
Block a user