|
|
@ -2,342 +2,134 @@ |
|
|
|
<div class="list_warp"> |
|
|
|
<el-row :gutter="15"> |
|
|
|
<el-col> |
|
|
|
<!-- v-loading="crud.loading" --> |
|
|
|
<el-table |
|
|
|
ref="table" |
|
|
|
:data="tableData" |
|
|
|
:header-cell-style="{ background: '#3a8aeb', color: '#fff' }" |
|
|
|
class="publish_table" |
|
|
|
@selection-change="handleSelectionChange" |
|
|
|
> |
|
|
|
<el-table ref="table" :data="publishList" :header-cell-style="{ background: '#3a8aeb', color: '#fff' }" class="publish_table" @selection-change="handleSelectionChange"> |
|
|
|
<el-table-column type="selection" width="55" /> |
|
|
|
<el-table-column label="文件名称" align="center" prop="name" /> |
|
|
|
<el-table-column label="文件名称" align="center" prop="relaase_name" /> |
|
|
|
<el-table-column label="发布内容" align="center" prop="content"> |
|
|
|
<template slot-scope="scope"> |
|
|
|
<div> |
|
|
|
<img width="100px" size="medium" :src="scope.row.cover" /> |
|
|
|
<img width="100px" size="medium" :src="scope.row.release_first_img" /> |
|
|
|
</div> |
|
|
|
</template> |
|
|
|
</el-table-column> |
|
|
|
<el-table-column label="发布时间" align="center" prop="date" /> |
|
|
|
<el-table-column label="发布时间" align="center" prop="date" width="200px"> |
|
|
|
<template slot-scope="scope"> |
|
|
|
<div v-if="scope.row.release_type==0">{{ scope.row.release_start }}</div> |
|
|
|
<div v-else>{{scope.row.release_start+" 至 "+scope.row.release_end}}</div> |
|
|
|
</template> |
|
|
|
</el-table-column> |
|
|
|
<el-table-column label="发布类型" align="center" prop="type"> |
|
|
|
<template slot-scope="scope"> |
|
|
|
<div>{{ scope.row.type ? "定时发布" : "即时发布" }}</div> |
|
|
|
<div>{{ scope.row.release_type==1 ? "定时发布" : "即时发布" }}</div> |
|
|
|
</template> |
|
|
|
</el-table-column> |
|
|
|
<el-table-column label="发布人" align="center" prop="user" /> |
|
|
|
<el-table-column label="发布人" align="center" prop="nick_name" /> |
|
|
|
<el-table-column label="状态" align="center" prop="enabled"> |
|
|
|
<template slot-scope="scope"> |
|
|
|
<div :class="{ stop_txt: scope.row.enabled }"> |
|
|
|
{{ scope.row.enabled ? "发布中" : "停止" }} |
|
|
|
<div :class="{ stop_txt: scope.row.is_state }"> |
|
|
|
{{ scope.row.is_state==1 ? "发布中" : "停止" }} |
|
|
|
</div> |
|
|
|
</template> |
|
|
|
</el-table-column> |
|
|
|
<el-table-column |
|
|
|
prop="device" |
|
|
|
align="center" |
|
|
|
label="发布设备" |
|
|
|
width="300px" |
|
|
|
> |
|
|
|
<el-table-column prop="release_device" align="center" label="发布设备" width="300px"> |
|
|
|
<template slot-scope="scope"> |
|
|
|
<div> |
|
|
|
{{ scope.row.device ? "" : "全部设备" }} |
|
|
|
{{ scope.row.release_device == 2 ? "" : "全部设备" }} |
|
|
|
<div class="tag_list"> |
|
|
|
<el-tag |
|
|
|
v-for="tag in scope.row.deviceData" |
|
|
|
:key="tag" |
|
|
|
type="primary" |
|
|
|
>{{ tag }}</el-tag> |
|
|
|
<el-tag v-for="tag in scope.row.binding_device" :key="tag" type="primary">{{ tag }}</el-tag> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
</template> |
|
|
|
</el-table-column> |
|
|
|
<el-table-column |
|
|
|
label="操作" |
|
|
|
width="220px" |
|
|
|
align="center" |
|
|
|
fixed="right" |
|
|
|
> |
|
|
|
<el-table-column label="操作" width="220px" align="center" fixed="right"> |
|
|
|
<template slot-scope="scope"> |
|
|
|
<el-button |
|
|
|
type="primary" |
|
|
|
:class="['top_btn', { top_btn_active: scope.row.isTop }]" |
|
|
|
@click="isTophandle(scope.$index, scope.row)" |
|
|
|
>{{ scope.row.isTop ? "取消" : "置顶" }}</el-button> |
|
|
|
<el-button |
|
|
|
type="primary" |
|
|
|
class="edit_btn" |
|
|
|
@click="editForm(scope.$index, scope.row)" |
|
|
|
>编辑</el-button> |
|
|
|
<el-button |
|
|
|
type="primary" |
|
|
|
:class="['start_btn', { stop_btn: scope.row.enabled }]" |
|
|
|
@click="isStopHandle(scope.$index, scope.row)" |
|
|
|
>{{ scope.row.enabled ? "停止" : "恢复" }}</el-button> |
|
|
|
<el-button type="primary" :class="['top_btn', { top_btn_active: scope.row.is_topping }]" @click="isTophandle(scope.$index, scope.row)">{{ scope.row.is_topping ? "取消" : "置顶" }}</el-button> |
|
|
|
<el-button type="primary" class="edit_btn" @click="editForm(scope.$index, scope.row)">编辑</el-button> |
|
|
|
<el-button type="primary" :class="['start_btn', { stop_btn: scope.row.is_state }]" @click="isStopHandle(scope.$index, scope.row)">{{ scope.row.is_state ? "停止" : "恢复" }}</el-button> |
|
|
|
<el-button type="info" class="delt_btn">删除</el-button> |
|
|
|
</template> |
|
|
|
</el-table-column> |
|
|
|
</el-table> |
|
|
|
</el-col> |
|
|
|
</el-row> |
|
|
|
<!-- 编辑 --> |
|
|
|
<div class="publish_layer"> |
|
|
|
<el-dialog |
|
|
|
title="编辑" |
|
|
|
:close-on-click-modal="false" |
|
|
|
:show-close="false" |
|
|
|
:visible.sync="publishVisible" |
|
|
|
width="872px" |
|
|
|
height="384px" |
|
|
|
> |
|
|
|
<el-form ref="form" :model="form" size="small" label-width="100px"> |
|
|
|
<el-form-item |
|
|
|
label="发布名称" |
|
|
|
prop="name" |
|
|
|
:rules="[ |
|
|
|
{ required: true, message: '请输入发布名称', trigger: '' }, |
|
|
|
]" |
|
|
|
> |
|
|
|
<el-input v-model="form.name" style="width: 674px" /> |
|
|
|
</el-form-item> |
|
|
|
<el-form-item |
|
|
|
label="发布时间" |
|
|
|
prop="date" |
|
|
|
:rules="[ |
|
|
|
{ required: true, message: '请选择发布时间', trigger: 'change' }, |
|
|
|
]" |
|
|
|
> |
|
|
|
<el-date-picker |
|
|
|
v-if="isTypeDate === 0" |
|
|
|
v-model="form.date" |
|
|
|
type="date" |
|
|
|
placeholder="选择日期" |
|
|
|
/> |
|
|
|
<el-date-picker |
|
|
|
v-else |
|
|
|
v-model="form.date" |
|
|
|
type="daterange" |
|
|
|
range-separator="至" |
|
|
|
start-placeholder="开始日期" |
|
|
|
end-placeholder="结束日期" |
|
|
|
/> |
|
|
|
</el-form-item> |
|
|
|
<el-form-item label="上传内容" prop="file"> |
|
|
|
<el-upload action="#" list-type="picture-card" :auto-upload="false"> |
|
|
|
<!-- <i slot="default" class="el-icon-plus"></i> --> |
|
|
|
<img src="@/assets/images/t-sc.png" alt /> |
|
|
|
<div slot="file" slot-scope="{ file }"> |
|
|
|
<img |
|
|
|
class="el-upload-list__item-thumbnail" |
|
|
|
:src="file.url" |
|
|
|
alt |
|
|
|
/> |
|
|
|
<!-- <span class="el-upload-list__item-actions"> |
|
|
|
<span |
|
|
|
class="el-upload-list__item-preview" |
|
|
|
@click="handlePictureCardPreview(file)" |
|
|
|
> |
|
|
|
<i class="el-icon-zoom-in"></i> |
|
|
|
</span> |
|
|
|
<span |
|
|
|
v-if="!disabled" |
|
|
|
class="el-upload-list__item-delete" |
|
|
|
@click="handleDownload(file)" |
|
|
|
> |
|
|
|
<i class="el-icon-download"></i> |
|
|
|
</span> |
|
|
|
<span |
|
|
|
v-if="!disabled" |
|
|
|
class="el-upload-list__item-delete" |
|
|
|
@click="handleRemove(file)" |
|
|
|
> |
|
|
|
<i class="el-icon-delete"></i> |
|
|
|
</span> |
|
|
|
</span>--> |
|
|
|
</div> |
|
|
|
</el-upload> |
|
|
|
<!-- <el-dialog :visible.sync="dialogVisible"> |
|
|
|
<img width="100%" :src="dialogImageUrl" alt /> |
|
|
|
</el-dialog>--> |
|
|
|
</el-form-item> |
|
|
|
<el-form-item |
|
|
|
label="选择设备" |
|
|
|
prop="deviceSelect" |
|
|
|
:rules="[ |
|
|
|
{ required: true, message: '请选择设备', trigger: 'change' }, |
|
|
|
]" |
|
|
|
> |
|
|
|
<el-radio-group v-model="form.deviceSelect"> |
|
|
|
<el-radio label="all" value="all">所有设备</el-radio> |
|
|
|
<el-radio |
|
|
|
label="other" |
|
|
|
value="other" |
|
|
|
>部分设备<i |
|
|
|
v-if="form.deviceSelect === 'other'" |
|
|
|
class="radio_tip" |
|
|
|
@click="addDeviceTag()" |
|
|
|
>添加</i></el-radio> |
|
|
|
</el-radio-group> |
|
|
|
</el-form-item> |
|
|
|
<div v-if="form.deviceSelect === 'all'" class="select_all_tip"> |
|
|
|
所有设备都将被发送 |
|
|
|
</div> |
|
|
|
<div |
|
|
|
v-if="deviceTags.length > 0 && form.deviceSelect === 'other'" |
|
|
|
class="select_other" |
|
|
|
> |
|
|
|
<el-row> |
|
|
|
<el-col |
|
|
|
:span="10" |
|
|
|
class="other_tip" |
|
|
|
>以下设备都将被发送<span>总计{{ deviceTags.length }}个设备</span></el-col> |
|
|
|
<el-col :span="4"> |
|
|
|
<el-button |
|
|
|
round |
|
|
|
class="delt_btn" |
|
|
|
@click="clearDevice()" |
|
|
|
>清空</el-button> |
|
|
|
</el-col> |
|
|
|
</el-row> |
|
|
|
<el-tag |
|
|
|
v-for="tag in deviceTags" |
|
|
|
:key="tag" |
|
|
|
closable |
|
|
|
:disable-transitions="true" |
|
|
|
:hit="false" |
|
|
|
color="#cbe3ff" |
|
|
|
@close="handleClose(tag)" |
|
|
|
> |
|
|
|
{{ tag }} |
|
|
|
</el-tag> |
|
|
|
</div> |
|
|
|
</el-form> |
|
|
|
<div slot="footer" class="dialog-footer"> |
|
|
|
<!-- :loading="crud.status.cu === 2" |
|
|
|
@click="crud.submitCU"--> |
|
|
|
<el-button |
|
|
|
type="primary" |
|
|
|
round |
|
|
|
>保存</el-button> |
|
|
|
<el-button round @click="publishVisible=false">关闭</el-button> |
|
|
|
</div> |
|
|
|
</el-dialog> |
|
|
|
</div> |
|
|
|
<!-- 添加发布的设备 --> |
|
|
|
<div class="add_device_layer"> |
|
|
|
<el-dialog |
|
|
|
title="请选择设备" |
|
|
|
:close-on-click-modal="false" |
|
|
|
:visible.sync="selectDeviceVisible" |
|
|
|
width="400px" |
|
|
|
> |
|
|
|
<el-tag |
|
|
|
v-for="tag in deviceAllTags" |
|
|
|
:key="tag" |
|
|
|
:disable-transitions="true" |
|
|
|
:hit="false" |
|
|
|
color="#cbe3ff" |
|
|
|
class="all_tags" |
|
|
|
@click="tagHandle(tag)" |
|
|
|
> |
|
|
|
{{ tag }} |
|
|
|
</el-tag> |
|
|
|
</el-dialog> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
</template> |
|
|
|
|
|
|
|
<script> |
|
|
|
|
|
|
|
import {reqPublishList} from '@/api/publish/publishList' |
|
|
|
import { parseTime } from '@/utils/index.js' |
|
|
|
import { FetchGetReleaseList, FetchGetReleaseDetailsById } from '@/api/release/release' |
|
|
|
export default { |
|
|
|
name: 'PublishList', |
|
|
|
data() { |
|
|
|
data () { |
|
|
|
return { |
|
|
|
// queryInfo:{ |
|
|
|
// release_name:'', |
|
|
|
// orga_id:'', |
|
|
|
// page:1, |
|
|
|
// size:3, |
|
|
|
// }, |
|
|
|
form:{ |
|
|
|
name:'', |
|
|
|
date:'', |
|
|
|
file:'', |
|
|
|
deviceSelect:'' |
|
|
|
}, |
|
|
|
orga_id: '133221333123111', |
|
|
|
page: 1, |
|
|
|
size: 10, |
|
|
|
selectedList: [], |
|
|
|
publishVisible: false, |
|
|
|
messageVisible: false, |
|
|
|
selectDeviceVisible: false, |
|
|
|
isTypeDate: 0, |
|
|
|
tableData: [ |
|
|
|
{ |
|
|
|
id: 1, |
|
|
|
name: '及时发布 2022-1-1', |
|
|
|
cover: require('@/assets/images/background.jpg'), |
|
|
|
type: 0, |
|
|
|
user: '某某某', |
|
|
|
device: 0, |
|
|
|
deviceData: [], |
|
|
|
enabled: true, |
|
|
|
isTop: true, |
|
|
|
date: '2021-2-2' |
|
|
|
}, |
|
|
|
{ |
|
|
|
id: 2, |
|
|
|
name: '定时发布 2022-1-1', |
|
|
|
cover: require('@/assets/images/background.jpg'), |
|
|
|
type: 1, |
|
|
|
user: '某某某2', |
|
|
|
device: 1, |
|
|
|
deviceData: ['GCXR1', 'GCXR2', 'GCXR3', 'GCXR4', 'GCXR5'], |
|
|
|
enabled: false, |
|
|
|
isTop: false, |
|
|
|
date: '2021-2-2 至 2022-4-6' |
|
|
|
} |
|
|
|
], |
|
|
|
publishList: [], |
|
|
|
deviceAllTags: ['GCXR1', 'GCXR2', 'GCXR3', 'GCXR4', 'GCXR5'], |
|
|
|
deviceTags: [] |
|
|
|
} |
|
|
|
}, |
|
|
|
mounted(){ |
|
|
|
// this.getPublishList() |
|
|
|
mounted () { |
|
|
|
this.getPublishList() |
|
|
|
}, |
|
|
|
methods: { |
|
|
|
// 获取发布列表的数据 |
|
|
|
// getPublishList(){ |
|
|
|
// const params=this.queryInfo |
|
|
|
// reqPublishList(params).then(res=>{ |
|
|
|
// if(res.code==200) { |
|
|
|
// this.publishList=res.data.content |
|
|
|
// } |
|
|
|
// }) |
|
|
|
// }, |
|
|
|
isTophandle(index, row) { |
|
|
|
row.isTop = !row.isTop |
|
|
|
getPublishList () { |
|
|
|
const params = { |
|
|
|
release_name: '', |
|
|
|
orga_id: this.orga_id, |
|
|
|
page: this.page, |
|
|
|
size: this.size |
|
|
|
} |
|
|
|
FetchGetReleaseList(params).then(res => { |
|
|
|
if (res.code == 200) { |
|
|
|
this.publishList = res.data.content |
|
|
|
this.publishList.forEach(item => { |
|
|
|
item.release_start = parseTime(item.release_start).split("00:00:00")[0] |
|
|
|
item.release_end = parseTime(item.release_end).split("00:00:00")[0] |
|
|
|
if (item.binding_device) { |
|
|
|
item.binding_device = item.binding_device.split(",") |
|
|
|
} |
|
|
|
}) |
|
|
|
} else { |
|
|
|
this.$message.error(res.msg) |
|
|
|
} |
|
|
|
}) |
|
|
|
}, |
|
|
|
isStopHandle(index, row) { |
|
|
|
row.enabled = !row.enabled |
|
|
|
// 是否置顶 |
|
|
|
isTophandle (index, row) { |
|
|
|
row.is_topping = !row.is_topping |
|
|
|
}, |
|
|
|
editForm(index, row) { |
|
|
|
this.publishVisible = true |
|
|
|
this.form.name = row.name |
|
|
|
this.isTypeDate = row.type |
|
|
|
if (this.isTypeDate === 0) { |
|
|
|
this.form.date = row.date |
|
|
|
} else { |
|
|
|
const dateSplice = row.date.split('至') |
|
|
|
this.form.date = dateSplice |
|
|
|
} |
|
|
|
if (row.device === 0) { |
|
|
|
this.form.deviceSelect = 'all' |
|
|
|
} else { |
|
|
|
this.form.deviceSelect = 'other' |
|
|
|
// 是否停止发布 |
|
|
|
isStopHandle (index, row) { |
|
|
|
row.is_state = !row.is_state |
|
|
|
}, |
|
|
|
// 编辑 |
|
|
|
editForm (index, row) { |
|
|
|
console.log(row) |
|
|
|
const params = { |
|
|
|
release_id: row.release_id |
|
|
|
} |
|
|
|
this.deviceTags = row.deviceData |
|
|
|
this.$router.push( |
|
|
|
{ |
|
|
|
path: '/release', query: { tag: 1 } |
|
|
|
} |
|
|
|
) |
|
|
|
FetchGetReleaseDetailsById(params).then(res => { |
|
|
|
if (res.code == 200) { |
|
|
|
console.log(res.data) |
|
|
|
} else { |
|
|
|
this.$message.error(res.msg) |
|
|
|
} |
|
|
|
}) |
|
|
|
}, |
|
|
|
handleSelectionChange(val) { |
|
|
|
handleSelectionChange (val) { |
|
|
|
this.selectedList = val |
|
|
|
if (val.length > 0) { |
|
|
|
this.clearBtnDisabled = false |
|
|
@ -345,20 +137,6 @@ export default { |
|
|
|
this.clearBtnDisabled = true |
|
|
|
} |
|
|
|
console.log(val) |
|
|
|
}, |
|
|
|
addDeviceTag() { |
|
|
|
this.selectDeviceVisible = true |
|
|
|
}, |
|
|
|
tagHandle(tag) { |
|
|
|
console.log(tag) |
|
|
|
this.deviceTags.push(tag) |
|
|
|
}, |
|
|
|
handleClose(tag) { |
|
|
|
this.deviceTags.splice(this.deviceTags.indexOf(tag), 1) |
|
|
|
console.log(this.deviceTags) |
|
|
|
}, |
|
|
|
clearDevice() { |
|
|
|
this.deviceTags = [] |
|
|
|
} |
|
|
|
} |
|
|
|
} |
|
|
|