From a02fc6a77fa1b35c6516b2d37108d80e260c6c85 Mon Sep 17 00:00:00 2001
From: king <18310653075@163.com>
Date: 星期四, 07 十一月 2024 22:05:08 +0800
Subject: [PATCH] 2024-11-07
---
src/views/menudesign/menuform/index.jsx | 351 ++++++++++++++++++++++++++++++++++++++++-----------------
1 files changed, 245 insertions(+), 106 deletions(-)
diff --git a/src/views/menudesign/menuform/index.jsx b/src/views/menudesign/menuform/index.jsx
index 0b3fbbd..d8b2366 100644
--- a/src/views/menudesign/menuform/index.jsx
+++ b/src/views/menudesign/menuform/index.jsx
@@ -4,14 +4,16 @@
import { QuestionCircleOutlined } from '@ant-design/icons'
import Api from '@/api'
-import options from '@/store/options.js'
+import asyncComponent from '@/utils/asyncComponent'
import './index.scss'
const { TextArea } = Input
+const ColorSketch = asyncComponent(() => import('@/mob/colorsketch'))
+const SysColorSketch = asyncComponent(() => import('@/menu/stylecontroller/syscolorsketch'))
+
class CustomMenuForm extends Component {
static propTpyes = {
- dict: PropTypes.object, // 瀛楀吀椤�
config: PropTypes.object,
MenuId: PropTypes.string,
MenuName: PropTypes.string,
@@ -27,11 +29,67 @@
}
UNSAFE_componentWillMount () {
- const { MenuId, config } = this.props
- let _param = {func: 's_get_pc_menus', systemType: options.sysType, debug: 'Y'}
- _param.pro_sys = window.GLOB.systemType === 'production' ? 'Y' : ''
+ const { config } = this.props
- Api.getSystemConfig(_param).then(result => {
+ if (sessionStorage.getItem('thdMenuList') && sessionStorage.getItem('fstMenuList')) {
+ this.setMenus()
+ } else {
+ this.getMenus()
+ }
+
+ window.GLOB.process = config.process === 'true'
+ }
+
+ setMenus = () => {
+ const { MenuId, config } = this.props
+
+ let menulist = sessionStorage.getItem('fstMenuList')
+ let thdMenuList = sessionStorage.getItem('thdMenuList')
+
+ menulist = JSON.parse(menulist)
+ thdMenuList = JSON.parse(thdMenuList)
+
+ let thdMenu = null
+ let firstId = ''
+
+ thdMenuList.forEach(trd => {
+ if (MenuId === trd.MenuID) {
+ thdMenu = trd
+ }
+ })
+
+ let smenulist = []
+
+ if (thdMenu) {
+ menulist.forEach(item => {
+ if (item.MenuID === thdMenu.FstId) {
+ smenulist = item.children
+ }
+ })
+
+ firstId = thdMenu.FstId || ''
+ }
+
+ if (firstId !== config.fstMenuId) {
+ this.props.updateConfig({...config, fstMenuId: firstId})
+ }
+
+ this.setState({
+ fstMenuId: firstId,
+ menulist,
+ smenulist
+ }, () => {
+ this.props.form.setFieldsValue({
+ fstMenuId: firstId,
+ parentId: thdMenu ? thdMenu.ParentId : ''
+ })
+ })
+ }
+
+ getMenus = () => {
+ const { MenuId, config } = this.props
+
+ Api.getCloudConfig({func: 's_get_pc_menus', systemType: window.GLOB.sysType, debug: 'Y'}).then(result => {
if (result.status) {
let thdMenu = null
let thdMenuList = []
@@ -67,22 +125,21 @@
EasyCode: trd.EasyCode,
value: trd.MenuID,
label: trd.MenuName,
- type: 'CommonTable',
- // disabled: trd.MenuID === MenuId
+ type: 'CustomPage',
disabled: false
- }
-
- if (MenuId === trd.MenuID) {
- thdMenu = trdItem
}
if (trd.PageParam) {
try {
trd.PageParam = JSON.parse(trd.PageParam)
- trdItem.type = trd.PageParam.Template || 'CommonTable'
+ trdItem.type = trd.PageParam.Template || 'CustomPage'
} catch (e) {
}
+ }
+
+ if (MenuId === trd.MenuID) {
+ thdMenu = trdItem
}
thdMenuList.push(trdItem)
@@ -97,22 +154,29 @@
})
let smenulist = []
- menulist.forEach(item => {
- if (thdMenu && (item.MenuID === thdMenu.FstId)) {
- smenulist = item.children
- }
- })
+ let firstId = ''
+ if (thdMenu) {
+ menulist.forEach(item => {
+ if (item.MenuID === thdMenu.FstId) {
+ smenulist = item.children
+ }
+ })
+ firstId = thdMenu.FstId || ''
+ }
sessionStorage.setItem('fstMenuList', JSON.stringify(menulist))
sessionStorage.setItem('thdMenuList', JSON.stringify(thdMenuList))
- this.props.updateConfig({...config, fstMenuId: thdMenu ? thdMenu.FstId : ''})
+
+ if (firstId !== config.fstMenuId) {
+ this.props.updateConfig({...config, fstMenuId: firstId})
+ }
this.setState({
- fstMenuId: thdMenu ? thdMenu.FstId : '',
+ fstMenuId: firstId,
menulist,
smenulist
}, () => {
this.props.form.setFieldsValue({
- fstMenuId: thdMenu ? thdMenu.FstId : '',
+ fstMenuId: firstId,
parentId: thdMenu ? thdMenu.ParentId : ''
})
})
@@ -126,7 +190,6 @@
})
}
- // 涓�浜岀骇鑿滃崟鍒囨崲
selectChange = (key, value) => {
const { config } = this.props
const { menulist } = this.state
@@ -146,47 +209,20 @@
this.props.form.setFieldsValue({parentId: _id})
this.props.updateConfig({...config, fstMenuId: value, parentId: _id})
})
- } else if (key === 'parentId') {
- this.props.updateConfig({...config, parentId: value})
- } else if (key === 'cacheUseful') {
- this.props.updateConfig({...config, cacheUseful: value})
- } else if (key === 'timeUnit') {
- this.props.updateConfig({...config, timeUnit: value})
- } else if (key === 'OpenType') {
- this.props.updateConfig({...config, OpenType: value})
- } else if (key === 'hidden') {
- this.props.updateConfig({...config, hidden: value})
+ } else {
+ if (key === 'cacheTime' || key === 'minWidth' || key === 'localCacheTime') {
+ if (typeof(value) !== 'number') {
+ value = ''
+ }
+ } else if (key === 'process') {
+ window.GLOB.process = value === 'true'
+ }
+ this.props.updateConfig({...config, [key]: value})
}
- }
-
- // 鑿滃崟鍚嶇О
- changeName = (e) => {
- this.props.updateConfig({...this.props.config, MenuName: e.target.value})
- }
-
- // 鑿滃崟鍙傛暟
- changeNo = (e) => {
- this.props.updateConfig({...this.props.config, MenuNo: e.target.value})
- }
-
- // 鍔╄鐮�
- changeEasyCode = (e) => {
- this.props.updateConfig({...this.props.config, easyCode: e.target.value})
- }
-
- changeRemark = (e) => {
- this.props.updateConfig({...this.props.config, Remark: e.target.value})
- }
-
- changeCacheDay = (val) => {
- if (typeof(val) !== 'number') {
- val = ''
- }
- this.props.updateConfig({...this.props.config, cacheTime: val})
}
render() {
- const { dict, MenuName, MenuNo, config } = this.props
+ const { MenuName, MenuNo, config } = this.props
const { menulist, smenulist } = this.state
const { getFieldDecorator } = this.props.form
const formItemLayout = {
@@ -204,13 +240,13 @@
<Form {...formItemLayout} className="custom-menu-form">
<Row>
<Col span={24}>
- <Form.Item label={dict['mob.menu.first'] + dict['mob.menu']}>
+ <Form.Item label="涓�绾ц彍鍗�">
{getFieldDecorator('fstMenuId', {
initialValue: '',
rules: [
{
required: true,
- message: dict['mob.required.select'] + dict['mob.menu.first'] + dict['mob.menu'] + '!'
+ message: '璇烽�夋嫨涓�绾ц彍鍗�!'
}
]
})(
@@ -225,13 +261,13 @@
</Form.Item>
</Col>
<Col span={24}>
- <Form.Item label={dict['mob.menu.second'] + dict['mob.menu']}>
+ <Form.Item label="浜岀骇鑿滃崟">
{getFieldDecorator('parentId', {
initialValue: '',
rules: [
{
required: true,
- message: dict['mob.required.select'] + dict['mob.menu.second'] + dict['mob.menu'] + '!'
+ message: '璇烽�夋嫨浜岀骇鑿滃崟!'
}
]
})(
@@ -246,63 +282,42 @@
</Form.Item>
</Col>
<Col span={24}>
- <Form.Item label={dict['mob.menu'] + dict['mob.name']}>
+ <Form.Item label="鑿滃崟鍚嶇О">
{getFieldDecorator('MenuName', {
initialValue: MenuName,
rules: [
{
required: true,
- message: dict['mob.required.input'] + dict['mob.menu'] + dict['mob.name'] + '!'
+ message: '璇疯緭鍏ヨ彍鍗曞悕绉�!'
}
]
- })(<Input placeholder="" autoComplete="off" onChange={this.changeName}/>)}
+ })(<Input placeholder="" autoComplete="off" onChange={(e) => {this.selectChange('MenuName', e.target.value)}}/>)}
</Form.Item>
</Col>
<Col span={24}>
- <Form.Item label={dict['mob.menu'] + dict['mob.param']}>
+ <Form.Item label="鑿滃崟鍙傛暟">
{getFieldDecorator('MenuNo', {
initialValue: MenuNo,
rules: [
{
required: true,
- message: dict['mob.required.input'] + dict['mob.menu'] + dict['mob.param'] + '!'
+ message: '璇疯緭鍏ヨ彍鍗曞弬鏁�!'
}
]
- })(<Input placeholder="" autoComplete="off" onChange={this.changeNo}/>)}
+ })(<Input placeholder="" autoComplete="off" onChange={(e) => {this.selectChange('MenuNo', e.target.value)}}/>)}
</Form.Item>
</Col>
<Col span={24}>
<Form.Item label="鎵撳紑鏂瑰紡">
{getFieldDecorator('OpenType', {
initialValue: config.OpenType || 'newtab',
- rules: [
- {
- required: true,
- message: dict['form.required.select'] + dict['model.openway'] + '!'
- }
- ]
+ rules: [{ required: true, message: '璇烽�夋嫨鎵撳紑鏂瑰紡!' }]
})(
- <Radio.Group onChange={(e) => {this.selectChange('OpenType', e.target.value)}}>
- <Radio value="newtab">鏍囩椤�</Radio>
- <Radio value="newpage">鏂伴〉闈�</Radio>
- </Radio.Group>
- )}
- </Form.Item>
- </Col>
- <Col span={24}>
- <Form.Item label={
- <Tooltip placement="topLeft" title="瀵逛簬涓嶇粡甯告�у彉鍔ㄧ殑淇℃伅锛岀紦瀛樻暟鎹湁鍔╀簬鎻愰珮鏌ヨ鏁堢巼銆�">
- <QuestionCircleOutlined className="mk-form-tip" />
- 缂撳瓨鏁版嵁
- </Tooltip>
- }>
- {getFieldDecorator('cacheUseful', {
- initialValue: config.cacheUseful || 'false'
- })(
- <Radio.Group onChange={(e) => {this.selectChange('cacheUseful', e.target.value)}}>
- <Radio value="true">浣跨敤</Radio>
- <Radio value="false">涓嶄娇鐢�</Radio>
- </Radio.Group>
+ <Select onChange={(value) => {this.selectChange('OpenType', value)}}>
+ <Select.Option value="newtab">鏍囩椤�</Select.Option>
+ <Select.Option value="newpage">鏂伴〉闈紙鏍囩椤碉級</Select.Option>
+ <Select.Option value="view">鏂伴〉闈紙鍏ㄥ睆锛�</Select.Option>
+ </Select>
)}
</Form.Item>
</Col>
@@ -323,14 +338,80 @@
)}
</Form.Item>
</Col>
+ {config.permission !== 'false' ? <Col span={24}>
+ <Form.Item label={
+ <Tooltip placement="topLeft" title="鏄惁妫�楠屽悗绔痵ql鐨勬潈闄愶紝浣跨敤鍚庣sql鑴氭湰鏃舵湁鏁堛��">
+ <QuestionCircleOutlined className="mk-form-tip" />
+ sql楠岃瘉
+ </Tooltip>
+ }>
+ {getFieldDecorator('sqlperm', {
+ initialValue: config.sqlperm || 'true'
+ })(
+ <Radio.Group onChange={(e) => {this.selectChange('sqlperm', e.target.value)}}>
+ <Radio value="true">浣跨敤</Radio>
+ <Radio value="false">涓嶄娇鐢�</Radio>
+ </Radio.Group>
+ )}
+ </Form.Item>
+ </Col> : null}
+ <Col span={24}>
+ <Form.Item label={
+ <Tooltip placement="topLeft" title="鏁版嵁浼氱紦瀛樺埌鐢ㄦ埛鏈湴锛屾柟渚块〉闈㈠揩閫熷憟鐜般��">
+ <QuestionCircleOutlined className="mk-form-tip" />
+ 鏈湴缂撳瓨
+ </Tooltip>
+ }>
+ {getFieldDecorator('cacheLocal', {
+ initialValue: config.cacheLocal || 'false'
+ })(
+ <Radio.Group onChange={(e) => {this.selectChange('cacheLocal', e.target.value)}}>
+ <Radio value="true">浣跨敤</Radio>
+ <Radio value="false">涓嶄娇鐢�</Radio>
+ </Radio.Group>
+ )}
+ </Form.Item>
+ </Col>
+ {config.cacheLocal === 'true' ? <Col span={24}>
+ <Form.Item label={
+ <Tooltip placement="topLeft" title="璁剧疆鏈湴缂撳瓨鏃堕暱鍚庯紝鍦ㄧ紦瀛樻湡闄愬唴涓嶅悜鍚庡彴璇锋眰鏁版嵁锛屾椂闀挎渶澶т负5澶╋紙鍗�7200鍒嗛挓锛夈�傛敞锛氭椂闀夸负绌烘椂缂撳瓨鏁版嵁鍙敤浜庨〉闈㈠揩閫熷憟鐜帮紝涓嶅奖鍝嶆帴鍙ｈ姹傘��">
+ <QuestionCircleOutlined className="mk-form-tip" />
+ 鏃堕暱(鍒�)
+ </Tooltip>
+ }>
+ {getFieldDecorator('localCacheTime', {
+ initialValue: config.localCacheTime
+ })(
+ <InputNumber min={1} max={7200} precision={0} onChange={(val) => {this.selectChange('localCacheTime', val)}}/>
+ )}
+ </Form.Item>
+ </Col> : null}
+ <Col span={24}>
+ <Form.Item label={
+ <Tooltip placement="topLeft" title="瀵逛簬涓嶇粡甯告�у彉鍔ㄧ殑淇℃伅锛岀紦瀛樻暟鎹湁鍔╀簬鎻愰珮鏌ヨ鏁堢巼銆�">
+ <QuestionCircleOutlined className="mk-form-tip" />
+ 鍚庣缂撳瓨
+ </Tooltip>
+ }>
+ {getFieldDecorator('cacheUseful', {
+ initialValue: config.cacheUseful || 'false'
+ })(
+ <Radio.Group onChange={(e) => {this.selectChange('cacheUseful', e.target.value)}}>
+ <Radio value="true">浣跨敤</Radio>
+ <Radio value="false">涓嶄娇鐢�</Radio>
+ </Radio.Group>
+ )}
+ </Form.Item>
+ </Col>
{config.cacheUseful === 'true' ? <Col span={24}>
<Form.Item label="鍗曚綅">
{getFieldDecorator('timeUnit', {
initialValue: config.timeUnit || 'day'
})(
- <Radio.Group onChange={(e) => {this.selectChange('timeUnit', e.target.value)}}>
+ <Radio.Group style={{whiteSpace: 'nowrap'}} onChange={(e) => {this.selectChange('timeUnit', e.target.value)}}>
<Radio value="day">澶�</Radio>
<Radio value="hour">灏忔椂</Radio>
+ <Radio value="minute">鍒嗛挓</Radio>
</Radio.Group>
)}
</Form.Item>
@@ -342,29 +423,77 @@
rules: [
{
required: true,
- message: dict['mob.required.input'] + '鏃堕暱!'
+ message: '璇疯緭鍏ユ椂闀�!'
}
]
})(
- <InputNumber min={1} max={config.timeUnit !== 'hour' ? 7 : 23} precision={0} onChange={this.changeCacheDay}/>
+ <InputNumber min={1} max={config.timeUnit === 'day' ? 7 : (config.timeUnit === 'hour' ? 23 : 59)} precision={0} onChange={(val) => {this.selectChange('cacheTime', val)}}/>
)}
</Form.Item>
</Col> : null}
<Col span={24}>
- <Form.Item label={dict['mob.menu.easycode']}>
- {getFieldDecorator('easyCode', {
- initialValue: config.easyCode
- })(<Input placeholder="" autoComplete="off" onChange={this.changeEasyCode}/>)}
+ <Form.Item label={
+ <Tooltip placement="topLeft" title="寮�鍚悗鍙湪鎸夐挳鍙婃暟鎹簮璁剧疆娴佺▼鍙傛暟銆�">
+ <QuestionCircleOutlined className="mk-form-tip" />
+ 宸ヤ綔娴�
+ </Tooltip>
+ }>
+ {getFieldDecorator('process', {
+ initialValue: config.process || 'false'
+ })(
+ <Radio.Group onChange={(e) => {this.selectChange('process', e.target.value)}}>
+ <Radio value="true">浣跨敤</Radio>
+ <Radio value="false">涓嶄娇鐢�</Radio>
+ </Radio.Group>
+ )}
</Form.Item>
</Col>
<Col span={24}>
- <Form.Item label={'闅愯棌鑿滃崟'}>
+ <Form.Item label={
+ <Tooltip placement="topLeft" title="鏁版嵁鍔犺浇鏃剁殑閬僵鏄惁鏄剧ず銆�">
+ <QuestionCircleOutlined className="mk-form-tip" />
+ 鍔犺浇閬僵
+ </Tooltip>
+ }>
+ {getFieldDecorator('mask', {
+ initialValue: config.mask || 'true'
+ })(
+ <Radio.Group onChange={(e) => {this.selectChange('mask', e.target.value)}}>
+ <Radio value="true">鏄剧ず</Radio>
+ <Radio value="false">闅愯棌</Radio>
+ </Radio.Group>
+ )}
+ </Form.Item>
+ </Col>
+ <Col span={24}>
+ <Form.Item label={
+ <Tooltip placement="topLeft" title="濡傛灉椤甸潰鍐呭鍦ㄧ獥鍙ｄ腑鏃犳硶瀹屽叏灞曠ず锛屽彲璁剧疆鏈�灏忓搴︼紝瀹炵幇椤甸潰鐨勬í鍚戞粴鍔ㄣ��">
+ <QuestionCircleOutlined className="mk-form-tip" />
+ 鏈�灏忓搴�
+ </Tooltip>
+ }>
+ {getFieldDecorator('minWidth', {
+ initialValue: config.minWidth
+ })(
+ <InputNumber min={0} precision={0} onChange={(val) => {this.selectChange('minWidth', val)}}/>
+ )}
+ </Form.Item>
+ </Col>
+ <Col span={24}>
+ <Form.Item label="鍔╄鐮�">
+ {getFieldDecorator('easyCode', {
+ initialValue: config.easyCode
+ })(<Input placeholder="" autoComplete="off" onChange={(e) => {this.selectChange('easyCode', e.target.value)}}/>)}
+ </Form.Item>
+ </Col>
+ <Col span={24}>
+ <Form.Item label="闅愯棌鑿滃崟">
<Switch checkedChildren={'鏄�'} checked={config.hidden === 'true'} unCheckedChildren={'鍚�'} onChange={(value) => {
this.selectChange('hidden', value + '')
}} />
</Form.Item>
</Col>
- <Col span={24}>
+ <Col span={24} className="red-font">
<Form.Item label="澶囨敞">
{getFieldDecorator('Remark', {
initialValue: config.Remark || '',
@@ -374,7 +503,17 @@
message: '澶囨敞鏈�澶�512涓瓧绗︼紒'
}
]
- })(<TextArea rows={2} placeholder={''} onChange={this.changeRemark} />)}
+ })(<TextArea rows={2} placeholder={''} onChange={(e) => {this.selectChange('Remark', e.target.value)}}/>)}
+ </Form.Item>
+ </Col>
+ <Col span={24}>
+ <Form.Item style={{marginBottom: '0px'}} label="鑿滃崟棰滆壊">
+ <ColorSketch allowClear={true} value={config.menuColor || ''} onChange={(val) => {this.selectChange('menuColor', val)}} />
+ </Form.Item>
+ </Col>
+ <Col span={24}>
+ <Form.Item style={{marginBottom: '0px'}} label="绯荤粺鑹�">
+ <SysColorSketch onChange={(val) => {this.selectChange('menuColor', val)}} />
</Form.Item>
</Col>
</Row>
--
Gitblit v1.8.0