209 行
8.2 KiB
HTML
209 行
8.2 KiB
HTML
<link rel="stylesheet" href="__CDN__/assets/addons/shopro/libs/element/element.css">
|
|
<link rel="stylesheet" href="__CDN__/assets/addons/shopro/libs/common.css">
|
|
<style>
|
|
#commentView>div {
|
|
width: 100%;
|
|
}
|
|
|
|
.custom-table {
|
|
padding: 20px 20px 30px;
|
|
background: #fff;
|
|
}
|
|
|
|
.page-container {
|
|
margin-top: 30px;
|
|
justify-content: space-between;
|
|
}
|
|
|
|
.create-btn {
|
|
width: fit-content;
|
|
padding: 10px;
|
|
}
|
|
|
|
.shopro-screen-container {
|
|
background: #fff;
|
|
padding-top: 20px;
|
|
margin-bottom: 10px;
|
|
border-radius: 4px;
|
|
display: flex;
|
|
align-items: flex-start;
|
|
justify-content: space-between;
|
|
}
|
|
|
|
.shopro-screen-container-left {
|
|
flex: 1;
|
|
display: flex;
|
|
flex-wrap: wrap;
|
|
}
|
|
|
|
.shopro-screen-tip {
|
|
flex-shrink: 0;
|
|
}
|
|
|
|
.recycle-btn {
|
|
margin-bottom: 20px;
|
|
}
|
|
|
|
.shopro-reset-button {
|
|
margin-right: 10px;
|
|
}
|
|
|
|
.table-image {
|
|
width: 32px;
|
|
height: 32px;
|
|
border-radius: 50%;
|
|
margin-right: 8px;
|
|
float: left;
|
|
}
|
|
|
|
.goods {
|
|
border-radius: 4px;
|
|
}
|
|
|
|
.images {
|
|
margin: 0 8px 8px 0;
|
|
border-radius: 4px;
|
|
}
|
|
|
|
.ellipsis-item {
|
|
line-height: 32px;
|
|
}
|
|
|
|
[v-cloak] {
|
|
display: none
|
|
}
|
|
</style>
|
|
<script src="__CDN__/assets/addons/shopro/libs/vue.js"></script>
|
|
<script src="__CDN__/assets/addons/shopro/libs/element/element.js"></script>
|
|
<script src="__CDN__/assets/addons/shopro/libs/moment.js"></script>
|
|
<div id="commentView" v-cloak v-loading="allAjax">
|
|
<div class="shopro-screen-container">
|
|
<div class="shopro-screen-container-left">
|
|
<div class="shopro-button shopro-refresh-button" @click="getData">
|
|
<i class="el-icon-refresh"></i>
|
|
</div>
|
|
<div class="display-flex shopro-screen-item">
|
|
<div class="shopro-screen-tip">商品名称</div>
|
|
<div class="shopro-screen-condition">
|
|
<el-input placeholder="请输入商品名称" v-model="searchForm.goods_title" class="screen-item-input"
|
|
size="small">
|
|
</el-input>
|
|
</div>
|
|
</div>
|
|
<div class="display-flex shopro-screen-item">
|
|
<div class="shopro-screen-tip">评价状态</div>
|
|
<div class="shopro-screen-condition">
|
|
<el-select v-model="searchForm.comment_status" placeholder="请选择" size="small">
|
|
<el-option label="全部" value="all"></el-option>
|
|
<el-option label="显示" value="show"></el-option>
|
|
<el-option label="隐藏" value="hidden"></el-option>
|
|
</el-select>
|
|
</div>
|
|
</div>
|
|
<div class="display-flex shopro-screen-item-button">
|
|
<div class="shopro-button shopro-reset-button" @click="screenEmpty">重置</div>
|
|
<div class="shopro-button shopro-screen-button" @click="screenFilter">筛选</div>
|
|
</div>
|
|
</div>
|
|
<div class="shopro-screen-container-right">
|
|
<div class="recycle-btn" @click="recyclebin">
|
|
<i class="fa fa-recycle"></i> 回收站
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="custom-table" v-loading="tableAjax">
|
|
<el-table ref="multipleTable" :data="data" tooltip-effect="dark" style="width: 100%" border
|
|
@selection-change="handleSelectionChange">
|
|
<el-table-column type="selection" min-width="36">
|
|
</el-table-column>
|
|
<el-table-column label="ID" prop="id" min-width="148">
|
|
</el-table-column>
|
|
<el-table-column label="商品" min-width="148" align="left">
|
|
<template slot-scope="scope">
|
|
<div class="display-flex">
|
|
<div class="ellipsis-item-wrap" v-if="scope.row.goods">
|
|
<el-image class="table-image goods" :src="scope.row.goods.image"></el-image>
|
|
<span class="ellipsis-item">{{scope.row.goods.title}}</span>
|
|
</div>
|
|
<div v-else>{{scope.row.goods_id}}</div>
|
|
</div>
|
|
</template>
|
|
</el-table-column>
|
|
<el-table-column label="评论用户" min-width="148" align="left">
|
|
<template slot-scope="scope">
|
|
<div class="display-flex">
|
|
<div class="ellipsis-item-wrap" v-if="scope.row.user">
|
|
<el-image class="table-image" :src="scope.row.user.avatar"></el-image>
|
|
<span class="ellipsis-item">{{scope.row.user.nickname}}</span>
|
|
</div>
|
|
<div v-else>{{scope.row.user_id}}</div>
|
|
</div>
|
|
</template>
|
|
</el-table-column>
|
|
<el-table-column label="评价星级" min-width="148">
|
|
<template slot-scope="scope">
|
|
<div>
|
|
<el-rate v-model="scope.row.level" disabled> </el-rate>
|
|
</div>
|
|
</template>
|
|
</el-table-column>
|
|
<el-table-column label="评价内容" min-width="148" align="left">
|
|
<template slot-scope="scope">
|
|
<div>
|
|
<span class="ellipsis-item">{{scope.row.content}}</span>
|
|
</div>
|
|
</template>
|
|
</el-table-column>
|
|
<el-table-column label="评价图片" min-width="148">
|
|
<template slot-scope="scope">
|
|
<div class="ellipsis-item" v-if="scope.row.images">
|
|
<el-image class="table-image images" v-for="image in scope.row.images.split(',')" :src="image">
|
|
</el-image>
|
|
</div>
|
|
<span v-if="!scope.row.images">-</span>
|
|
</template>
|
|
</el-table-column>
|
|
<el-table-column fixed="right" label="显示状态" min-width="100">
|
|
<template slot-scope="scope">
|
|
<div>
|
|
<span class="shopro-status-dot"
|
|
:class="scope.row.status=='show'?'shopro-status-normal-dot':'shopro-status-default-dot'"></span>
|
|
<span :class="scope.row.status=='show'?'shopro-status-normal':'shopro-status-default'">
|
|
{{scope.row.status_text}}
|
|
</span>
|
|
</div>
|
|
</template>
|
|
</el-table-column>
|
|
<el-table-column label="评论时间" min-width="148">
|
|
<template slot-scope="scope">
|
|
<div>
|
|
{{scope.row.replytime_text || "-"}}
|
|
</div>
|
|
</template>
|
|
</el-table-column>
|
|
<el-table-column fixed="right" label="操作" min-width="120">
|
|
<template slot-scope="scope">
|
|
<span class="shopro-edit-text" @click="editRow(scope.row)">编辑
|
|
</span>
|
|
<span class="shopro-delete-text" @click="deleteRow(scope.row.id)">删除</span>
|
|
</template>
|
|
</el-table-column>
|
|
</el-table>
|
|
<div class="page-container display-flex">
|
|
<div class="display-flex">
|
|
<el-button :disabled="selectedData.length==0" @click="setStatus('show')" type="primary" size="small"
|
|
plain>显示
|
|
</el-button>
|
|
<el-button :disabled="selectedData.length==0" @click="setStatus('hidden')" size="small" plain>
|
|
隐藏
|
|
</el-button>
|
|
<el-button :disabled="selectedData.length==0" @click="batchDelete" type="danger" size="small">删除
|
|
</el-button>
|
|
</div>
|
|
<el-pagination @size-change="handleSizeChange" @current-change="handleCurrentChange"
|
|
:current-page="currentPage" :page-sizes="[10, 20, 30, 40]" :page-size="limit"
|
|
layout="total, sizes, prev, pager, next, jumper" :total="totalPage">
|
|
</el-pagination>
|
|
</div>
|
|
</div>
|
|
</div> |