dev
parent
6113c85c7b
commit
12fe818f6f
@ -0,0 +1,10 @@
|
|||||||
|
import httpService from "@/request"
|
||||||
|
|
||||||
|
// 任务列表
|
||||||
|
export function dynamicList(params) {
|
||||||
|
return httpService({
|
||||||
|
url: `/user/dynamic/list`,
|
||||||
|
method: 'get',
|
||||||
|
params: params,
|
||||||
|
})
|
||||||
|
}
|
||||||
@ -0,0 +1,67 @@
|
|||||||
|
<template>
|
||||||
|
<div class="formbox">
|
||||||
|
<a-form-model ref="ruleForm" :model="form" v-bind="layout">
|
||||||
|
<a-form-model-item
|
||||||
|
v-for="item in formItem"
|
||||||
|
:key="item.prop"
|
||||||
|
:label="item.label"
|
||||||
|
:prop="item.prop"
|
||||||
|
>
|
||||||
|
<a-input v-if="item.type === 'input'" v-model="form[item.prop]" :placeholder="item.placeholder" />
|
||||||
|
<a-select
|
||||||
|
v-model="form[item.prop]"
|
||||||
|
v-else-if="item.type === 'select'"
|
||||||
|
:placeholder="item.placeholder"
|
||||||
|
>
|
||||||
|
<a-select-option
|
||||||
|
v-for="option in item.option"
|
||||||
|
:key="option.id"
|
||||||
|
:value="option.id"
|
||||||
|
>{{ option.name }}</a-select-option
|
||||||
|
>
|
||||||
|
</a-select>
|
||||||
|
</a-form-model-item>
|
||||||
|
<a-form-model-item :wrapper-col="{ span: 12, offset: 2 }">
|
||||||
|
<a-button type="primary" @click="getSearch"> 查询 </a-button>
|
||||||
|
<a-button style="margin-left: 10px" @click="resetForm"> 重置 </a-button>
|
||||||
|
</a-form-model-item>
|
||||||
|
</a-form-model>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
export default {
|
||||||
|
props: {
|
||||||
|
formItem:{
|
||||||
|
type:Array,
|
||||||
|
}
|
||||||
|
},
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
form: {},
|
||||||
|
layout: {
|
||||||
|
labelCol: { span: 2 },
|
||||||
|
wrapperCol: { span: 4 },
|
||||||
|
},
|
||||||
|
};
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
getSearch() {
|
||||||
|
this.$emit('getSearch', this.form)
|
||||||
|
},
|
||||||
|
resetForm() {
|
||||||
|
this.$refs.ruleForm.resetFields();
|
||||||
|
this.$emit('getSearch', this.form)
|
||||||
|
},
|
||||||
|
},
|
||||||
|
};
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style lang="less" scoped>
|
||||||
|
.formbox {
|
||||||
|
text-align: left;
|
||||||
|
background: #f9f9f9;
|
||||||
|
padding-top: 25px;
|
||||||
|
padding-bottom: 1px;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
@ -0,0 +1,88 @@
|
|||||||
|
export const pagination = {
|
||||||
|
current: 1,
|
||||||
|
total: 0,
|
||||||
|
pageSize: 10,
|
||||||
|
showTotal: (total) => `共 ${total} 条`,
|
||||||
|
showSizeChanger: true,
|
||||||
|
showQuickJumper: true,
|
||||||
|
}
|
||||||
|
export const columns = [
|
||||||
|
{
|
||||||
|
title: "内容",
|
||||||
|
width: "12%",
|
||||||
|
dataIndex: "content",
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: "是否可以评论",
|
||||||
|
width: "8%",
|
||||||
|
dataIndex: "isComment",
|
||||||
|
customRender: function (isComment) {
|
||||||
|
switch (isComment) {
|
||||||
|
case 1:
|
||||||
|
return '是'
|
||||||
|
case 0:
|
||||||
|
return '否'
|
||||||
|
}
|
||||||
|
}
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: "是否公开",
|
||||||
|
width: "4%",
|
||||||
|
dataIndex: "isPublic",
|
||||||
|
customRender: function (isPublic) {
|
||||||
|
switch (isPublic) {
|
||||||
|
case 1:
|
||||||
|
return '是'
|
||||||
|
case 0:
|
||||||
|
return '否'
|
||||||
|
}
|
||||||
|
}
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: "发布人名称",
|
||||||
|
width: "12%",
|
||||||
|
dataIndex: "createName",
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: "发布时间",
|
||||||
|
width: "12%",
|
||||||
|
dataIndex: "createDate",
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: "点赞数量",
|
||||||
|
width: "12%",
|
||||||
|
dataIndex: "likes",
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: "浏览量",
|
||||||
|
width: "12%",
|
||||||
|
dataIndex: "views",
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: "是否删除",
|
||||||
|
width: "4%",
|
||||||
|
dataIndex: "isDelete",
|
||||||
|
customRender: function (isDelete) {
|
||||||
|
switch (isDelete) {
|
||||||
|
case 1:
|
||||||
|
return '否'
|
||||||
|
case 0:
|
||||||
|
return '是'
|
||||||
|
}
|
||||||
|
}
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: "操作",
|
||||||
|
dataIndex: "action",
|
||||||
|
key: "action",
|
||||||
|
width: "200",
|
||||||
|
fixed: "right",
|
||||||
|
scopedSlots: { customRender: "action" },
|
||||||
|
},
|
||||||
|
]
|
||||||
|
export const options = {
|
||||||
|
isTrue: [
|
||||||
|
{ id:1,name:'是'},
|
||||||
|
{ id:0,name:'否'},
|
||||||
|
]
|
||||||
|
}
|
||||||
@ -0,0 +1,185 @@
|
|||||||
|
<template>
|
||||||
|
<div>
|
||||||
|
<div class="cardTitle">社区动态</div>
|
||||||
|
<a-divider></a-divider>
|
||||||
|
<div class="formbox">
|
||||||
|
<a-form-model ref="ruleForm" :model="searchForm" v-bind="layout">
|
||||||
|
<a-form-model-item label="内容" prop="content">
|
||||||
|
<a-input v-model="searchForm.content" />
|
||||||
|
</a-form-model-item>
|
||||||
|
<a-form-model-item label="是否公开" prop="isPublic">
|
||||||
|
<a-select v-model="searchForm.isPublic">
|
||||||
|
<a-select-option
|
||||||
|
v-for="item in options.isTrue"
|
||||||
|
:key="item.id"
|
||||||
|
:value="item.id"
|
||||||
|
>{{ item.name }}</a-select-option
|
||||||
|
>
|
||||||
|
</a-select>
|
||||||
|
</a-form-model-item>
|
||||||
|
<a-form-model-item label="是否可以评论" prop="isComment">
|
||||||
|
<a-select v-model="searchForm.isComment">
|
||||||
|
<a-select-option
|
||||||
|
v-for="item in options.isTrue"
|
||||||
|
:key="item.id"
|
||||||
|
:value="item.id"
|
||||||
|
>{{ item.name }}</a-select-option
|
||||||
|
>
|
||||||
|
</a-select>
|
||||||
|
</a-form-model-item>
|
||||||
|
<a-form-model-item :wrapper-col="{ span: 12, offset: 2 }">
|
||||||
|
<a-button type="primary" @click="getData()"> 查询 </a-button>
|
||||||
|
<a-button style="margin-left: 10px" @click="reset"> 重置 </a-button>
|
||||||
|
</a-form-model-item>
|
||||||
|
</a-form-model>
|
||||||
|
</div>
|
||||||
|
<div class="main">
|
||||||
|
<!-- 表格 -->
|
||||||
|
<a-table
|
||||||
|
:columns="columns"
|
||||||
|
:data-source="tableData"
|
||||||
|
:pagination="pagination"
|
||||||
|
:scroll="{ x: 1800 }"
|
||||||
|
@change="handleTableChange"
|
||||||
|
:row-selection="{
|
||||||
|
selectedRowKeys: selectedRowKeys,
|
||||||
|
onChange: selectionChoosed,
|
||||||
|
}"
|
||||||
|
:row-key="
|
||||||
|
(record, index) => {
|
||||||
|
return index;
|
||||||
|
}
|
||||||
|
"
|
||||||
|
>
|
||||||
|
<span slot="action" slot-scope="text, row">
|
||||||
|
<a-space>
|
||||||
|
<a
|
||||||
|
class="ant-dropdown-link"
|
||||||
|
@click="detail(row)"
|
||||||
|
>详情</a
|
||||||
|
>
|
||||||
|
<a
|
||||||
|
class="ant-dropdown-link"
|
||||||
|
@click="detail(row)"
|
||||||
|
>删除</a
|
||||||
|
>
|
||||||
|
<a
|
||||||
|
class="ant-dropdown-link"
|
||||||
|
@click="detail(row)"
|
||||||
|
>恢复</a
|
||||||
|
>
|
||||||
|
</a-space>
|
||||||
|
</span>
|
||||||
|
</a-table>
|
||||||
|
<div style="margin-bottom: 16px" class="action">
|
||||||
|
<!-- 批量操作 -->
|
||||||
|
<a-select
|
||||||
|
type="primary"
|
||||||
|
v-model="activeAction"
|
||||||
|
:disabled="!hasSelected"
|
||||||
|
:loading="loading"
|
||||||
|
style="width: 120px"
|
||||||
|
@change="Actions"
|
||||||
|
placeholder="请选择操作"
|
||||||
|
>
|
||||||
|
批量
|
||||||
|
<a-select-option v-for="item in ActionsList" :key="item.value">
|
||||||
|
{{ item.label }}
|
||||||
|
</a-select-option>
|
||||||
|
</a-select>
|
||||||
|
<span style="margin-left: 8px">
|
||||||
|
<template v-if="hasSelected">
|
||||||
|
{{ `已选择 ${selectedRowKeys.length} 条` }}
|
||||||
|
</template>
|
||||||
|
</span>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
import { pagination, columns, options } from "./depend/config";
|
||||||
|
import { dynamicList } from "@/api/operation/dynamic";
|
||||||
|
export default {
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
tableData: [],
|
||||||
|
pagination,
|
||||||
|
options,
|
||||||
|
columns,
|
||||||
|
activeAction: undefined,
|
||||||
|
loading: false,
|
||||||
|
// 选择的index
|
||||||
|
selectedRowKeys: [],
|
||||||
|
tableChoosed: [],
|
||||||
|
ActionsList: [],
|
||||||
|
layout: {
|
||||||
|
labelCol: { span: 2 },
|
||||||
|
wrapperCol: { span: 4 },
|
||||||
|
},
|
||||||
|
searchForm: {
|
||||||
|
content: "",
|
||||||
|
isPublic: undefined,
|
||||||
|
isComment: undefined,
|
||||||
|
},
|
||||||
|
};
|
||||||
|
},
|
||||||
|
mounted() {
|
||||||
|
this.getData();
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
async getData() {
|
||||||
|
let res = await dynamicList({
|
||||||
|
content: this.searchForm.content,
|
||||||
|
isPublic: this.searchForm.isPublic,
|
||||||
|
isComment: this.searchForm.isComment,
|
||||||
|
pageNum: this.pagination.current,
|
||||||
|
size: this.pagination.pageSize,
|
||||||
|
});
|
||||||
|
this.tableData = res.data.rows;
|
||||||
|
this.pagination.total = res.data.total;
|
||||||
|
},
|
||||||
|
reset() {
|
||||||
|
this.searchForm = {
|
||||||
|
content: "",
|
||||||
|
isPublic: undefined,
|
||||||
|
isComment: undefined,
|
||||||
|
}
|
||||||
|
this.getData()
|
||||||
|
},
|
||||||
|
Actions(data) {
|
||||||
|
console.log(data);
|
||||||
|
this.activeAction = undefined;
|
||||||
|
},
|
||||||
|
selectionChoosed(data) {
|
||||||
|
console.log(data);
|
||||||
|
this.tableChoosed = data;
|
||||||
|
},
|
||||||
|
handleTableChange(pagination) {
|
||||||
|
console.log(pagination);
|
||||||
|
const pager = { ...this.pagination };
|
||||||
|
pager.current = pagination.current;
|
||||||
|
pager.pageSize = pagination.pageSize;
|
||||||
|
this.pagination = pager;
|
||||||
|
this.getData();
|
||||||
|
},
|
||||||
|
},
|
||||||
|
computed: {
|
||||||
|
hasSelected() {
|
||||||
|
return this.selectedRowKeys.length > 0;
|
||||||
|
},
|
||||||
|
},
|
||||||
|
};
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style lang="less" scoped>
|
||||||
|
.action {
|
||||||
|
margin-top: -50px;
|
||||||
|
}
|
||||||
|
.formbox {
|
||||||
|
text-align: left;
|
||||||
|
background: #f9f9f9;
|
||||||
|
padding-top: 25px;
|
||||||
|
padding-bottom: 1px;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
@ -0,0 +1,13 @@
|
|||||||
|
<template>
|
||||||
|
<router-view></router-view>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
export default {
|
||||||
|
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style>
|
||||||
|
|
||||||
|
</style>
|
||||||
Loading…
Reference in new issue