elink-star
/
tduck-front
12
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity
Browse Source

fix

old
wangqing 4 years ago
parent
38d4b931e2
commit
523d3c6b9d
10 changed files with 291 additions and 281 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Unified View
Diff Options
Show Stats Download Patch File Download Diff File
  1. BIN
      src/assets/images/5b968a75b5e42.png
  2. BIN
      src/assets/images/official/banner2.png
  3. BIN
      src/assets/images/official/desc1.png
  4. BIN
      src/assets/images/official/solution1.png
  5. BIN
      src/assets/images/official/solution2.png
  6. BIN
      src/assets/images/official/solution3.png
  7. BIN
      src/assets/images/official/use-commony.png
  8. 14
      src/views/form/index.vue
  9. 556
      src/views/official/index.vue
  10. 2
      src/views/project/template/preview.vue

BIN
src/assets/images/5b968a75b5e42.png
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 174 KiB

BIN
src/assets/images/official/banner2.png
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 646 KiB

BIN
src/assets/images/official/desc1.png
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 358 KiB

BIN
src/assets/images/official/solution1.png
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 321 KiB

BIN
src/assets/images/official/solution2.png
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 231 KiB

BIN
src/assets/images/official/solution3.png
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 228 KiB

BIN
src/assets/images/official/use-commony.png
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 219 KiB

14
src/views/form/index.vue
View File

@ -9,10 +9,14 @@
<img class="header-logo" src="@/assets/images/indexLogo.png" @click="$router.push({path:'/home'})"> <img class="header-logo" src="@/assets/images/indexLogo.png" @click="$router.push({path:'/home'})">
</el-col> </el-col>
<el-col :span="1"> <el-col :span="1">
<el-button type="primary">编辑</el-button> <el-button type="primary" icon="el-icon-view">
预览
</el-button>
</el-col> </el-col>
<el-col :span="2"> <el-col :span="2">
<el-button type="success">保存为模板</el-button> <el-button type="success" icon="el-icon-folder-add">
保存为模板
</el-button>
</el-col> </el-col>
</el-row> </el-row>
</el-card> </el-card>
@ -87,6 +91,12 @@ export default {
menuSelectHandle(index) { menuSelectHandle(index) {
this.$router.replace({path: index, query: {key: this.projectKey}}) this.$router.replace({path: index, query: {key: this.projectKey}})
}, },
saveProjectAsTemplateHandle() {
// 全局组件Id
this.$api.get('/user/project/item/max-form-id', {params: {key: this.projectKey}}).then(res => {
this.idGlobal = res.data ? res.data : 100
})
},
collapseHandle() { collapseHandle() {
let isCollapse = !this.isCollapse let isCollapse = !this.isCollapse
this.$store.dispatch('form/setIsCollapse', isCollapse).then(() => { this.$store.dispatch('form/setIsCollapse', isCollapse).then(() => {

556
src/views/official/index.vue
View File

@ -2,7 +2,7 @@
<div class="official-container"> <div class="official-container">
<div class="header-container"> <div class="header-container">
<div class="background"> <div class="background">
<img src="https://qiniu.smileyi.top/background.svg"> <img src="@/assets/images/official/background.svg">
</div> </div>
<div id="headerNav" :class="{'is-fixed' : isFixed}" class="top-header"> <div id="headerNav" :class="{'is-fixed' : isFixed}" class="top-header">
<img class="logo" src="@/assets/images/official/TDUCK@2x.png" @click="$router.push({path:'/'})"> <img class="logo" src="@/assets/images/official/TDUCK@2x.png" @click="$router.push({path:'/'})">
@ -36,7 +36,7 @@
<el-button @click="$router.push({path:'/home'})">立即体验</el-button> <el-button @click="$router.push({path:'/home'})">立即体验</el-button>
</div> </div>
<div class="right"> <div class="right">
<img src="https://qiniu.smileyi.top/banner2.png"> <img src="@/assets/images/official/banner2.png">
</div> </div>
</div> </div>
</div> </div>
@ -56,13 +56,13 @@
<p> 无需编程，拖拽可视化模板或组件，即可生成精美问卷</p> <p> 无需编程，拖拽可视化模板或组件，即可生成精美问卷</p>
</div> </div>
</div> </div>
<img class="img1" src="https://qiniu.smileyi.top/desc1.png"> <img class="img1" src="@/assets/images/official/desc1.png">
</div> </div>
<p class="title">我们的解决方案</p> <p class="title">我们的解决方案</p>
<div class="solutions"> <div class="solutions">
<div class="solution-item"> <div class="solution-item">
<p class="title">客户体验</p> <p class="title">客户体验</p>
<img src="https://qiniu.smileyi.top/solution1.png"> <img src="@/assets/images/official/solution1.png">
<p class="desc">客户满意度 宾馆服务满意度 </p> <p class="desc">客户满意度 宾馆服务满意度 </p>
<p class="desc"> 餐厅满意度调查 公共服务满意度</p> <p class="desc"> 餐厅满意度调查 公共服务满意度</p>
<p class="desc">旅游服务满意度 经销商满意度 </p> <p class="desc">旅游服务满意度 经销商满意度 </p>
@ -70,7 +70,7 @@
</div> </div>
<div class="solution-item"> <div class="solution-item">
<p class="title">市场调研</p> <p class="title">市场调研</p>
<img src="https://qiniu.smileyi.top/solution2.png"> <img src="@/assets/images/official/solution2.png">
<p class="desc">餐饮市场调查 手机市场调查 </p> <p class="desc">餐饮市场调查 手机市场调查 </p>
<p class="desc"> 培训市场调查 消费者调查 </p> <p class="desc"> 培训市场调查 消费者调查 </p>
<p class="desc">APP市场调查 女性消费者偏好调查 </p> <p class="desc">APP市场调查 女性消费者偏好调查 </p>
@ -78,7 +78,7 @@
</div> </div>
<div class="solution-item"> <div class="solution-item">
<p class="title">报名登记</p> <p class="title">报名登记</p>
<img src="https://qiniu.smileyi.top/solution3.png"> <img src="@/assets/images/official/solution3.png">
<p class="desc">才艺比赛报名 粉丝活动报名 </p> <p class="desc">才艺比赛报名 粉丝活动报名 </p>
<p class="desc"> 聚餐出游报名 活动/会务微信报名 </p> <p class="desc"> 聚餐出游报名 活动/会务微信报名 </p>
<p class="desc"> 讲座公开课报名 商品订单 </p> <p class="desc"> 讲座公开课报名 商品订单 </p>
@ -87,7 +87,7 @@
</div> </div>
<div class="use-company"> <div class="use-company">
<p class="title">他们都在使用</p> <p class="title">他们都在使用</p>
<img src="https://qiniu.smileyi.top/use-commony.png"> <img src="@/assets/images/official/use-commony.png">
</div> </div>
<div class="footer"> <div class="footer">
<div class="top"> <div class="top">
@ -137,7 +137,7 @@
<script> <script>
import store from '@/store' import store from '@/store'
import 'animate.css'
export default { export default {
name: 'Official', name: 'Official',
data() { data() {
@ -180,320 +180,320 @@ export default {
<style lang="scss" scoped> <style lang="scss" scoped>
html, html,
body { body {
height: 100%; height: 100%;
} }
.official-container { .official-container {
min-width: 1280px; min-width: 1280px;
height: 100%; height: 100%;
//overflow-x: hidden; //overflow-x: hidden;
} }
.header-container { .header-container {
position: relative; position: relative;
.background { .background {
position: absolute;
z-index: 1;
img {
width: 100%;
}
}
.top-header {
width: 100%;
height: 72px;
line-height: 72px;
display: flex;
flex-direction: row;
justify-content: space-around;
align-content: center;
align-items: center;
* {
z-index: 20;
}
.logo {
width: 182px;
height: 28px;
}
.menu-item {
font-size: 17px;
font-weight: 300;
cursor: pointer;
color: #fff;
margin-right: 73px;
line-height: 72px;
}
.add-contact-me {
position: relative;
div {
margin-top: 20px;
position: absolute; position: absolute;
z-index: 1; right: 0%;
img { top: 100%;
width: 100%; visibility: hidden;
} opacity: 0;
transform: translateY(100px);
transition: 0.3s;
}
img {
width: 100px;
height: 100px;
}
} }
.top-header { .add-contact-me:hover {
width: 100%; div {
height: 72px; visibility: visible;
line-height: 72px; opacity: 1;
display: flex; transform: translateY(0);
flex-direction: row; }
justify-content: space-around;
align-content: center;
align-items: center;
* {
z-index: 20;
}
.logo {
width: 182px;
height: 28px;
}
.menu-item {
font-size: 17px;
font-weight: 300;
cursor: pointer;
color: #fff;
margin-right: 73px;
line-height: 72px;
}
.add-contact-me {
position: relative;
div {
margin-top: 20px;
position: absolute;
right: 0%;
top: 100%;
visibility: hidden;
opacity: 0;
transform: translateY(100px);
transition: 0.3s;
}
img {
width: 100px;
height: 100px;
}
}
.add-contact-me:hover {
div {
visibility: visible;
opacity: 1;
transform: translateY(0);
}
}
.login-btn {
width: 95px;
height: 37px;
background: #fff;
border-radius: 11px;
}
} }
.content-header { .login-btn {
display: flex; width: 95px;
flex-direction: row; height: 37px;
justify-content: space-evenly; background: #fff;
align-content: center; border-radius: 11px;
align-items: center; }
* { }
z-index: 20; .content-header {
} display: flex;
.slogan { flex-direction: row;
font-size: 59px; justify-content: space-evenly;
font-weight: bold; align-content: center;
color: #fff; align-items: center;
line-height: 18px; * {
} z-index: 20;
.slogan-desc { }
font-size: 37px; .slogan {
font-weight: bold; font-size: 59px;
color: #fff; font-weight: bold;
line-height: 43px; color: #fff;
} line-height: 18px;
.right img { }
padding-top: 30px; .slogan-desc {
height: 540px; font-size: 37px;
width: 375px; font-weight: bold;
} color: #fff;
line-height: 43px;
} }
.right img {
padding-top: 30px;
height: 540px;
width: 375px;
}
}
} }
.title { .title {
text-align: center; text-align: center;
font-size: 23px; font-size: 23px;
font-weight: bold; font-weight: bold;
color: #232323; color: #232323;
line-height: 76px; line-height: 76px;
} }
.introduction { .introduction {
margin-top: 217px; margin-top: 217px;
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
.en-title {
font-size: 101px;
font-weight: bold;
color: #fff;
line-height: 97px;
letter-spacing: 15px;
background: linear-gradient(-32deg, rgba(32, 84, 241, 0.51) 0%, rgba(34, 78, 243, 0.51) 0%, rgba(56, 234, 255, 0.51) 100%);
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
animation: show 0.5s forwards;
}
.features {
display: flex; display: flex;
flex-direction: column; div {
justify-content: center; margin: 0 20px;
align-items: center; text-align: center;
.en-title {
font-size: 101px;
font-weight: bold;
color: #fff;
line-height: 97px;
letter-spacing: 15px;
background: linear-gradient(-32deg, rgba(32, 84, 241, 0.51) 0%, rgba(34, 78, 243, 0.51) 0%, rgba(56, 234, 255, 0.51) 100%);
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
animation: show 0.5s forwards;
} }
.features { :first-child {
display: flex; font-size: 25px;
div { font-weight: bold;
margin: 0 20px; color: #222;
text-align: center; line-height: 68px;
}
:first-child {
font-size: 25px;
font-weight: bold;
color: #222;
line-height: 68px;
}
:last-child {
font-size: 10px;
font-weight: 300;
color: #222;
line-height: 22px;
}
} }
.img1 { :last-child {
min-width: 515px; font-size: 10px;
height: 438px; font-weight: 300;
color: #222;
line-height: 22px;
} }
}
.img1 {
min-width: 515px;
height: 438px;
}
} }
.solutions { .solutions {
width: 80%; width: 80%;
margin: 0 auto; margin: 0 auto;
display: flex; display: flex;
justify-content: space-evenly; justify-content: space-evenly;
.solution-item { .solution-item {
width: 250px; width: 250px;
height: 390px; height: 390px;
background: linear-gradient(-12deg, rgba(32, 84, 241, 0.08), rgba(34, 78, 243, 0.08), rgba(56, 234, 255, 0.08)); background: linear-gradient(-12deg, rgba(32, 84, 241, 0.08), rgba(34, 78, 243, 0.08), rgba(56, 234, 255, 0.08));
border-radius: 15px; border-radius: 15px;
text-align: center; text-align: center;
cursor: pointer; cursor: pointer;
&:hover { &:hover {
box-shadow: 0 2px 49px 0 rgba(105, 119, 168, 0.54); box-shadow: 0 2px 49px 0 rgba(105, 119, 168, 0.54);
} }
img { img {
width: 197px; width: 197px;
height: 147px; height: 147px;
} }
.title { .title {
font-size: 16px; font-size: 16px;
font-weight: bold; font-weight: bold;
color: #276ef6; color: #276ef6;
line-height: 69px; line-height: 69px;
} }
.desc { .desc {
font-size: 9px; font-size: 9px;
font-weight: 300; font-weight: 300;
color: #222; color: #222;
line-height: 15px; line-height: 15px;
} }
:last-child { :last-child {
font-size: 10px; font-size: 10px;
font-weight: 300; font-weight: 300;
color: #276ef6; color: #276ef6;
line-height: 69px; line-height: 69px;
}
} }
}
} }
.use-company { .use-company {
display: flex; display: flex;
flex-direction: column; flex-direction: column;
align-content: center; align-content: center;
align-items: center; align-items: center;
justify-content: flex-start; justify-content: flex-start;
margin-top: 200px; margin-top: 200px;
} }
.footer { .footer {
margin-top: 227px; margin-top: 227px;
width: 100%; width: 100%;
height: 464px; height: 464px;
background: linear-gradient(163deg, rgba(32, 84, 241, 0.67), rgba(34, 78, 243, 0.67), rgba(56, 234, 255, 0.67)); background: linear-gradient(163deg, rgba(32, 84, 241, 0.67), rgba(34, 78, 243, 0.67), rgba(56, 234, 255, 0.67));
display: flex;
flex-direction: column;
justify-content: space-between;
.top {
display: flex; display: flex;
flex-direction: column; flex-direction: row;
justify-content: space-between; justify-content: space-evenly;
.top { text-align: left;
display: flex; .title {
flex-direction: row; font-size: 20px;
justify-content: space-evenly; font-weight: bold;
text-align: left; color: #fff;
.title { line-height: 60px;
font-size: 20px; text-align: left;
font-weight: bold;
color: #fff;
line-height: 60px;
text-align: left;
}
.desc {
font-size: 12px;
font-weight: 300;
color: #fff;
line-height: 20px;
max-width: 292px;
}
a {
font-size: 12px;
font-weight: 300;
color: #fff;
cursor: pointer;
line-height: 30px;
display: block;
}
.qrcode {
display: flex;
div {
margin: 10px;
}
img {
margin-top: 30px;
width: 115px;
height: 114px;
}
}
} }
.bottom { .desc {
position: relative; font-size: 12px;
bottom: 0; font-weight: 300;
p { color: #fff;
text-align: center; line-height: 20px;
font-size: 16px; max-width: 292px;
font-weight: 300;
color: #fff;
line-height: 20px;
}
} }
a {
font-size: 12px;
font-weight: 300;
color: #fff;
cursor: pointer;
line-height: 30px;
display: block;
}
.qrcode {
display: flex;
div {
margin: 10px;
}
img {
margin-top: 30px;
width: 115px;
height: 114px;
}
}
}
.bottom {
position: relative;
bottom: 0;
p {
text-align: center;
font-size: 16px;
font-weight: 300;
color: #fff;
line-height: 20px;
}
}
} }
.top-header { .top-header {
animation: stickyMenu1 0.4s ease-in-out; animation: stickyMenu1 0.4s ease-in-out;
} }
.is-fixed { .is-fixed {
position: fixed; position: fixed;
z-index: 999; z-index: 999;
animation: stickyMenu 0.5s ease-in-out; animation: stickyMenu 0.5s ease-in-out;
top: 0; top: 0;
background: linear-gradient(-67deg, rgba(32, 84, 241, 1), rgba(51, 201, 253, 1), rgba(35, 86, 244, 1)); background: linear-gradient(-67deg, rgba(32, 84, 241, 1), rgba(51, 201, 253, 1), rgba(35, 86, 244, 1));
} }
@keyframes stickyMenu1 { @keyframes stickyMenu1 {
0% { 0% {
opacity: 0; opacity: 0;
background: rgba(32, 84, 241, 1); background: rgba(32, 84, 241, 1);
} }
50% { 50% {
opacity: 0.5; opacity: 0.5;
background: rgba(32, 84, 241, 1); background: rgba(32, 84, 241, 1);
} }
100% { 100% {
background-color: transparent; background-color: transparent;
opacity: 1; opacity: 1;
} }
} }
@keyframes stickyMenu { @keyframes stickyMenu {
0% { 0% {
margin-top: -120px; margin-top: -120px;
opacity: 0; opacity: 0;
} }
50% { 50% {
margin-top: -64px; margin-top: -64px;
opacity: 0; opacity: 0;
} }
100% { 100% {
margin-top: 0; margin-top: 0;
opacity: 1; opacity: 1;
} }
} }
@media only screen and (max-width: 1580px) { @media only screen and (max-width: 1580px) {
.content-header { .content-header {
.slogan-desc { .slogan-desc {
font-size: 25px !important; font-size: 25px !important;
}
} }
}
} }
@media only screen and (max-width: 1280px) { @media only screen and (max-width: 1280px) {
.content-header { .content-header {
.slogan { .slogan {
font-size: 39px !important; font-size: 39px !important;
} }
.slogan-desc { .slogan-desc {
font-size: 20px !important; font-size: 20px !important;
}
} }
}
} }
::v-deep .el-button { ::v-deep .el-button {
border: none; border: none;
} }
::v-deep .el-button span { ::v-deep .el-button span {
font-weight: 400; font-weight: 400;
color: #2667f5; color: #2667f5;
} }
</style> </style>

2
src/views/project/template/preview.vue
View File

@ -52,7 +52,7 @@ export default {
methods: { methods: {
createProjectByTemplate() { createProjectByTemplate() {
this.createProjectLoading = true this.createProjectLoading = true
this.$api.post('/user/project/template/create/', {'key': this.projectConfig.projectKey}).then(res => { this.$api.post('/user/project/use-template/create', {'key': this.projectConfig.projectKey}).then(res => {
this.createProjectLoading = false this.createProjectLoading = false
if (res.data) { if (res.data) {
this.$router.push({path: '/project/form', query: {key: res.data, active: 1}}) this.$router.push({path: '/project/form', query: {key: res.data, active: 1}})

Write Preview
Loading…
Cancel
Save