x-php-Admin/src/views/app/apartment/lives.vue
2023-06-12 18:36:51 +08:00

126 lines
3.5 KiB
Vue

<template>
<el-drawer :size="800" @closed="$emit('closed', data)" :close-on-press-escape="false" :close-on-click-modal="false" destroy-on-close title="直播列表" v-model="visible">
<el-container v-loading="loading">
<el-main style="padding:0 6px 6px 6px">
<sc-form-table :addtemplate="filtersAddTemplate" :hideAdd="true" class="lives" drag-sort="" placeholder="暂无数据" ref="livestable" v-model="data.lives">
<el-table-column label="视频ID" prop="text" width="100">
<template #default="scope">
<el-input placeholder="视频ID" v-model="scope.row.videoid">
</el-input>
</template>
</el-table-column>
<el-table-column label="视频链接" prop="text">
<template #default="scope">
<el-input placeholder="视频链接" v-model="scope.row.videourl">
</el-input>
</template>
</el-table-column>
<el-table-column label="视频图片" prop="value" width="150">
<template #default="scope">
<el-input class="input-with-select" placeholder="视频图片" v-model="scope.row.imageid">
<template v-slot:append="">
<sc-upload :height="30" :multiple="false" :on-success="function(res){ scope.row.imageid = res.aid; scope.row.imageurl = res.url }" :showfilelist="0" :width="30" v-model="scope.row.imageurl">
<el-button icon="el-icon-upload" type="danger">
</el-button>
</sc-upload>
</template>
</el-input>
</template>
</el-table-column>
</sc-form-table>
<div style="padding:10px 0px 0 0px">
<el-upload :action="fileConfig.api" :file-list="fileList" :on-success="pushRow" name="files">
<slot>
<el-button style="width: 100%;" type="danger">
点击上传视频文件
</el-button>
</slot>
</el-upload>
</div>
</el-main>
<el-footer>
<el-button @click="submit" type="primary">
提交
</el-button>
</el-footer>
</el-container>
</el-drawer>
</template>
<style>
.input-with-select .el-input-group__prepend {
padding: 2px;
}
.lives .el-input-group__append{
padding: 0px;
}
</style>
<script>
import sysConfig from "@/config";
import api from './api'
export default {
emits: ['success', 'closed'],
data() {
return {
visible: false,
issave: false,
data:[],
filtersAddTemplate: {
imageid: null,
videoid: null,
videourl: '',
imageurl: '',
},
fileList:[],
fileConfig:{
api: sysConfig.API_URL + this.$api.common.upload.url,
},
}
},
mounted() {
},
methods: {
pushRow(res){
this.fileList = [];
if (res.code==200) {
this.$refs.livestable.pushRow({
imageid: null,
videoid: res.data.aid,
videourl: res.data.url,
imageurl: '',
})
return ;
}
this.$message.warning(res.message);
},
close(){
this.visible = false;
},
//表单提交方法
submit(){
this.$emit('success', this.data, this)
},
//显示
open(){
this.visible = true;
return this;
},
//表单注入数据
setData(o){
this.data = o
},
remoteData(o){
setTimeout(async ()=>{
var res = await api.get('getAttachment',{id:o.id})
this.loading = false
this.data = res.data;
this.issave = true
},400)
}
}
}
</script>
<style>
</style>