前端:管理后台增加 Banner CRUD 功能
This commit is contained in:
parent
4595db1d4c
commit
23acc40d8d
@ -2,7 +2,8 @@
|
||||
|
||||
export default {
|
||||
'/admin-api/': {
|
||||
target: 'http://180.167.213.26:18083/',
|
||||
// target: 'http://180.167.213.26:18083/',
|
||||
target: 'http://127.0.0.1:18083/',
|
||||
changeOrigin: true,
|
||||
pathRewrite: {},
|
||||
},
|
||||
@ -11,4 +12,9 @@ export default {
|
||||
changeOrigin: true,
|
||||
pathRewrite: {},
|
||||
},
|
||||
'/promotion-api/': {
|
||||
target: 'http://127.0.0.1:18085/',
|
||||
changeOrigin: true,
|
||||
pathRewrite: {},
|
||||
},
|
||||
};
|
||||
|
@ -94,6 +94,29 @@ export default [
|
||||
},
|
||||
],
|
||||
},
|
||||
// promotion
|
||||
{
|
||||
path: '/promotion',
|
||||
name: 'promotion',
|
||||
icon: 'user',
|
||||
routes: [
|
||||
{
|
||||
path: '/promotion/banner-list',
|
||||
name: 'promotion-banner-list',
|
||||
component: './Promotion/BannerList',
|
||||
},
|
||||
// {
|
||||
// path: '/product/product-spu-add',
|
||||
// name: 'product-spu-add',
|
||||
// component: './Product/ProductSpuAddOrUpdate',
|
||||
// },
|
||||
// {
|
||||
// path: '/product/product-category-list',
|
||||
// name: 'product-category-list',
|
||||
// component: './Product/ProductCategoryList',
|
||||
// },
|
||||
],
|
||||
},
|
||||
{
|
||||
path: '/dashboard',
|
||||
name: 'dashboard',
|
||||
|
@ -49,10 +49,10 @@ function getDictionaryTree(req, res) {
|
||||
}
|
||||
|
||||
export default {
|
||||
'GET /admin-api/admins/admin/menu_resource_tree': getAdminMenuAll,
|
||||
'GET /admin-api/admins/admin/url_resource_list': getAdminUrls,
|
||||
'GET /admin-api/admins/resource/tree': getResourceTree,
|
||||
'GET /admin-api/admins/role/page': getQueryRole,
|
||||
// 'GET /admin-api/admins/admin/menu_resource_tree': getAdminMenuAll,
|
||||
// 'GET /admin-api/admins/admin/url_resource_list': getAdminUrls,
|
||||
// 'GET /admin-api/admins/resource/tree': getResourceTree,
|
||||
// 'GET /admin-api/admins/role/page': getQueryRole,
|
||||
// 'GET /admin-api/admins/admin/page': getQueryRole,
|
||||
'GET /admin-api/admins/data_dict/tree': getDictionaryTree,
|
||||
// 'GET /admin-api/admins/data_dict/tree': getDictionaryTree,
|
||||
};
|
||||
|
@ -52,4 +52,6 @@ export default {
|
||||
// 订单
|
||||
'menu.order': '订单管理',
|
||||
'menu.order.order-list': '订单管理',
|
||||
// 营销相关
|
||||
'menu.promotion.promotion-banner-list': 'Banner 管理'
|
||||
};
|
||||
|
256
admin-web/src/models/promotion/bannerList.js
Normal file
256
admin-web/src/models/promotion/bannerList.js
Normal file
@ -0,0 +1,256 @@
|
||||
import {message} from 'antd';
|
||||
import {buildTreeNode, findCheckedKeys} from '../../utils/tree.utils';
|
||||
import {
|
||||
addBanner,
|
||||
adminRoleAssign,
|
||||
deleteBanner,
|
||||
queryBanner,
|
||||
queryBannerRoleList,
|
||||
updateBanner,
|
||||
updateBannerStatus,
|
||||
} from '../../services/promotion';
|
||||
import {arrayToStringParams} from '../../utils/request.qs';
|
||||
import PaginationHelper from '../../../helpers/PaginationHelper';
|
||||
|
||||
const SEARCH_PARAMS_DEFAULT = {
|
||||
title: '',
|
||||
};
|
||||
|
||||
export default {
|
||||
namespace: 'bannerList',
|
||||
|
||||
state: {
|
||||
// 分页列表相关
|
||||
list: [],
|
||||
listLoading: false,
|
||||
pagination: PaginationHelper.defaultPaginationConfig,
|
||||
searchParams: SEARCH_PARAMS_DEFAULT,
|
||||
|
||||
// 添加 or 修改表单相关
|
||||
modalVisible: false,
|
||||
modalType: undefined, // 'add' or 'update' 表单
|
||||
formVals: {}, // 当前表单值
|
||||
modalLoading: false,
|
||||
|
||||
// 分配角色表单相关
|
||||
roleList: [],
|
||||
roleModalVisible: false,
|
||||
roleCheckedKeys: [], // 此处的 Key ,就是角色编号
|
||||
roleAssignLoading: false,
|
||||
},
|
||||
|
||||
effects: {
|
||||
// 查询列表
|
||||
* query({ payload }, { call, put }) {
|
||||
// 显示加载中
|
||||
yield put({
|
||||
type: 'changeListLoading',
|
||||
payload: true,
|
||||
});
|
||||
|
||||
// 请求
|
||||
const response = yield call(queryBanner, payload);
|
||||
// 响应
|
||||
yield put({
|
||||
type: 'setAll',
|
||||
payload: {
|
||||
list: response.data.list,
|
||||
pagination: PaginationHelper.formatPagination(response.data, payload),
|
||||
searchParams: {
|
||||
title: payload.title || ''
|
||||
}
|
||||
},
|
||||
});
|
||||
|
||||
// 隐藏加载中
|
||||
yield put({
|
||||
type: 'changeListLoading',
|
||||
payload: false,
|
||||
});
|
||||
},
|
||||
* add({ payload }, { call, put }) {
|
||||
const { callback, body } = payload;
|
||||
// 显示加载中
|
||||
yield put({
|
||||
type: 'changeModalLoading',
|
||||
payload: true,
|
||||
});
|
||||
|
||||
// 请求
|
||||
const response = yield call(addBanner, body);
|
||||
// 响应
|
||||
if (response.code === 0) {
|
||||
if (callback) {
|
||||
callback(response);
|
||||
}
|
||||
// 刷新列表
|
||||
yield put({
|
||||
type: 'query',
|
||||
payload: {
|
||||
...PaginationHelper.defaultPayload
|
||||
},
|
||||
});
|
||||
}
|
||||
|
||||
// 隐藏加载中
|
||||
yield put({
|
||||
type: 'changeModalLoading',
|
||||
payload: false,
|
||||
});
|
||||
},
|
||||
* update({ payload }, { call, put }) {
|
||||
const { callback, body } = payload;
|
||||
// 显示加载中
|
||||
yield put({
|
||||
type: 'changeModalLoading',
|
||||
payload: true,
|
||||
});
|
||||
|
||||
// 请求
|
||||
const response = yield call(updateBanner, body);
|
||||
// 响应
|
||||
if (response.code === 0) {
|
||||
if (callback) {
|
||||
callback(response);
|
||||
}
|
||||
// 刷新列表
|
||||
yield put({
|
||||
type: 'query',
|
||||
payload: {
|
||||
...PaginationHelper.defaultPayload
|
||||
},
|
||||
});
|
||||
}
|
||||
|
||||
// 隐藏加载中
|
||||
yield put({
|
||||
type: 'changeModalLoading',
|
||||
payload: false,
|
||||
});
|
||||
},
|
||||
|
||||
* updateStatus({ payload }, { call, put }) {
|
||||
// 请求
|
||||
const response = yield call(updateBannerStatus, payload);
|
||||
// 响应
|
||||
if (response.code === 0) {
|
||||
message.info('更新状态成功!');
|
||||
// 刷新列表
|
||||
yield put({
|
||||
type: 'query',
|
||||
payload: {
|
||||
...PaginationHelper.defaultPayload
|
||||
},
|
||||
});
|
||||
}
|
||||
},
|
||||
|
||||
* delete({ payload }, { call, put }) {
|
||||
// 请求
|
||||
const response = yield call(deleteBanner, payload);
|
||||
// 响应
|
||||
if (response.code === 0) {
|
||||
message.info('删除成功!');
|
||||
// 刷新列表
|
||||
yield put({
|
||||
type: 'query',
|
||||
payload: {
|
||||
...PaginationHelper.defaultPayload
|
||||
},
|
||||
});
|
||||
}
|
||||
},
|
||||
|
||||
* queryRoleList({ payload }, { call, put }) {
|
||||
// 显示加载中
|
||||
yield put({
|
||||
type: 'changeRoleAssignLoading',
|
||||
payload: true,
|
||||
});
|
||||
|
||||
// 请求
|
||||
const response = yield call(queryBannerRoleList, payload);
|
||||
// 响应
|
||||
if (response.code === 0) {
|
||||
const roleList = response.data;
|
||||
const roleTreeData = buildTreeNode(roleList, 'name', 'id');
|
||||
const roleCheckedKeys = findCheckedKeys(roleList);
|
||||
yield put({
|
||||
type: 'setAll',
|
||||
payload: {
|
||||
roleList: roleTreeData,
|
||||
roleCheckedKeys,
|
||||
},
|
||||
});
|
||||
}
|
||||
|
||||
// 隐藏加载中
|
||||
yield put({
|
||||
type: 'changeRoleAssignLoading',
|
||||
payload: false,
|
||||
});
|
||||
},
|
||||
|
||||
* roleAssign({ payload }, { call, put }) {
|
||||
const { callback, body } = payload;
|
||||
// 显示加载中
|
||||
yield put({
|
||||
type: 'changeRoleAssignLoading',
|
||||
payload: true,
|
||||
});
|
||||
|
||||
// 请求
|
||||
const response = yield call(adminRoleAssign, {
|
||||
id: body.id,
|
||||
roleIds: arrayToStringParams(body.roleIds),
|
||||
});
|
||||
// 响应
|
||||
if (response.code === 0) {
|
||||
if (callback) {
|
||||
callback(response);
|
||||
}
|
||||
}
|
||||
|
||||
// 隐藏加载中
|
||||
yield put({
|
||||
type: 'changeRoleAssignLoading',
|
||||
payload: false,
|
||||
});
|
||||
},
|
||||
},
|
||||
|
||||
reducers: {
|
||||
changeRoleCheckedKeys(state, { payload }) {
|
||||
return {
|
||||
...state,
|
||||
roleCheckedKeys: payload,
|
||||
};
|
||||
},
|
||||
// 修改加载中的状态
|
||||
changeRoleAssignLoading(state, { payload }) {
|
||||
return {
|
||||
...state,
|
||||
roleAssignLoading: payload,
|
||||
};
|
||||
},
|
||||
changeModalLoading(state, { payload }) {
|
||||
return {
|
||||
...state,
|
||||
modalLoading: payload,
|
||||
};
|
||||
},
|
||||
changeListLoading(state, { payload }) {
|
||||
return {
|
||||
...state,
|
||||
listLoading: payload,
|
||||
};
|
||||
},
|
||||
// 设置所有属性
|
||||
setAll(state, { payload }) {
|
||||
return {
|
||||
...state,
|
||||
...payload,
|
||||
};
|
||||
}
|
||||
},
|
||||
};
|
@ -209,7 +209,6 @@ class ProductCategoryList extends PureComponent {
|
||||
{
|
||||
title: '排序值',
|
||||
dataIndex: 'sort',
|
||||
render: sort => <span>{sort}</span>,
|
||||
},
|
||||
{
|
||||
title: '创建时间',
|
||||
|
416
admin-web/src/pages/Promotion/BannerList.js
Normal file
416
admin-web/src/pages/Promotion/BannerList.js
Normal file
@ -0,0 +1,416 @@
|
||||
/* eslint-disable */
|
||||
|
||||
import React, { PureComponent, Fragment } from 'react';
|
||||
import { connect } from 'dva';
|
||||
import {
|
||||
Card,
|
||||
Form,
|
||||
Input,
|
||||
Button,
|
||||
Modal,
|
||||
message,
|
||||
Table,
|
||||
Divider,
|
||||
Tree,
|
||||
Spin,
|
||||
Row,
|
||||
Col,
|
||||
Select,
|
||||
Icon,
|
||||
InputNumber
|
||||
} from 'antd';
|
||||
import { checkTypeWithEnglishAndNumbers } from '../../../helpers/validator'
|
||||
import PageHeaderWrapper from '@/components/PageHeaderWrapper';
|
||||
|
||||
import styles from './BannerList.less';
|
||||
import moment from "moment";
|
||||
import PaginationHelper from "../../../helpers/PaginationHelper";
|
||||
|
||||
const FormItem = Form.Item;
|
||||
const { TreeNode } = Tree;
|
||||
const status = ['未知', '正常', '禁用'];
|
||||
|
||||
// 列表
|
||||
function List ({ dataSource, loading, pagination, searchParams, dispatch,
|
||||
handleModalVisible}) {
|
||||
|
||||
function handleStatus(record) {
|
||||
Modal.confirm({
|
||||
title: record.status === 1 ? '确认禁用' : '取消禁用',
|
||||
content: `${record.username}`,
|
||||
onOk() {
|
||||
dispatch({
|
||||
type: 'bannerList/updateStatus',
|
||||
payload: {
|
||||
id: record.id,
|
||||
status: record.status === 1 ? 2 : 1,
|
||||
},
|
||||
});
|
||||
},
|
||||
onCancel() {},
|
||||
});
|
||||
}
|
||||
|
||||
function handleDelete(record) {
|
||||
Modal.confirm({
|
||||
title: `确认删除?`,
|
||||
content: `${record.title}`,
|
||||
onOk() {
|
||||
dispatch({
|
||||
type: 'bannerList/delete',
|
||||
payload: {
|
||||
id: record.id,
|
||||
},
|
||||
});
|
||||
},
|
||||
onCancel() {},
|
||||
});
|
||||
}
|
||||
|
||||
const columns = [
|
||||
{
|
||||
title: '标题',
|
||||
dataIndex: 'title'
|
||||
},
|
||||
{
|
||||
title: '跳转链接',
|
||||
dataIndex: 'url',
|
||||
},
|
||||
{
|
||||
title: '图片',
|
||||
dataIndex: 'picUrl',
|
||||
render(val) {
|
||||
return <img width={120} src={val} />;
|
||||
},
|
||||
},
|
||||
{
|
||||
title: '排序值',
|
||||
dataIndex: 'sort',
|
||||
},
|
||||
{
|
||||
title: '状态',
|
||||
dataIndex: 'status',
|
||||
render(val) {
|
||||
return <span>{status[val]}</span>; // TODO 芋艿,此处要改
|
||||
},
|
||||
},
|
||||
{
|
||||
title: '备注',
|
||||
dataIndex: 'memo',
|
||||
},
|
||||
{
|
||||
title: '创建时间',
|
||||
dataIndex: 'createTime',
|
||||
render: val => <span>{moment(val).format('YYYY-MM-DD HH:mm')}</span>,
|
||||
},
|
||||
{
|
||||
title: '操作',
|
||||
width: 360,
|
||||
render: (text, record) => {
|
||||
const statusText = record.status === 1 ? '禁用' : '开启'; // TODO 芋艿,此处要改
|
||||
return (
|
||||
<Fragment>
|
||||
<a onClick={() => handleModalVisible(true, 'update', record)}>编辑</a>
|
||||
<Divider type="vertical" />
|
||||
<a className={styles.tableDelete} onClick={() => handleStatus(record)}>
|
||||
{statusText}
|
||||
</a>
|
||||
{
|
||||
record.status === 2 ?
|
||||
<span>
|
||||
<Divider type="vertical" />
|
||||
<a className={styles.tableDelete} onClick={() => handleDelete(record)}>
|
||||
删除
|
||||
</a>
|
||||
</span> : null
|
||||
}
|
||||
</Fragment>
|
||||
);
|
||||
},
|
||||
},
|
||||
];
|
||||
|
||||
function onPageChange(page) { // 翻页
|
||||
dispatch({
|
||||
type: 'bannerList/query',
|
||||
payload: {
|
||||
pageNo: page.current,
|
||||
pageSize: page.pageSize,
|
||||
...searchParams
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
return (
|
||||
<Table
|
||||
columns={columns}
|
||||
dataSource={dataSource}
|
||||
loading={loading}
|
||||
rowKey="id"
|
||||
pagination={pagination}
|
||||
onChange={onPageChange}
|
||||
/>
|
||||
)
|
||||
}
|
||||
|
||||
// 搜索表单
|
||||
// TODO 芋艿,有没办法换成上面那种写法
|
||||
const SearchForm = Form.create()(props => {
|
||||
const {
|
||||
form,
|
||||
form: { getFieldDecorator },
|
||||
dispatch
|
||||
} = props;
|
||||
|
||||
function search() {
|
||||
dispatch({
|
||||
type: 'bannerList/query',
|
||||
payload: {
|
||||
...PaginationHelper.defaultPayload,
|
||||
...form.getFieldsValue()
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
// 提交搜索
|
||||
function handleSubmit(e) {
|
||||
// 阻止默认事件
|
||||
e.preventDefault();
|
||||
// 提交搜索
|
||||
search();
|
||||
}
|
||||
|
||||
// 重置搜索
|
||||
function handleReset() {
|
||||
// 重置表单
|
||||
form.resetFields();
|
||||
// 执行搜索
|
||||
search();
|
||||
}
|
||||
|
||||
return (
|
||||
<Form onSubmit={handleSubmit} layout="inline">
|
||||
<Row gutter={{ md: 8, lg: 24, xl: 48 }}>
|
||||
<Col md={8} sm={24}>
|
||||
<FormItem label="标题">
|
||||
{getFieldDecorator('title')(<Input placeholder="请输入" />)}
|
||||
</FormItem>
|
||||
</Col>
|
||||
<Col md={8} sm={24}>
|
||||
<span className={styles.submitButtons}>
|
||||
<Button type="primary" htmlType="submit">
|
||||
查询
|
||||
</Button>
|
||||
<Button style={{ marginLeft: 8 }} onClick={handleReset}>
|
||||
重置
|
||||
</Button>
|
||||
</span>
|
||||
</Col>
|
||||
</Row>
|
||||
</Form>
|
||||
);
|
||||
});
|
||||
|
||||
// 添加 or 修改 Form 表单
|
||||
const AddOrUpdateForm = Form.create()(props => {
|
||||
const { dispatch, modalVisible, form, handleModalVisible, modalType, formVals } = props;
|
||||
|
||||
const okHandle = () => {
|
||||
form.validateFields((err, fields) => {
|
||||
if (err) return;
|
||||
// 添加表单
|
||||
if (modalType === 'add') {
|
||||
dispatch({
|
||||
type: 'bannerList/add',
|
||||
payload: {
|
||||
body: {
|
||||
...fields,
|
||||
},
|
||||
callback: () => {
|
||||
// 清空表单
|
||||
form.resetFields();
|
||||
// 提示
|
||||
message.success('添加成功');
|
||||
// 关闭弹窗
|
||||
handleModalVisible();
|
||||
},
|
||||
},
|
||||
});
|
||||
// 修改表单
|
||||
} else {
|
||||
dispatch({
|
||||
type: 'bannerList/update',
|
||||
payload: {
|
||||
body: {
|
||||
id: formVals.id,
|
||||
...fields,
|
||||
},
|
||||
callback: () => {
|
||||
// 清空表单
|
||||
form.resetFields();
|
||||
// 提示
|
||||
message.success('更新成功');
|
||||
// 关闭弹窗
|
||||
handleModalVisible();
|
||||
},
|
||||
},
|
||||
});
|
||||
}
|
||||
});
|
||||
};
|
||||
|
||||
const title = modalType === 'add' ? '新建 Banner' : '更新 Banner';
|
||||
return (
|
||||
<Modal
|
||||
destroyOnClose
|
||||
title={title}
|
||||
visible={modalVisible}
|
||||
onOk={okHandle}
|
||||
okText='保存'
|
||||
onCancel={() => handleModalVisible()}
|
||||
>
|
||||
<FormItem labelCol={{ span: 5 }} wrapperCol={{ span: 15 }} label="标题">
|
||||
{form.getFieldDecorator('title', {
|
||||
rules: [{ required: true, message: '请输入标题!'},
|
||||
{max: 32, min:2, message: '长度为 2-32 位'},
|
||||
],
|
||||
initialValue: formVals.title,
|
||||
})(<Input placeholder="请输入" />)}
|
||||
</FormItem>
|
||||
<FormItem labelCol={{ span: 5 }} wrapperCol={{ span: 15 }} label="跳转链接">
|
||||
{form.getFieldDecorator('url', {
|
||||
rules: [{ required: true, message: '请输入跳转链接!'},
|
||||
{ type: 'url', message: '必须是 URL!'},
|
||||
{max: 255, message: '最大长度为 255 位'},
|
||||
],
|
||||
initialValue: formVals.picUrl,
|
||||
})(<Input placeholder="请输入" />)}
|
||||
</FormItem>
|
||||
<FormItem labelCol={{ span: 5 }} wrapperCol={{ span: 15 }} label="图片">
|
||||
{form.getFieldDecorator('picUrl', {
|
||||
rules: [{ required: true, message: '请输入跳转链接!'},],
|
||||
initialValue: formVals.picUrl,
|
||||
})(<Input placeholder="请输入" />)}
|
||||
</FormItem>
|
||||
<FormItem labelCol={{ span: 5 }} wrapperCol={{ span: 15 }} label="排序值">
|
||||
{form.getFieldDecorator('sort', {
|
||||
rules: [{ required: true, message: '请输入排序值!' }],
|
||||
initialValue: formVals.sort,
|
||||
})(<InputNumber placeholder="请输入" />)}
|
||||
</FormItem>
|
||||
<FormItem labelCol={{ span: 5 }} wrapperCol={{ span: 15 }} label="备注">
|
||||
{form.getFieldDecorator('memo', {
|
||||
rules: [{ required: false, message: '请输入备注!' },
|
||||
{max: 255, message: '最大长度为 255 位'},
|
||||
],
|
||||
initialValue: formVals.memo,
|
||||
})(<Input.TextArea placeholder="请输入" />)}
|
||||
</FormItem>
|
||||
</Modal>
|
||||
);
|
||||
});
|
||||
|
||||
@connect(({ bannerList }) => ({
|
||||
// list: bannerList.list,
|
||||
// pagination: bannerList.pagination,
|
||||
...bannerList,
|
||||
}))
|
||||
|
||||
// 主界面
|
||||
@Form.create()
|
||||
class BannerList extends PureComponent {
|
||||
|
||||
componentDidMount() {
|
||||
const { dispatch } = this.props;
|
||||
dispatch({
|
||||
type: 'bannerList/query',
|
||||
payload: {
|
||||
...PaginationHelper.defaultPayload
|
||||
},
|
||||
});
|
||||
}
|
||||
|
||||
handleModalVisible = (modalVisible, modalType, record) => {
|
||||
const { dispatch } = this.props;
|
||||
dispatch({
|
||||
type: 'bannerList/setAll',
|
||||
payload: {
|
||||
modalVisible,
|
||||
modalType,
|
||||
formVals: record || {}
|
||||
},
|
||||
});
|
||||
};
|
||||
|
||||
handleRoleAssignModalVisible = (roleModalVisible, record) => {
|
||||
const { dispatch } = this.props;
|
||||
dispatch({
|
||||
type: 'bannerList/setAll',
|
||||
payload: {
|
||||
roleModalVisible: roleModalVisible,
|
||||
formVals: record || {}
|
||||
},
|
||||
});
|
||||
};
|
||||
|
||||
render() {
|
||||
// let that = this;
|
||||
const { dispatch,
|
||||
list, listLoading, searchParams, pagination,
|
||||
modalVisible, modalType, formVals,
|
||||
confirmLoading,
|
||||
roleList, roleModalVisible, roleAssignLoading, roleCheckedKeys } = this.props;
|
||||
|
||||
// 列表属性
|
||||
const listProps = {
|
||||
dataSource: list,
|
||||
pagination,
|
||||
searchParams,
|
||||
dispatch,
|
||||
loading: listLoading,
|
||||
confirmLoading,
|
||||
handleModalVisible: this.handleModalVisible, // Function
|
||||
};
|
||||
|
||||
// 搜索表单属性
|
||||
const searchFormProps = {
|
||||
dispatch,
|
||||
};
|
||||
|
||||
// 添加 or 更新表单属性
|
||||
const addOrUpdateFormProps = {
|
||||
modalVisible,
|
||||
modalType,
|
||||
formVals,
|
||||
dispatch,
|
||||
handleModalVisible: this.handleModalVisible, // Function
|
||||
};
|
||||
|
||||
return (
|
||||
<PageHeaderWrapper>
|
||||
<Card bordered={false}>
|
||||
<div className={styles.tableList}>
|
||||
<div className={styles.tableListForm}>
|
||||
<SearchForm {...searchFormProps} />
|
||||
</div>
|
||||
<div className={styles.tableListOperator}>
|
||||
<Button
|
||||
icon="plus"
|
||||
type="primary"
|
||||
onClick={() => this.handleModalVisible(true, 'add', {})}
|
||||
>
|
||||
新建 Banner
|
||||
</Button>
|
||||
</div>
|
||||
</div>
|
||||
<List {...listProps} />
|
||||
</Card>
|
||||
|
||||
<AddOrUpdateForm {...addOrUpdateFormProps} />
|
||||
|
||||
</PageHeaderWrapper>
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
export default BannerList;
|
47
admin-web/src/pages/Promotion/BannerList.less
Normal file
47
admin-web/src/pages/Promotion/BannerList.less
Normal file
@ -0,0 +1,47 @@
|
||||
@import '~antd/lib/style/themes/default.less';
|
||||
@import '~@/utils/utils.less';
|
||||
|
||||
.tableList {
|
||||
.tableListOperator {
|
||||
margin-bottom: 16px;
|
||||
button {
|
||||
margin-right: 8px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.tableDelete {
|
||||
color: red;
|
||||
}
|
||||
|
||||
.tableListForm {
|
||||
:global {
|
||||
.ant-form-item {
|
||||
display: flex;
|
||||
margin-right: 0;
|
||||
margin-bottom: 24px;
|
||||
> .ant-form-item-label {
|
||||
width: auto;
|
||||
padding-right: 8px;
|
||||
line-height: 32px;
|
||||
}
|
||||
.ant-form-item-control {
|
||||
line-height: 32px;
|
||||
}
|
||||
}
|
||||
.ant-form-item-control-wrapper {
|
||||
flex: 1;
|
||||
}
|
||||
}
|
||||
.submitButtons {
|
||||
display: block;
|
||||
margin-bottom: 24px;
|
||||
white-space: nowrap;
|
||||
}
|
||||
}
|
||||
|
||||
@media screen and (max-width: @screen-lg) {
|
||||
.tableListForm :global(.ant-form-item) {
|
||||
margin-right: 24px;
|
||||
}
|
||||
}
|
34
admin-web/src/services/promotion.js
Normal file
34
admin-web/src/services/promotion.js
Normal file
@ -0,0 +1,34 @@
|
||||
import { stringify } from '@/utils/request.qs';
|
||||
import request from '@/utils/request';
|
||||
|
||||
// banner
|
||||
|
||||
export async function queryBanner(params) {
|
||||
return request(`/promotion-api/admins/banner/page?${stringify(params)}`, {
|
||||
method: 'GET',
|
||||
});
|
||||
}
|
||||
|
||||
export async function addBanner(params) {
|
||||
return request(`/promotion-api/admins/banner/add?${stringify(params)}`, {
|
||||
method: 'POST',
|
||||
});
|
||||
}
|
||||
|
||||
export async function updateBanner(params) {
|
||||
return request(`/promotion-api/admins/banner/update?${stringify(params)}`, {
|
||||
method: 'POST',
|
||||
});
|
||||
}
|
||||
|
||||
export async function updateBannerStatus(params) {
|
||||
return request(`/promotion-api/admins/banner/update_status?${stringify(params)}`, {
|
||||
method: 'POST',
|
||||
});
|
||||
}
|
||||
|
||||
export async function deleteBanner(params) {
|
||||
return request(`/promotion-api/admins/banner/delete?${stringify(params)}`, {
|
||||
method: 'POST',
|
||||
});
|
||||
}
|
@ -66,14 +66,14 @@ public class ResourceController {
|
||||
@ApiImplicitParam(name = "sort", value = "排序", required = true, example = "1"),
|
||||
@ApiImplicitParam(name = "displayName", value = "菜单展示名", required = true, example = "商品管理"),
|
||||
@ApiImplicitParam(name = "pid", value = "父级资源编号", required = true, example = "1"),
|
||||
@ApiImplicitParam(name = "handler", value = "操作", required = true, example = "/order/list"),
|
||||
@ApiImplicitParam(name = "handler", value = "操作", example = "/order/list"),
|
||||
})
|
||||
public CommonResult<ResourceVO> add(@RequestParam("name") String name,
|
||||
@RequestParam("type") Integer type,
|
||||
@RequestParam("sort") Integer sort,
|
||||
@RequestParam("displayName") String displayName,
|
||||
@RequestParam("pid") Integer pid,
|
||||
@RequestParam("handler") String handler) {
|
||||
@RequestParam(value = "handler", required = false) String handler) {
|
||||
ResourceAddDTO resourceAddDTO = new ResourceAddDTO().setName(name).setType(type).setSort(sort)
|
||||
.setDisplayName(displayName).setPid(pid).setHandler(handler);
|
||||
return ResourceConvert.INSTANCE.convert3(resourceService.addResource(AdminSecurityContextHolder.getContext().getAdminId(), resourceAddDTO));
|
||||
@ -87,14 +87,14 @@ public class ResourceController {
|
||||
@ApiImplicitParam(name = "sort", value = "排序", required = true, example = "1"),
|
||||
@ApiImplicitParam(name = "displayName", value = "菜单展示名", required = true, example = "商品管理"),
|
||||
@ApiImplicitParam(name = "pid", value = "父级资源编号", required = true, example = "1"),
|
||||
@ApiImplicitParam(name = "handler", value = "操作", required = true, example = "/order/list"),
|
||||
@ApiImplicitParam(name = "handler", value = "操作", example = "/order/list"),
|
||||
})
|
||||
public CommonResult<Boolean> update(@RequestParam("id") Integer id,
|
||||
@RequestParam("name") String name,
|
||||
@RequestParam("sort") Integer sort,
|
||||
@RequestParam("displayName") String displayName,
|
||||
@RequestParam("pid") Integer pid,
|
||||
@RequestParam("handler") String handler) {
|
||||
@RequestParam(value = "handler", required = false) String handler) {
|
||||
ResourceUpdateDTO resourceUpdateDTO = new ResourceUpdateDTO().setId(id).setName(name).setSort(sort).setDisplayName(displayName).setPid(pid).setHandler(handler);
|
||||
return resourceService.updateResource(AdminSecurityContextHolder.getContext().getAdminId(), resourceUpdateDTO);
|
||||
}
|
||||
|
@ -14,7 +14,7 @@ public class BannerVO {
|
||||
private String title;
|
||||
@ApiModelProperty(value = "跳转链接", required = true, example = "http://www.baidu.com")
|
||||
private String url;
|
||||
@ApiModelProperty(value = "突脸链接", required = true, example = "http://www.iocoder.cn/01.jpg")
|
||||
@ApiModelProperty(value = "图片链接", required = true, example = "http://www.iocoder.cn/01.jpg")
|
||||
private String picUrl;
|
||||
@ApiModelProperty(value = "排序", required = true, example = "10")
|
||||
private Integer sort;
|
||||
|
@ -12,13 +12,15 @@ import javax.validation.constraints.NotNull;
|
||||
public class BannerAddDTO {
|
||||
|
||||
@NotEmpty(message = "标题不能为空")
|
||||
@Length(min = 6, max = 32, message = "标题长度为 6-32 位")
|
||||
@Length(min = 2, max = 32, message = "标题长度为 2-32 位")
|
||||
private String title;
|
||||
@NotEmpty(message = "跳转链接不能为空")
|
||||
@URL(message = "跳转链接格式不正确")
|
||||
@Length(max = 255, message = "跳转链接最大长度为 255 位")
|
||||
private String url;
|
||||
@NotEmpty(message = "图片链接不能为空")
|
||||
@URL(message = "图片链接格式不正确")
|
||||
@Length(max = 255, message = "图片链接最大长度为 255 位")
|
||||
private String picUrl;
|
||||
@NotNull(message = "排序不能为空")
|
||||
private Integer sort;
|
||||
|
@ -14,12 +14,15 @@ public class BannerUpdateDTO {
|
||||
@NotNull(message = "编号不能为空")
|
||||
private Integer id;
|
||||
@NotEmpty(message = "标题不能为空")
|
||||
@Length(min = 6, max = 32, message = "标题长度为 6-32 位")
|
||||
@Length(min = 2, max = 32, message = "标题长度为 2-32 位")
|
||||
private String title;
|
||||
@NotEmpty(message = "跳转链接不能为空")
|
||||
@URL(message = "跳转链接格式不正确")
|
||||
@Length(max = 255, message = "跳转链接最大长度为 255 位")
|
||||
private String url;
|
||||
@NotEmpty(message = "图片链接不能为空")
|
||||
@URL(message = "图片链接格式不正确")
|
||||
@Length(max = 255, message = "图片链接最大长度为 255 位")
|
||||
private String picUrl;
|
||||
@NotNull(message = "排序不能为空")
|
||||
private Integer sort;
|
||||
|
@ -42,7 +42,7 @@ public class BannerServiceImpl implements BannerService {
|
||||
@Override
|
||||
public CommonResult<BannerBO> addBanner(Integer adminId, BannerAddDTO bannerAddDTO) {
|
||||
// 保存到数据库
|
||||
BannerDO banner = BannerConvert.INSTANCE.convert(bannerAddDTO);
|
||||
BannerDO banner = BannerConvert.INSTANCE.convert(bannerAddDTO).setStatus(CommonStatusEnum.ENABLE.getValue());
|
||||
banner.setDeleted(DeletedStatusEnum.DELETED_NO.getValue()).setCreateTime(new Date());
|
||||
bannerMapper.insert(banner);
|
||||
// 返回成功
|
||||
|
@ -76,7 +76,7 @@
|
||||
<if test="url != null">
|
||||
url = #{url},
|
||||
</if>
|
||||
<if test="pic_url != null">
|
||||
<if test="picUrl != null">
|
||||
pic_url = #{picUrl} ,
|
||||
</if>
|
||||
<if test="sort != null">
|
||||
@ -85,8 +85,8 @@
|
||||
<if test="status != null">
|
||||
status = #{status},
|
||||
</if>
|
||||
<if test="VALUES != null">
|
||||
VALUES = #{VALUES},
|
||||
<if test="memo != null">
|
||||
memo = #{memo},
|
||||
</if>
|
||||
<if test="deleted != null">
|
||||
deleted = #{deleted}
|
||||
|
Loading…
Reference in New Issue
Block a user