Commit 17ef2560 authored by Maofei94's avatar Maofei94

feat: 小程序配置

parent 95eacae1
......@@ -501,7 +501,7 @@ const InitDataBase = props => {
))}
</Select>
</Form.Item>
<Form.Item>
<Form.Item wrapperCol={{ offset: 3 }}>
<div className={styles.tCenter}>
<Space size="large" className={styles.btnBox}>
<Space>
......
......@@ -13,5 +13,5 @@
}
.btnBox {
display: flex !important;
justify-content: space-around;
justify-content: space-between;
}
\ No newline at end of file
......@@ -22,7 +22,7 @@ const SiteConfig = props => {
const layout = {
layout: 'horizontal',
labelCol: { span: 7 },
wrapperCol: { span: 6 },
wrapperCol: { span: 8 },
};
useEffect(() => {
console.log(miniTitle, 'miniTitle');
......@@ -37,8 +37,9 @@ const SiteConfig = props => {
})
.then(res => {
setLoading(false);
let obj = { ...form.getFieldsValue() };
let arr = Object.keys({ ...form.getFieldsValue() });
console.log(res.shortcutIcon);
let obj = {};
let arr = Object.keys(form.getFieldsValue());
arr.map(k => {
obj[k] = res[k];
});
......@@ -88,7 +89,7 @@ const SiteConfig = props => {
};
return (
<Spin spinning={loading} tip="loading...">
<div style={{ minHeight: 'calc(100vh - 172px)', marginTop: '20px' }}>
<div style={{ minHeight: 'calc(100vh - 192px)', marginTop: '20px' }}>
<Form form={form} {...layout}>
<Item
label="应用名称:"
......@@ -102,7 +103,6 @@ const SiteConfig = props => {
>
<Input placeholder="请输入应用名称" allowClear />
</Item>
<Item
label="系统图标:"
name="shortcutIcon"
......@@ -115,10 +115,10 @@ const SiteConfig = props => {
>
<Input placeholder="请输入系统图标名称" allowClear />
</Item>
<Item label="系统图标预览:">
<Item label="系统图标预览:" name="shortcutIcon">
<PicturesWall />
</Item>
<Item
label="登陆页面:"
name="loginTemplate"
......
......@@ -29,11 +29,11 @@ const MobileConfigPage = props => {
});
}, [flag]);
useEffect(() => {
getMiniAppModuleTree({
userMode: 'super',
}).then(res => {
console.log(res);
});
// getMiniAppModuleTree({
// userMode: 'super',
// }).then(res => {
// console.log(res);
// });
}, []);
// 修改选中的tab
const handleChange = key => {
......
import React, { useState } from 'react';
import { Form, Input } from 'antd';
import { Form, Input, Button, Row, Col } from 'antd';
import styles from './addForm.less';
import PicturesWall from '@/components/Upload/index';
const { Item } = Form;
const AddForm = props => {
const {} = props;
const { submitCallback, nodeType, nodeObj, addType } = props;
// const [type, setType] = useState(2);
const [form] = Form.useForm();
const [otherForm] = Form.useForm();
const layout = {
layout: '',
layout: 'horizontal',
labelCol: { span: 4, offset: 1 },
wrapperCol: { span: 16 },
};
const submit = () => {
if (addType === 1 || addType === 2) {
let obj = form.getFieldsValue();
submitCallback(obj, nodeObj);
}
if (addType === 3 || addType === 4) {
let obj = otherForm.getFieldsValue();
submitCallback(obj, nodeObj);
}
};
return (
<Form form={form} {...layout}>
<Item label="分组名称">
<div>
{(addType === 1 || addType === 2) && (
<Form form={form} {...layout} className={styles.formStyle}>
<Item label="分组名称" name="menuName">
<Input />
</Item>
<Item label="分组别名">
<Item label="分组别名" name="shortName">
<Input />
</Item>
<Item label="在线图标">
{addType === 1 && (
<Item label="在线图标" name="imageUrl">
<PicturesWall />
</Item>
)}
{addType === 1 && (
<Item label="离线图标" name="offlineImgUrl">
<PicturesWall />
</Item>
)}
{addType === 2 && (
<Item label="分组图标" name="imageUrl">
<PicturesWall />
</Item>
)}
<Item label="功能参数" name="funParam">
<Input />
</Item>
<Item label="离线图标">
<Item wrapperCol={{ offset: 5 }} style={{ marginTop: '40px' }}>
<Button type="primary" onClick={() => submit()}>
提交
</Button>
</Item>
</Form>
)}
{(addType === 3 || addType === 4) && (
<Form form={otherForm} {...layout} className={styles.formStyle}>
<Item label="菜单名称" name="menuName">
<Input />
</Item>
<Item label="功能参数">
<Item label="菜单别名" name="shortName">
<Input />
</Item>
{addType === 3 && (
<Item label="在线图标" name="imageUrl">
<PicturesWall />
</Item>
)}
{addType === 3 && (
<Item label="离线图标" name="offlineImgUrl">
{/* {otherForm.getFieldsValue().offlineImgUrl && <PicturesWall />} */}
<PicturesWall />
</Item>
)}
{addType === 4 && (
<Item label="菜单图标" name="imageUrl">
<PicturesWall />
</Item>
)}
<Item label="功能路径" name="pageUrl">
<Input />
</Item>
<Item label="功能参数" name="funParam">
<Input />
</Item>
<Item wrapperCol={{ offset: 5 }} style={{ marginTop: '40px' }}>
<Button type="primary" onClick={() => submit()}>
提交
</Button>
</Item>
</Form>
)}
</div>
);
};
export default AddForm;
This diff is collapsed.
.contentContainer{
// min-height: calc(100vh - 48px);
overflow-x: auto;
display: flex;
.menuContainer{
min-width: 300px;
border:2px solid #eee;
min-height:calc(100vh - 172px);
overflow-y:auto;
.ant-tree-list{
padding: 10px;
height:calc(100vh - 330px);
.ant-tree-switcher{
line-height: 1;
color:#1890FF;
}
.ant-tree-iconEle{
line-height: 1.2;
color:#1890FF;
}
}
}
.editContainer{
margin-left: 12px;
flex: 1;
padding: 16px;
float: left;
min-width: 500px;
border:2px solid #eee;
.ant-table-pagination-right{
padding-right: 12px;
}
}
.previewContainer{
margin-left: 12px;
// flex: 1;
float: left;
min-width: 700px;
border:2px solid #eee;
.ant-table-pagination-right{
padding-right: 12px;
}
}
.ant-tree-treenode{
width: 100% !important;
.ant-tree-node-content-wrapper{
display: inline-block;
width: 100%;
}
.iconWraper1{
float: right;
span{
display: none;
}
}
}
.ant-tree-treenode:hover{
.iconWraper1>span{
margin-left: 12px;
font-size: 18px;
display: inline-block;
}
}
}
.redText{
color: red;
cursor: pointer;
}
\ No newline at end of file
import React, { useState, useEffect } from 'react';
import ProCard from '@ant-design/pro-card';
import AddForm from './AddForm';
import LeftPart from './LeftPart';
import MiniMenu from './miniMenu';
const MenuConfig = props => {
const [flag, setFlag] = useState(1);
return (
<div split="vertical">
<LeftPart />
{/* <ProCard><AddForm /></ProCard> */}
<MiniMenu />
</div>
);
};
......
.formStyle{
margin-bottom: 40px;
}
\ No newline at end of file
import React, { useState, useEffect } from 'react';
import { Form, Input, Button, Row, Col } from 'antd';
import styles from './addForm.less';
import PicturesWall from '@/components/Upload/index';
const { Item } = Form;
const EditForm = props => {
const { submitCallback, nodeType, info } = props;
const [form] = Form.useForm();
const [otherForm] = Form.useForm();
console.log(info);
const layout = {
layout: 'horizontal',
labelCol: { span: 4, offset: 1 },
wrapperCol: { span: 16 },
};
// 回显表单
useEffect(() => {
form.resetFields();
otherForm.resetFields();
}, [info]);
useEffect(() => {
if (nodeType === 1 || nodeType === 2) {
let arr = Object.keys(form.getFieldsValue());
let obj = {};
arr.map(i => {
obj[i] = info[i];
});
form.setFieldsValue({ ...obj, shortName: info.menuShortName });
}
if (nodeType === 3 || nodeType === 4) {
let arr = Object.keys(otherForm.getFieldsValue());
let obj = {};
arr.map(i => {
obj[i] = info[i];
});
otherForm.setFieldsValue({ ...obj, shortName: info.menuShortName });
}
}, [info]);
const submit = () => {
if (nodeType === 1 || nodeType === 2) {
let obj = form.getFieldsValue();
console.log(obj, '1,2');
submitCallback(obj);
}
if (nodeType === 3 || nodeType === 4) {
let obj = otherForm.getFieldsValue();
console.log(obj, '3,4');
submitCallback(obj);
}
};
return (
<div>
{(nodeType === 1 || nodeType === 2) && (
<Form form={form} {...layout} className={styles.formStyle}>
<Item label="分组名称" name="menuName">
<Input />
</Item>
<Item label="分组别名" name="shortName">
<Input />
</Item>
{nodeType === 1 && (
<Item label="在线图标" name="imageUrl">
<PicturesWall />
</Item>
)}
{nodeType === 1 && (
<Item label="离线图标" name="offlineImgUrl">
<PicturesWall />
</Item>
)}
{nodeType === 2 && (
<Item label="分组图标" name="imageUrl">
<PicturesWall />
</Item>
)}
<Item label="功能参数" name="funParam">
<Input />
</Item>
<Item wrapperCol={{ offset: 5 }} style={{ marginTop: '40px' }}>
<Button type="primary" onClick={() => submit()}>
提交
</Button>
</Item>
</Form>
)}
{(nodeType === 3 || nodeType === 4) && (
<Form form={otherForm} {...layout} className={styles.formStyle}>
<Item label="菜单名称" name="menuName">
<Input />
</Item>
<Item label="菜单别名" name="shortName">
<Input />
</Item>
{nodeType === 3 && (
<Item label="在线图标" name="imageUrl">
<PicturesWall />
</Item>
)}
{nodeType === 3 && (
<Item label="离线图标" name="offlineImgUrl">
{/* {otherForm.getFieldsValue().offlineImgUrl && <PicturesWall />} */}
<PicturesWall />
</Item>
)}
{nodeType === 4 && (
<Item label="菜单图标" name="imageUrl">
<PicturesWall />
</Item>
)}
<Item label="功能路径" name="pageUrl">
<Input />
</Item>
<Item label="功能参数" name="funParam">
<Input />
</Item>
<Item wrapperCol={{ offset: 5 }} style={{ marginTop: '40px' }}>
<Button type="primary" onClick={() => submit()}>
提交
</Button>
</Item>
</Form>
)}
</div>
);
};
export default EditForm;
This diff is collapsed.
.box{
min-height: calc( 100vh - 172px);
display: flex;
}
.left{
min-width: 300px;
width: 300px;
min-height: 100%;
border: 1px solid #eee;
padding: 10px;
.ant-tree-node-content-wrapper{
display: flex;
align-items: center;
.ant-tree-iconEle{
display: flex;
align-items: center;
}
.ant-tree-title{
width: 100%;
}
}
.leftTop{
display: flex;
align-items: center;
margin-bottom: 10px;
justify-content: space-between;
.tRight{
display: flex;
align-items: center;
.icon1{
font-size: 20px;
margin-right: 10px;
}
.icon2{
font-size: 18px;
margin-right: 5px;
}
.icon:hover{
cursor: pointer;
}
}
}
}
.middle{
min-width: 500px;
width: 500px;
min-height: 100%;
border: 1px solid #eee;
padding: 10px;
margin: 0 10px;
}
.title{
display: flex;
align-items: center;
width: 100%;
}
.tip{
display: none;
}
.title:hover{
.tip{
display: flex;
align-items: center;
justify-content: flex-end;
width: 100%;
}
}
.fs{
font-size: 18px;
margin-left: 10px;
}
\ No newline at end of file
......@@ -29,6 +29,7 @@ import ListCard, {
} from '@/components/CheckGroup';
// import ListCard from '@/pages/orgnazation/ListCard';
import qs from 'qs';
import classnames from 'classnames';
import styles from '@/pages/userCenter/roleManage/RoleManage.less';
import AddModal from './AddModal';
import DelModal from './DelModal';
......@@ -38,6 +39,7 @@ import userStyles from '../UserManage.less';
const { Search } = Input;
const placeholder = '请输入功能名称';
const SiteManage = () => {
const [treeData, setTreeData] = useState([]);
const [searchWord, setSearchWord] = useState('');
......@@ -313,9 +315,19 @@ const SiteManage = () => {
};
return (
<PageContainer>
<Row gutter={0}>
<Col span={mulu ? 4 : 0}>
<Card className={styles.cardBox}>
{/* <Row gutter={0}>
<Col span={mulu ? 4 : 0}> */}
<div
className={classnames({
[styles.content]: true,
})}
>
<Card
className={classnames({
[styles.cardBox]: true,
[styles.hideBox]: !mulu,
})}
>
<Spin
tip="loading...."
spinning={spinLoading}
......@@ -361,6 +373,18 @@ const SiteManage = () => {
onCancel={() => setGroupVisible(false)}
confirmModal={groupModal}
/>
<div>
{mulu && (
<Tooltip title="隐藏角色栏" className={styles.hide}>
<DoubleLeftOutlined onClick={() => handleHide()} />
</Tooltip>
)}
{!mulu && (
<Tooltip title="显示角色栏" className={styles.hide}>
<DoubleRightOutlined onClick={() => handleHide()} />
</Tooltip>
)}
</div>
</Card>
{/* <div>
{mulu && (
......@@ -369,7 +393,7 @@ const SiteManage = () => {
</Tooltip>
)}
</div> */}
</Col>
{/* </Col> */}
{/* <Col span={mulu ? 0 : 1}>
{mulu && (
<Tooltip title="隐藏角色栏" className={styles.hide}>
......@@ -382,8 +406,19 @@ const SiteManage = () => {
</Tooltip>
)}
</Col> */}
<Col span={mulu ? 20 : 23}>
<Card style={{ marginBottom: '10px', minWidth: '870px' }}>
{/* <Col span={mulu ? 20 : 23}> */}
<div
className={classnames({
[styles.boxR]: true,
[styles.boxH]: mulu,
})}
>
<Card
className={classnames({
[styles.cardBoxTop]: true,
[styles.boxH]: mulu,
})}
>
<Row align="middle">
<Col span={1}>搜索</Col>
<Col span={8}>
......@@ -438,7 +473,12 @@ const SiteManage = () => {
</Col>
</Row>
</Card>
<Card className={styles.cardBoxR}>
<Card
className={classnames({
[styles.boxH]: mulu,
[styles.cardBoxR]: true,
})}
>
{roleID && (
<ListCard
loading={loading}
......@@ -451,8 +491,10 @@ const SiteManage = () => {
/>
)}
</Card>
</Col>
</Row>
</div>
{/* </Col>
</Row> */}
</div>
</PageContainer>
);
};
......
.cardBox{
min-height: calc(100vh - 74px);
max-height: calc(100vh - 74px);
overflow-y: scroll;
margin-right: 20px;
// overflow-y: scroll;
overflow: auto;
width: 260px;
left: 0;
top: 0;
margin-right: 10px;
position: relative;
// transition: left,width 10s;
transition-property:width,left;
transition-duration: 0.5s;
white-space: nowrap;
.ant-tree-node-content-wrapper{
display: flex;
align-items: center;
......@@ -12,6 +21,15 @@
}
}
}
.hideBox{
left: 0px;
top: 0;
width: 20px;
}
.hideH{
width: 100%;
}
.ant-tree-node-content-wrapper-open{
display: flex;
align-items: center;
......@@ -35,16 +53,16 @@
align-items: center;
}
.cardBoxR{
min-width: 870px;
min-height: calc(100vh - 158px);
max-height: calc(100vh - 158px);
min-width: 870px;
overflow-y: scroll;
}
:global{
.ant-tree-switcher{
display: flex;
align-items: center;
color:#1890FF;
// color:#1890FF;
.ant-tree-switcher-line-icon{
margin-left: 5px;
}
......@@ -62,10 +80,18 @@
z-index: 2;
}
.anticon-unordered-list{
vertical-align: 0.125em;
color:#1890FF;
.boxR{
width: 100%;
position: relative;
transition: width 2s;
}
.ant-card-body {
padding: 20px 10px;
// .anticon-unordered-list{
// vertical-align: 0.125em;
// color:#1890FF;
// }
.content{
width: 100%;
display: flex;
position: relative;
}
\ No newline at end of file
......@@ -236,11 +236,13 @@ const SiteManage = () => {
return (
<PageContainer>
<Row>
<Col span={mulu ? 4 : 0}>
{/* <Row>
<Col span={mulu ? 4 : 0}> */}
<div className={styles.content}>
<Card
className={classnames({
[styles.cardBox]: true,
[styles.hideBox]: !mulu,
})}
>
<Spin
......@@ -270,6 +272,18 @@ const SiteManage = () => {
onCancel={() => setEditVisible(false)}
confirmModal={editModal}
/>
<div>
{mulu && (
<Tooltip title="隐藏站点" className={styles.hide}>
<DoubleLeftOutlined onClick={() => handleHide()} />
</Tooltip>
)}
{!mulu && (
<Tooltip title="显示站点" className={styles.hide}>
<DoubleRightOutlined onClick={() => handleHide()} />
</Tooltip>
)}
</div>
</Card>
{/* <div>
{mulu && (
......@@ -283,7 +297,7 @@ const SiteManage = () => {
</Tooltip>
)}
</div> */}
</Col>
{/* </Col> */}
{/* <Col span={mulu ? 0 : 1}>
{mulu && (
<Tooltip title="隐藏站点" className={styles.hide}>
......@@ -296,8 +310,19 @@ const SiteManage = () => {
</Tooltip>
)}
</Col> */}
<Col span={mulu ? 20 : 23}>
<Card style={{ marginBottom: '10px', minWidth: '600px' }}>
{/* <Col span={mulu ? 20 : 23}> */}
<div
className={classnames({
[styles.boxR]: true,
[styles.boxH]: mulu,
})}
>
<Card
className={classnames({
[styles.cardBoxTop]: true,
[styles.boxH]: mulu,
})}
>
<Row align="middle">
<Col span={1}>搜索</Col>
<Col span={8}>
......@@ -343,7 +368,12 @@ const SiteManage = () => {
</Col>
</Row>
</Card>
<Card className={styles.cardBoxR}>
<Card
className={classnames({
[styles.boxH]: mulu,
[styles.cardBoxR]: true,
})}
>
{currentStation.stationID && (
<ListCard
loading={loading}
......@@ -355,8 +385,10 @@ const SiteManage = () => {
/>
)}
</Card>
</Col>
</Row>
</div>
</div>
{/* </Col>
</Row> */}
</PageContainer>
);
};
......
.cardBox{
min-height: calc(100vh - 74px);
max-height: calc(100vh - 74px);
min-height: calc(100vh - 75px);
max-height: calc(100vh - 75px);
overflow: auto;
width: 260px;
left: 0;
top: 0;
margin-right: 10px;
position: relative;
// transition: left,width 10s;
transition-property:width,left;
transition-duration: 0.5s;
white-space: nowrap
}
.hideBox{
left: 0px;
top: 0;
width: 20px;
}
.hideH{
width: 100%;
}
.siteTitle{
font-size: 16px;
......@@ -17,6 +33,11 @@
min-width: 600px;
overflow-y: scroll;
}
.cardBoxTop{
// max-width: calc( 100% - 450px);
// margin-bottom: 10px;
}
.ant-tree-node-content-wrapper-open{
display: flex;
align-items: center;
......@@ -65,3 +86,13 @@
// .hide{
// left: 0;
// }
.content{
width: 100%;
display: flex;
position: relative;
}
.boxR{
width: 100%;
position: relative;
transition: width 2s;
}
\ No newline at end of file
......@@ -46,3 +46,41 @@ export const editWebsite = (params, options) => {
*/
export const getMiniAppModuleTree = params =>
get(`${PUBLISH_SERVICE}/PlatformCenter/MiniAppModuleTree`, params);
/**
*
* @新增功能菜单组
* @请求参数 {*}{
* version: 9999
_dc: 1606203896370
parentID: -1
subSystemValue: miniapp
menuName: 分组名称
imageUrl: assets/images/appMenu/小程序tab/enterprise_select.png
offlineImgUrl: assets/images/appMenu/小程序tab/enterprise_unselect.png
shortName: 分组别名
pageUrl: //功能路径
funParam: 测试功能参数
relatedRoleList: //角色数组
}
*/
export const addMenu = params =>
get('/Cityinterface/rest/services/OMS.svc/MiniApp_AddMenu', params);
// 获取菜单详情
/**
* {
* menuID:''
* }
*/
export const getMenuInfo = params =>
get('/Cityinterface/rest/services/OMS.svc/Mini_GetMenuInfo', params);
// 编辑菜单
export const editMenu = params =>
get('/Cityinterface/rest/services/OMS.svc/MiniApp_EditMenu', params);
// 删除菜单
export const deleteMenu = params =>
get('/Cityinterface/rest/services/OMS.svc/MiniApp_DeleteMenu', params);
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment