全局代码格式 优化
This commit is contained in:
@@ -120,141 +120,141 @@
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import Tinymce from 'components/Tinymce'
|
||||
import Upload from 'components/Upload/singleImage3'
|
||||
import MDinput from 'components/MDinput';
|
||||
import { validateURL } from 'utils/validate';
|
||||
import { getArticle } from 'api/article';
|
||||
import { userSearch } from 'api/remoteSearch';
|
||||
import Tinymce from 'components/Tinymce'
|
||||
import Upload from 'components/Upload/singleImage3'
|
||||
import MDinput from 'components/MDinput';
|
||||
import { validateURL } from 'utils/validate';
|
||||
import { getArticle } from 'api/article';
|
||||
import { userSearch } from 'api/remoteSearch';
|
||||
|
||||
export default {
|
||||
name: 'articleDetail',
|
||||
components: { Tinymce, MDinput, Upload },
|
||||
data() {
|
||||
const validateRequire = (rule, value, callback) => {
|
||||
if (value === '') {
|
||||
export default {
|
||||
name: 'articleDetail',
|
||||
components: { Tinymce, MDinput, Upload },
|
||||
data() {
|
||||
const validateRequire = (rule, value, callback) => {
|
||||
if (value === '') {
|
||||
this.$message({
|
||||
message: rule.field + '为必传项',
|
||||
type: 'error'
|
||||
});
|
||||
callback(null)
|
||||
} else {
|
||||
callback()
|
||||
}
|
||||
};
|
||||
const validateSourceUri = (rule, value, callback) => {
|
||||
if (value) {
|
||||
if (validateURL(value)) {
|
||||
callback()
|
||||
} else {
|
||||
this.$message({
|
||||
message: rule.field + '为必传项',
|
||||
message: '外链url填写不正确',
|
||||
type: 'error'
|
||||
});
|
||||
callback(null)
|
||||
} else {
|
||||
callback()
|
||||
}
|
||||
};
|
||||
const validateSourceUri = (rule, value, callback) => {
|
||||
if (value) {
|
||||
if (validateURL(value)) {
|
||||
callback()
|
||||
} else {
|
||||
this.$message({
|
||||
message: '外链url填写不正确',
|
||||
type: 'error'
|
||||
});
|
||||
callback(null)
|
||||
}
|
||||
} else {
|
||||
callback()
|
||||
}
|
||||
};
|
||||
return {
|
||||
postForm: {
|
||||
title: '', // 文章题目
|
||||
content: '', // 文章内容
|
||||
content_short: '', // 文章摘要
|
||||
source_uri: '', // 文章外链
|
||||
image_uri: '', // 文章图片
|
||||
source_name: '', // 文章外部作者
|
||||
display_time: undefined, // 前台展示时间
|
||||
id: undefined,
|
||||
platforms: ['a-platform']
|
||||
},
|
||||
fetchSuccess: true,
|
||||
loading: false,
|
||||
userLIstOptions: [],
|
||||
platformsOptions: [
|
||||
} else {
|
||||
callback()
|
||||
}
|
||||
};
|
||||
return {
|
||||
postForm: {
|
||||
title: '', // 文章题目
|
||||
content: '', // 文章内容
|
||||
content_short: '', // 文章摘要
|
||||
source_uri: '', // 文章外链
|
||||
image_uri: '', // 文章图片
|
||||
source_name: '', // 文章外部作者
|
||||
display_time: undefined, // 前台展示时间
|
||||
id: undefined,
|
||||
platforms: ['a-platform']
|
||||
},
|
||||
fetchSuccess: true,
|
||||
loading: false,
|
||||
userLIstOptions: [],
|
||||
platformsOptions: [
|
||||
{ key: 'a-platform', name: 'a-platform' },
|
||||
{ key: 'b-platform', name: 'b-platform' },
|
||||
{ key: 'c-platform', name: 'c-platform' }
|
||||
],
|
||||
rules: {
|
||||
image_uri: [{ validator: validateRequire }],
|
||||
title: [{ validator: validateRequire }],
|
||||
content: [{ validator: validateRequire }],
|
||||
source_uri: [{ validator: validateSourceUri, trigger: 'blur' }]
|
||||
}
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
contentShortLength() {
|
||||
return this.postForm.content_short.length
|
||||
},
|
||||
isEdit() {
|
||||
return this.$route.meta.isEdit // 根据meta判断
|
||||
// return this.$route.path.indexOf('edit') !== -1 // 根据路由判断
|
||||
}
|
||||
},
|
||||
created() {
|
||||
if (this.isEdit) {
|
||||
this.fetchData();
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
fetchData() {
|
||||
getArticle().then(response => {
|
||||
this.postForm = response.data;
|
||||
}).catch(err => {
|
||||
this.fetchSuccess = false;
|
||||
console.log(err);
|
||||
});
|
||||
},
|
||||
submitForm() {
|
||||
this.postForm.display_time = parseInt(this.display_time / 1000);
|
||||
console.log(this.postForm)
|
||||
this.$refs.postForm.validate(valid => {
|
||||
if (valid) {
|
||||
this.loading = true;
|
||||
this.$notify({
|
||||
title: '成功',
|
||||
message: '发布文章成功',
|
||||
type: 'success',
|
||||
duration: 2000
|
||||
});
|
||||
this.postForm.status = 'published';
|
||||
this.loading = false;
|
||||
} else {
|
||||
console.log('error submit!!');
|
||||
return false;
|
||||
}
|
||||
});
|
||||
},
|
||||
draftForm() {
|
||||
if (this.postForm.content.length === 0 || this.postForm.title.length === 0) {
|
||||
this.$message({
|
||||
message: '请填写必要的标题和内容',
|
||||
type: 'warning'
|
||||
});
|
||||
return;
|
||||
}
|
||||
this.$message({
|
||||
message: '保存成功',
|
||||
type: 'success',
|
||||
showClose: true,
|
||||
duration: 1000
|
||||
});
|
||||
this.postForm.status = 'draft';
|
||||
},
|
||||
getRemoteUserList(query) {
|
||||
userSearch(query).then(response => {
|
||||
if (!response.data.items) return;
|
||||
console.log(response)
|
||||
this.userLIstOptions = response.data.items.map(v => ({
|
||||
key: v.name
|
||||
}));
|
||||
})
|
||||
],
|
||||
rules: {
|
||||
image_uri: [{ validator: validateRequire }],
|
||||
title: [{ validator: validateRequire }],
|
||||
content: [{ validator: validateRequire }],
|
||||
source_uri: [{ validator: validateSourceUri, trigger: 'blur' }]
|
||||
}
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
contentShortLength() {
|
||||
return this.postForm.content_short.length
|
||||
},
|
||||
isEdit() {
|
||||
return this.$route.meta.isEdit // 根据meta判断
|
||||
// return this.$route.path.indexOf('edit') !== -1 // 根据路由判断
|
||||
}
|
||||
},
|
||||
created() {
|
||||
if (this.isEdit) {
|
||||
this.fetchData();
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
fetchData() {
|
||||
getArticle().then(response => {
|
||||
this.postForm = response.data;
|
||||
}).catch(err => {
|
||||
this.fetchSuccess = false;
|
||||
console.log(err);
|
||||
});
|
||||
},
|
||||
submitForm() {
|
||||
this.postForm.display_time = parseInt(this.display_time / 1000);
|
||||
console.log(this.postForm)
|
||||
this.$refs.postForm.validate(valid => {
|
||||
if (valid) {
|
||||
this.loading = true;
|
||||
this.$notify({
|
||||
title: '成功',
|
||||
message: '发布文章成功',
|
||||
type: 'success',
|
||||
duration: 2000
|
||||
});
|
||||
this.postForm.status = 'published';
|
||||
this.loading = false;
|
||||
} else {
|
||||
console.log('error submit!!');
|
||||
return false;
|
||||
}
|
||||
});
|
||||
},
|
||||
draftForm() {
|
||||
if (this.postForm.content.length === 0 || this.postForm.title.length === 0) {
|
||||
this.$message({
|
||||
message: '请填写必要的标题和内容',
|
||||
type: 'warning'
|
||||
});
|
||||
return;
|
||||
}
|
||||
this.$message({
|
||||
message: '保存成功',
|
||||
type: 'success',
|
||||
showClose: true,
|
||||
duration: 1000
|
||||
});
|
||||
this.postForm.status = 'draft';
|
||||
},
|
||||
getRemoteUserList(query) {
|
||||
userSearch(query).then(response => {
|
||||
if (!response.data.items) return;
|
||||
console.log(response)
|
||||
this.userLIstOptions = response.data.items.map(v => ({
|
||||
key: v.name
|
||||
}));
|
||||
})
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
<style rel="stylesheet/scss" lang="scss" scoped>
|
||||
@import "src/styles/mixin.scss";
|
||||
|
@@ -60,64 +60,64 @@
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { fetchList } from 'api/article_table';
|
||||
import Sortable from 'sortablejs'
|
||||
import { fetchList } from 'api/article_table';
|
||||
import Sortable from 'sortablejs'
|
||||
|
||||
export default {
|
||||
name: 'drag-table_demo',
|
||||
data() {
|
||||
return {
|
||||
list: null,
|
||||
total: null,
|
||||
listLoading: true,
|
||||
listQuery: {
|
||||
page: 1,
|
||||
limit: 10
|
||||
},
|
||||
sortable: null,
|
||||
olderList: [],
|
||||
newList: []
|
||||
}
|
||||
},
|
||||
created() {
|
||||
this.getList();
|
||||
},
|
||||
filters: {
|
||||
statusFilter(status) {
|
||||
const statusMap = {
|
||||
published: 'success',
|
||||
draft: 'gray',
|
||||
deleted: 'danger'
|
||||
};
|
||||
return statusMap[status]
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
getList() {
|
||||
this.listLoading = true;
|
||||
fetchList(this.listQuery).then(response => {
|
||||
this.list = response.data.items;
|
||||
this.total = response.data.total;
|
||||
this.listLoading = false;
|
||||
this.olderList = this.list.map(v => v.id);
|
||||
this.newList = this.olderList.slice();
|
||||
this.$nextTick(() => {
|
||||
this.setSort()
|
||||
})
|
||||
})
|
||||
export default {
|
||||
name: 'drag-table_demo',
|
||||
data() {
|
||||
return {
|
||||
list: null,
|
||||
total: null,
|
||||
listLoading: true,
|
||||
listQuery: {
|
||||
page: 1,
|
||||
limit: 10
|
||||
},
|
||||
setSort() {
|
||||
const el = document.querySelectorAll('.el-table__body-wrapper > table > tbody')[0];
|
||||
this.sortable = Sortable.create(el, {
|
||||
sortable: null,
|
||||
olderList: [],
|
||||
newList: []
|
||||
}
|
||||
},
|
||||
created() {
|
||||
this.getList();
|
||||
},
|
||||
filters: {
|
||||
statusFilter(status) {
|
||||
const statusMap = {
|
||||
published: 'success',
|
||||
draft: 'gray',
|
||||
deleted: 'danger'
|
||||
};
|
||||
return statusMap[status]
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
getList() {
|
||||
this.listLoading = true;
|
||||
fetchList(this.listQuery).then(response => {
|
||||
this.list = response.data.items;
|
||||
this.total = response.data.total;
|
||||
this.listLoading = false;
|
||||
this.olderList = this.list.map(v => v.id);
|
||||
this.newList = this.olderList.slice();
|
||||
this.$nextTick(() => {
|
||||
this.setSort()
|
||||
})
|
||||
})
|
||||
},
|
||||
setSort() {
|
||||
const el = document.querySelectorAll('.el-table__body-wrapper > table > tbody')[0];
|
||||
this.sortable = Sortable.create(el, {
|
||||
// handle: '.drag-handler',
|
||||
onEnd: evt => {
|
||||
const tempIndex = this.newList.splice(evt.oldIndex, 1)[0];
|
||||
this.newList.splice(evt.newIndex, 0, tempIndex);
|
||||
}
|
||||
});
|
||||
}
|
||||
onEnd: evt => {
|
||||
const tempIndex = this.newList.splice(evt.oldIndex, 1)[0];
|
||||
this.newList.splice(evt.newIndex, 0, tempIndex);
|
||||
}
|
||||
});
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style >
|
||||
|
@@ -1,10 +1,10 @@
|
||||
<template>
|
||||
<div class="app-container">
|
||||
<div style='margin:0 0 5px 20px'>固定表头 按照表头顺序排序</div>
|
||||
<fixed-thead/>
|
||||
<fixed-thead></fixed-thead>
|
||||
|
||||
<div style='margin:30px 0 5px 20px'>不固定表头 按照点击顺序排序</div>
|
||||
<unfixed-thead/>
|
||||
<unfixed-thead></unfixed-thead>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
|
@@ -23,7 +23,7 @@
|
||||
|
||||
<el-table-column width="100px" label="重要性">
|
||||
<template scope="scope">
|
||||
<icon-svg v-for="n in +scope.row.importance" icon-class="wujiaoxing" class="meta-item__icon" :key="n" ></icon-svg>
|
||||
<icon-svg v-for="n in +scope.row.importance" icon-class="wujiaoxing" class="meta-item__icon" :key="n"></icon-svg>
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
@@ -52,44 +52,44 @@
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { fetchList } from 'api/article_table';
|
||||
import { fetchList } from 'api/article_table';
|
||||
|
||||
export default {
|
||||
name: 'inline_edit-table_demo',
|
||||
data() {
|
||||
return {
|
||||
list: null,
|
||||
listLoading: true,
|
||||
listQuery: {
|
||||
page: 1,
|
||||
limit: 10
|
||||
}
|
||||
}
|
||||
},
|
||||
created() {
|
||||
this.getList();
|
||||
},
|
||||
filters: {
|
||||
statusFilter(status) {
|
||||
const statusMap = {
|
||||
published: 'success',
|
||||
draft: 'gray',
|
||||
deleted: 'danger'
|
||||
};
|
||||
return statusMap[status]
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
getList() {
|
||||
this.listLoading = true;
|
||||
fetchList(this.listQuery).then(response => {
|
||||
this.list = response.data.items.map(v => {
|
||||
v.edit = false;
|
||||
return v
|
||||
});
|
||||
this.listLoading = false;
|
||||
})
|
||||
export default {
|
||||
name: 'inline_edit-table_demo',
|
||||
data() {
|
||||
return {
|
||||
list: null,
|
||||
listLoading: true,
|
||||
listQuery: {
|
||||
page: 1,
|
||||
limit: 10
|
||||
}
|
||||
}
|
||||
},
|
||||
created() {
|
||||
this.getList();
|
||||
},
|
||||
filters: {
|
||||
statusFilter(status) {
|
||||
const statusMap = {
|
||||
published: 'success',
|
||||
draft: 'gray',
|
||||
deleted: 'danger'
|
||||
};
|
||||
return statusMap[status]
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
getList() {
|
||||
this.listLoading = true;
|
||||
fetchList(this.listQuery).then(response => {
|
||||
this.list = response.data.items.map(v => {
|
||||
v.edit = false;
|
||||
return v
|
||||
});
|
||||
this.listLoading = false;
|
||||
})
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
@@ -60,7 +60,7 @@
|
||||
|
||||
<el-table-column width="80px" label="重要性">
|
||||
<template scope="scope">
|
||||
<icon-svg v-for="n in +scope.row.importance" icon-class="wujiaoxing" class="meta-item__icon" :key="n" ></icon-svg>
|
||||
<icon-svg v-for="n in +scope.row.importance" icon-class="wujiaoxing" class="meta-item__icon" :key="n"></icon-svg>
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
@@ -150,199 +150,199 @@
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { fetchList, fetchPv } from 'api/article_table';
|
||||
import { parseTime } from 'utils';
|
||||
import { fetchList, fetchPv } from 'api/article_table';
|
||||
import { parseTime } from 'utils';
|
||||
|
||||
const calendarTypeOptions = [
|
||||
const calendarTypeOptions = [
|
||||
{ key: 'CN', display_name: '中国' },
|
||||
{ key: 'US', display_name: '美国' },
|
||||
{ key: 'JP', display_name: '日本' },
|
||||
{ key: 'EU', display_name: '欧元区' }
|
||||
];
|
||||
];
|
||||
|
||||
// arr to obj
|
||||
const calendarTypeKeyValue = calendarTypeOptions.reduce((acc, cur) => {
|
||||
acc[cur.key] = cur.display_name;
|
||||
return acc
|
||||
}, {});
|
||||
// arr to obj
|
||||
const calendarTypeKeyValue = calendarTypeOptions.reduce((acc, cur) => {
|
||||
acc[cur.key] = cur.display_name;
|
||||
return acc
|
||||
}, {});
|
||||
|
||||
export default {
|
||||
name: 'table_demo',
|
||||
data() {
|
||||
return {
|
||||
list: null,
|
||||
total: null,
|
||||
listLoading: true,
|
||||
listQuery: {
|
||||
page: 1,
|
||||
limit: 20,
|
||||
importance: undefined,
|
||||
title: undefined,
|
||||
type: undefined,
|
||||
sort: '+id'
|
||||
},
|
||||
temp: {
|
||||
id: undefined,
|
||||
importance: 0,
|
||||
remark: '',
|
||||
timestamp: 0,
|
||||
title: '',
|
||||
type: '',
|
||||
status: 'published'
|
||||
},
|
||||
importanceOptions: [1, 2, 3],
|
||||
calendarTypeOptions,
|
||||
sortOptions: [{ label: '按ID升序列', key: '+id' }, { label: '按ID降序', key: '-id' }],
|
||||
statusOptions: ['published', 'draft', 'deleted'],
|
||||
dialogFormVisible: false,
|
||||
dialogStatus: '',
|
||||
textMap: {
|
||||
update: '编辑',
|
||||
create: '创建'
|
||||
},
|
||||
dialogPvVisible: false,
|
||||
pvData: [],
|
||||
showAuditor: false,
|
||||
tableKey: 0
|
||||
}
|
||||
export default {
|
||||
name: 'table_demo',
|
||||
data() {
|
||||
return {
|
||||
list: null,
|
||||
total: null,
|
||||
listLoading: true,
|
||||
listQuery: {
|
||||
page: 1,
|
||||
limit: 20,
|
||||
importance: undefined,
|
||||
title: undefined,
|
||||
type: undefined,
|
||||
sort: '+id'
|
||||
},
|
||||
temp: {
|
||||
id: undefined,
|
||||
importance: 0,
|
||||
remark: '',
|
||||
timestamp: 0,
|
||||
title: '',
|
||||
type: '',
|
||||
status: 'published'
|
||||
},
|
||||
importanceOptions: [1, 2, 3],
|
||||
calendarTypeOptions,
|
||||
sortOptions: [{ label: '按ID升序列', key: '+id' }, { label: '按ID降序', key: '-id' }],
|
||||
statusOptions: ['published', 'draft', 'deleted'],
|
||||
dialogFormVisible: false,
|
||||
dialogStatus: '',
|
||||
textMap: {
|
||||
update: '编辑',
|
||||
create: '创建'
|
||||
},
|
||||
dialogPvVisible: false,
|
||||
pvData: [],
|
||||
showAuditor: false,
|
||||
tableKey: 0
|
||||
}
|
||||
},
|
||||
created() {
|
||||
this.getList();
|
||||
},
|
||||
filters: {
|
||||
statusFilter(status) {
|
||||
const statusMap = {
|
||||
published: 'success',
|
||||
draft: 'gray',
|
||||
deleted: 'danger'
|
||||
};
|
||||
return statusMap[status]
|
||||
},
|
||||
created() {
|
||||
typeFilter(type) {
|
||||
return calendarTypeKeyValue[type]
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
getList() {
|
||||
this.listLoading = true;
|
||||
fetchList(this.listQuery).then(response => {
|
||||
this.list = response.data.items;
|
||||
this.total = response.data.total;
|
||||
this.listLoading = false;
|
||||
})
|
||||
},
|
||||
handleFilter() {
|
||||
this.getList();
|
||||
},
|
||||
filters: {
|
||||
statusFilter(status) {
|
||||
const statusMap = {
|
||||
published: 'success',
|
||||
draft: 'gray',
|
||||
deleted: 'danger'
|
||||
};
|
||||
return statusMap[status]
|
||||
},
|
||||
typeFilter(type) {
|
||||
return calendarTypeKeyValue[type]
|
||||
}
|
||||
handleSizeChange(val) {
|
||||
this.listQuery.limit = val;
|
||||
this.getList();
|
||||
},
|
||||
methods: {
|
||||
getList() {
|
||||
this.listLoading = true;
|
||||
fetchList(this.listQuery).then(response => {
|
||||
this.list = response.data.items;
|
||||
this.total = response.data.total;
|
||||
this.listLoading = false;
|
||||
})
|
||||
},
|
||||
handleFilter() {
|
||||
this.getList();
|
||||
},
|
||||
handleSizeChange(val) {
|
||||
this.listQuery.limit = val;
|
||||
this.getList();
|
||||
},
|
||||
handleCurrentChange(val) {
|
||||
this.listQuery.page = val;
|
||||
this.getList();
|
||||
},
|
||||
timeFilter(time) {
|
||||
if (!time[0]) {
|
||||
this.listQuery.start = undefined;
|
||||
this.listQuery.end = undefined;
|
||||
return;
|
||||
}
|
||||
this.listQuery.start = parseInt(+time[0] / 1000);
|
||||
this.listQuery.end = parseInt((+time[1] + 3600 * 1000 * 24) / 1000);
|
||||
},
|
||||
handleModifyStatus(row, status) {
|
||||
this.$message({
|
||||
message: '操作成功',
|
||||
type: 'success'
|
||||
});
|
||||
row.status = status;
|
||||
},
|
||||
handleCreate() {
|
||||
this.resetTemp();
|
||||
this.dialogStatus = 'create';
|
||||
this.dialogFormVisible = true;
|
||||
},
|
||||
handleUpdate(row) {
|
||||
this.temp = Object.assign({}, row);
|
||||
this.dialogStatus = 'update';
|
||||
this.dialogFormVisible = true;
|
||||
},
|
||||
handleDelete(row) {
|
||||
this.$notify({
|
||||
title: '成功',
|
||||
message: '删除成功',
|
||||
type: 'success',
|
||||
duration: 2000
|
||||
});
|
||||
const index = this.list.indexOf(row);
|
||||
this.list.splice(index, 1);
|
||||
},
|
||||
create() {
|
||||
this.temp.id = parseInt(Math.random() * 100) + 1024;
|
||||
this.temp.timestamp = +new Date();
|
||||
this.temp.author = '原创作者';
|
||||
this.list.unshift(this.temp);
|
||||
this.dialogFormVisible = false;
|
||||
this.$notify({
|
||||
title: '成功',
|
||||
message: '创建成功',
|
||||
type: 'success',
|
||||
duration: 2000
|
||||
});
|
||||
},
|
||||
update() {
|
||||
this.temp.timestamp = +this.temp.timestamp;
|
||||
for (const v of this.list) {
|
||||
if (v.id === this.temp.id) {
|
||||
const index = this.list.indexOf(v);
|
||||
this.list.splice(index, 1, this.temp);
|
||||
break;
|
||||
}
|
||||
}
|
||||
this.dialogFormVisible = false;
|
||||
this.$notify({
|
||||
title: '成功',
|
||||
message: '更新成功',
|
||||
type: 'success',
|
||||
duration: 2000
|
||||
});
|
||||
},
|
||||
resetTemp() {
|
||||
this.temp = {
|
||||
id: undefined,
|
||||
importance: 0,
|
||||
remark: '',
|
||||
timestamp: 0,
|
||||
title: '',
|
||||
status: 'published',
|
||||
type: ''
|
||||
};
|
||||
},
|
||||
handleFetchPv(pv) {
|
||||
fetchPv(pv).then(response => {
|
||||
this.pvData = response.data.pvData;
|
||||
this.dialogPvVisible = true;
|
||||
})
|
||||
},
|
||||
handleDownload() {
|
||||
require.ensure([], () => {
|
||||
const { export_json_to_excel } = require('vendor/Export2Excel');
|
||||
const tHeader = ['时间', '地区', '类型', '标题', '重要性'];
|
||||
const filterVal = ['timestamp', 'province', 'type', 'title', 'importance'];
|
||||
const data = this.formatJson(filterVal, this.list);
|
||||
export_json_to_excel(tHeader, data, 'table数据');
|
||||
})
|
||||
},
|
||||
formatJson(filterVal, jsonData) {
|
||||
return jsonData.map(v => filterVal.map(j => {
|
||||
if (j === 'timestamp') {
|
||||
return parseTime(v[j])
|
||||
} else {
|
||||
return v[j]
|
||||
}
|
||||
}))
|
||||
handleCurrentChange(val) {
|
||||
this.listQuery.page = val;
|
||||
this.getList();
|
||||
},
|
||||
timeFilter(time) {
|
||||
if (!time[0]) {
|
||||
this.listQuery.start = undefined;
|
||||
this.listQuery.end = undefined;
|
||||
return;
|
||||
}
|
||||
this.listQuery.start = parseInt(+time[0] / 1000);
|
||||
this.listQuery.end = parseInt((+time[1] + 3600 * 1000 * 24) / 1000);
|
||||
},
|
||||
handleModifyStatus(row, status) {
|
||||
this.$message({
|
||||
message: '操作成功',
|
||||
type: 'success'
|
||||
});
|
||||
row.status = status;
|
||||
},
|
||||
handleCreate() {
|
||||
this.resetTemp();
|
||||
this.dialogStatus = 'create';
|
||||
this.dialogFormVisible = true;
|
||||
},
|
||||
handleUpdate(row) {
|
||||
this.temp = Object.assign({}, row);
|
||||
this.dialogStatus = 'update';
|
||||
this.dialogFormVisible = true;
|
||||
},
|
||||
handleDelete(row) {
|
||||
this.$notify({
|
||||
title: '成功',
|
||||
message: '删除成功',
|
||||
type: 'success',
|
||||
duration: 2000
|
||||
});
|
||||
const index = this.list.indexOf(row);
|
||||
this.list.splice(index, 1);
|
||||
},
|
||||
create() {
|
||||
this.temp.id = parseInt(Math.random() * 100) + 1024;
|
||||
this.temp.timestamp = +new Date();
|
||||
this.temp.author = '原创作者';
|
||||
this.list.unshift(this.temp);
|
||||
this.dialogFormVisible = false;
|
||||
this.$notify({
|
||||
title: '成功',
|
||||
message: '创建成功',
|
||||
type: 'success',
|
||||
duration: 2000
|
||||
});
|
||||
},
|
||||
update() {
|
||||
this.temp.timestamp = +this.temp.timestamp;
|
||||
for (const v of this.list) {
|
||||
if (v.id === this.temp.id) {
|
||||
const index = this.list.indexOf(v);
|
||||
this.list.splice(index, 1, this.temp);
|
||||
break;
|
||||
}
|
||||
}
|
||||
this.dialogFormVisible = false;
|
||||
this.$notify({
|
||||
title: '成功',
|
||||
message: '更新成功',
|
||||
type: 'success',
|
||||
duration: 2000
|
||||
});
|
||||
},
|
||||
resetTemp() {
|
||||
this.temp = {
|
||||
id: undefined,
|
||||
importance: 0,
|
||||
remark: '',
|
||||
timestamp: 0,
|
||||
title: '',
|
||||
status: 'published',
|
||||
type: ''
|
||||
};
|
||||
},
|
||||
handleFetchPv(pv) {
|
||||
fetchPv(pv).then(response => {
|
||||
this.pvData = response.data.pvData;
|
||||
this.dialogPvVisible = true;
|
||||
})
|
||||
},
|
||||
handleDownload() {
|
||||
require.ensure([], () => {
|
||||
const { export_json_to_excel } = require('vendor/Export2Excel');
|
||||
const tHeader = ['时间', '地区', '类型', '标题', '重要性'];
|
||||
const filterVal = ['timestamp', 'province', 'type', 'title', 'importance'];
|
||||
const data = this.formatJson(filterVal, this.list);
|
||||
export_json_to_excel(tHeader, data, 'table数据');
|
||||
})
|
||||
},
|
||||
formatJson(filterVal, jsonData) {
|
||||
return jsonData.map(v => filterVal.map(j => {
|
||||
if (j === 'timestamp') {
|
||||
return parseTime(v[j])
|
||||
} else {
|
||||
return v[j]
|
||||
}
|
||||
}))
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
Reference in New Issue
Block a user