From 6a50694b1ff7d566aa0b4acbe20f34a95bbab6af Mon Sep 17 00:00:00 2001
From: king <18310653075@163.com>
Date: 星期一, 12 十二月 2022 22:28:49 +0800
Subject: [PATCH] 2022-12-12
---
src/views/systemproc/proc/index.jsx | 89 ++++++++++++++---
src/views/systemproc/proc/index.scss | 64 ++++++++++++
src/assets/css/viewstyle.scss | 58 +++++-----
src/menu/components/table/base-table/columns/index.jsx | 32 ++++++
4 files changed, 196 insertions(+), 47 deletions(-)
diff --git a/src/assets/css/viewstyle.scss b/src/assets/css/viewstyle.scss
index 0f54397..99d5fa6 100644
--- a/src/assets/css/viewstyle.scss
+++ b/src/assets/css/viewstyle.scss
@@ -11,7 +11,7 @@
// color8 8闃惰壊
// color9 9闃惰壊
// color10 10闃惰壊
-@mixin viewstyle($bg1, $bg2, $font1, $font2, $color1, $color2, $color3, $color4, $color5, $color6, $color7, $color8, $color9, $color10) {
+@mixin viewstyle($bg1, $bg2, $font1, $font2, $color1, $color2, $color3, $color4, $color5, $color6, $color7) {
.login-container {
background-color: $bg1;
.logo {
@@ -535,127 +535,127 @@
body.mk-blue-black {
--mk-sys-color: #1890ff;
- @include viewstyle(#000000, #434343,rgba(255, 255, 255, 0.85), rgba(255, 255, 255, 0.65), #e6f7ff, #bae7ff, #91d5ff, #69c0ff, #40a9ff, #1890ff, #096dd9, #0050b3, #003a8c, #002766);
+ @include viewstyle(#000000, #434343,rgba(255, 255, 255, 0.85), rgba(255, 255, 255, 0.65), #e6f7ff, #bae7ff, #91d5ff, #69c0ff, #40a9ff, #1890ff, #096dd9);
@include bgblack();
}
body.mk-blue-white {
--mk-sys-color: #1890ff;
- @include viewstyle(#ffffff, #ffffff, rgba(0, 0, 0, 0.85), rgba(0, 0, 0, 0.65), #e6f7ff, #bae7ff, #91d5ff, #69c0ff, #40a9ff, #1890ff, #096dd9, #0050b3, #003a8c, #002766);
+ @include viewstyle(#ffffff, #ffffff, rgba(0, 0, 0, 0.85), rgba(0, 0, 0, 0.65), #e6f7ff, #bae7ff, #91d5ff, #69c0ff, #40a9ff, #1890ff, #096dd9);
}
body.mk-red-black {
--mk-sys-color: #f5222d;
- @include viewstyle(#000000, #434343,rgba(255, 255, 255, 0.85), rgba(255, 255, 255, 0.65), #fff1f0, #ffccc7, #ffa39e, #ff7875, #ff4d4f, #f5222d, #cf1322, #a8071a, #820014, #5c0011);
+ @include viewstyle(#000000, #434343,rgba(255, 255, 255, 0.85), rgba(255, 255, 255, 0.65), #fff1f0, #ffccc7, #ffa39e, #ff7875, #ff4d4f, #f5222d, #cf1322);
@include bgblack();
}
body.mk-red-white {
--mk-sys-color: #f5222d;
- @include viewstyle(#ffffff, #ffffff, rgba(0, 0, 0, 0.85), rgba(0, 0, 0, 0.65), #fff1f0, #ffccc7, #ffa39e, #ff7875, #ff4d4f, #f5222d, #cf1322, #a8071a, #820014, #5c0011);
+ @include viewstyle(#ffffff, #ffffff, rgba(0, 0, 0, 0.85), rgba(0, 0, 0, 0.65), #fff1f0, #ffccc7, #ffa39e, #ff7875, #ff4d4f, #f5222d, #cf1322);
}
body.mk-orange-red-black {
--mk-sys-color: #fa541c;
- @include viewstyle(#000000, #434343,rgba(255, 255, 255, 0.85), rgba(255, 255, 255, 0.65), #fff2e8, #ffd8bf, #ffbb96, #ff9c6e, #ff7a45, #fa541c, #d4380d, #ad2102, #871400, #610b00);
+ @include viewstyle(#000000, #434343,rgba(255, 255, 255, 0.85), rgba(255, 255, 255, 0.65), #fff2e8, #ffd8bf, #ffbb96, #ff9c6e, #ff7a45, #fa541c, #d4380d);
@include bgblack();
}
body.mk-orange-red-white {
--mk-sys-color: #fa541c;
- @include viewstyle(#ffffff, #ffffff, rgba(0, 0, 0, 0.85), rgba(0, 0, 0, 0.65), #fff2e8, #ffd8bf, #ffbb96, #ff9c6e, #ff7a45, #fa541c, #d4380d, #ad2102, #871400, #610b00);
+ @include viewstyle(#ffffff, #ffffff, rgba(0, 0, 0, 0.85), rgba(0, 0, 0, 0.65), #fff2e8, #ffd8bf, #ffbb96, #ff9c6e, #ff7a45, #fa541c, #d4380d);
}
body.mk-orange-black {
--mk-sys-color: #fa8c16;
- @include viewstyle(#000000, #434343,rgba(255, 255, 255, 0.85), rgba(255, 255, 255, 0.65), #fff7e6, #ffe7ba, #ffd591, #ffc069, #ffa940, #fa8c16, #d46b08, #ad4e00, #873800, #612500);
+ @include viewstyle(#000000, #434343,rgba(255, 255, 255, 0.85), rgba(255, 255, 255, 0.65), #fff7e6, #ffe7ba, #ffd591, #ffc069, #ffa940, #fa8c16, #d46b08);
@include bgblack();
}
body.mk-orange-white {
--mk-sys-color: #fa8c16;
- @include viewstyle(#ffffff, #ffffff, rgba(0, 0, 0, 0.85), rgba(0, 0, 0, 0.65), #fff7e6, #ffe7ba, #ffd591, #ffc069, #ffa940, #fa8c16, #d46b08, #ad4e00, #873800, #612500);
+ @include viewstyle(#ffffff, #ffffff, rgba(0, 0, 0, 0.85), rgba(0, 0, 0, 0.65), #fff7e6, #ffe7ba, #ffd591, #ffc069, #ffa940, #fa8c16, #d46b08);
}
body.mk-orange-yellow-black {
--mk-sys-color: #faad14;
- @include viewstyle(#000000, #434343,rgba(255, 255, 255, 0.85), rgba(255, 255, 255, 0.65),#fffbe6, #fff1b8, #ffe58f, #ffd666, #ffc53d, #faad14, #d48806, #ad6800, #874d00, #613400);
+ @include viewstyle(#000000, #434343,rgba(255, 255, 255, 0.85), rgba(255, 255, 255, 0.65),#fffbe6, #fff1b8, #ffe58f, #ffd666, #ffc53d, #faad14, #d48806);
@include bgblack();
}
body.mk-orange-yellow-white {
--mk-sys-color: #faad14;
- @include viewstyle(#ffffff, #ffffff, rgba(0, 0, 0, 0.85), rgba(0, 0, 0, 0.65), #fffbe6, #fff1b8, #ffe58f, #ffd666, #ffc53d, #faad14, #d48806, #ad6800, #874d00, #613400);
+ @include viewstyle(#ffffff, #ffffff, rgba(0, 0, 0, 0.85), rgba(0, 0, 0, 0.65), #fffbe6, #fff1b8, #ffe58f, #ffd666, #ffc53d, #faad14, #d48806);
}
body.mk-yellow-black {
--mk-sys-color: #fadb14;
- @include viewstyle(#000000, #434343,rgba(255, 255, 255, 0.85), rgba(255, 255, 255, 0.65),#feffe6, #ffffb8, #fffb8f, #fff566, #ffec3d, #fadb14, #d4b106, #ad8b00, #876800, #614700);
+ @include viewstyle(#000000, #434343,rgba(255, 255, 255, 0.85), rgba(255, 255, 255, 0.65),#feffe6, #ffffb8, #fffb8f, #fff566, #ffec3d, #fadb14, #d4b106);
@include bgblack();
}
body.mk-yellow-white {
--mk-sys-color: #fadb14;
- @include viewstyle(#ffffff, #ffffff, rgba(0, 0, 0, 0.85), rgba(0, 0, 0, 0.65), #feffe6, #ffffb8, #fffb8f, #fff566, #ffec3d, #fadb14, #d4b106, #ad8b00, #876800, #614700);
+ @include viewstyle(#ffffff, #ffffff, rgba(0, 0, 0, 0.85), rgba(0, 0, 0, 0.65), #feffe6, #ffffb8, #fffb8f, #fff566, #ffec3d, #fadb14, #d4b106);
}
body.mk-yellow-green-black {
--mk-sys-color: #a0d911;
- @include viewstyle(#000000, #434343,rgba(255, 255, 255, 0.85), rgba(255, 255, 255, 0.65),#fcffe6, #f4ffb8, #eaff8f, #d3f261, #bae637, #a0d911, #7cb305, #5b8c00, #3f6600, #254000);
+ @include viewstyle(#000000, #434343,rgba(255, 255, 255, 0.85), rgba(255, 255, 255, 0.65),#fcffe6, #f4ffb8, #eaff8f, #d3f261, #bae637, #a0d911, #7cb305);
@include bgblack();
}
body.mk-yellow-green-white {
--mk-sys-color: #a0d911;
- @include viewstyle(#ffffff, #ffffff, rgba(0, 0, 0, 0.85), rgba(0, 0, 0, 0.65), #fcffe6, #f4ffb8, #eaff8f, #d3f261, #bae637, #a0d911, #7cb305, #5b8c00, #3f6600, #254000);
+ @include viewstyle(#ffffff, #ffffff, rgba(0, 0, 0, 0.85), rgba(0, 0, 0, 0.65), #fcffe6, #f4ffb8, #eaff8f, #d3f261, #bae637, #a0d911, #7cb305);
}
body.mk-green-black {
--mk-sys-color: #52c41a;
- @include viewstyle(#000000, #434343,rgba(255, 255, 255, 0.85), rgba(255, 255, 255, 0.65),#f6ffed, #d9f7be, #b7eb8f, #95de64, #73d13d, #52c41a, #389e0d, #237804, #135200, #092b00);
+ @include viewstyle(#000000, #434343,rgba(255, 255, 255, 0.85), rgba(255, 255, 255, 0.65),#f6ffed, #d9f7be, #b7eb8f, #95de64, #73d13d, #52c41a, #389e0d);
@include bgblack();
}
body.mk-green-white {
--mk-sys-color: #52c41a;
- @include viewstyle(#ffffff, #ffffff, rgba(0, 0, 0, 0.85), rgba(0, 0, 0, 0.65), #f6ffed, #d9f7be, #b7eb8f, #95de64, #73d13d, #52c41a, #389e0d, #237804, #135200, #092b00);
+ @include viewstyle(#ffffff, #ffffff, rgba(0, 0, 0, 0.85), rgba(0, 0, 0, 0.65), #f6ffed, #d9f7be, #b7eb8f, #95de64, #73d13d, #52c41a, #389e0d);
}
body.mk-cyan-black {
--mk-sys-color: #13c2c2;
- @include viewstyle(#000000, #434343,rgba(255, 255, 255, 0.85), rgba(255, 255, 255, 0.65),#e6fffb, #b5f5ec, #87e8de, #5cdbd3, #36cfc9, #13c2c2, #08979c, #006d75, #00474f, #002329);
+ @include viewstyle(#000000, #434343,rgba(255, 255, 255, 0.85), rgba(255, 255, 255, 0.65),#e6fffb, #b5f5ec, #87e8de, #5cdbd3, #36cfc9, #13c2c2, #08979c);
@include bgblack();
}
body.mk-cyan-white {
--mk-sys-color: #13c2c2;
- @include viewstyle(#ffffff, #ffffff, rgba(0, 0, 0, 0.85), rgba(0, 0, 0, 0.65), #e6fffb, #b5f5ec, #87e8de, #5cdbd3, #36cfc9, #13c2c2, #08979c, #006d75, #00474f, #002329);
+ @include viewstyle(#ffffff, #ffffff, rgba(0, 0, 0, 0.85), rgba(0, 0, 0, 0.65), #e6fffb, #b5f5ec, #87e8de, #5cdbd3, #36cfc9, #13c2c2, #08979c);
}
body.mk-blue-purple-black {
--mk-sys-color: #2f54eb;
- @include viewstyle(#000000, #434343,rgba(255, 255, 255, 0.85), rgba(255, 255, 255, 0.65),#f0f5ff, #d6e4ff, #adc6ff, #85a5ff, #597ef7, #2f54eb, #1d39c4, #10239e, #061178, #030852);
+ @include viewstyle(#000000, #434343,rgba(255, 255, 255, 0.85), rgba(255, 255, 255, 0.65),#f0f5ff, #d6e4ff, #adc6ff, #85a5ff, #597ef7, #2f54eb, #1d39c4);
@include bgblack();
}
body.mk-blue-purple-white {
--mk-sys-color: #2f54eb;
- @include viewstyle(#ffffff, #ffffff, rgba(0, 0, 0, 0.85), rgba(0, 0, 0, 0.65), #f0f5ff, #d6e4ff, #adc6ff, #85a5ff, #597ef7, #2f54eb, #1d39c4, #10239e, #061178, #030852);
+ @include viewstyle(#ffffff, #ffffff, rgba(0, 0, 0, 0.85), rgba(0, 0, 0, 0.65), #f0f5ff, #d6e4ff, #adc6ff, #85a5ff, #597ef7, #2f54eb, #1d39c4);
}
body.mk-purple-black {
--mk-sys-color: #722ed1;
- @include viewstyle(#000000, #434343,rgba(255, 255, 255, 0.85), rgba(255, 255, 255, 0.65),#f9f0ff, #efdbff, #d3adf7, #b37feb, #9254de, #722ed1, #531dab, #391085, #22075e, #120338);
+ @include viewstyle(#000000, #434343,rgba(255, 255, 255, 0.85), rgba(255, 255, 255, 0.65),#f9f0ff, #efdbff, #d3adf7, #b37feb, #9254de, #722ed1, #531dab);
@include bgblack();
}
body.mk-purple-white {
--mk-sys-color: #722ed1;
- @include viewstyle(#ffffff, #ffffff, rgba(0, 0, 0, 0.85), rgba(0, 0, 0, 0.65), #f9f0ff, #efdbff, #d3adf7, #b37feb, #9254de, #722ed1, #531dab, #391085, #22075e, #120338);
+ @include viewstyle(#ffffff, #ffffff, rgba(0, 0, 0, 0.85), rgba(0, 0, 0, 0.65), #f9f0ff, #efdbff, #d3adf7, #b37feb, #9254de, #722ed1, #531dab);
}
body.mk-magenta-black {
--mk-sys-color: #eb2f96;
- @include viewstyle(#000000, #434343,rgba(255, 255, 255, 0.85), rgba(255, 255, 255, 0.65),#fff0f6, #ffd6e7, #ffadd2, #ff85c0, #f759ab, #eb2f96, #c41d7f, #9e1068, #780650, #520339);
+ @include viewstyle(#000000, #434343,rgba(255, 255, 255, 0.85), rgba(255, 255, 255, 0.65),#fff0f6, #ffd6e7, #ffadd2, #ff85c0, #f759ab, #eb2f96, #c41d7f);
@include bgblack();
}
body.mk-magenta-white {
--mk-sys-color: #eb2f96;
- @include viewstyle(#ffffff, #ffffff, rgba(0, 0, 0, 0.85), rgba(0, 0, 0, 0.65), #fff0f6, #ffd6e7, #ffadd2, #ff85c0, #f759ab, #eb2f96, #c41d7f, #9e1068, #780650, #520339);
+ @include viewstyle(#ffffff, #ffffff, rgba(0, 0, 0, 0.85), rgba(0, 0, 0, 0.65), #fff0f6, #ffd6e7, #ffadd2, #ff85c0, #f759ab, #eb2f96, #c41d7f);
}
body.mk-grass-green-black {
--mk-sys-color: #aeb303;
- @include viewstyle(#000000, #434343,rgba(255, 255, 255, 0.85), rgba(255, 255, 255, 0.65),#f2efda, #e6de97, #d9d26c, #ccc845, #bfbf22, #aeb303, #838c00, #5c6600, #374000, #151a00);
+ @include viewstyle(#000000, #434343,rgba(255, 255, 255, 0.85), rgba(255, 255, 255, 0.65),#f2efda, #e6de97, #d9d26c, #ccc845, #bfbf22, #aeb303, #838c00);
@include bgblack();
}
body.mk-grass-green-white {
--mk-sys-color: #aeb303;
- @include viewstyle(#ffffff, #ffffff, rgba(0, 0, 0, 0.85), rgba(0, 0, 0, 0.65), #f2efda, #e6de97, #d9d26c, #ccc845, #bfbf22, #aeb303, #838c00, #5c6600, #374000, #151a00);
+ @include viewstyle(#ffffff, #ffffff, rgba(0, 0, 0, 0.85), rgba(0, 0, 0, 0.65), #f2efda, #e6de97, #d9d26c, #ccc845, #bfbf22, #aeb303, #838c00);
}
body.mk-deep-red-black {
--mk-sys-color: #c32539;
- @include viewstyle(#000000, #434343,rgba(255, 255, 255, 0.85), rgba(255, 255, 255, 0.65),#fff0f0, #f5cbcb, #e89b9e, #db7077, #cf4856, #c32539, #9c162c, #750b20, #4f0315, #29010c);
+ @include viewstyle(#000000, #434343,rgba(255, 255, 255, 0.85), rgba(255, 255, 255, 0.65),#fff0f0, #f5cbcb, #e89b9e, #db7077, #cf4856, #c32539, #9c162c);
@include bgblack();
}
body.mk-deep-red-white {
--mk-sys-color: #c32539;
- @include viewstyle(#ffffff, #ffffff, rgba(0, 0, 0, 0.85), rgba(0, 0, 0, 0.65), #fff0f0, #f5cbcb, #e89b9e, #db7077, #cf4856, #c32539, #9c162c, #750b20, #4f0315, #29010c);
+ @include viewstyle(#ffffff, #ffffff, rgba(0, 0, 0, 0.85), rgba(0, 0, 0, 0.65), #fff0f0, #f5cbcb, #e89b9e, #db7077, #cf4856, #c32539, #9c162c);
}
diff --git a/src/menu/components/table/base-table/columns/index.jsx b/src/menu/components/table/base-table/columns/index.jsx
index c74157f..07ec61f 100644
--- a/src/menu/components/table/base-table/columns/index.jsx
+++ b/src/menu/components/table/base-table/columns/index.jsx
@@ -140,6 +140,34 @@
}))(HeaderCol),
)
+class HeaderEmptyCol extends Component {
+ render() {
+ const { connectDragSource, connectDropTarget } = this.props
+
+ return connectDragSource(
+ connectDropTarget(<div style={{border: '1px solid #e8e8e8', textAlign: 'center', height: '100px', lineHeight: '100px', color: '#bcbcbc'}}>璇锋坊鍔犳樉绀哄垪</div>)
+ )
+ }
+}
+
+const ColEmptyTarget = {
+ drop(props, monitor) {
+ const item = monitor.getItem()
+
+ if (item.$init) {
+ props.dropCol(item, 0)
+ }
+ }
+}
+
+const DragableEmptyCol = DropTarget('col', ColEmptyTarget, connect => ({
+ connectDropTarget: connect.dropTarget()
+}))(
+ DragSource('col', rowSource, connect => ({
+ connectDragSource: connect.dragSource(),
+ }))(HeaderEmptyCol)
+)
+
class EditableColumnCell extends Component {
updateCard = (vals, btn) => {
const { column } = this.props
@@ -648,7 +676,7 @@
} : false}
/>
}) :
- <Table
+ (columns.length === 0 ? <DragableEmptyCol dropCol={this.dropCol}/> : <Table
rowKey="uuid"
size={config.wrap.size || 'middle'}
bordered={config.wrap.bordered !== 'false'}
@@ -664,7 +692,7 @@
total: 58,
showTotal: (total, range) => `${range[0]}-${range[1]} 鍏� ${total} 鏉
}}
- />}
+ />)}
</DndProvider>
<EditColumn column={card} fields={fields} submitCol={this.submitCol} cancelCol={this.cancelCol}/>
</div>
diff --git a/src/views/systemproc/proc/index.jsx b/src/views/systemproc/proc/index.jsx
index 51811aa..6f13864 100644
--- a/src/views/systemproc/proc/index.jsx
+++ b/src/views/systemproc/proc/index.jsx
@@ -1,5 +1,6 @@
import React, {Component} from 'react'
-import { Input, notification, Button, Form, Modal } from 'antd'
+import { Input, notification, Button, Form, Modal, Empty } from 'antd'
+import { MenuUnfoldOutlined, MenuFoldOutlined } from '@ant-design/icons'
import moment from 'moment'
import Utils from '@/utils/utils.js'
@@ -16,6 +17,9 @@
content: '',
loading: false,
visible: false,
+ searchable: false,
+ inputing: false,
+ procList: [],
permFuncs: []
}
@@ -23,7 +27,7 @@
if (sessionStorage.getItem('permFuncField')) {
this.setState({permFuncs: JSON.parse(sessionStorage.getItem('permFuncField'))})
} else {
- Api.getSystemConfig({func: 'sPC_Get_Roles_sModular'}).then(res => {
+ Api.getCloudConfig({func: 'sPC_Get_Roles_sModular'}).then(res => {
if (res.status) {
let _permFuncs = []
@@ -108,17 +112,21 @@
]
let error = ''
+
+ if (!/create(\s+)proc/ig.test(value)) {
+ error = '鑴氭湰涓繀椤讳娇鐢╟reate proc'
+ }
chars.forEach(char => {
if (!error && char.reg.test(value)) {
- error = char.key
+ error = '涓嶅彲浣跨敤' + char.key
}
})
if (error) {
notification.warning({
top: 92,
- message: '涓嶅彲浣跨敤' + error,
+ message: error,
duration: 5
})
return
@@ -299,26 +307,77 @@
})
}
+ searchAll = (value) => {
+ let param = {
+ func: 's_proc_search',
+ proc_name: value || ''
+ }
+
+ this.setState({loading: true})
+
+ Api.genericInterface(param).then(res => {
+ this.setState({loading: false})
+ if (!res.status) {
+ notification.warning({
+ top: 92,
+ message: res.message,
+ duration: 5
+ })
+ return
+ }
+
+ this.setState({procList: res.data || []})
+ })
+ }
+
+ changeProc = (name) => {
+ const { loading } = this.state
+
+ if (loading) {
+ notification.warning({
+ top: 92,
+ message: '鏌ヨ涓绋嶅悗銆�',
+ duration: 5
+ })
+ return
+ }
+
+ this.setState({inputing: true, procName: name}, () => {
+ this.setState({inputing: false})
+ this.search(name)
+ })
+ }
+
render () {
const { getFieldDecorator } = this.props.form
- const { loading, content, procName, visible, permFuncs } = this.state
+ const { loading, content, procName, visible, permFuncs, searchable, procList, inputing } = this.state
let _patten = permFuncs.length ? new RegExp('^(' + permFuncs.join('|') + ')[0-9a-zA-Z_]*$', 'g') : ''
return (
<div className="mk-proc-wrap">
- <div className="control-wrap">
- <div className="search-wrap">
- <Search placeholder="璇疯緭鍏ュ瓨鍌ㄨ繃绋嬪悕绉�" disabled={loading} enterButton="纭畾" onSearch={this.search}/>
- </div>
- <div className="action-wrap">
- <Button key="save" className="mk-btn mk-green" disabled={loading} onClick={() => this.save()}>淇濆瓨</Button>
- <Button key="prev" className="mk-btn mk-primary" disabled={!procName || loading} onClick={this.prev}>涓婁竴鐗堟湰</Button>
- <Button key="next" className="mk-btn mk-primary" disabled={!procName || loading} onClick={this.next}>涓嬩竴鐗堟湰</Button>
+ <div className={'searh-list' + (searchable ? ' open' : '')}>
+ <Search placeholder="瀛樺偍杩囩▼鍚嶇О鏌ヨ" disabled={loading} onSearch={this.searchAll}/>
+ <div className="proc-list">
+ {procList.map((item, index) => (<div className="proc-item" onClick={() => this.changeProc(item.proc_name)} key={index}>{item.proc_name}</div>))}
+ {procList.length === 0 ? <Empty /> : null}
</div>
</div>
- <div className="edit-wrap">
- <CodeMirror value={content} onChange={(val) => this.setState({content: val})}/>
+ <div className="proc-wrap">
+ <div className="control-wrap">
+ <div className="search-wrap">
+ {searchable ? <MenuUnfoldOutlined onClick={() => this.setState({searchable: !searchable})}/> : <MenuFoldOutlined onClick={() => this.setState({searchable: !searchable})}/>}
+ {!inputing ? <Search placeholder="璇疯緭鍏ュ瓨鍌ㄨ繃绋嬪悕绉�" defaultValue={procName} disabled={loading} enterButton="纭畾" onSearch={this.search}/> : null}
+ </div>
+ <div className="action-wrap">
+ <Button key="save" className="mk-btn mk-green" disabled={loading} onClick={() => this.save()}>淇濆瓨</Button>
+ <Button key="prev" className="mk-btn mk-primary" disabled={!procName || loading} onClick={this.prev}>涓婁竴鐗堟湰</Button>
+ <Button key="next" className="mk-btn mk-primary" disabled={!procName || loading} onClick={this.next}>涓嬩竴鐗堟湰</Button>
+ </div>
+ </div>
+ <div className="edit-wrap">
+ <CodeMirror value={content} onChange={(val) => this.setState({content: val})}/>
+ </div>
</div>
<Modal
title="鏂板缓"
diff --git a/src/views/systemproc/proc/index.scss b/src/views/systemproc/proc/index.scss
index fc2fdff..653bc5c 100644
--- a/src/views/systemproc/proc/index.scss
+++ b/src/views/systemproc/proc/index.scss
@@ -1,12 +1,63 @@
.mk-proc-wrap {
position: relative;
padding: 65px 20px 0px;
+ display: flex;
+ .searh-list {
+ width: 0px;
+ margin-right: 15px;
+ overflow: hidden;
+ transition: width 0.2s;
+
+ .ant-input-search {
+ width: 300px;
+ }
+ .proc-list {
+ width: 300px;
+ height: calc(100vh - 128px);
+ overflow-y: auto;
+ overflow-x: hidden;
+ margin-top: 10px;
+ border: 1px solid #e8e8e8;
+
+ .proc-item {
+ padding: 5px;
+ margin: 5px;
+ word-break: break-all;
+ cursor: pointer;
+ }
+ .ant-empty {
+ margin-top: 50px;
+ }
+ }
+ .proc-list::-webkit-scrollbar {
+ width: 7px;
+ height: 7px;
+ }
+ .proc-list::-webkit-scrollbar-thumb {
+ border-radius: 5px;
+ box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.13);
+ background: rgba(0, 0, 0, 0.13);
+ }
+ .proc-list::-webkit-scrollbar-track {
+ box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.05);
+ border-radius: 3px;
+ border: 1px solid rgba(0, 0, 0, 0.07);
+ background: rgba(0, 0, 0, 0);
+ }
+ }
+ .searh-list.open {
+ width: 300px;
+ }
+ .proc-wrap {
+ flex: 1;
+ }
.control-wrap {
display: flex;
.search-wrap {
- width: 300px;
+ width: 360px;
+ display: flex;
.ant-btn[disabled] {
background-color: #1890ff!important;
@@ -14,6 +65,17 @@
color: #ffffff!important;
opacity: 0.5;
}
+ .ant-input {
+ border-radius: 0;
+ }
+ >.anticon {
+ line-height: 30px;
+ width: 35px;
+ border: 1px solid #e8e8e8;
+ cursor: pointer;
+ border-top-left-radius: 4px;
+ border-bottom-left-radius: 4px;
+ }
}
.action-wrap {
text-align: right;
--
Gitblit v1.8.0