feat: 编辑页和投放页交互优化 (#9)
This commit is contained in:
parent
14c768fdc6
commit
630fe0541c
@ -131,10 +131,6 @@
|
|||||||
"msg_9004": "提交失败!"
|
"msg_9004": "提交失败!"
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
"bottomConf": {
|
|
||||||
"logoImage": "",
|
|
||||||
"logoImageWidth": "33%"
|
|
||||||
},
|
|
||||||
"baseConf": {
|
"baseConf": {
|
||||||
"begTime": "2018-05-22 17:17:48",
|
"begTime": "2018-05-22 17:17:48",
|
||||||
"endTime": "2028-05-22 17:17:48",
|
"endTime": "2028-05-22 17:17:48",
|
||||||
|
@ -17,10 +17,6 @@
|
|||||||
"skinColor": "#4a4c5b",
|
"skinColor": "#4a4c5b",
|
||||||
"inputBgColor": "#ffffff"
|
"inputBgColor": "#ffffff"
|
||||||
},
|
},
|
||||||
"bottomConf": {
|
|
||||||
"logoImage": "",
|
|
||||||
"logoImageWidth": "40%"
|
|
||||||
},
|
|
||||||
"bannerConf": {
|
"bannerConf": {
|
||||||
"titleConfig": {
|
"titleConfig": {
|
||||||
"mainTitle": "<h3 style=\"text-align: center\">满意度调研</h3> <p> </p> <p>为了给您提供更好的服务,希望您能抽出几分钟时间,将您的感受和建议告诉我们,<span style=\"color: rgb(204, 0, 0)\">期待您的参与</span></p>",
|
"mainTitle": "<h3 style=\"text-align: center\">满意度调研</h3> <p> </p> <p>为了给您提供更好的服务,希望您能抽出几分钟时间,将您的感受和建议告诉我们,<span style=\"color: rgb(204, 0, 0)\">期待您的参与</span></p>",
|
||||||
|
@ -163,10 +163,6 @@
|
|||||||
},
|
},
|
||||||
"link": ""
|
"link": ""
|
||||||
},
|
},
|
||||||
"bottomConf": {
|
|
||||||
"logoImage": "",
|
|
||||||
"logoImageWidth": "33%"
|
|
||||||
},
|
|
||||||
"baseConf": {
|
"baseConf": {
|
||||||
"begTime": "2018-05-22 17:17:48",
|
"begTime": "2018-05-22 17:17:48",
|
||||||
"endTime": "2028-05-22 17:17:48",
|
"endTime": "2028-05-22 17:17:48",
|
||||||
|
@ -150,10 +150,6 @@
|
|||||||
"msg_9004": "提交失败!"
|
"msg_9004": "提交失败!"
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
"bottomConf": {
|
|
||||||
"logoImage": "",
|
|
||||||
"logoImageWidth": "33%"
|
|
||||||
},
|
|
||||||
"baseConf": {
|
"baseConf": {
|
||||||
"begTime": "2018-05-25 10:22:23",
|
"begTime": "2018-05-25 10:22:23",
|
||||||
"endTime": "2028-05-25 10:22:23",
|
"endTime": "2028-05-25 10:22:23",
|
||||||
|
@ -25,8 +25,8 @@
|
|||||||
}
|
}
|
||||||
},
|
},
|
||||||
"bottomConf": {
|
"bottomConf": {
|
||||||
"logoImage": "",
|
"logoImage": "https://img-hxy021.didistatic.com/static/starimg/img/4XcFlkzll41700742941814.png",
|
||||||
"logoImageWidth": "28%"
|
"logoImageWidth": "60%"
|
||||||
},
|
},
|
||||||
"baseConf": {
|
"baseConf": {
|
||||||
"begTime": "2018-05-30 10:38:31",
|
"begTime": "2018-05-30 10:38:31",
|
||||||
|
12
server/src/apps/ui/public/commom.css
Normal file
12
server/src/apps/ui/public/commom.css
Normal file
@ -0,0 +1,12 @@
|
|||||||
|
#main{
|
||||||
|
width: 100wh;
|
||||||
|
height: 100vh;
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
justify-content: center;
|
||||||
|
align-items: center;
|
||||||
|
}
|
||||||
|
.title{
|
||||||
|
font-size: 20px;
|
||||||
|
color: #4A4C5B;
|
||||||
|
}
|
@ -5,8 +5,12 @@
|
|||||||
<meta http-equiv="X-UA-Compatible" content="IE=edge">
|
<meta http-equiv="X-UA-Compatible" content="IE=edge">
|
||||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||||
<title>问卷管理端</title>
|
<title>问卷管理端</title>
|
||||||
|
<link rel="stylesheet" href="./commom.css">
|
||||||
</head>
|
</head>
|
||||||
<body>
|
<body>
|
||||||
<h2 id="hello">问卷管理端</h2>
|
<div id="main">
|
||||||
|
<img src="./nodata.png" alt="">
|
||||||
|
<p class="title">暂无数据</p>
|
||||||
|
</div>
|
||||||
</body>
|
</body>
|
||||||
</html>
|
</html>
|
BIN
server/src/apps/ui/public/nodata.png
Normal file
BIN
server/src/apps/ui/public/nodata.png
Normal file
Binary file not shown.
After Width: | Height: | Size: 34 KiB |
@ -5,8 +5,12 @@
|
|||||||
<meta http-equiv="X-UA-Compatible" content="IE=edge">
|
<meta http-equiv="X-UA-Compatible" content="IE=edge">
|
||||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||||
<title>问卷投放端</title>
|
<title>问卷投放端</title>
|
||||||
|
<link rel="stylesheet" href="./commom.css">
|
||||||
</head>
|
</head>
|
||||||
<body>
|
<body>
|
||||||
<h2 id="hello">问卷投放端</h2>
|
<div id="main">
|
||||||
|
<img src="./nodata.png" alt="">
|
||||||
|
<p class="title">暂无数据</p>
|
||||||
|
</div>
|
||||||
</body>
|
</body>
|
||||||
</html>
|
</html>
|
BIN
web/public/imgs/nodata.png
Normal file
BIN
web/public/imgs/nodata.png
Normal file
Binary file not shown.
After Width: | Height: | Size: 34 KiB |
@ -8,9 +8,6 @@
|
|||||||
<title><%= htmlWebpackPlugin.options.title %></title>
|
<title><%= htmlWebpackPlugin.options.title %></title>
|
||||||
</head>
|
</head>
|
||||||
<body>
|
<body>
|
||||||
<noscript>
|
|
||||||
<strong><%= htmlWebpackPlugin.options.title %>页面不允许执行JavaScript,请修改设置</strong>
|
|
||||||
</noscript>
|
|
||||||
<div id="app"></div>
|
<div id="app"></div>
|
||||||
<!-- built files will be auto injected -->
|
<!-- built files will be auto injected -->
|
||||||
</body>
|
</body>
|
||||||
|
@ -43,9 +43,6 @@
|
|||||||
</head>
|
</head>
|
||||||
|
|
||||||
<body>
|
<body>
|
||||||
<noscript>
|
|
||||||
<strong> <%= htmlWebpackPlugin.options.title %>页面不允许执行JavaScript,请修改设置</strong>
|
|
||||||
</noscript>
|
|
||||||
<div id="app"></div>
|
<div id="app"></div>
|
||||||
</body>
|
</body>
|
||||||
|
|
||||||
|
@ -22,7 +22,7 @@ export default [
|
|||||||
{
|
{
|
||||||
label: '视频海报地址',
|
label: '视频海报地址',
|
||||||
type: 'Input',
|
type: 'Input',
|
||||||
key: 'bannerConfig.posterImg',
|
key: 'bannerConfig.postImg',
|
||||||
direction: 'horizon',
|
direction: 'horizon',
|
||||||
},
|
},
|
||||||
],
|
],
|
||||||
|
@ -14,8 +14,8 @@
|
|||||||
:poster="bannerConf.bannerConfig.postImg"
|
:poster="bannerConf.bannerConfig.postImg"
|
||||||
preload="auto"
|
preload="auto"
|
||||||
controls
|
controls
|
||||||
|
:src="bannerConf.bannerConfig.videoLink"
|
||||||
>
|
>
|
||||||
<source :src="bannerConf.bannerConfig.videoLink" type="video/mp4" />
|
|
||||||
</video>
|
</video>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
@ -1,4 +1,5 @@
|
|||||||
<template>
|
<template>
|
||||||
|
<div class="container">
|
||||||
<div class="question-logo" @click="onSelect">
|
<div class="question-logo" @click="onSelect">
|
||||||
<img
|
<img
|
||||||
v-if="logoImg !== ''"
|
v-if="logoImg !== ''"
|
||||||
@ -11,6 +12,7 @@
|
|||||||
<div class="no-logo-tip">若不配置logo,该图片将不会在问卷中展示</div>
|
<div class="no-logo-tip">若不配置logo,该图片将不会在问卷中展示</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
</div>
|
||||||
</template>
|
</template>
|
||||||
<script>
|
<script>
|
||||||
export default {
|
export default {
|
||||||
@ -36,11 +38,16 @@ export default {
|
|||||||
};
|
};
|
||||||
</script>
|
</script>
|
||||||
<style lang="scss" rel="stylesheet/scss" scoped>
|
<style lang="scss" rel="stylesheet/scss" scoped>
|
||||||
|
.container{
|
||||||
|
display: flex;
|
||||||
|
justify-content: center;
|
||||||
|
}
|
||||||
.question-logo {
|
.question-logo {
|
||||||
position: relative;
|
max-width: 300px;
|
||||||
text-align: center;
|
text-align: center;
|
||||||
padding: 0 0 0.6rem;
|
padding: 0 0 0.6rem;
|
||||||
margin-top: -0.2rem;
|
margin-top: -0.2rem;
|
||||||
|
cursor: pointer;
|
||||||
}
|
}
|
||||||
|
|
||||||
.logo-placeholder-wrapper {
|
.logo-placeholder-wrapper {
|
||||||
|
@ -93,7 +93,7 @@ export default defineComponent({
|
|||||||
};
|
};
|
||||||
const onDelete = async () => {
|
const onDelete = async () => {
|
||||||
try {
|
try {
|
||||||
await proxy.$confirm('确定删除题目吗?', '提示', {
|
await proxy.$confirm('本次操作会影响数据统计查看,是否确认删除?', '提示', {
|
||||||
confirmButtonText: '确定',
|
confirmButtonText: '确定',
|
||||||
cancelButtonText: '取消',
|
cancelButtonText: '取消',
|
||||||
type: 'warning',
|
type: 'warning',
|
||||||
|
@ -30,9 +30,6 @@ export default {
|
|||||||
immediate: true,
|
immediate: true,
|
||||||
handler(newVal) {
|
handler(newVal) {
|
||||||
let val = parseFloat(newVal);
|
let val = parseFloat(newVal);
|
||||||
if (isNaN(val)) {
|
|
||||||
val = 50;
|
|
||||||
}
|
|
||||||
if (val === this.value) {
|
if (val === this.value) {
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
|
@ -27,7 +27,7 @@
|
|||||||
</video>
|
</video>
|
||||||
<div
|
<div
|
||||||
class="video-modal"
|
class="video-modal"
|
||||||
:style="`background-image:url(${bannerConf.bannerConfig.posterImg})`"
|
:style="`background-image:url(${bannerConf.bannerConfig.postImg})`"
|
||||||
></div>
|
></div>
|
||||||
<div class="iconfont icon-kaishi play-icon" @click="play()"></div>
|
<div class="iconfont icon-kaishi play-icon" @click="play()"></div>
|
||||||
</div>
|
</div>
|
||||||
@ -72,6 +72,12 @@ export default {
|
|||||||
}
|
}
|
||||||
window.open(formatLink(jumpLink));
|
window.open(formatLink(jumpLink));
|
||||||
},
|
},
|
||||||
|
play() {
|
||||||
|
const video = document.getElementById("video");
|
||||||
|
document.querySelector('.play-icon').style.display = 'none';
|
||||||
|
document.querySelector(".video-modal").style.display = 'none';
|
||||||
|
video.play();
|
||||||
|
},
|
||||||
},
|
},
|
||||||
};
|
};
|
||||||
</script>
|
</script>
|
||||||
|
@ -1,10 +1,12 @@
|
|||||||
<template>
|
<template>
|
||||||
|
<div class="container">
|
||||||
<div v-if="logoImage" class="logo-wrapper">
|
<div v-if="logoImage" class="logo-wrapper">
|
||||||
<img
|
<img
|
||||||
:style="{ width: !isMobile ? '20%' : logoImageWidth || '20%' }"
|
:style="{ width: !isMobile ? '20%' : logoImageWidth || '20%' }"
|
||||||
:src="logoImage"
|
:src="logoImage"
|
||||||
/>
|
/>
|
||||||
</div>
|
</div>
|
||||||
|
</div>
|
||||||
</template>
|
</template>
|
||||||
<script>
|
<script>
|
||||||
export default {
|
export default {
|
||||||
@ -23,8 +25,12 @@ export default {
|
|||||||
};
|
};
|
||||||
</script>
|
</script>
|
||||||
<style lang="scss" rel="stylesheet/scss" scoped>
|
<style lang="scss" rel="stylesheet/scss" scoped>
|
||||||
|
.container{
|
||||||
|
display: flex;
|
||||||
|
justify-content: center;
|
||||||
|
}
|
||||||
.logo-wrapper {
|
.logo-wrapper {
|
||||||
position: relative;
|
max-width: 300px;
|
||||||
text-align: center;
|
text-align: center;
|
||||||
font-size: 0;
|
font-size: 0;
|
||||||
padding: 0.1rem 0 0.5rem;
|
padding: 0.1rem 0 0.5rem;
|
||||||
|
@ -1,7 +1,9 @@
|
|||||||
<template>
|
<template>
|
||||||
<div class="not-found">
|
<div class="container">
|
||||||
<h1>404</h1>
|
<img src="/imgs/nodata.png" alt="" class="ui-404">
|
||||||
<p>问卷找不到啦~</p>
|
<div class="ui-title">
|
||||||
|
<div class="ui-maintitle">问卷找不到啦~</div>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
@ -12,21 +14,29 @@ export default {
|
|||||||
</script>
|
</script>
|
||||||
|
|
||||||
<style scoped>
|
<style scoped>
|
||||||
.not-found {
|
.container {
|
||||||
text-align: center;
|
text-align: center;
|
||||||
margin-top: 20vh;
|
margin-top: 20vh;
|
||||||
font-family: 'Arial', sans-serif;
|
font-family: 'Arial', sans-serif;
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
align-content: center;
|
||||||
|
justify-content: center;
|
||||||
}
|
}
|
||||||
|
.ui-404{
|
||||||
h1 {
|
width: 75%;
|
||||||
font-size: 5rem;
|
max-width: 300px;
|
||||||
color: #ff5722;
|
margin: .4rem auto 0;
|
||||||
margin: 0;
|
display: block;
|
||||||
}
|
}
|
||||||
|
.ui-title {
|
||||||
p {
|
margin-top: .3rem;
|
||||||
font-size: 1.5rem;
|
text-align: center;
|
||||||
color: #555;
|
font-size: .5rem;
|
||||||
margin: 10px 0;
|
}
|
||||||
|
.ui-title .ui-subtitle {
|
||||||
|
padding-top: 10px;
|
||||||
|
font-size: 12px;
|
||||||
|
color: #909090;
|
||||||
}
|
}
|
||||||
</style>
|
</style>
|
||||||
|
Loading…
Reference in New Issue
Block a user