326 lines
12 KiB
PHP
326 lines
12 KiB
PHP
@extends('layouts.base')
|
|
@section('title', "图文审核")
|
|
@section('content')
|
|
<link rel="stylesheet" href="{{resource_get('plugins/wechat/src/common/static/index.css')}}">
|
|
<style>
|
|
.top-title {
|
|
background: #fff;
|
|
margin: 10px;
|
|
padding: 20px 0;
|
|
border-radius: 10px;
|
|
}
|
|
|
|
.vue-main-title {
|
|
padding: 0 20px 20px 20px;
|
|
}
|
|
|
|
.top-title .vue-main-title .el-button {
|
|
border: 1px solid #25cbae;
|
|
color: #25cbae;
|
|
background: #f1fcfa;
|
|
}
|
|
|
|
.bottom-content {
|
|
display: flex;
|
|
flex-wrap: wrap;
|
|
margin: 0 20px;
|
|
}
|
|
|
|
.context {
|
|
display: flex;
|
|
justify-content: flex-start;
|
|
margin-bottom: 10px;
|
|
}
|
|
|
|
.member-img {
|
|
width: 50px;
|
|
height: 50px;
|
|
margin-right: 5px;
|
|
}
|
|
|
|
.member_nickname {
|
|
color: #52c2e0;
|
|
font-weight: bold;
|
|
text-align: left;
|
|
}
|
|
|
|
.bottom-content div {
|
|
margin-bottom: 10px;
|
|
}
|
|
|
|
.el-button {
|
|
height: 40px;
|
|
}
|
|
|
|
.bottom-content .el-input {
|
|
width: 200px;
|
|
margin-right: 10px;
|
|
}
|
|
|
|
.bottom-content .block {
|
|
margin-right: 10px;
|
|
}
|
|
|
|
.vue-main {
|
|
border-radius: 10px;
|
|
padding-left: 0;
|
|
}
|
|
|
|
/* .el-table__row .el-table_1_column_3 .cell {
|
|
color: #13c7a7;
|
|
} */
|
|
|
|
.el-button:focus,
|
|
.el-button:hover {
|
|
color: #fff;
|
|
border-color: #13c7a7;
|
|
background-color: #13c7a7;
|
|
}
|
|
|
|
.reviewed {
|
|
color: #e59133;
|
|
font-weight: 500;
|
|
}
|
|
|
|
.publish {
|
|
color: #13c7a7;
|
|
font-weight: 500;
|
|
}
|
|
|
|
.upload-cover {
|
|
display: flex;
|
|
justify-content: center;
|
|
align-items: center;
|
|
margin-bottom: 10px;
|
|
}
|
|
|
|
.upload-cover .el-input__inner {
|
|
padding:0 !important;
|
|
}
|
|
|
|
.upload-cover .upload-box {
|
|
width: 100px;
|
|
height: 50px;
|
|
display: flex;
|
|
flex-direction: column;
|
|
}
|
|
|
|
.upload-cover .el-icon-plus {
|
|
font-size: 18px;
|
|
}
|
|
|
|
.upload-cover .el-icon-link {
|
|
font-size: 18px;
|
|
margin: 0 10px;
|
|
}
|
|
|
|
.upload-cover .el-icon-delete-solid{
|
|
font-size: 18px;
|
|
}
|
|
</style>
|
|
<div class="all">
|
|
<div id="app" v-cloak>
|
|
<link rel="stylesheet" href="//at.alicdn.com/t/font_432132_zbfevy1oy.css">
|
|
<div class="top-title">
|
|
<div class="vue-main-title">
|
|
<div class="vue-main-title-left"></div>
|
|
<div class="vue-main-title-content">发布审核</div>
|
|
<el-button type="primary" style="background:#13c7a7;color:#fff" @click="syncPublic">同步公众号发表记录</el-button>
|
|
</div>
|
|
<div class="bottom-content">
|
|
<el-input v-model="form.title" placeholder="请输入标题/关键词"></el-input>
|
|
<el-select v-model="form.status" placeholder="发布状态" clearable>
|
|
<el-option :label="item.name" :value="item.value" v-for="(item,index) in send_state" :key="index"></el-option>
|
|
</el-select>
|
|
<div class="block">
|
|
<el-date-picker v-model="date" format="yyyy-MM-dd HH:mm:ss" value-format="yyyy-MM-dd HH:mm:ss" type="datetimerange" range-separator="至" start-placeholder="开始日期" end-placeholder="结束日期">
|
|
</el-date-picker>
|
|
</div>
|
|
<el-button @click="search(1)" style="background:#13c7a7;color:#fff" class="btn-style">搜索</el-button>
|
|
</div>
|
|
</div>
|
|
<div class="vue-main">
|
|
<div class="vue-main-title">
|
|
<div class="vue-main-title-left"></div>
|
|
<div class="vue-main-title-content">发布列表</div>
|
|
</div>
|
|
<el-table :data="list_data" style="width: 100%">
|
|
<el-table-column label="时间" align="center" prop="created_at"></el-table-column>
|
|
<el-table-column label="发布内容" align="center">
|
|
<template slot-scope="scope">
|
|
<div v-for="(item,index) in scope.row.has_many_article" :key="index" class="context">
|
|
<el-image class="member-img" :src="item.thumb_url" fit="contain"></el-image>
|
|
<span class="member_nickname">[[item.title]]</span>
|
|
</div>
|
|
</template>
|
|
</el-table-column>
|
|
<el-table-column label="发布状态" align="center">
|
|
<template slot-scope="scope">
|
|
<!-- 0待审核 -1已驳回 1已发布 -->
|
|
<span :class="scope.row.status === 0 ? 'reviewed' : scope.row.status === -1 ? '已驳回' : 'publish'">[[scope.row.status === 0 ? '待审核' : scope.row.status === -1 ? '已驳回' : '已发布']]</span>
|
|
</template>
|
|
</el-table-column>
|
|
<el-table-column label="操作" align="center">
|
|
<template slot-scope="scope">
|
|
<div class="upload-cover" v-for="(item,index) in scope.row.has_many_article" :key="index" v-if="scope.row.has_many_article.length >= 0 && scope.row.status !== 0">
|
|
<div class="upload-box" @click="uploadImgCover(item.id)" v-if="!item.thumb_url && scope.row.status !== -1">
|
|
<i class="el-icon-plus"></i>
|
|
<span>上传封面</span>
|
|
</div>
|
|
<div @click="copy(`textUrl_${item.id}_${scope.row.id}`)">
|
|
<el-input v-model="item.url" :ref="`textUrl_${item.id}_${scope.row.id}`" style="width: 12px;height:1px;opacity: 0;"></el-input>
|
|
<i class="el-icon-link"></i>
|
|
</div>
|
|
<i class="el-icon-delete-solid" @click="delExamineRecord(item.examine_id,scope.row.article_id)"></i>
|
|
</div>
|
|
<div class="upload-cover" v-if="scope.row.has_many_article.length === 0 && scope.row.status !== 0">
|
|
<div class="upload-box" @click="uploadImgCover('')" v-if="scope.row.status !== -1">
|
|
<i class="el-icon-plus"></i>
|
|
<span>上传封面</span>
|
|
</div>
|
|
<div @click="copy('textNull')" v-if="scope.row.status !== -1">
|
|
<el-input ref="textNull" style="width: 1px;height:12px;opacity: 0;"></el-input>
|
|
<i class="el-icon-link"></i>
|
|
</div>
|
|
<i class="el-icon-delete-solid" @click="delExamineRecord('',scope.row.article_id)"></i>
|
|
</div>
|
|
</template>
|
|
</el-table-column>
|
|
</el-table>
|
|
</div>
|
|
<!-- 分页 -->
|
|
<div class="vue-page" v-if="total>0">
|
|
<el-row>
|
|
<el-col align="right">
|
|
<el-pagination layout="prev, pager, next,jumper" @current-change="search" :total="total" :page-size="per_page" :current-page="current_page" background></el-pagination>
|
|
</el-col>
|
|
</el-row>
|
|
</div>
|
|
<upload-img :upload-show="uploadShow" :name="chooseImgName" @replace="changeProp" @sure="sureImg"></upload-img>
|
|
</div>
|
|
</div>
|
|
@include('public.admin.uploadImg')
|
|
<script>
|
|
var app = new Vue({
|
|
el: "#app",
|
|
delimiters: ['[[', ']]'],
|
|
name: 'test',
|
|
data() {
|
|
return {
|
|
form: {
|
|
title: '',
|
|
status: ''
|
|
},
|
|
date: '',
|
|
send_state: [{
|
|
value: 0,
|
|
name: '待审核'
|
|
}, {
|
|
value: 1,
|
|
name: '已发布'
|
|
}, {
|
|
value: -1,
|
|
name: '已驳回'
|
|
}],
|
|
list_data: [],
|
|
current_page: 1,
|
|
total: 1,
|
|
per_page: 1,
|
|
chooseImgName:'',
|
|
uploadIndex:0,
|
|
uploadShow:false,
|
|
}
|
|
},
|
|
mounted() {
|
|
this.getRecordData(1);
|
|
},
|
|
methods: {
|
|
getRecordData(page) {
|
|
this.$http.post("{!! yzWebFullUrl('plugin.wechat.admin.material.controller.article.index') !!}", {
|
|
page,
|
|
...this.form,
|
|
time_arr:[this.date !== null ? this.date[0] : '',this.date !== null ? this.date[1] : '']
|
|
}).then(res => {
|
|
return res.json();
|
|
}).then(response => {
|
|
if (response.result) {
|
|
// console.log(response,'response');
|
|
this.list_data = response.data.data
|
|
this.current_page = response.data.current_page;
|
|
this.total = response.data.total;
|
|
this.per_page = response.data.per_page;
|
|
} else {
|
|
console.log(123);
|
|
this.$message.error(response.msg);
|
|
}
|
|
});
|
|
},
|
|
search(val) {
|
|
this.getRecordData(val);
|
|
},
|
|
changeProp(val) {
|
|
this.uploadShow = !val;
|
|
},
|
|
sureImg(name,image,image_url) {
|
|
// console.log(this.uploadIndex,image_url,'image');
|
|
this.uploadCover(this.uploadIndex,image_url)
|
|
},
|
|
uploadImgCover(index){
|
|
this.uploadShow = true;
|
|
this.uploadIndex = index;
|
|
},
|
|
// 同步公众号发表记录
|
|
syncPublic(){
|
|
this.$http.post("{!! yzWebFullUrl('plugin.wechat.admin.material.controller.article.refresh') !!}", {examine_id:''}).then(res => {
|
|
return res.json();
|
|
}).then(response => {
|
|
if (response.result) {
|
|
this.$message.success(response.msg);
|
|
location.reload();
|
|
} else {
|
|
this.$message.error(response.msg);
|
|
}
|
|
});
|
|
},
|
|
// 复制链接
|
|
copy(indexUrl){
|
|
let url = this.$refs[indexUrl];
|
|
// console.log( this.$refs[indexUrl],indexUrl) // 改变了的值
|
|
if(indexUrl == 'textNull') {
|
|
url.select(); // 选择对象
|
|
}else {
|
|
url[0].select(); // 选择对象
|
|
}
|
|
document.execCommand("Copy",false);
|
|
this.$message({message:"复制成功!",type:"success"});
|
|
},
|
|
// 上传封面
|
|
uploadCover(id,thumb_url){
|
|
this.$http.post("{!! yzWebFullUrl('plugin.wechat.admin.material.controller.article.changeArticleImage') !!}", {id,thumb_url}).then(res => {
|
|
return res.json();
|
|
}).then(response => {
|
|
if (response.result) {
|
|
this.$message.success(response.msg);
|
|
this.getRecordData(1);
|
|
} else {
|
|
this.$message.error(response.msg);
|
|
}
|
|
});
|
|
},
|
|
// 删除审核记录
|
|
delExamineRecord(examine_id,article_id){
|
|
this.$http.post("{!! yzWebFullUrl('plugin.wechat.admin.material.controller.article.deleteArticle') !!}", {examine_id,article_id}).then(res => {
|
|
return res.json();
|
|
}).then(response => {
|
|
if (response.result) {
|
|
this.$message.success(response.msg);
|
|
this.getRecordData(1);
|
|
} else {
|
|
this.$message.error(response.msg);
|
|
}
|
|
});
|
|
}
|
|
},
|
|
})
|
|
</script>
|
|
@endsection |