You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
178 lines
4.4 KiB
178 lines
4.4 KiB
<template>
|
|
<el-card class="box-card" shadow="hover" id="todo-card">
|
|
<div slot="header">
|
|
<span style="border-left: 3px solid #338de3ff; padding-left: 6px"
|
|
>待办事项</span
|
|
>
|
|
<i class="el-icon-more" style="float: right; font-size: 20px"></i>
|
|
</div>
|
|
|
|
<div>
|
|
<Table :height="tableHeight" :loading="loading" size="small" :data="/^\/system/.test(this.$route.path) ? example : list" :columns="table"></Table>
|
|
|
|
<div ref="todo-page" style="display: flex; justify-content: center; margin: 10px 0">
|
|
<Page :total="/^\/system/.test(this.$route.path) ? example.length : total"
|
|
size="small"
|
|
show-elevator
|
|
show-total
|
|
@on-change="e => {
|
|
select.page = e;
|
|
getNotices();
|
|
}"/>
|
|
</div>
|
|
</div>
|
|
</el-card>
|
|
</template>
|
|
|
|
<script>
|
|
import { getNotice, readNotice } from '@/api/dashboard/notice'
|
|
import ElementResize from 'element-resize-detector'
|
|
|
|
export default {
|
|
name: "card2",
|
|
layout: {
|
|
x: 4,
|
|
y: 0,
|
|
w: 6,
|
|
h: 4,
|
|
i: "2",
|
|
name: "待办事项",
|
|
},
|
|
data() {
|
|
return {
|
|
example:[
|
|
{
|
|
type: 1,
|
|
content: "示例1",
|
|
created_at:this.$moment().format("YYYY-MM-DD HH:mm:ss"),
|
|
read_count: true
|
|
},
|
|
{
|
|
type: 2,
|
|
content: "示例2",
|
|
created_at:this.$moment().format("YYYY-MM-DD HH:mm:ss"),
|
|
read_count: false
|
|
}
|
|
],
|
|
select:{
|
|
page: 1,
|
|
page_size: 10
|
|
},
|
|
tableHeight: 120,
|
|
loading: false,
|
|
list: [],
|
|
total: 0,
|
|
table: [
|
|
{
|
|
type: "index",
|
|
title: "序号",
|
|
align: "center",
|
|
width: 64
|
|
},
|
|
{
|
|
title: "类型",
|
|
align: "center",
|
|
width: 100,
|
|
render: (h, { row }) => {
|
|
return h("span", {}, row.type === 1 ? "合同流程" : "付款计划");
|
|
},
|
|
},
|
|
{
|
|
title: "内容",
|
|
key: "content",
|
|
align: "left",
|
|
ellipsis: true,
|
|
tooltip: true,
|
|
minWidth: 120
|
|
},
|
|
{
|
|
title: "下发时间",
|
|
key: "created_at",
|
|
width: 180,
|
|
align: "center"
|
|
},
|
|
{
|
|
title: "状态",
|
|
key: "read_count",
|
|
width: 120,
|
|
render: (h, { row }) => {
|
|
return row.read_count
|
|
? h(
|
|
"el-link",
|
|
{
|
|
props: {
|
|
type: "success",
|
|
underline: false,
|
|
},
|
|
},
|
|
"已读"
|
|
)
|
|
: h(
|
|
"Button",
|
|
{
|
|
props: {
|
|
type: "error",
|
|
size: "small",
|
|
ghost: true
|
|
},
|
|
on: {
|
|
['click']:e => {
|
|
if(/^\/system/.test(this.$route.path)) return
|
|
|
|
readNotice({
|
|
id: row.id
|
|
}).then(res => {
|
|
this.$message({
|
|
type: 'success',
|
|
message: '已读'
|
|
})
|
|
this.getNotices()
|
|
})
|
|
}
|
|
}
|
|
},
|
|
"未读"
|
|
);
|
|
},
|
|
},
|
|
],
|
|
};
|
|
},
|
|
methods: {
|
|
async getNotices() {
|
|
if(/^\/system/.test(this.$route.path)) return
|
|
try{
|
|
this.loading = true
|
|
const res = await getNotice(this.select,true);
|
|
this.list = res.data;
|
|
this.total = res.total;
|
|
this.loading = false
|
|
}catch (e) {
|
|
this.loading = false
|
|
}
|
|
},
|
|
|
|
init() {
|
|
let cardDom = document.getElementById('todo-card');
|
|
let cardTitleH = 58;
|
|
let page = this.$refs['todo-page']
|
|
const elementResize = ElementResize({
|
|
strategy:'scroll'
|
|
})
|
|
elementResize.listenTo(cardDom,ele => {
|
|
this.tableHeight = cardDom.getBoundingClientRect().height - 40 - cardTitleH - page.getBoundingClientRect().height
|
|
})
|
|
}
|
|
},
|
|
computed: {},
|
|
created() {
|
|
this.getNotices();
|
|
},
|
|
mounted() {
|
|
this.init();
|
|
}
|
|
};
|
|
</script>
|
|
|
|
<style scoped lang="scss"></style>
|