Skip to content

S
SuperMan
Commit 2bb344ca authored by zhengke's avatar zhengke
Browse files
Options

新增

parent 885490dd
Hide whitespace changes
Inline Side-by-side
Showing with 267 additions and 0 deletions
src/components/WebSet/WebSiteEdit.vue 0 → 100644
View file @ 2bb344ca
<style>
.WebSiteEdit {
width: 100%;
height: 100%;
min-width: 0;
background-color: #f3f3f3;
}
.WebSiteContent {
min-width: 1280px;
height: 725px;
display: flex;
}
.WebSite_Left {
background-color: rgba(34, 45, 50, .8);
padding: 20px;
overflow-y: auto;
width: 250px;
height: 100%;
top: 0;
}
.WebSite_right {
padding-left: 2px;
position: relative;
overflow-y: auto;
}
[flex] {
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex
}
[flex~="box:first"]>:first-child,
[flex~="box:last"]>:last-child,
[flex~="box:justify"]>:first-child,
[flex~="box:justify"]>:last-child {
width: auto;
-webkit-box-flex: 0;
-webkit-flex-grow: 0;
-ms-flex-positive: 0;
flex-grow: 0;
-webkit-flex-shrink: 0;
-ms-flex-negative: 0;
flex-shrink: 0
}
.WebSite_right_preview {
width: 800px;
border: 1px solid #d2d6de;
overflow-y: auto;
height: 725px;
margin: 0 20px;
background-color: #ddd;
}
</style>
<template>
<div class="WebSiteEdit">
<div flex="box:first" class="WebSiteContent">
<div class="WebSite_Left">
<el-select v-model="choiceModule">
<el-option v-for="item in selData" :label="item.TemplateName" :value="item.Id" :key="item.Id">
</el-option>
</el-select>
</div>
<div class="WebSite_right">
<div class="WebSite_right_preview">
<div v-for="(item,index) in dataList" :key="index">
<movie1 v-if="item.Id='movie1'" :myData="item"></movie1>
</div>
</div>
</div>
</div>
</div>
</template>
<script>
import movie1 from "../WebSet/plug-in/movie1.vue"
export default {
data() {
return {
//下拉框
selData:[],
choiceModule:0,
dataList: [{
Id: 'movie1',
isCked: false,
data: {
isShelves: 0, //是否上架
title: '', //標題
decrible: '', //描述
id: '', //YouTube 影片ID
}
}]
};
},
created() {},
components: {
movie1
},
methods: {
//获取下拉框
getModule(){
this.apipost(
"ws_get_GetTemplateList", {},
res => {
if (res.data.resultCode == 1) {
this.selData=res.data.data;
} else {
this.Error(res.data.message);
}
},
err => {}
);
}
},
mounted() {
this.getModule();
}
};
</script>
src/components/WebSet/plug-in/movie1.vue 0 → 100644
View file @ 2bb344ca
<style>
.WebSite_item{
display: flex;
border-bottom: 1px solid #f6f6f6;
background-color: #fff;
}
.diy-component-preview .WebSite_item .temp-img {
flex-basis: calc(60% - 60px);
}
.temp-img img{
display: block;
width: 100%;
user-select: none;
pointer-events: none;
}
.WebSite_item .temp-info{
padding: 15px 20px 0;
flex-basis: 40%;
background-color: #fff;
}
.WebSite_item .temp-title{
margin: 0;
font-size: 18px;
font-weight: 500;
}
.temp-subtitle{
margin: 0;
width: 280px;
padding-top: 2px;
font-size: 15px;
font-weight: 700;
color: #999;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.diy-component-edit{
position: absolute;
top: 0;
bottom: 0;
left: 465px;
right: 0;
background: #fff;
padding: 20px;
overflow: auto;
min-width: 650px;
padding-right: 20%;
}
.group-tool{
margin-top:20px;
}
.Movie_sj{
color:#333;
font-size:14px;
margin-left:20px;
}
</style>
<template>
<div>
<!-- <div class="diy-component-options" v-if="myData.isCked">
<el-button type="primary" icon="el-icon-delete" style="left: -25px; top: 0px;" @click="delPlugin()"></el-button>
<el-button type="primary" icon="el-icon-document-copy" style="left: -25px; top: 30px;"></el-button>
<el-button type="primary" icon="el-icon-arrow-up" v-if="index>0" @click="resetSord(0)"
style="right: -25px; top: 0;"></el-button>
<el-button type="primary" icon="el-icon-arrow-down" v-if="index!=dataLeng-1" @click="resetSord(1)"
style="right: -25px; top: 30px;"></el-button>
</div> -->
<div class="diy-component-preview">
<div class="WebSite_item">
<div class="temp-img">
<!-- <img src="../../../assets/img/taiwan/video1.jpg" alt=""/> -->
</div>
<div class="temp-info">
<h2 class="temp-title">影片 - 1</h2>
<h3 class="temp-subtitle">
創立於2018年。主要業務包括國內外旅遊、飯店、機票、商務旅遊等全方位服務。合作飯店覆蓋全球200個國家，並與超過一百萬間酒店緊密合作。我們擁有先進的交易服務平台，包括行動裝置瀏覽模式，目前有超過60%以上的訂單是從手機預訂，讓您隨時隨地輕鬆預定行程。我們致力於讓旅遊變得容易，專業行程企劃為您掌握最新景點、最佳行程！
</h3>
<div class="group-tool">
<el-button type="primary" size="small">編輯</el-button>
<el-button type="danger" size="small">刪除</el-button>
<span class="Movie_sj">上架</span>
<el-switch v-model="myData.isShelves" :active-value="1" :inactive-value="0" active-color="#13ce66"
inactive-color="#dcdfe6"></el-switch>
</div>
</div>
</div>
</div>
<!-- <div class="diy-component-edit" v-if="myData.isCked">
<el-form label-width="100px">
<el-form-item label="標題">
<el-input type="text" v-model="myData.title"></el-input>
</el-form-item>
<el-form-item label="描述">
<el-input type="textarea" v-model="myData.decrible" :rows="4"></el-input>
</el-form-item>
<el-form-item label="YouTube 影片ID">
<el-input type="text" v-model="myData.id"></el-input>
</el-form-item>
<el-form-item>
<div>如何取得 YouTube 影片 ID：</div>
<div>該影片網址 v= 後面的編號，即為該影片的 ID</div>
<div>
<img src="../../../assets/img/taiwan/youtubeId.jpg" alt=""/>
</div>
</el-form-item>
</el-form>
</div> -->
</div>
</template>
<script>
export default {
props: ["myData"],
data() {
return {
};
},
created() {},
methods: {
//向父组件传值 并调用排序
resetSord(IsUp) {
this.$emit('getSord', this.index, IsUp);
},
//点击触发父组件删除
delPlugin() {
this.$emit('comDelPlugin', this.index);
},
},
mounted() {}
};
</script>
\ No newline at end of file
src/router/config.js
View file @ 2bb344ca
......@@ -4601,6 +4601,14 @@ export default {
title: '模板配置'
},
},
{
path: '/WebSiteEdit', //前台网站模板配置【模板编辑】
name: 'WebSiteEdit',
component: resolve => require(['@/components/WebSet/WebSiteEdit'], resolve),
meta: {
title: '模板编辑'
},
}
]
},
{
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment