Skip to content

S
SuperMan
Commit 4afb1114 authored by zhengke's avatar zhengke
Browse files
Options

修改

parent cffd11bf
Hide whitespace changes
Inline Side-by-side
Showing with 151 additions and 38 deletions
src/components/WebSet/plug-in/other_dialog.vue
View file @ 4afb1114
<style>
.otherDialog .table-striped{
width:100%;
border-spacing: 0;
border-collapse: collapse;
}
.otherDialog .table-striped th,.otherDialog .table-striped td{
padding:8px;
text-align: center;
}
.otherDialog .table-striped>tr:nth-of-type(odd) {
background-color: #f9f9f9;
}
.otherDialog .table-striped {
width: 100%;
border-spacing: 0;
border-collapse: collapse;
}
.otherDialog .table-striped th,
.otherDialog .table-striped td {
padding: 8px;
text-align: center;
}
.otherDialog .table-striped>tr:nth-of-type(odd) {
background-color: #f9f9f9;
}
.otherDialog .webSliderDiv {
line-height: 0;
height: 115px;
width:400px;
border: 1px solid #ccc;
cursor: pointer;
position: relative;
}
.otherDialog .webSliderDiv .el-upload {
width: 100%;
height: 100%;
}
.otherDialog .webSliderDiv .addIconDiv {
position: absolute;
width: 100%;
height: 100%;
top: 0;
background-color: transparent;
display: flex;
align-items: center;
justify-content: center;
}
.otherDialog .webSliderDiv i {
font-size: 50px;
color: #d1d1d1;
cursor: pointer;
}
.otherDialog .webSliderDiv .addIconDiv:hover {
background: rgba(0, 0, 0, 0.5);
color: #fff;
}
.otherDialog .webSliderDiv>div {
height: 100%;
}
.otherDialog .sectionImg{
position:absolute;
width:100%;
height:100%;
background-position: center;
background-size: cover;
}
</style>
<template>
<div class="otherDialog">
......@@ -26,34 +76,85 @@
</template>
<template v-if="plugData.Type==2">
<el-form-item label="主標題">
<el-input type="text" v-model="plugData.Title"></el-input>
<el-input type="text" v-model="plugData.Title"></el-input>
</el-form-item>
<el-form-item>
<span style="color:#8a6d3b">未填標題或未傳檔案則不會顯示於前台，檔案類型限制：jpg、png、pdf，大小上限 8MB。</span>
<span style="color:#8a6d3b">未填標題或未傳檔案則不會顯示於前台，檔案類型限制：jpg、png、pdf，大小上限 8MB。</span>
</el-form-item>
<table class="table-striped">
<tr>
<th style="width:7%">項次</th>
<th style="width:47%">標題</th>
<th style="width:28%">上傳檔案</th>
<th style="width:18%">檢視檔案</th>
</tr>
<tr v-for="(item,index) in plugData.DownLoadList" :key="index">
<td>{{index+1}}</td>
<td>
<el-input type="text" v-model="item.LinkTitle"></el-input>
</td>
<td>
<el-upload :http-request="UploadImage" :show-file-list="false" :multiple="true" accept="" action=''>
<el-button size="small" type="primary" @click="checkIndex=index">点击上传</el-button>
</el-upload>
</td>
<td>
<a v-if="item.LinkUrl!=''" style="color:blue" target="_blank" :href="item.LinkUrl">预览</a>
</td>
</tr>
</table>
<tr>
<th style="width:7%">項次</th>
<th style="width:47%">標題</th>
<th style="width:28%">上傳檔案</th>
<th style="width:18%">檢視檔案</th>
</tr>
<tr v-for="(item,index) in plugData.DownLoadList" :key="index">
<td>{{index+1}}</td>
<td>
<el-input type="text" v-model="item.LinkTitle"></el-input>
</td>
<td>
<el-upload :http-request="UploadImage" :show-file-list="false" :multiple="true" accept="" action=''>
<el-button size="small" type="primary" @click="checkIndex=index">点击上传</el-button>
</el-upload>
</td>
<td>
<a v-if="item.LinkUrl!=''" style="color:blue" target="_blank" :href="item.LinkUrl">预览</a>
</td>
</tr>
</table>
</template>
<template v-if="plugData.Type==3">
<el-row>
<el-col :span="24">
<el-form-item label="標題">
<el-input type="text" v-model="plugData.Title"></el-input>
</el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="24">
<el-form-item label="副標題">
<el-input type="text" v-model="plugData.SubTitle"></el-input>
</el-form-item>
</el-col>
</el-row>
</template>
<template v-if="plugData.Type==4">
<el-row>
<el-col :span="24">
<el-form-item label="段落內容">
<el-input type="textarea" :rows="4" v-model="plugData.ParagraphContent"></el-input>
</el-form-item>
</el-col>
</el-row>
</template>
<template v-if="plugData.Type==5">
<el-row>
<el-col :span="12">
<el-form-item>
<div class="webSliderDiv">
<el-upload :http-request="UploadImage2" :multiple="true"
accept="image/jpeg,image/gif,image/png,image/bmp" :show-file-list="false" action="">
<div class="sectionImg" :style="{backgroundImage:'url(' + plugData.ImageUrl + ')'}"></div>
<div class="addIconDiv">
<i class="web_addImg iconfont icon-img_haha"></i>
<i class="web_delImg iconfont icon-img_delete_small" style="margin-left:10px;"
@click.stop="plugData.ImageUrl=''"></i>
</div>
</el-upload>
</div>
<div>圖片尺寸請上傳：1440x360(前台高度不限)</div>
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="標題">
<el-input type="text" v-model="plugData.Title"></el-input>
</el-form-item>
</el-col>
</el-row>
</template>
</el-form>
</div>
</template>
......@@ -67,8 +168,8 @@
},
created() {},
methods: {
//上传文件
UploadImage(file) {
console.log(this.checkIndex,'index');
let newArr = [];
newArr.push(file.file);
let fileName = file.file.name;
......@@ -76,10 +177,22 @@
this.UploadSelfFileT(path, newArr, x => {
var str = x.data.FilePath;
var imgUrl = this.domainManager().ViittoFileUrl + str;
this.plugData.DownLoadList[this.checkIndex].LinkUrl=imgUrl;
this.plugData.DownLoadList[this.checkIndex].LinkUrl = imgUrl;
});
},
//上传图片
UploadImage2(file){
let newArr = [];
newArr.push(file.file);
let fileName = file.file.name;
var path = "/Upload/WebSite/";
this.UploadSelfFileT(path, newArr, x => {
var str = x.data.FilePath;
var imgUrl = this.domainManager().ViittoFileUrl + str;
this.plugData.ImageUrl = imgUrl;
});
}
}
},
mounted() {
......
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