|
|
|
@@ -1,27 +1,27 @@
|
|
|
|
|
<template>
|
|
|
|
|
<div class="app-container">
|
|
|
|
|
<div class="filter-container">
|
|
|
|
|
<el-input v-model="listQuery.title" :placeholder="$t('table.title')" style="width: 200px;" class="filter-item" @keyup.enter.native="handleFilter" />
|
|
|
|
|
<el-select v-model="listQuery.importance" :placeholder="$t('table.importance')" clearable style="width: 90px" class="filter-item">
|
|
|
|
|
<el-input v-model="listQuery.title" placeholder="Title" style="width: 200px;" class="filter-item" @keyup.enter.native="handleFilter" />
|
|
|
|
|
<el-select v-model="listQuery.importance" placeholder="Imp" clearable style="width: 90px" class="filter-item">
|
|
|
|
|
<el-option v-for="item in importanceOptions" :key="item" :label="item" :value="item" />
|
|
|
|
|
</el-select>
|
|
|
|
|
<el-select v-model="listQuery.type" :placeholder="$t('table.type')" clearable class="filter-item" style="width: 130px">
|
|
|
|
|
<el-select v-model="listQuery.type" placeholder="Type" clearable class="filter-item" style="width: 130px">
|
|
|
|
|
<el-option v-for="item in calendarTypeOptions" :key="item.key" :label="item.display_name+'('+item.key+')'" :value="item.key" />
|
|
|
|
|
</el-select>
|
|
|
|
|
<el-select v-model="listQuery.sort" style="width: 140px" class="filter-item" @change="handleFilter">
|
|
|
|
|
<el-option v-for="item in sortOptions" :key="item.key" :label="item.label" :value="item.key" />
|
|
|
|
|
</el-select>
|
|
|
|
|
<el-button v-waves class="filter-item" type="primary" icon="el-icon-search" @click="handleFilter">
|
|
|
|
|
{{ $t('table.search') }}
|
|
|
|
|
Search
|
|
|
|
|
</el-button>
|
|
|
|
|
<el-button class="filter-item" style="margin-left: 10px;" type="primary" icon="el-icon-edit" @click="handleCreate">
|
|
|
|
|
{{ $t('table.add') }}
|
|
|
|
|
Add
|
|
|
|
|
</el-button>
|
|
|
|
|
<el-button v-waves :loading="downloadLoading" class="filter-item" type="primary" icon="el-icon-download" @click="handleDownload">
|
|
|
|
|
{{ $t('table.export') }}
|
|
|
|
|
Export
|
|
|
|
|
</el-button>
|
|
|
|
|
<el-checkbox v-model="showReviewer" class="filter-item" style="margin-left:15px;" @change="tableKey=tableKey+1">
|
|
|
|
|
{{ $t('table.reviewer') }}
|
|
|
|
|
reviewer
|
|
|
|
|
</el-checkbox>
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
@@ -35,63 +35,63 @@
|
|
|
|
|
style="width: 100%;"
|
|
|
|
|
@sort-change="sortChange"
|
|
|
|
|
>
|
|
|
|
|
<el-table-column :label="$t('table.id')" prop="id" sortable="custom" align="center" width="80">
|
|
|
|
|
<el-table-column label="ID" prop="id" sortable="custom" align="center" width="80">
|
|
|
|
|
<template slot-scope="scope">
|
|
|
|
|
<span>{{ scope.row.id }}</span>
|
|
|
|
|
</template>
|
|
|
|
|
</el-table-column>
|
|
|
|
|
<el-table-column :label="$t('table.date')" width="150px" align="center">
|
|
|
|
|
<el-table-column label="Date" width="150px" align="center">
|
|
|
|
|
<template slot-scope="scope">
|
|
|
|
|
<span>{{ scope.row.timestamp | parseTime('{y}-{m}-{d} {h}:{i}') }}</span>
|
|
|
|
|
</template>
|
|
|
|
|
</el-table-column>
|
|
|
|
|
<el-table-column :label="$t('table.title')" min-width="150px">
|
|
|
|
|
<el-table-column label="Title" min-width="150px">
|
|
|
|
|
<template slot-scope="{row}">
|
|
|
|
|
<span class="link-type" @click="handleUpdate(row)">{{ row.title }}</span>
|
|
|
|
|
<el-tag>{{ row.type | typeFilter }}</el-tag>
|
|
|
|
|
</template>
|
|
|
|
|
</el-table-column>
|
|
|
|
|
<el-table-column :label="$t('table.author')" width="110px" align="center">
|
|
|
|
|
<el-table-column label="Author" width="110px" align="center">
|
|
|
|
|
<template slot-scope="scope">
|
|
|
|
|
<span>{{ scope.row.author }}</span>
|
|
|
|
|
</template>
|
|
|
|
|
</el-table-column>
|
|
|
|
|
<el-table-column v-if="showReviewer" :label="$t('table.reviewer')" width="110px" align="center">
|
|
|
|
|
<el-table-column v-if="showReviewer" label="Reviewer" width="110px" align="center">
|
|
|
|
|
<template slot-scope="scope">
|
|
|
|
|
<span style="color:red;">{{ scope.row.reviewer }}</span>
|
|
|
|
|
</template>
|
|
|
|
|
</el-table-column>
|
|
|
|
|
<el-table-column :label="$t('table.importance')" width="80px">
|
|
|
|
|
<el-table-column label="Imp" width="80px">
|
|
|
|
|
<template slot-scope="scope">
|
|
|
|
|
<svg-icon v-for="n in +scope.row.importance" :key="n" icon-class="star" class="meta-item__icon" />
|
|
|
|
|
</template>
|
|
|
|
|
</el-table-column>
|
|
|
|
|
<el-table-column :label="$t('table.readings')" align="center" width="95">
|
|
|
|
|
<el-table-column label="Readings" align="center" width="95">
|
|
|
|
|
<template slot-scope="{row}">
|
|
|
|
|
<span v-if="row.pageviews" class="link-type" @click="handleFetchPv(row.pageviews)">{{ row.pageviews }}</span>
|
|
|
|
|
<span v-else>0</span>
|
|
|
|
|
</template>
|
|
|
|
|
</el-table-column>
|
|
|
|
|
<el-table-column :label="$t('table.status')" class-name="status-col" width="100">
|
|
|
|
|
<el-table-column label="Status" class-name="status-col" width="100">
|
|
|
|
|
<template slot-scope="{row}">
|
|
|
|
|
<el-tag :type="row.status | statusFilter">
|
|
|
|
|
{{ row.status }}
|
|
|
|
|
</el-tag>
|
|
|
|
|
</template>
|
|
|
|
|
</el-table-column>
|
|
|
|
|
<el-table-column :label="$t('table.actions')" align="center" width="230" class-name="small-padding fixed-width">
|
|
|
|
|
<el-table-column label="Actions" align="center" width="230" class-name="small-padding fixed-width">
|
|
|
|
|
<template slot-scope="{row}">
|
|
|
|
|
<el-button type="primary" size="mini" @click="handleUpdate(row)">
|
|
|
|
|
{{ $t('table.edit') }}
|
|
|
|
|
Edit
|
|
|
|
|
</el-button>
|
|
|
|
|
<el-button v-if="row.status!='published'" size="mini" type="success" @click="handleModifyStatus(row,'published')">
|
|
|
|
|
{{ $t('table.publish') }}
|
|
|
|
|
Publish
|
|
|
|
|
</el-button>
|
|
|
|
|
<el-button v-if="row.status!='draft'" size="mini" @click="handleModifyStatus(row,'draft')">
|
|
|
|
|
{{ $t('table.draft') }}
|
|
|
|
|
Draft
|
|
|
|
|
</el-button>
|
|
|
|
|
<el-button v-if="row.status!='deleted'" size="mini" type="danger" @click="handleModifyStatus(row,'deleted')">
|
|
|
|
|
{{ $t('table.delete') }}
|
|
|
|
|
Delete
|
|
|
|
|
</el-button>
|
|
|
|
|
</template>
|
|
|
|
|
</el-table-column>
|
|
|
|
@@ -101,35 +101,35 @@
|
|
|
|
|
|
|
|
|
|
<el-dialog :title="textMap[dialogStatus]" :visible.sync="dialogFormVisible">
|
|
|
|
|
<el-form ref="dataForm" :rules="rules" :model="temp" label-position="left" label-width="70px" style="width: 400px; margin-left:50px;">
|
|
|
|
|
<el-form-item :label="$t('table.type')" prop="type">
|
|
|
|
|
<el-form-item label="Type" prop="type">
|
|
|
|
|
<el-select v-model="temp.type" class="filter-item" placeholder="Please select">
|
|
|
|
|
<el-option v-for="item in calendarTypeOptions" :key="item.key" :label="item.display_name" :value="item.key" />
|
|
|
|
|
</el-select>
|
|
|
|
|
</el-form-item>
|
|
|
|
|
<el-form-item :label="$t('table.date')" prop="timestamp">
|
|
|
|
|
<el-form-item label="Date" prop="timestamp">
|
|
|
|
|
<el-date-picker v-model="temp.timestamp" type="datetime" placeholder="Please pick a date" />
|
|
|
|
|
</el-form-item>
|
|
|
|
|
<el-form-item :label="$t('table.title')" prop="title">
|
|
|
|
|
<el-form-item label="Title" prop="title">
|
|
|
|
|
<el-input v-model="temp.title" />
|
|
|
|
|
</el-form-item>
|
|
|
|
|
<el-form-item :label="$t('table.status')">
|
|
|
|
|
<el-form-item label="Status">
|
|
|
|
|
<el-select v-model="temp.status" class="filter-item" placeholder="Please select">
|
|
|
|
|
<el-option v-for="item in statusOptions" :key="item" :label="item" :value="item" />
|
|
|
|
|
</el-select>
|
|
|
|
|
</el-form-item>
|
|
|
|
|
<el-form-item :label="$t('table.importance')">
|
|
|
|
|
<el-form-item label="Imp">
|
|
|
|
|
<el-rate v-model="temp.importance" :colors="['#99A9BF', '#F7BA2A', '#FF9900']" :max="3" style="margin-top:8px;" />
|
|
|
|
|
</el-form-item>
|
|
|
|
|
<el-form-item :label="$t('table.remark')">
|
|
|
|
|
<el-form-item label="Remark">
|
|
|
|
|
<el-input v-model="temp.remark" :autosize="{ minRows: 2, maxRows: 4}" type="textarea" placeholder="Please input" />
|
|
|
|
|
</el-form-item>
|
|
|
|
|
</el-form>
|
|
|
|
|
<div slot="footer" class="dialog-footer">
|
|
|
|
|
<el-button @click="dialogFormVisible = false">
|
|
|
|
|
{{ $t('table.cancel') }}
|
|
|
|
|
Cancel
|
|
|
|
|
</el-button>
|
|
|
|
|
<el-button type="primary" @click="dialogStatus==='create'?createData():updateData()">
|
|
|
|
|
{{ $t('table.confirm') }}
|
|
|
|
|
Confirm
|
|
|
|
|
</el-button>
|
|
|
|
|
</div>
|
|
|
|
|
</el-dialog>
|
|
|
|
@@ -140,7 +140,7 @@
|
|
|
|
|
<el-table-column prop="pv" label="Pv" />
|
|
|
|
|
</el-table>
|
|
|
|
|
<span slot="footer" class="dialog-footer">
|
|
|
|
|
<el-button type="primary" @click="dialogPvVisible = false">{{ $t('table.confirm') }}</el-button>
|
|
|
|
|
<el-button type="primary" @click="dialogPvVisible = false">Confirm</el-button>
|
|
|
|
|
</span>
|
|
|
|
|
</el-dialog>
|
|
|
|
|
</div>
|
|
|
|
@@ -248,7 +248,7 @@ export default {
|
|
|
|
|
},
|
|
|
|
|
handleModifyStatus(row, status) {
|
|
|
|
|
this.$message({
|
|
|
|
|
message: '操作成功',
|
|
|
|
|
message: '操作Success',
|
|
|
|
|
type: 'success'
|
|
|
|
|
})
|
|
|
|
|
row.status = status
|
|
|
|
@@ -295,8 +295,8 @@ export default {
|
|
|
|
|
this.list.unshift(this.temp)
|
|
|
|
|
this.dialogFormVisible = false
|
|
|
|
|
this.$notify({
|
|
|
|
|
title: '成功',
|
|
|
|
|
message: '创建成功',
|
|
|
|
|
title: 'Success',
|
|
|
|
|
message: 'Created Successfully',
|
|
|
|
|
type: 'success',
|
|
|
|
|
duration: 2000
|
|
|
|
|
})
|
|
|
|
@@ -328,8 +328,8 @@ export default {
|
|
|
|
|
}
|
|
|
|
|
this.dialogFormVisible = false
|
|
|
|
|
this.$notify({
|
|
|
|
|
title: '成功',
|
|
|
|
|
message: '更新成功',
|
|
|
|
|
title: 'Success',
|
|
|
|
|
message: 'Update Successfully',
|
|
|
|
|
type: 'success',
|
|
|
|
|
duration: 2000
|
|
|
|
|
})
|
|
|
|
@@ -339,8 +339,8 @@ export default {
|
|
|
|
|
},
|
|
|
|
|
handleDelete(row) {
|
|
|
|
|
this.$notify({
|
|
|
|
|
title: '成功',
|
|
|
|
|
message: '删除成功',
|
|
|
|
|
title: 'Success',
|
|
|
|
|
message: 'Delete Successfully',
|
|
|
|
|
type: 'success',
|
|
|
|
|
duration: 2000
|
|
|
|
|
})
|
|
|
|
|