From efad1f9eff8d6af31f5b15edceee7b855b3db957 Mon Sep 17 00:00:00 2001
From: king <18310653075@163.com>
Date: 星期三, 22 十二月 2021 00:00:28 +0800
Subject: [PATCH] 2021-12-22

---
 src/mob/components/navbar/normal-navbar/menusetting/index.jsx     |    5 
 src/mob/components/navbar/normal-navbar/index.jsx                 |   17 +-
 src/menu/sysinterface/settingform/simplescript/index.jsx          |   13 +-
 src/mob/colorsketch/index.jsx                                     |    5 
 src/mob/components/menubar/normal-menubar/menucomponent/index.jsx |   18 +-
 src/menu/components/tree/antd-tree/index.scss                     |   13 +
 src/menu/stylecontroller/index.jsx                                |  106 +++++++++++------
 src/tabviews/custom/components/tree/antd-tree/index.jsx           |    4 
 src/mob/components/menubar/normal-menubar/index.jsx               |   15 +-
 src/mob/components/formdragelement/card.jsx                       |   26 ++--
 src/menu/components/tree/antd-tree/index.jsx                      |    2 
 src/tabviews/custom/components/tree/antd-tree/index.scss          |    9 
 src/menu/stylecombcontroller/index.jsx                            |   95 ++++++++++-----
 src/menu/sysinterface/index.jsx                                   |   13 +-
 14 files changed, 206 insertions(+), 135 deletions(-)

diff --git a/src/menu/components/tree/antd-tree/index.jsx b/src/menu/components/tree/antd-tree/index.jsx
index 544f078..5911a79 100644
--- a/src/menu/components/tree/antd-tree/index.jsx
+++ b/src/menu/components/tree/antd-tree/index.jsx
@@ -166,7 +166,7 @@
     let _style = resetStyle(card.style)
 
     return (
-      <div className="menu-editor-sand-box" style={_style} onClick={this.clickComponent} id={card.uuid}>
+      <div className="menu-tree-box" style={_style} onClick={this.clickComponent} id={card.uuid}>
         <NormalHeader config={card} updateComponent={this.updateComponent}/>
         <Popover overlayClassName="mk-popover-control-wrap" mouseLeaveDelay={0.2} mouseEnterDelay={0.2} content={
           <div className="mk-popover-control">
diff --git a/src/menu/components/tree/antd-tree/index.scss b/src/menu/components/tree/antd-tree/index.scss
index c096ca8..ff7b7fb 100644
--- a/src/menu/components/tree/antd-tree/index.scss
+++ b/src/menu/components/tree/antd-tree/index.scss
@@ -1,11 +1,12 @@
-.menu-editor-sand-box {
+.menu-tree-box {
   position: relative;
   box-sizing: border-box;
   background: #ffffff;
   background-position: center center;
   background-repeat: no-repeat;
   background-size: cover;
-  min-height: 30px;
+  min-height: 50px;
+  overflow-y: auto;
 
   .anticon-tool {
     position: absolute;
@@ -25,12 +26,16 @@
     color: #bcbcbc;
   }
 }
-.menu-editor-sand-box::after {
+.menu-tree-box::after {
   display: block;
   content: ' ';
   clear: both;
 }
-.menu-editor-sand-box:hover {
+.menu-tree-box:hover {
   z-index: 1;
   box-shadow: 0px 0px 4px #1890ff;
 }
+.menu-tree-box::-webkit-scrollbar {
+  display: none;
+}
+
diff --git a/src/menu/stylecombcontroller/index.jsx b/src/menu/stylecombcontroller/index.jsx
index f7b3ffa..e9b5f91 100644
--- a/src/menu/stylecombcontroller/index.jsx
+++ b/src/menu/stylecombcontroller/index.jsx
@@ -1,7 +1,34 @@
 import React, {Component} from 'react'
 import PropTypes from 'prop-types'
 import { is, fromJS } from 'immutable'
-import { Collapse, Form, Col, Icon, InputNumber, Select, Radio, Drawer, Button } from 'antd'
+import { Collapse, Form, Col, InputNumber, Select, Radio, Drawer, Button } from 'antd'
+import {
+  ColumnHeightOutlined,
+  FontSizeOutlined,
+  BoldOutlined,
+  LineHeightOutlined,
+  ColumnWidthOutlined,
+  FontColorsOutlined,
+  ItalicOutlined,
+  AlignLeftOutlined,
+  AlignCenterOutlined,
+  AlignRightOutlined,
+  UnderlineOutlined,
+  StrikethroughOutlined,
+  BgColorsOutlined,
+  BorderOutlined,
+  BorderOuterOutlined,
+  BorderLeftOutlined,
+  BorderRightOutlined,
+  BorderTopOutlined,
+  BorderBottomOutlined,
+  RadiusSettingOutlined,
+  ArrowUpOutlined,
+  ArrowDownOutlined,
+  ArrowLeftOutlined,
+  ArrowRightOutlined,
+  SwapOutlined,
+} from '@ant-design/icons'
 
 import MKEmitter from '@/utils/events.js'
 import ColorSketch from '@/mob/colorsketch'
@@ -254,7 +281,7 @@
                 <Col span={24}>
                   <Form.Item
                     colon={false}
-                    label={<Icon title="楂樺害" type="column-height" />}
+                    label={<ColumnHeightOutlined title="楂樺害" />}
                     labelCol={{xs: { span: 24 }, sm: { span: 4 }}} wrapperCol={ {xs: { span: 24 }, sm: { span: 20 }} }
                   >
                     <StyleInput defaultValue={''} options={['px', 'vh', 'vw']} onChange={this.changeHeight}/>
@@ -263,12 +290,12 @@
               </Panel> : null}
               {options.includes('font') ? <Panel header="瀛椾綋" key="font">
                 <Col span={12}>
-                  <Form.Item colon={false} label={<Icon title="瀛椾綋澶у皬" type="font-size" />}>
+                  <Form.Item colon={false} label={<FontSizeOutlined title="瀛椾綋澶у皬"/>}>
                     <InputNumber defaultValue={''} min={12} max={100} precision={0} onChange={this.changeFontSize} />
                   </Form.Item>
                 </Col>
                 <Col span={12}>
-                  <Form.Item colon={false} label={<Icon title="瀛椾綋绮楃粏" type="bold" />}>
+                  <Form.Item colon={false} label={<BoldOutlined title="瀛椾綋绮楃粏"/>}>
                     <Select defaultValue={''} onChange={this.boldChange}>
                       <Option value="normal">normal</Option>
                       <Option value="bold">bold</Option>
@@ -287,19 +314,19 @@
                   </Form.Item>
                 </Col>
                 <Col span={12}>
-                  <Form.Item colon={false} label={<Icon title="琛岄珮" type="line-height" />}>
+                  <Form.Item colon={false} label={<LineHeightOutlined title="琛岄珮" />}>
                     <InputNumber defaultValue={''} min={1} max={10} precision={1} onChange={this.changeLineHeight} />
                   </Form.Item>
                 </Col>
                 <Col span={12}>
-                  <Form.Item colon={false} label={<Icon title="瀛楅棿璺�" type="column-width" />}>
+                  <Form.Item colon={false} label={<ColumnWidthOutlined title="瀛楅棿璺�"/>}>
                     <InputNumber defaultValue={''} min={0} max={100} precision={0} onChange={this.changeLetterSpacing}/>
                   </Form.Item>
                 </Col>
                 <Col span={24}>
                   <Form.Item
                     colon={false}
-                    label={<Icon title="瀛椾綋棰滆壊" type="font-colors" />}
+                    label={<FontColorsOutlined title="瀛椾綋棰滆壊"/>}
                     labelCol={{xs: { span: 24 }, sm: { span: 4 }}} wrapperCol={ {xs: { span: 24 }, sm: { span: 20 }} }
                   >
                     <ColorSketch onChange={this.changeFontColor} />
@@ -313,7 +340,7 @@
                   >
                     <Radio.Group defaultValue={''} onChange={this.changeFontStyle}>
                       <Radio.Button value="normal"><span title="鏍囧噯">N</span></Radio.Button>
-                      <Radio.Button value="italic"><Icon title="鏂滀綋" type="italic" /></Radio.Button>
+                      <Radio.Button value="italic"><ItalicOutlined title="鏂滀綋"/></Radio.Button>
                       <Radio.Button value="oblique" style={{fontStyle: 'oblique'}}><span title="鍊炬枩">B</span></Radio.Button>
                     </Radio.Group>
                   </Form.Item>
@@ -325,9 +352,9 @@
                     labelCol={{xs: { span: 24 }, sm: { span: 4 }}} wrapperCol={ {xs: { span: 24 }, sm: { span: 20 }} }
                   >
                     <Radio.Group className="text-align" defaultValue={''} onChange={this.changeTextAlign}>
-                      <Radio.Button value="left"><Icon title="宸﹀榻�" type="align-left" /></Radio.Button>
-                      <Radio.Button value="center"><Icon title="灞呬腑瀵归綈" type="align-center" /></Radio.Button>
-                      <Radio.Button value="right"><Icon title="鍙冲榻�" type="align-right" /></Radio.Button>
+                      <Radio.Button value="left"><AlignLeftOutlined title="宸﹀榻�"/></Radio.Button>
+                      <Radio.Button value="center"><AlignCenterOutlined title="灞呬腑瀵归綈"/></Radio.Button>
+                      <Radio.Button value="right"><AlignRightOutlined title="鍙冲榻�"/></Radio.Button>
                     </Radio.Group>
                   </Form.Item>
                 </Col>
@@ -339,8 +366,8 @@
                   >
                     <Radio.Group className="text-decoration" defaultValue={''} onChange={this.changeTextDecoration}>
                       <Radio.Button value="none"><span title="鏍囧噯">N</span></Radio.Button>
-                      <Radio.Button value="underline"><Icon title="涓嬪垝绾�" type="underline" /></Radio.Button>
-                      <Radio.Button value="line-through"><Icon title="涓垝绾�" type="strikethrough" /></Radio.Button>
+                      <Radio.Button value="underline"><UnderlineOutlined title="涓嬪垝绾�"/></Radio.Button>
+                      <Radio.Button value="line-through"><StrikethroughOutlined title="涓垝绾�"/></Radio.Button>
                       <Radio.Button value="overline" style={{textDecoration: 'overline'}}><span title="涓婂垝绾�">O</span></Radio.Button>
                     </Radio.Group>
                   </Form.Item>
@@ -350,7 +377,7 @@
                 <Col span={24}>
                   <Form.Item
                     colon={false}
-                    label={<Icon title="鑳屾櫙棰滆壊" type="bg-colors" />}
+                    label={<BgColorsOutlined title="鑳屾櫙棰滆壊"/>}
                     labelCol={{xs: { span: 24 }, sm: { span: 4 }}} wrapperCol={ {xs: { span: 24 }, sm: { span: 20 }} }
                   >
                     <ColorSketch onChange={this.changeBackgroundColor} />
@@ -361,22 +388,22 @@
                 <Col span={24}>
                   <Form.Item
                     colon={false}
-                    label={<Icon title="杈规浣嶇疆" type="border" />}
+                    label={<BorderOutlined title="杈规浣嶇疆"/>}
                     labelCol={{xs: { span: 24 }, sm: { span: 4 }}} wrapperCol={ {xs: { span: 24 }, sm: { span: 20 }} }
                   >
                     <Radio.Group className="border-position" defaultValue={'outer'} onChange={(e) => this.setState({borposition: e.target.value})}>
-                      <Radio value="outer"><Icon title="澶栬竟妗�" type="border-outer" /></Radio>
-                      <Radio value="left"><Icon title="宸﹁竟妗�" type="border-left" /></Radio>
-                      <Radio value="right"><Icon title="鍙宠竟妗�" type="border-right" /></Radio>
-                      <Radio value="top"><Icon title="涓婅竟妗�" type="border-top" /></Radio>
-                      <Radio value="bottom"><Icon title="涓嬭竟妗�" type="border-bottom" /></Radio>
+                      <Radio value="outer"><BorderOuterOutlined title="澶栬竟妗�"/></Radio>
+                      <Radio value="left"><BorderLeftOutlined title="宸﹁竟妗�"/></Radio>
+                      <Radio value="right"><BorderRightOutlined title="鍙宠竟妗�"/></Radio>
+                      <Radio value="top"><BorderTopOutlined title="涓婅竟妗�"/></Radio>
+                      <Radio value="bottom"><BorderBottomOutlined title="涓嬭竟妗�"/></Radio>
                     </Radio.Group>
                   </Form.Item>
                 </Col>
                 <Col span={24}>
                   <Form.Item
                     colon={false}
-                    label={<Icon title="杈规鏍峰紡" type="border-outer" />}
+                    label={<BorderOuterOutlined title="杈规鏍峰紡"/>}
                     labelCol={{xs: { span: 24 }, sm: { span: 4 }}} wrapperCol={ {xs: { span: 24 }, sm: { span: 20 }} }
                   >
                     {borposition === 'outer' ? <Select defaultValue={'solid'} onChange={this.changeBorderStyle}>
@@ -414,7 +441,7 @@
                 <Col span={24}>
                   <Form.Item
                     colon={false}
-                    label={<Icon title="杈规瀹藉害" type="column-width" />}
+                    label={<ColumnWidthOutlined title="杈规瀹藉害"/>}
                     labelCol={{xs: { span: 24 }, sm: { span: 4 }}} wrapperCol={ {xs: { span: 24 }, sm: { span: 20 }} }
                   >
                     {borposition === 'outer' ? <StyleInput defaultValue={''} options={['px']} onChange={this.changeBorderWidth}/> : null}
@@ -427,7 +454,7 @@
                 <Col span={24}>
                   <Form.Item
                     colon={false}
-                    label={<Icon title="杈规棰滆壊" type="bg-colors" />}
+                    label={<BgColorsOutlined title="杈规棰滆壊"/>}
                     labelCol={{xs: { span: 24 }, sm: { span: 4 }}} wrapperCol={ {xs: { span: 24 }, sm: { span: 20 }} }
                   >
                     {borposition === 'outer' ? <ColorSketch onChange={this.changeBorderColor} /> : null}
@@ -440,7 +467,7 @@
                 <Col span={24}>
                   <Form.Item
                     colon={false}
-                    label={<Icon title="鍦嗚" type="radius-setting" />}
+                    label={<RadiusSettingOutlined title="鍦嗚"/>}
                     labelCol={{xs: { span: 24 }, sm: { span: 4 }}} wrapperCol={ {xs: { span: 24 }, sm: { span: 20 }} }
                   >
                     <StyleInput defaultValue={'0px'} options={['px', '%']} onChange={(val) => this.changeNormalStyle(val, 'borderRadius')}/>
@@ -451,7 +478,7 @@
                 <Col span={24}>
                   <Form.Item
                     colon={false}
-                    label={<Icon title="闃村奖棰滆壊" type="bg-colors" />}
+                    label={<BgColorsOutlined title="闃村奖棰滆壊"/>}
                     labelCol={{xs: { span: 24 }, sm: { span: 4 }}} wrapperCol={ {xs: { span: 24 }, sm: { span: 20 }} }
                   >
                     <ColorSketch onChange={this.changeShadowColor} />
@@ -462,7 +489,7 @@
                 <Col span={24}>
                   <Form.Item
                     colon={false}
-                    label={<Icon title="涓婅竟璺�" type="arrow-up"/>}
+                    label={<ArrowUpOutlined title="涓婅竟璺�"/>}
                     labelCol={{xs: { span: 24 }, sm: { span: 4 }}} wrapperCol={ {xs: { span: 24 }, sm: { span: 20 }} }
                   >
                     <StyleInput defaultValue={''} options={['px', 'vh', 'vw']} onChange={(val) => this.changeNormalStyle(val, 'marginTop')}/>
@@ -471,7 +498,7 @@
                 <Col span={24}>
                   <Form.Item
                     colon={false}
-                    label={<Icon title="涓嬭竟璺�" type="arrow-down"/>}
+                    label={<ArrowDownOutlined title="涓嬭竟璺�"/>}
                     labelCol={{xs: { span: 24 }, sm: { span: 4 }}} wrapperCol={ {xs: { span: 24 }, sm: { span: 20 }} }
                   >
                     <StyleInput defaultValue={''} options={['px', 'vh', 'vw']} onChange={(val) => this.changeNormalStyle(val, 'marginBottom')}/>
@@ -480,7 +507,7 @@
                 <Col span={24}>
                   <Form.Item
                     colon={false}
-                    label={<Icon title="宸﹁竟璺�" type="arrow-left"/>}
+                    label={<ArrowLeftOutlined title="宸﹁竟璺�"/>}
                     labelCol={{xs: { span: 24 }, sm: { span: 4 }}} wrapperCol={ {xs: { span: 24 }, sm: { span: 20 }} }
                   >
                     <StyleInput defaultValue={''} options={['px', 'vh', 'vw']} onChange={(val) => this.changeNormalStyle(val, 'marginLeft')}/>
@@ -489,7 +516,7 @@
                 <Col span={24}>
                   <Form.Item
                     colon={false}
-                    label={<Icon title="鍙宠竟璺�" type="arrow-right"/>}
+                    label={<ArrowRightOutlined title="鍙宠竟璺�"/>}
                     labelCol={{xs: { span: 24 }, sm: { span: 4 }}} wrapperCol={ {xs: { span: 24 }, sm: { span: 20 }} }
                   >
                     <StyleInput defaultValue={''} options={['px', 'vh', 'vw']} onChange={(val) => this.changeNormalStyle(val, 'marginRight')}/>
@@ -500,7 +527,7 @@
                 <Col span={24}>
                   <Form.Item
                     colon={false}
-                    label={<Icon title="涓婅竟璺�" type="arrow-up"/>}
+                    label={<ArrowUpOutlined title="涓婅竟璺�"/>}
                     labelCol={{xs: { span: 24 }, sm: { span: 4 }}} wrapperCol={ {xs: { span: 24 }, sm: { span: 20 }} }
                   >
                     <StyleInput defaultValue={''} options={['px', 'vh', 'vw']} onChange={(val) => this.changeNormalStyle(val, 'paddingTop')}/>
@@ -509,7 +536,7 @@
                 <Col span={24}>
                   <Form.Item
                     colon={false}
-                    label={<Icon title="涓嬭竟璺�" type="arrow-down"/>}
+                    label={<ArrowDownOutlined title="涓嬭竟璺�"/>}
                     labelCol={{xs: { span: 24 }, sm: { span: 4 }}} wrapperCol={ {xs: { span: 24 }, sm: { span: 20 }} }
                   >
                     <StyleInput defaultValue={''} options={['px', 'vh', 'vw']} onChange={(val) => this.changeNormalStyle(val, 'paddingBottom')}/>
@@ -518,7 +545,7 @@
                 <Col span={24}>
                   <Form.Item
                     colon={false}
-                    label={<Icon title="宸﹁竟璺�" type="arrow-left"/>}
+                    label={<ArrowLeftOutlined title="宸﹁竟璺�"/>}
                     labelCol={{xs: { span: 24 }, sm: { span: 4 }}} wrapperCol={ {xs: { span: 24 }, sm: { span: 20 }} }
                   >
                     <StyleInput defaultValue={''} options={['px', 'vh', 'vw']} onChange={(val) => this.changeNormalStyle(val, 'paddingLeft')}/>
@@ -527,7 +554,7 @@
                 <Col span={24}>
                   <Form.Item
                     colon={false}
-                    label={<Icon title="鍙宠竟璺�" type="arrow-right"/>}
+                    label={<ArrowRightOutlined title="鍙宠竟璺�"/>}
                     labelCol={{xs: { span: 24 }, sm: { span: 4 }}} wrapperCol={ {xs: { span: 24 }, sm: { span: 20 }} }
                   >
                     <StyleInput defaultValue={''} options={['px', 'vh', 'vw']} onChange={(val) => this.changeNormalStyle(val, 'paddingRight')}/>
@@ -538,7 +565,7 @@
                 <Col span={24}>
                   <Form.Item
                     colon={false}
-                    label={<Icon title="娴姩" type="swap" />}
+                    label={<SwapOutlined title="娴姩"/>}
                     labelCol={{xs: { span: 24 }, sm: { span: 4 }}} wrapperCol={ {xs: { span: 24 }, sm: { span: 20 }} }
                   >
                     <Radio.Group defaultValue={''} onChange={(e) => this.changeNormalStyle(e.target.value, 'float')}>
diff --git a/src/menu/stylecontroller/index.jsx b/src/menu/stylecontroller/index.jsx
index 046b8ed..f3e7bef 100644
--- a/src/menu/stylecontroller/index.jsx
+++ b/src/menu/stylecontroller/index.jsx
@@ -1,7 +1,35 @@
 import React, {Component} from 'react'
 import PropTypes from 'prop-types'
 import { is, fromJS } from 'immutable'
-import { Collapse, Form, Col, Icon, InputNumber, Select, Radio, Drawer, Button } from 'antd'
+import { Collapse, Form, Col, InputNumber, Select, Radio, Drawer, Button } from 'antd'
+import {
+  ColumnHeightOutlined,
+  FontSizeOutlined,
+  BoldOutlined,
+  LineHeightOutlined,
+  ColumnWidthOutlined,
+  FontColorsOutlined,
+  ItalicOutlined,
+  AlignLeftOutlined,
+  AlignCenterOutlined,
+  AlignRightOutlined,
+  UnderlineOutlined,
+  StrikethroughOutlined,
+  BgColorsOutlined,
+  PictureOutlined,
+  BorderOutlined,
+  BorderOuterOutlined,
+  BorderLeftOutlined,
+  BorderRightOutlined,
+  BorderTopOutlined,
+  BorderBottomOutlined,
+  RadiusSettingOutlined,
+  ArrowUpOutlined,
+  ArrowDownOutlined,
+  ArrowLeftOutlined,
+  ArrowRightOutlined,
+  SwapOutlined,
+} from '@ant-design/icons'
 
 import MKEmitter from '@/utils/events.js'
 import asyncComponent from '@/utils/asyncComponent'
@@ -381,7 +409,7 @@
                 <Col span={24}>
                   <Form.Item
                     colon={false}
-                    label={<Icon title="瀹藉害" type="column-width" />}
+                    label={<ColumnWidthOutlined title="瀹藉害"/>}
                     labelCol={{xs: { span: 24 }, sm: { span: 4 }}} wrapperCol={ {xs: { span: 24 }, sm: { span: 20 }} }
                   >
                     <StyleInput defaultValue={card.width || ''} options={['px', 'vh', 'vw', '%']} onChange={this.changeWidth}/>
@@ -392,7 +420,7 @@
                 <Col span={24}>
                   <Form.Item
                     colon={false}
-                    label={<Icon title="楂樺害" type="column-height" />}
+                    label={<ColumnHeightOutlined title="楂樺害"/>}
                     labelCol={{xs: { span: 24 }, sm: { span: 4 }}} wrapperCol={ {xs: { span: 24 }, sm: { span: 20 }} }
                   >
                     <StyleInput defaultValue={card.height || ''} options={['px', 'vh', 'vw']} onChange={this.changeHeight}/>
@@ -401,12 +429,12 @@
               </Panel> : null}
               {options.includes('font') ? <Panel header="瀛椾綋" key="font">
                 <Col span={12}>
-                  <Form.Item colon={false} label={<Icon title="瀛椾綋澶у皬" type="font-size" />}>
+                  <Form.Item colon={false} label={<FontSizeOutlined title="瀛椾綋澶у皬"/>}>
                     <InputNumber defaultValue={card.fontSize || 14} min={12} max={100} precision={0} onChange={this.changeFontSize} />
                   </Form.Item>
                 </Col>
                 <Col span={12}>
-                  <Form.Item colon={false} label={<Icon title="瀛椾綋绮楃粏" type="bold" />}>
+                  <Form.Item colon={false} label={<BoldOutlined title="瀛椾綋绮楃粏"/>}>
                     <Select defaultValue={card.fontWeight || 'normal'} onChange={this.boldChange}>
                       <Option value="normal">normal</Option>
                       <Option value="bold">bold</Option>
@@ -425,19 +453,19 @@
                   </Form.Item>
                 </Col>
                 <Col span={12}>
-                  <Form.Item colon={false} label={<Icon title="琛岄珮" type="line-height" />}>
+                  <Form.Item colon={false} label={<LineHeightOutlined title="琛岄珮"/>}>
                     <InputNumber defaultValue={card.lineHeight || 1.5} min={1} max={10} precision={1} onChange={this.changeLineHeight} />
                   </Form.Item>
                 </Col>
                 <Col span={12}>
-                  <Form.Item colon={false} label={<Icon title="瀛楅棿璺�" type="column-width" />}>
+                  <Form.Item colon={false} label={<ColumnWidthOutlined title="瀛楅棿璺�"/>}>
                     <InputNumber defaultValue={card.letterSpacing || 0} min={0} max={100} precision={0} onChange={this.changeLetterSpacing}/>
                   </Form.Item>
                 </Col>
                 <Col span={24}>
                   <Form.Item
                     colon={false}
-                    label={<Icon title="瀛椾綋棰滆壊" type="font-colors" />}
+                    label={<FontColorsOutlined title="瀛椾綋棰滆壊"/>}
                     labelCol={{xs: { span: 24 }, sm: { span: 4 }}} wrapperCol={ {xs: { span: 24 }, sm: { span: 20 }} }
                   >
                     <ColorSketch value={card.color || 'rgba(0, 0, 0, 0.85)'} onChange={this.changeFontColor} />
@@ -451,7 +479,7 @@
                   >
                     <Radio.Group defaultValue={card.fontStyle || 'normal'} onChange={this.changeFontStyle}>
                       <Radio.Button value="normal"><span title="鏍囧噯">N</span></Radio.Button>
-                      <Radio.Button value="italic"><Icon title="鏂滀綋" type="italic" /></Radio.Button>
+                      <Radio.Button value="italic"><ItalicOutlined title="鏂滀綋"/></Radio.Button>
                       <Radio.Button value="oblique" style={{fontStyle: 'oblique'}}><span title="鍊炬枩">B</span></Radio.Button>
                     </Radio.Group>
                   </Form.Item>
@@ -463,9 +491,9 @@
                     labelCol={{xs: { span: 24 }, sm: { span: 4 }}} wrapperCol={ {xs: { span: 24 }, sm: { span: 20 }} }
                   >
                     <Radio.Group className="text-align" defaultValue={card.textAlign || 'left'} onChange={this.changeTextAlign}>
-                      <Radio.Button value="left"><Icon title="宸﹀榻�" type="align-left" /></Radio.Button>
-                      <Radio.Button value="center"><Icon title="灞呬腑瀵归綈" type="align-center" /></Radio.Button>
-                      <Radio.Button value="right"><Icon title="鍙冲榻�" type="align-right" /></Radio.Button>
+                      <Radio.Button value="left"><AlignLeftOutlined title="宸﹀榻�"/></Radio.Button>
+                      <Radio.Button value="center"><AlignCenterOutlined title="灞呬腑瀵归綈"/></Radio.Button>
+                      <Radio.Button value="right"><AlignRightOutlined title="鍙冲榻�"/></Radio.Button>
                     </Radio.Group>
                   </Form.Item>
                 </Col>
@@ -477,8 +505,8 @@
                   >
                     <Radio.Group className="text-decoration" defaultValue={card.textDecoration || 'none'} onChange={this.changeTextDecoration}>
                       <Radio.Button value="none"><span title="鏍囧噯">N</span></Radio.Button>
-                      <Radio.Button value="underline"><Icon title="涓嬪垝绾�" type="underline" /></Radio.Button>
-                      <Radio.Button value="line-through"><Icon title="涓垝绾�" type="strikethrough" /></Radio.Button>
+                      <Radio.Button value="underline"><UnderlineOutlined title="涓嬪垝绾�"/></Radio.Button>
+                      <Radio.Button value="line-through"><StrikethroughOutlined title="涓垝绾�"/></Radio.Button>
                       <Radio.Button value="overline" style={{textDecoration: 'overline'}}><span title="涓婂垝绾�">O</span></Radio.Button>
                     </Radio.Group>
                   </Form.Item>
@@ -488,7 +516,7 @@
                 <Col span={24}>
                   <Form.Item
                     colon={false}
-                    label={<Icon title="鑳屾櫙棰滆壊" type="bg-colors" />}
+                    label={<BgColorsOutlined title="鑳屾櫙棰滆壊"/>}
                     labelCol={{xs: { span: 24 }, sm: { span: 4 }}} wrapperCol={ {xs: { span: 24 }, sm: { span: 20 }} }
                   >
                     <ColorSketch value={card.backgroundColor || '#ffffff'} onChange={this.changeBackgroundColor} />
@@ -497,7 +525,7 @@
                 {!options.includes('backgroundColor') ? <Col span={24}>
                   <Form.Item
                     colon={false}
-                    label={<Icon title="鑳屾櫙鍥剧墖" type="picture" />}
+                    label={<PictureOutlined title="鑳屾櫙鍥剧墖"/>}
                     labelCol={{xs: { span: 24 }, sm: { span: 4 }}} wrapperCol={ {xs: { span: 24 }, sm: { span: 20 }} }
                   >
                     <SourceComponent value={backgroundImage} type="" placement="right" onChange={this.imgChange}/>
@@ -552,22 +580,22 @@
                 <Col span={24}>
                   <Form.Item
                     colon={false}
-                    label={<Icon title="杈规浣嶇疆" type="border" />}
+                    label={<BorderOutlined title="杈规浣嶇疆"/>}
                     labelCol={{xs: { span: 24 }, sm: { span: 4 }}} wrapperCol={ {xs: { span: 24 }, sm: { span: 20 }} }
                   >
                     <Radio.Group className="border-position" defaultValue={'outer'} onChange={(e) => this.setState({borposition: e.target.value})}>
-                      <Radio value="outer"><Icon title="澶栬竟妗�" type="border-outer" /></Radio>
-                      <Radio value="left"><Icon title="宸﹁竟妗�" type="border-left" /></Radio>
-                      <Radio value="right"><Icon title="鍙宠竟妗�" type="border-right" /></Radio>
-                      <Radio value="top"><Icon title="涓婅竟妗�" type="border-top" /></Radio>
-                      <Radio value="bottom"><Icon title="涓嬭竟妗�" type="border-bottom" /></Radio>
+                      <Radio value="outer"><BorderOuterOutlined title="澶栬竟妗�"/></Radio>
+                      <Radio value="left"><BorderLeftOutlined title="宸﹁竟妗�"/></Radio>
+                      <Radio value="right"><BorderRightOutlined title="鍙宠竟妗�"/></Radio>
+                      <Radio value="top"><BorderTopOutlined title="涓婅竟妗�"/></Radio>
+                      <Radio value="bottom"><BorderBottomOutlined title="涓嬭竟妗�"/></Radio>
                     </Radio.Group>
                   </Form.Item>
                 </Col>
                 <Col span={24}>
                   <Form.Item
                     colon={false}
-                    label={<Icon title="杈规鏍峰紡" type="border-outer" />}
+                    label={<BorderOuterOutlined title="杈规鏍峰紡"/>}
                     labelCol={{xs: { span: 24 }, sm: { span: 4 }}} wrapperCol={ {xs: { span: 24 }, sm: { span: 20 }} }
                   >
                     {borposition === 'outer' ? <Select defaultValue={card.borderStyle || 'solid'} onChange={this.changeBorderStyle}>
@@ -605,7 +633,7 @@
                 <Col span={24}>
                   <Form.Item
                     colon={false}
-                    label={<Icon title="杈规瀹藉害" type="column-width" />}
+                    label={<ColumnWidthOutlined title="杈规瀹藉害"/>}
                     labelCol={{xs: { span: 24 }, sm: { span: 4 }}} wrapperCol={ {xs: { span: 24 }, sm: { span: 20 }} }
                   >
                     {borposition === 'outer' ? <StyleInput defaultValue={card.borderWidth || '0px'} options={['px']} onChange={this.changeBorderWidth}/> : null}
@@ -618,7 +646,7 @@
                 <Col span={24}>
                   <Form.Item
                     colon={false}
-                    label={<Icon title="杈规棰滆壊" type="bg-colors" />}
+                    label={<BgColorsOutlined title="杈规棰滆壊"/>}
                     labelCol={{xs: { span: 24 }, sm: { span: 4 }}} wrapperCol={ {xs: { span: 24 }, sm: { span: 20 }} }
                   >
                     {borposition === 'outer' ? <ColorSketch defaultValue={card.borderColor || 'transparent'} onChange={this.changeBorderColor} /> : null}
@@ -631,7 +659,7 @@
                 <Col span={24}>
                   <Form.Item
                     colon={false}
-                    label={<Icon title="鍦嗚" type="radius-setting" />}
+                    label={<RadiusSettingOutlined title="鍦嗚"/>}
                     labelCol={{xs: { span: 24 }, sm: { span: 4 }}} wrapperCol={ {xs: { span: 24 }, sm: { span: 20 }} }
                   >
                     <StyleInput defaultValue={card.borderRadius || '0px'} options={['px', '%']} onChange={(val) => this.changeNormalStyle(val, 'borderRadius')}/>
@@ -642,7 +670,7 @@
                 <Col span={24}>
                   <Form.Item
                     colon={false}
-                    label={<Icon title="闃村奖棰滆壊" type="bg-colors" />}
+                    label={<BgColorsOutlined title="闃村奖棰滆壊"/>}
                     labelCol={{xs: { span: 24 }, sm: { span: 4 }}} wrapperCol={ {xs: { span: 24 }, sm: { span: 20 }} }
                   >
                     <ColorSketch value={card.shadowColor || 'transparent'} onChange={this.changeShadowColor} />
@@ -651,7 +679,7 @@
                 <Col span={24}>
                   <Form.Item
                     colon={false}
-                    label={<Icon title="妯$硦璺濈" type="column-width" />}
+                    label={<ColumnWidthOutlined title="妯$硦璺濈"/>}
                     labelCol={{xs: { span: 24 }, sm: { span: 4 }}} wrapperCol={ {xs: { span: 24 }, sm: { span: 20 }} }
                   >
                     <StyleInput defaultValue={card.shadowBlur || '0px'} options={['px']} onChange={this.changeShadowBlur}/>
@@ -660,7 +688,7 @@
                 <Col span={24}>
                   <Form.Item
                     colon={false}
-                    label={<Icon title="姘村钩浣嶇疆" type="arrow-right" />}
+                    label={<ArrowRightOutlined title="姘村钩浣嶇疆"/>}
                     labelCol={{xs: { span: 24 }, sm: { span: 4 }}} wrapperCol={ {xs: { span: 24 }, sm: { span: 20 }} }
                   >
                     <StyleInput defaultValue={card.hShadow || '0px'} options={['px']} onChange={this.changeHShadow}/>
@@ -669,7 +697,7 @@
                 <Col span={24}>
                   <Form.Item
                     colon={false}
-                    label={<Icon title="鍨傜洿浣嶇疆" type="arrow-down" />}
+                    label={<ArrowDownOutlined title="鍨傜洿浣嶇疆"/>}
                     labelCol={{xs: { span: 24 }, sm: { span: 4 }}} wrapperCol={ {xs: { span: 24 }, sm: { span: 20 }} }
                   >
                     <StyleInput defaultValue={card.vShadow || '0px'} options={['px']} onChange={this.changeVShadow}/>
@@ -680,7 +708,7 @@
                 <Col span={24}>
                   <Form.Item
                     colon={false}
-                    label={<Icon title="涓婅竟璺�" type="arrow-up"/>}
+                    label={<ArrowUpOutlined title="涓婅竟璺�"/>}
                     labelCol={{xs: { span: 24 }, sm: { span: 4 }}} wrapperCol={ {xs: { span: 24 }, sm: { span: 20 }} }
                   >
                     <StyleInput defaultValue={card.marginTop || '0px'} options={['px', 'vh', 'vw', '%']} onChange={(val) => this.changeNormalStyle(val, 'marginTop')}/>
@@ -689,7 +717,7 @@
                 <Col span={24}>
                   <Form.Item
                     colon={false}
-                    label={<Icon title="涓嬭竟璺�" type="arrow-down"/>}
+                    label={<ArrowDownOutlined title="涓嬭竟璺�"/>}
                     labelCol={{xs: { span: 24 }, sm: { span: 4 }}} wrapperCol={ {xs: { span: 24 }, sm: { span: 20 }} }
                   >
                     <StyleInput defaultValue={card.marginBottom || '0px'} options={['px', 'vh', 'vw', '%']} onChange={(val) => this.changeNormalStyle(val, 'marginBottom')}/>
@@ -698,7 +726,7 @@
                 <Col span={24}>
                   <Form.Item
                     colon={false}
-                    label={<Icon title="宸﹁竟璺�" type="arrow-left"/>}
+                    label={<ArrowLeftOutlined title="宸﹁竟璺�"/>}
                     labelCol={{xs: { span: 24 }, sm: { span: 4 }}} wrapperCol={ {xs: { span: 24 }, sm: { span: 20 }} }
                   >
                     <StyleInput defaultValue={card.marginLeft || '0px'} options={['px', 'vh', 'vw', '%']} onChange={(val) => this.changeNormalStyle(val, 'marginLeft')}/>
@@ -707,7 +735,7 @@
                 <Col span={24}>
                   <Form.Item
                     colon={false}
-                    label={<Icon title="鍙宠竟璺�" type="arrow-right"/>}
+                    label={<ArrowRightOutlined title="鍙宠竟璺�"/>}
                     labelCol={{xs: { span: 24 }, sm: { span: 4 }}} wrapperCol={ {xs: { span: 24 }, sm: { span: 20 }} }
                   >
                     <StyleInput defaultValue={card.marginRight || '0px'} options={['px', 'vh', 'vw', '%']} onChange={(val) => this.changeNormalStyle(val, 'marginRight')}/>
@@ -718,7 +746,7 @@
                 <Col span={24}>
                   <Form.Item
                     colon={false}
-                    label={<Icon title="涓婅竟璺�" type="arrow-up"/>}
+                    label={<ArrowUpOutlined title="涓婅竟璺�"/>}
                     labelCol={{xs: { span: 24 }, sm: { span: 4 }}} wrapperCol={ {xs: { span: 24 }, sm: { span: 20 }} }
                   >
                     <StyleInput defaultValue={card.paddingTop || '0px'} options={['px', 'vh', 'vw', '%']} onChange={(val) => this.changeNormalStyle(val, 'paddingTop')}/>
@@ -727,7 +755,7 @@
                 <Col span={24}>
                   <Form.Item
                     colon={false}
-                    label={<Icon title="涓嬭竟璺�" type="arrow-down"/>}
+                    label={<ArrowDownOutlined title="涓嬭竟璺�"/>}
                     labelCol={{xs: { span: 24 }, sm: { span: 4 }}} wrapperCol={ {xs: { span: 24 }, sm: { span: 20 }} }
                   >
                     <StyleInput defaultValue={card.paddingBottom || '0px'} options={['px', 'vh', 'vw', '%']} onChange={(val) => this.changeNormalStyle(val, 'paddingBottom')}/>
@@ -736,7 +764,7 @@
                 <Col span={24}>
                   <Form.Item
                     colon={false}
-                    label={<Icon title="宸﹁竟璺�" type="arrow-left"/>}
+                    label={<ArrowLeftOutlined title="宸﹁竟璺�"/>}
                     labelCol={{xs: { span: 24 }, sm: { span: 4 }}} wrapperCol={ {xs: { span: 24 }, sm: { span: 20 }} }
                   >
                     <StyleInput defaultValue={card.paddingLeft || '0px'} options={['px', 'vh', 'vw', '%']} onChange={(val) => this.changeNormalStyle(val, 'paddingLeft')}/>
@@ -745,7 +773,7 @@
                 <Col span={24}>
                   <Form.Item
                     colon={false}
-                    label={<Icon title="鍙宠竟璺�" type="arrow-right"/>}
+                    label={<ArrowRightOutlined title="鍙宠竟璺�"/>}
                     labelCol={{xs: { span: 24 }, sm: { span: 4 }}} wrapperCol={ {xs: { span: 24 }, sm: { span: 20 }} }
                   >
                     <StyleInput defaultValue={card.paddingRight || '0px'} options={['px', 'vh', 'vw', '%']} onChange={(val) => this.changeNormalStyle(val, 'paddingRight')}/>
@@ -756,7 +784,7 @@
                 <Col span={24}>
                   <Form.Item
                     colon={false}
-                    label={<Icon title="娴姩" type="swap" />}
+                    label={<SwapOutlined title="娴姩"/>}
                     labelCol={{xs: { span: 24 }, sm: { span: 4 }}} wrapperCol={ {xs: { span: 24 }, sm: { span: 20 }} }
                   >
                     <Radio.Group style={{whiteSpace: 'nowrap'}} defaultValue={card.float || 'left'} onChange={(e) => this.changeNormalStyle(e.target.value, 'float')}>
diff --git a/src/menu/sysinterface/index.jsx b/src/menu/sysinterface/index.jsx
index 0837130..41ca3dc 100644
--- a/src/menu/sysinterface/index.jsx
+++ b/src/menu/sysinterface/index.jsx
@@ -1,7 +1,8 @@
 import React, {Component} from 'react'
 import PropTypes from 'prop-types'
 import { is, fromJS } from 'immutable'
-import { Modal, Button, Icon, Popconfirm, message } from 'antd'
+import { Modal, Button, Popconfirm, message } from 'antd'
+import { StopTwoTone, CopyOutlined, EditOutlined, CheckCircleTwoTone, DeleteOutlined } from '@ant-design/icons'
 
 import Utils from '@/utils/utils.js'
 import asyncComponent from '@/utils/asyncComponent'
@@ -35,13 +36,13 @@
           (
             <div>
               绂佺敤
-              <Icon style={{marginLeft: '5px'}} type="stop" theme="twoTone" twoToneColor="#ff4d4f" />
+              <StopTwoTone style={{marginLeft: '5px'}} twoToneColor="#ff4d4f" />
             </div>
           ) :
           (
             <div>
               鍚敤
-              <Icon style={{marginLeft: '5px'}} type="check-circle" theme="twoTone" twoToneColor="#52c41a" />
+              <CheckCircleTwoTone style={{marginLeft: '5px'}} twoToneColor="#52c41a" />
             </div>
           )
       },
@@ -52,14 +53,14 @@
         dataIndex: 'operation',
         render: (text, record) =>
           (<div style={{textAlign: 'center'}}>
-            <span onClick={() => this.handleEdit(record)} style={{color: '#1890ff', cursor: 'pointer', fontSize: '16px', marginRight: '15px'}}><Icon type="edit" /></span>
-            <span onClick={() => {this.copy(record)}} style={{color: '#26C281', cursor: 'pointer', fontSize: '16px', marginRight: '15px'}}><Icon type="copy" /></span>
+            <span onClick={() => this.handleEdit(record)} style={{color: '#1890ff', cursor: 'pointer', fontSize: '16px', marginRight: '15px'}}><EditOutlined /></span>
+            <span onClick={() => {this.copy(record)}} style={{color: '#26C281', cursor: 'pointer', fontSize: '16px', marginRight: '15px'}}><CopyOutlined /></span>
             <Popconfirm
               overlayClassName="popover-confirm"
               title="纭畾鍒犻櫎锛�"
               onConfirm={() => this.deleteScript(record)
             }>
-              <span style={{color: '#ff4d4f', cursor: 'pointer', fontSize: '16px'}}><Icon type="delete" /></span>
+              <span style={{color: '#ff4d4f', cursor: 'pointer', fontSize: '16px'}}><DeleteOutlined /></span>
             </Popconfirm>
           </div>)
       }
diff --git a/src/menu/sysinterface/settingform/simplescript/index.jsx b/src/menu/sysinterface/settingform/simplescript/index.jsx
index 0e3f3ef..5b6a80f 100644
--- a/src/menu/sysinterface/settingform/simplescript/index.jsx
+++ b/src/menu/sysinterface/settingform/simplescript/index.jsx
@@ -1,7 +1,8 @@
 import React, {Component} from 'react'
 import PropTypes from 'prop-types'
 import { fromJS } from 'immutable'
-import { Form, Row, Col, Icon, Button, notification, Select, Popconfirm, Typography, Modal, Radio } from 'antd'
+import { Form, Row, Col, Button, notification, Select, Popconfirm, Typography, Modal, Radio } from 'antd'
+import { StopTwoTone, SwapOutlined, EditOutlined, CheckCircleTwoTone, DeleteOutlined } from '@ant-design/icons'
 import moment from 'moment'
 
 import Utils from '@/utils/utils.js'
@@ -66,13 +67,13 @@
           (
             <div>
               {this.props.dict['model.status.forbidden']}
-              <Icon style={{marginLeft: '5px'}} type="stop" theme="twoTone" twoToneColor="#ff4d4f" />
+              <StopTwoTone style={{marginLeft: '5px'}} twoToneColor="#ff4d4f" />
             </div>
           ) :
           (
             <div>
               {this.props.dict['model.status.open']}
-              <Icon style={{marginLeft: '5px'}} type="check-circle" theme="twoTone" twoToneColor="#52c41a" />
+              <CheckCircleTwoTone style={{marginLeft: '5px'}} twoToneColor="#52c41a" />
             </div>
           )
       },
@@ -83,14 +84,14 @@
         dataIndex: 'operation',
         render: (text, record) =>
           (<div style={{textAlign: 'center'}}>
-            <span className="operation-btn" title={this.props.dict['model.edit']} onClick={() => this.handleEdit(record)} style={{color: '#1890ff'}}><Icon type="edit" /></span>
-            <span className="operation-btn" title={this.props.dict['header.form.status.change']} onClick={() => this.handleStatus(record)} style={{color: '#8E44AD'}}><Icon type="swap" /></span>
+            <span className="operation-btn" title={this.props.dict['model.edit']} onClick={() => this.handleEdit(record)} style={{color: '#1890ff'}}><EditOutlined /></span>
+            <span className="operation-btn" title={this.props.dict['header.form.status.change']} onClick={() => this.handleStatus(record)} style={{color: '#8E44AD'}}><SwapOutlined /></span>
             <Popconfirm
               overlayClassName="popover-confirm"
               title={this.props.dict['model.query.delete']}
               onConfirm={() => this.handleDelete(record)
             }>
-              <span className="operation-btn" style={{color: '#ff4d4f'}}><Icon type="delete" /></span>
+              <span className="operation-btn" style={{color: '#ff4d4f'}}><DeleteOutlined /></span>
             </Popconfirm>
           </div>)
       }
diff --git a/src/mob/colorsketch/index.jsx b/src/mob/colorsketch/index.jsx
index afa975a..c56caab 100644
--- a/src/mob/colorsketch/index.jsx
+++ b/src/mob/colorsketch/index.jsx
@@ -2,7 +2,8 @@
 import PropTypes from 'prop-types'
 // import { is, fromJS } from 'immutable'
 import { SketchPicker } from 'react-color'
-import { Popover, Icon } from 'antd'
+import { Popover } from 'antd'
+import { CloseOutlined } from '@ant-design/icons'
 
 import './index.scss'
 
@@ -90,7 +91,7 @@
             <div className="color-sketch-block-inner" style={ {background: color} }></div>
           </div>
         </Popover>
-        <div className="color-sketch-value">{color}{allowClear && color ? <Icon onClick={this.clear} type="close"/> : null}</div>
+        <div className="color-sketch-value">{color}{allowClear && color ? <CloseOutlined onClick={this.clear}/> : null}</div>
       </div>
     )
   }
diff --git a/src/mob/components/formdragelement/card.jsx b/src/mob/components/formdragelement/card.jsx
index a92dc7f..73cf503 100644
--- a/src/mob/components/formdragelement/card.jsx
+++ b/src/mob/components/formdragelement/card.jsx
@@ -1,9 +1,11 @@
 import React from 'react'
 import { useDrag, useDrop } from 'react-dnd'
-import { Icon, Button, Popover, Switch, Checkbox, Form, Rate } from 'antd'
+import { Button, Popover, Switch, Checkbox, Form, Rate } from 'antd'
+import { ScanOutlined, RightOutlined, PlusOutlined, StarFilled, EditOutlined, CopyOutlined, CloseOutlined } from '@ant-design/icons'
 import moment from 'moment'
 
 import asyncComponent from '@/utils/asyncComponent'
+import MkIcon from '@/components/mk-icon'
 import './index.scss'
 
 const CheckCard = asyncComponent(() => import('@/templates/modalconfig/checkCard'))
@@ -60,17 +62,17 @@
 
   let formItem = null
   if (card.type === 'text' || card.type === 'number') {
-    formItem = (<div className={'am-list-item ' + (card.place || '')}><div className="am-list-line"><div className="am-input-label">{card.label}</div><div className={'am-input-control ' + card.cursor}>{card.initval ? card.initval : <span style={{color: '#bcbcbc'}}>{card.placeholder || ''}</span> }</div>{card.scan && card.scan !== 'false' ? <div className="am-list-extra"><Icon type="scan" /></div> : null}</div></div>)
+    formItem = (<div className={'am-list-item ' + (card.place || '')}><div className="am-list-line"><div className="am-input-label">{card.label}</div><div className={'am-input-control ' + card.cursor}>{card.initval ? card.initval : <span style={{color: '#bcbcbc'}}>{card.placeholder || ''}</span> }</div>{card.scan && card.scan !== 'false' ? <div className="am-list-extra"><ScanOutlined /></div> : null}</div></div>)
   } else if (card.type === 'number') {
     formItem = (<div className="am-list-item"><div className="am-list-line"><div className="am-input-label">{card.label}</div><div className={'am-input-control ' + card.cursor}>{card.initval}</div></div></div>)
   } else if (card.type === 'select' || card.type === 'link') {
-    formItem = (<div className="am-list-item"><div className="am-list-line"><div className="am-input-label">{card.label}</div><div className="am-input-control">{selectval || '璇烽�夋嫨'}</div><div className="am-list-extra"><Icon type="right" /></div></div></div>)
+    formItem = (<div className="am-list-item"><div className="am-list-line"><div className="am-input-label">{card.label}</div><div className="am-input-control">{selectval || '璇烽�夋嫨'}</div><div className="am-list-extra"><RightOutlined /></div></div></div>)
   } else if (card.type === 'date') {
-    formItem = (<div className="am-list-item"><div className="am-list-line"><div className="am-input-label">{card.label}</div><div className="am-input-control">{card.initval ? moment().subtract(card.initval, 'days').format('YYYY-MM-DD') : '璇烽�夋嫨'}</div><div className="am-list-extra"><Icon type="right" /></div></div></div>)
+    formItem = (<div className="am-list-item"><div className="am-list-line"><div className="am-input-label">{card.label}</div><div className="am-input-control">{card.initval ? moment().subtract(card.initval, 'days').format('YYYY-MM-DD') : '璇烽�夋嫨'}</div><div className="am-list-extra"><RightOutlined /></div></div></div>)
   } else if (card.type === 'datemonth') {
-    formItem = (<div className="am-list-item"><div className="am-list-line"><div className="am-input-label">{card.label}</div><div className="am-input-control">{card.initval ? moment().subtract(card.initval, 'month').format('YYYY-MM') : '璇烽�夋嫨'}</div><div className="am-list-extra"><Icon type="right" /></div></div></div>)
+    formItem = (<div className="am-list-item"><div className="am-list-line"><div className="am-input-label">{card.label}</div><div className="am-input-control">{card.initval ? moment().subtract(card.initval, 'month').format('YYYY-MM') : '璇烽�夋嫨'}</div><div className="am-list-extra"><RightOutlined /></div></div></div>)
   } else if (card.type === 'datetime') {
-    formItem = (<div className="am-list-item"><div className="am-list-line"><div className="am-input-label">{card.label}</div><div className="am-input-control">{card.initval ? moment().subtract(card.initval, 'days').format('YYYY-MM-DD HH:mm') : '璇烽�夋嫨'}</div><div className="am-list-extra"><Icon type="right" /></div></div></div>)
+    formItem = (<div className="am-list-item"><div className="am-list-line"><div className="am-input-label">{card.label}</div><div className="am-input-control">{card.initval ? moment().subtract(card.initval, 'days').format('YYYY-MM-DD HH:mm') : '璇烽�夋嫨'}</div><div className="am-list-extra"><RightOutlined /></div></div></div>)
   } else if (card.type === 'textarea') {
     let height = (card.maxRows || 2) * 25
     formItem = (<div className="am-list-item check-card">
@@ -86,7 +88,7 @@
     </div>)
   } else if (card.type === 'rate') {
     formItem = (<div className={'am-list-item ' + (card.place || '')}><div className="am-list-line"><div className="am-input-label">{card.label}</div><div style={{textAlign: 'left'}} className={'am-input-control ' + (card.place === 'up_down' ? 'left' : '')}>
-      <Rate value={card.initval || 0} count={card.rateCount || 5} character={card.character ? <Icon type={card.character}/> : <Icon type="star" theme="filled"/>} allowHalf={card.allowHalf === 'true'} />
+      <Rate value={card.initval || 0} count={card.rateCount || 5} character={card.character ? <MkIcon type={card.character}/> : <StarFilled />} allowHalf={card.allowHalf === 'true'} />
     </div></div></div>)
   } else if (card.type === 'fileupload') {
     formItem = (
@@ -94,9 +96,7 @@
         <div className="am-list-line">
           <div className="am-input-label">{card.label}</div>
           <div className="am-input-control" style={{textAlign: 'left'}}>
-            {/* {card.fileType !== 'picture-card' ? <Icon type="upload" style={{position: 'absolute', right: '10px', top: '10px'}} /> : null} */}
-            {/* {card.fileType === 'picture-card' ? <Button style={{width: '100px', marginBottom: '10px', height: '100px', fontSize: '50px', color: '#d9d9d9'}}><Icon type="plus" /></Button> : null} */}
-            <Button style={{width: '100px', marginBottom: '10px', height: '100px', fontSize: '50px', color: '#d9d9d9'}}><Icon type="plus" /></Button>
+            <Button style={{width: '100px', marginBottom: '10px', height: '100px', fontSize: '50px', color: '#d9d9d9'}}><PlusOutlined /></Button>
           </div>
         </div>
       </div>
@@ -184,9 +184,9 @@
   return (
     <Popover overlayClassName="mk-popover-control-wrap" mouseLeaveDelay={0.2} mouseEnterDelay={0.2} content={
       <div className="mk-popover-control">
-        <Icon className="edit" type="edit" onClick={edit} />
-        <Icon className="copy" type="copy" onClick={copy} />
-        <Icon className="close" type="close" onClick={close} />
+        <EditOutlined className="edit" onClick={edit} />
+        <CopyOutlined className="copy" onClick={copy} />
+        <CloseOutlined className="close" onClick={close} />
       </div>
     } trigger="hover">
       <div className="page-card" style={{ opacity: opacity}}>
diff --git a/src/mob/components/menubar/normal-menubar/index.jsx b/src/mob/components/menubar/normal-menubar/index.jsx
index 2ad9a87..93d9aff 100644
--- a/src/mob/components/menubar/normal-menubar/index.jsx
+++ b/src/mob/components/menubar/normal-menubar/index.jsx
@@ -1,7 +1,8 @@
 import React, {Component} from 'react'
 import PropTypes from 'prop-types'
 import { is, fromJS } from 'immutable'
-import { Icon, Popover, Modal } from 'antd'
+import { Popover, Modal } from 'antd'
+import { ToolOutlined, PlusOutlined, SettingOutlined, EditOutlined, FontColorsOutlined, DeleteOutlined } from '@ant-design/icons'
 
 import asyncComponent from '@/utils/asyncComponent'
 import asyncIconComponent from '@/utils/asyncIconComponent'
@@ -270,20 +271,20 @@
         {card.wrap.title ? <NormalHeader config={card} updateComponent={this.updateComponent}/> : null}
         <Popover overlayClassName="mk-popover-control-wrap" mouseLeaveDelay={0.2} mouseEnterDelay={0.2} content={
           <div className="mk-popover-control">
-            <Icon className="plus" title="娣诲姞鑿滃崟" onClick={this.addMenu} type="plus" />
+            <PlusOutlined className="plus" title="娣诲姞鑿滃崟" onClick={this.addMenu}/>
             <NormalForm title="鑿滃崟璁剧疆" width={800} update={this.updateWrap} getForms={this.getWrapForms}>
-              <Icon type="edit" style={{color: '#1890ff'}} title="缂栬緫"/>
+              <EditOutlined style={{color: '#1890ff'}} title="缂栬緫"/>
             </NormalForm>
             <CopyComponent type="menubar" card={card}/>
             <PasteComponent config={card} options={['menucell']} updateConfig={this.updateComponent} />
-            <Icon className="style" title="璋冩暣鏍峰紡" onClick={this.changeStyle} type="font-colors" />
+            <FontColorsOutlined className="style" title="璋冩暣鏍峰紡" onClick={this.changeStyle} />
             <UserComponent config={card}/>
-            <Icon className="close" title="鍒犻櫎缁勪欢" type="delete" onClick={() => this.props.deletecomponent(card.uuid)} />
+            <DeleteOutlined className="close" title="鍒犻櫎缁勪欢" onClick={() => this.props.deletecomponent(card.uuid)} />
             {card.wrap.datatype === 'dynamic' ? <SettingComponent config={card} updateConfig={this.updateComponent} /> : null}
-            {card.wrap.datatype !== 'dynamic' ? <Icon style={{color: '#eeeeee', cursor: 'not-allowed'}} type="setting"/> : null}
+            {card.wrap.datatype !== 'dynamic' ? <SettingOutlined style={{color: '#eeeeee', cursor: 'not-allowed'}}/> : null}
           </div>
         } trigger="hover">
-          <Icon type="tool" />
+          <ToolOutlined />
         </Popover>
         {card.subMenus.map((menu, index) => (<MenuComponent key={menu.uuid} offset={!index ? offset : 0} cards={card} card={menu} move={this.move} updateElement={this.updateCard} deleteElement={this.deleteCard}/>))}
       </div>
diff --git a/src/mob/components/menubar/normal-menubar/menucomponent/index.jsx b/src/mob/components/menubar/normal-menubar/menucomponent/index.jsx
index 4999373..2fe6362 100644
--- a/src/mob/components/menubar/normal-menubar/menucomponent/index.jsx
+++ b/src/mob/components/menubar/normal-menubar/menucomponent/index.jsx
@@ -1,12 +1,14 @@
 import React, {Component} from 'react'
 import PropTypes from 'prop-types'
 import { is, fromJS } from 'immutable'
-import { Popover, Icon, Col } from 'antd'
+import { Popover, Col } from 'antd'
+import { SwapOutlined, ArrowLeftOutlined, ArrowRightOutlined, EditOutlined, FontColorsOutlined, DeleteOutlined } from '@ant-design/icons'
 
 import asyncIconComponent from '@/utils/asyncIconComponent'
 import Utils from '@/utils/utils.js'
 import getSettingForm from './options'
 import { resetStyle } from '@/utils/utils-custom.js'
+import MkIcon from '@/components/mk-icon'
 import MKEmitter from '@/utils/events.js'
 import './index.scss'
 
@@ -127,24 +129,24 @@
         <Popover overlayClassName="mk-popover-control-wrap" mouseLeaveDelay={0.2} mouseEnterDelay={0.2} content={
           <div className="mk-popover-control">
             <NormalForm title="鑿滃崟缂栬緫" width={900} update={this.updateSetting} getForms={this.getSettingForms}>
-              <Icon type="edit" style={{color: '#1890ff'}} title="缂栬緫"/>
+              <EditOutlined style={{color: '#1890ff'}} title="缂栬緫"/>
             </NormalForm>
             <CopyComponent type="menucell" card={card}/>
-            <Icon className="style" title="璋冩暣鏍峰紡" onClick={this.changeStyle} type="font-colors" />
+            <FontColorsOutlined className="style" title="璋冩暣鏍峰紡" onClick={this.changeStyle}/>
             <Popover overlayClassName="mk-popover-control-wrap" mouseLeaveDelay={0.2} mouseEnterDelay={0.2} content={
               <div className="mk-popover-control">
-                <Icon className="plus" title="宸︾Щ" type="arrow-left" onClick={() => this.props.move(card, 'left')} />
-                <Icon className="close" title="鍙崇Щ" type="arrow-right" onClick={() => this.props.move(card, 'right')} />
+                <ArrowLeftOutlined className="plus" title="宸︾Щ" onClick={() => this.props.move(card, 'left')} />
+                <ArrowRightOutlined className="close" title="鍙崇Щ" onClick={() => this.props.move(card, 'right')} />
               </div>
             } trigger="hover" getPopupContainer={() => document.getElementById(card.uuid + 'swap')}>
-              <Icon type="swap" id={card.uuid + 'swap'}/>
+              <SwapOutlined id={card.uuid + 'swap'}/>
             </Popover>
-            <Icon className="close" title="鍒犻櫎鑿滃崟" type="delete" onClick={() => this.props.deleteElement(card)} />
+            <DeleteOutlined className="close" title="鍒犻櫎鑿滃崟" onClick={() => this.props.deleteElement(card)} />
           </div>
         } trigger="hover">
           <div className="menu-item" onDoubleClick={() => this.changeMenu()} style={_style}>
             {card.setting.sign === 'icon' ? <div className="menu-sign">
-              <Icon style={{
+              <MkIcon style={{
                 fontSize: card.setting.iconFont || 20,
                 padding: card.setting.padding,
                 background: card.setting.background,
diff --git a/src/mob/components/navbar/normal-navbar/index.jsx b/src/mob/components/navbar/normal-navbar/index.jsx
index d80c2fc..bc0925f 100644
--- a/src/mob/components/navbar/normal-navbar/index.jsx
+++ b/src/mob/components/navbar/normal-navbar/index.jsx
@@ -1,10 +1,11 @@
 import React, {Component} from 'react'
 import PropTypes from 'prop-types'
 import { is, fromJS } from 'immutable'
-import { Icon, Popover } from 'antd'
+import { Popover } from 'antd'
+import { SettingOutlined, EditOutlined, ToolOutlined, DeleteOutlined, FontColorsOutlined } from '@ant-design/icons'
 
 import asyncIconComponent from '@/utils/asyncIconComponent'
-
+import MkIcon from '@/components/mk-icon'
 import MKEmitter from '@/utils/events.js'
 import getWrapForm from './options'
 import './index.scss'
@@ -159,15 +160,15 @@
           <div className="mk-popover-control">
             <MenuComponent config={card} updateConfig={this.updateComponent} />
             <NormalForm title="鑿滃崟鏍忚缃�" width={800} update={this.updateWrap} getForms={this.getWrapForms}>
-              <Icon type="edit" style={{color: '#1890ff'}} title="缂栬緫"/>
+              <EditOutlined style={{color: '#1890ff'}} title="缂栬緫"/>
             </NormalForm>
-            <Icon className="style" title="璋冩暣鏍峰紡" onClick={this.changeStyle} type="font-colors" />
-            <Icon className="close" title="鍒犻櫎缁勪欢" type="delete" onClick={() => this.props.deletecomponent(card.uuid)} />
+            <FontColorsOutlined className="style" title="璋冩暣鏍峰紡" onClick={this.changeStyle} />
+            <DeleteOutlined className="close" title="鍒犻櫎缁勪欢" onClick={() => this.props.deletecomponent(card.uuid)} />
             {card.wrap.datatype !== 'static' ? <SettingComponent config={card} updateConfig={this.updateComponent} /> : null}
-            {card.wrap.datatype === 'static' ? <Icon style={{color: '#eeeeee', cursor: 'not-allowed'}} type="setting"/> : null}
+            {card.wrap.datatype === 'static' ? <SettingOutlined style={{color: '#eeeeee', cursor: 'not-allowed'}}/> : null}
           </div>
         } trigger="hover">
-          <Icon type="tool" />
+          <ToolOutlined />
         </Popover>
         <div className="menu">
           {card.menus.map(menu => {
@@ -175,7 +176,7 @@
               <div key={menu.MenuID} className="am-tab-bar-tab" onDoubleClick={() => this.changeMenu(menu)}>
                 {menu.icon ? <div className="am-tab-bar-tab-icon">
                   <span className="am-badge am-tab-bar-tab-badge tab-badge">
-                    <Icon type={menu.icon} />
+                    <MkIcon type={menu.icon} />
                     {menu.tip ? <sup className="am-badge-text"></sup> : null}
                   </span>
                 </div> : null}
diff --git a/src/mob/components/navbar/normal-navbar/menusetting/index.jsx b/src/mob/components/navbar/normal-navbar/menusetting/index.jsx
index 633fff4..345ec24 100644
--- a/src/mob/components/navbar/normal-navbar/menusetting/index.jsx
+++ b/src/mob/components/navbar/normal-navbar/menusetting/index.jsx
@@ -1,7 +1,8 @@
 import React, {Component} from 'react'
 import PropTypes from 'prop-types'
 import { is, fromJS } from 'immutable'
-import { Icon, Modal } from 'antd'
+import { Modal } from 'antd'
+import { MenuOutlined } from '@ant-design/icons'
 
 import zhCN from '@/locales/zh-CN/model.js'
 import enUS from '@/locales/en-US/model.js'
@@ -37,7 +38,7 @@
 
     return (
       <div className="model-menu-setting-wrap">
-        <Icon type="menu" title="鑿滃崟" onClick={() => this.setState({ visible: true })}/>
+        <MenuOutlined title="鑿滃崟" onClick={() => this.setState({ visible: true })}/>
         <Modal
           wrapClassName="popview-modal"
           title="鑿滃崟缂栬緫"
diff --git a/src/tabviews/custom/components/tree/antd-tree/index.jsx b/src/tabviews/custom/components/tree/antd-tree/index.jsx
index fc666d5..ebbd2d7 100644
--- a/src/tabviews/custom/components/tree/antd-tree/index.jsx
+++ b/src/tabviews/custom/components/tree/antd-tree/index.jsx
@@ -49,6 +49,8 @@
       _sync = false
     }
 
+    _config.wrap.contentHeight = config.wrap.title || config.wrap.searchable === 'true' ? 'calc(100% - 45px)' : '100%'
+
     this.setState({
       config: _config,
       data: _data,
@@ -441,7 +443,7 @@
           <span className="title">{config.wrap.title}</span>
           {config.wrap.searchable === 'true' ? <Search allowClear onSearch={this.treeFilter} /> : null}
         </div> : null}
-        {treeNodes && treeNodes.length > 0 ? <div className="tree-box">
+        {treeNodes && treeNodes.length > 0 ? <div className="tree-box" style={{height: config.wrap.contentHeight}}>
           <Tree
             blockNode
             onSelect={this.selectTreeNode}
diff --git a/src/tabviews/custom/components/tree/antd-tree/index.scss b/src/tabviews/custom/components/tree/antd-tree/index.scss
index 5c43bad..e60ec78 100644
--- a/src/tabviews/custom/components/tree/antd-tree/index.scss
+++ b/src/tabviews/custom/components/tree/antd-tree/index.scss
@@ -4,7 +4,7 @@
   background-position: center center;
   background-repeat: no-repeat;
   background-size: cover;
-  min-height: 180px;
+  min-height: 50px;
 
   .tree-header {
     position: relative;
@@ -41,7 +41,7 @@
     }
   }
   .tree-box {
-    overflow-x: auto;
+    overflow: auto;
     padding-bottom: 10px;
 
     .ant-tree-node-content-wrapper-close > span > span > .anticon-folder-open {
@@ -51,8 +51,9 @@
       display: none;
     }
   }
+
   .tree-box::-webkit-scrollbar {
-    height: 10px;
+    width: 7px;
   }
   .tree-box::-webkit-scrollbar-thumb {
     border-radius: 5px;
@@ -61,7 +62,7 @@
   }
   .tree-box::-webkit-scrollbar-track {/*婊氬姩鏉¢噷闈㈣建閬�*/
     box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.05);
-    border-radius: 3px;
+    border-radius: 5px;
     border: 1px solid rgba(0, 0, 0, 0.07);
     background: rgba(0, 0, 0, 0);
   }

--
Gitblit v1.8.0