From b11ff823b4250f5267a2c296818380b21136b380 Mon Sep 17 00:00:00 2001
From: king <18310653075@163.com>
Date: 星期三, 27 五月 2020 10:25:54 +0800
Subject: [PATCH] 2020-05-27

---
 src/templates/menuconfig/menuelement/index.scss          |    0 
 src/templates/headerconfig/dragelement/card.jsx          |    0 
 src/templates/zshare/transferform/index.jsx              |    1 
 src/components/header/index.jsx                          |    2 
 src/templates/zshare/basetransferform/index.jsx          |   48 +++++++++
 src/templates/zshare/adjustransferform/index.jsx         |  114 ++++++++++++++++++++++
 src/templates/headerconfig/dragelement/itemtypes.js      |    0 
 src/templates/menuconfig/editthdmenu/preview/index.jsx   |    0 
 src/templates/headerconfig/dragelement/index.jsx         |    0 
 src/templates/headerconfig/menuform/index.jsx            |    0 
 src/templates/menuconfig/editsecmenu/index.scss          |    0 
 src/templates/zshare/editcomponent/index.jsx             |    2 
 src/templates/menuconfig/menuform/index.scss             |    0 
 src/templates/menuconfig/editthdmenu/index.jsx           |    2 
 src/templates/headerconfig/menuform/index.scss           |    0 
 src/templates/menuconfig/editthdmenu/preview/index.scss  |    0 
 src/templates/headerconfig/index.jsx                     |   23 +++-
 src/templates/menuconfig/menuform/index.jsx              |    0 
 src/templates/headerconfig/dragelement/index.scss        |    0 
 src/templates/headerconfig/index.scss                    |    5 -
 src/templates/menuconfig/editthdmenu/menuform/index.scss |    0 
 src/templates/menuconfig/menuelement/card.jsx            |    0 
 src/templates/menuconfig/editthdmenu/index.scss          |    0 
 src/templates/menuconfig/menuelement/itemtypes.js        |    0 
 /dev/null                                                |   20 ----
 src/templates/zshare/basetransferform/index.scss         |    5 +
 src/templates/menuconfig/editsecmenu/index.jsx           |    2 
 src/templates/menuconfig/editthdmenu/menuform/index.jsx  |    0 
 src/templates/menuconfig/menuelement/index.jsx           |    0 
 src/components/sidemenu/index.jsx                        |    4 
 src/templates/zshare/adjustransferform/index.scss        |   29 +++++
 31 files changed, 217 insertions(+), 40 deletions(-)

diff --git a/src/components/dragelement/index.jsx b/src/components/dragelement/index.jsx
deleted file mode 100644
index 203eb77..0000000
--- a/src/components/dragelement/index.jsx
+++ /dev/null
@@ -1,73 +0,0 @@
-import React, { useState } from 'react'
-import { useDrop } from 'react-dnd'
-import { Icon, Button } from 'antd'
-import update from 'immutability-helper'
-import Card from './card'
-import ItemTypes from './itemtypes'
-import './index.scss'
-
-const Container = ({dict, list, handlePreviewList, handleMenu, handleButton }) => {
-  const [cards, setCards] = useState(list)
-  const moveCard = (id, atIndex) => {
-    const { card, index } = findCard(id)
-    const _cards = update(cards, { $splice: [[index, 1], [atIndex, 0, card]] })
-    setCards(_cards)
-    handlePreviewList(_cards)
-  }
-
-  const findCard = id => {
-    const card = cards.filter(c => `${c.id}` === id)[0]
-    return {
-      card,
-      index: cards.indexOf(card),
-    }
-  }
-
-  const editCard = id => {
-    const { card, index } = findCard(id)
-    handleMenu({
-      card,
-      index,
-      type: 'edit'
-    })
-  }
-
-  const add = () => {
-    handleButton('add')
-  }
-  
-  const confirm = () => {
-    handleButton('confirm')
-  }
-
-  const cancel = () => {
-    handleButton('cancel')
-  }
-
-  const thawmenu = () => {
-    handleButton('thawmenu')
-  }
-
-  const [, drop] = useDrop({ accept: ItemTypes.CARD })
-  return (
-    <div ref={drop} className="dragdashboard">
-      {cards.map(card => (
-        <Card
-          key={card.id}
-          id={`${card.id}`}
-          text={card.text}
-          moveCard={moveCard}
-          editCard={editCard}
-          findCard={findCard}
-        />
-      ))}
-      <div className="card-add" onClick={add}>
-        <Icon type="plus" />
-      </div>
-      <Button type="primary" onClick={thawmenu}>{dict['header.thawmenu']}</Button>
-      <Button type="primary" onClick={confirm}>{dict['model.confirm']}</Button>
-      <Button onClick={cancel}>{dict['header.close']}</Button>
-    </div>
-  )
-}
-export default Container
diff --git a/src/components/dragelement/index.scss b/src/components/dragelement/index.scss
deleted file mode 100644
index dbf749f..0000000
--- a/src/components/dragelement/index.scss
+++ /dev/null
@@ -1,58 +0,0 @@
-.dragdashboard {
-  position: relative;
-  z-index: 1;
-  width: calc(100vw - 400px);
-  float: left;
-  background: #001529;
-  padding-bottom: 5px;
-  .card-add {
-    border: 1px dashed gray;
-    padding: 2px;
-    margin-top: 13px;
-    margin-left: 10px;
-    width: 50px;
-    float: left;
-    text-align: center;
-    cursor: pointer;
-  }
-  button {
-    margin-top: 14px;
-    margin-left: 10px;
-    padding: 0 10px;
-    height: 26px;
-  }
-}
-.card {
-  position: relative;
-  border: 1px dashed gray;
-  margin-top: 7px;
-  margin-right: 10px;
-  float: left;
-  div {
-    padding: 5px 20px 5px 5px;
-    cursor: move;
-    min-width: 43px;
-    max-width: 85px;
-    overflow: hidden;
-    text-overflow: ellipsis;
-    white-space: nowrap;
-  }
-  .close {
-    position: absolute;
-    right: 0;
-    top: 0;
-    cursor: pointer;
-    :hover {
-      color: #ffffff;
-    }
-  }
-  .edit {
-    position: absolute;
-    right: 0;
-    bottom: 0;
-    cursor: pointer;
-    :hover {
-      color: #ffffff;
-    }
-  }
-}
diff --git a/src/components/header/dragelement/card.jsx b/src/components/header/dragelement/card.jsx
deleted file mode 100644
index 0f0aa3e..0000000
--- a/src/components/header/dragelement/card.jsx
+++ /dev/null
@@ -1,39 +0,0 @@
-import React from 'react'
-import { useDrag, useDrop } from 'react-dnd'
-import { Icon } from 'antd'
-import ItemTypes from './itemtypes'
-import './index.scss'
-
-const Card = ({ id, text, moveCard, findCard, editCard }) => {
-  const originalIndex = findCard(id).index
-  const [{ isDragging }, drag] = useDrag({
-    item: { type: ItemTypes.CARD, id, originalIndex },
-    collect: monitor => ({
-      isDragging: monitor.isDragging(),
-    }),
-  })
-  const [, drop] = useDrop({
-    accept: ItemTypes.CARD,
-    canDrop: () => false,
-    hover({ id: draggedId }) {
-      if (draggedId !== id) {
-        const { index: overIndex } = findCard(id)
-        moveCard(draggedId, overIndex)
-      }
-    },
-  })
-  const opacity = isDragging ? 0 : 1
-
-  const edit = () => {
-    editCard(id)
-  }
-  return (
-    <div className="card" style={{ opacity }}>
-      <div ref={node => drag(drop(node))}>
-        {text}
-      </div>
-      <Icon className="edit" type="edit" onClick={edit} />
-    </div>
-  )
-}
-export default Card
diff --git a/src/components/header/dragelement/itemtypes.js b/src/components/header/dragelement/itemtypes.js
deleted file mode 100644
index d03cfc1..0000000
--- a/src/components/header/dragelement/itemtypes.js
+++ /dev/null
@@ -1,3 +0,0 @@
-export default {
-  CARD: 'card',
-}
diff --git a/src/components/header/index.jsx b/src/components/header/index.jsx
index ba68417..5ecb8a8 100644
--- a/src/components/header/index.jsx
+++ b/src/components/header/index.jsx
@@ -31,7 +31,7 @@
 import LoginForm from './loginform'
 import './index.scss'
 
-const EditMenu = asyncComponent(() => import('./editmenu'))
+const EditMenu = asyncComponent(() => import('@/templates/headerconfig'))
 const { confirm } = Modal
 const { Search } = Input
 
diff --git a/src/components/sidemenu/index.jsx b/src/components/sidemenu/index.jsx
index 5ef00d0..2ecdfd2 100644
--- a/src/components/sidemenu/index.jsx
+++ b/src/components/sidemenu/index.jsx
@@ -14,8 +14,8 @@
 import Api from '@/api'
 import './index.scss'
 
-const EditSecMenu = asyncComponent(() => import('./editsecmenu'))
-const EditThdMenu = asyncComponent(() => import('./editthdmenu'))
+const EditSecMenu = asyncComponent(() => import('@/templates/menuconfig/editsecmenu'))
+const EditThdMenu = asyncComponent(() => import('@/templates/menuconfig/editthdmenu'))
 const { SubMenu } = Menu
 
 class Sidemenu extends Component {
diff --git a/src/components/sidemenu/menuform/index.scss b/src/components/sidemenu/menuform/index.scss
deleted file mode 100644
index 838b936..0000000
--- a/src/components/sidemenu/menuform/index.scss
+++ /dev/null
@@ -1,20 +0,0 @@
-.ant-advanced-search-form.main-search {
-  padding: 0px 24px 20px;
-  border-bottom: 1px solid #d9d9d9;
-  .ant-form-item {
-    display: flex;
-    margin-bottom: 10px;
-  }
-  .ant-form-item-control-wrapper {
-    flex: 1;
-  }
-  .ant-form-item-label {
-    width: 100px;
-  }
-}
-.ant-advanced-search-form {
-  position: relative;
-}
-.ant-advanced-search-form .ant-input-number {
-  width: 100%;
-}
\ No newline at end of file
diff --git a/src/components/dragelement/card.jsx b/src/templates/headerconfig/dragelement/card.jsx
similarity index 100%
rename from src/components/dragelement/card.jsx
rename to src/templates/headerconfig/dragelement/card.jsx
diff --git a/src/components/header/dragelement/index.jsx b/src/templates/headerconfig/dragelement/index.jsx
similarity index 100%
rename from src/components/header/dragelement/index.jsx
rename to src/templates/headerconfig/dragelement/index.jsx
diff --git a/src/components/header/dragelement/index.scss b/src/templates/headerconfig/dragelement/index.scss
similarity index 100%
rename from src/components/header/dragelement/index.scss
rename to src/templates/headerconfig/dragelement/index.scss
diff --git a/src/components/dragelement/itemtypes.js b/src/templates/headerconfig/dragelement/itemtypes.js
similarity index 100%
rename from src/components/dragelement/itemtypes.js
rename to src/templates/headerconfig/dragelement/itemtypes.js
diff --git a/src/components/header/editmenu/index.jsx b/src/templates/headerconfig/index.jsx
similarity index 93%
rename from src/components/header/editmenu/index.jsx
rename to src/templates/headerconfig/index.jsx
index 23b404a..054bc04 100644
--- a/src/components/header/editmenu/index.jsx
+++ b/src/templates/headerconfig/index.jsx
@@ -5,14 +5,21 @@
 import HTML5Backend from 'react-dnd-html5-backend'
 import { notification, Modal, Button, Spin } from 'antd'
 import moment from 'moment'
-import TransferForm from '@/components/transferform'
-import DragElement from '../dragelement'
-import MenuForm from '../menuform'
+
+import TransferForm from '@/templates/zshare/basetransferform'
+import DragElement from './dragelement'
+import MenuForm from './menuform'
 import Utils from '@/utils/utils.js'
 import zhCN from '@/locales/zh-CN/header.js'
 import enUS from '@/locales/en-US/header.js'
 import Api from '@/api'
 import './index.scss'
+
+import card1 from '@/assets/img/card-bg2.jpg'
+import card2 from '@/assets/img/card-bg5.jpg'
+import card3 from '@/assets/img/card-bg8.jpg'
+import card4 from '@/assets/img/card-bg7.jpg'
+import card5 from '@/assets/img/card-bg6.jpg'
 
 const { confirm } = Modal
 let previewList = null
@@ -308,19 +315,19 @@
     return (
       <div className="header-edit-box">
         <div className="mask">
-          <div className="tipcard card1">
+          <div className="tipcard card1" style={{backgroundImage: card1}}>
             鎷栧姩涓�绾ц彍鍗曞彲璋冩暣椤哄簭锛岄『搴忚皟鏁村悗锛岃鐐瑰嚮纭畾鎸夐挳淇濆瓨銆�
           </div>
-          <div className="tipcard card2">
+          <div className="tipcard card2" style={{backgroundImage: card2}}>
             榧犳爣缁忚繃鑿滃崟鏃朵細鏄剧ず缂栬緫鍥炬爣锛岀偣鍑荤紪杈戝彲淇敼鍜屽垹闄よ彍鍗曘��
           </div>
-          <div className="tipcard card3">
+          <div className="tipcard card3" style={{backgroundImage: card3}}>
             鐐瑰嚮瑙i櫎鍐荤粨鎸夐挳锛屽彲杩樺師宸插垹闄ょ殑涓�绾ц彍鍗曘��
           </div>
-          <div className="tipcard card4">
+          <div className="tipcard card4" style={{backgroundImage: card4}}>
             鐐瑰嚮娣诲姞鍥炬爣锛屽彲鏂板涓�绾ц彍鍗曘��
           </div>
-          <div className="tipcard card5">
+          <div className="tipcard card5" style={{backgroundImage: card5}}>
             <p>缂栬緫鐘舵�佷腑锛岃彍鍗曚箣澶栧尯鍩熶細閿佸畾锛屾煡鐪嬬郴缁熸暟鎹鐐瑰嚮銆�</p>
             <div>
               <a target="blank" href="#/main" >鏂伴〉闈�</a>
diff --git a/src/components/header/editmenu/index.scss b/src/templates/headerconfig/index.scss
similarity index 82%
rename from src/components/header/editmenu/index.scss
rename to src/templates/headerconfig/index.scss
index 5be7f5a..b38e001 100644
--- a/src/components/header/editmenu/index.scss
+++ b/src/templates/headerconfig/index.scss
@@ -19,7 +19,6 @@
       top: 20vh;
       width: 230px;
       min-height: 100px;
-      background-image: url('../../../assets/img/card-bg2.jpg');
       color: #000000;
       font-style: oblique;
     }
@@ -28,7 +27,6 @@
       top: 20vh;
       width: 230px;
       min-height: 100px;
-      background-image: url('../../../assets/img/card-bg5.jpg');
       color: #000000;
       padding: 20px 30px;
       font-style: oblique;
@@ -38,7 +36,6 @@
       top: 50vh;
       width: 230px;
       min-height: 140px;
-      background-image: url('../../../assets/img/card-bg8.jpg');
       color: #000000;
       padding: 20px 30px;
       font-style: oblique;
@@ -48,7 +45,6 @@
       top: 50vh;
       width: 230px;
       min-height: 140px;
-      background-image: url('../../../assets/img/card-bg7.jpg');
       color: #000000;
       padding: 20px 30px;
       font-style: oblique;
@@ -58,7 +54,6 @@
       top: 20vh;
       width: 130px;
       min-height: 240px;
-      background-image: url('../../../assets/img/card-bg6.jpg');
       color: #000000;
       padding: 40px 15px 10px;
       p {
diff --git a/src/components/header/menuform/index.jsx b/src/templates/headerconfig/menuform/index.jsx
similarity index 100%
rename from src/components/header/menuform/index.jsx
rename to src/templates/headerconfig/menuform/index.jsx
diff --git a/src/components/header/menuform/index.scss b/src/templates/headerconfig/menuform/index.scss
similarity index 100%
copy from src/components/header/menuform/index.scss
copy to src/templates/headerconfig/menuform/index.scss
diff --git a/src/components/sidemenu/editsecmenu/index.jsx b/src/templates/menuconfig/editsecmenu/index.jsx
similarity index 99%
rename from src/components/sidemenu/editsecmenu/index.jsx
rename to src/templates/menuconfig/editsecmenu/index.jsx
index fa7acaa..da3978c 100644
--- a/src/components/sidemenu/editsecmenu/index.jsx
+++ b/src/templates/menuconfig/editsecmenu/index.jsx
@@ -5,7 +5,7 @@
 import HTML5Backend from 'react-dnd-html5-backend'
 import { notification, Modal, Button, Spin, Icon } from 'antd'
 import moment from 'moment'
-import TransferForm from '@/components/transferform'
+import TransferForm from '@/templates/zshare/basetransferform'
 import Utils from '@/utils/utils.js'
 import DragElement from '../menuelement'
 import MenuForm from '../menuform'
diff --git a/src/components/sidemenu/editsecmenu/index.scss b/src/templates/menuconfig/editsecmenu/index.scss
similarity index 100%
rename from src/components/sidemenu/editsecmenu/index.scss
rename to src/templates/menuconfig/editsecmenu/index.scss
diff --git a/src/components/sidemenu/editthdmenu/index.jsx b/src/templates/menuconfig/editthdmenu/index.jsx
similarity index 99%
rename from src/components/sidemenu/editthdmenu/index.jsx
rename to src/templates/menuconfig/editthdmenu/index.jsx
index a123f98..e667b34 100644
--- a/src/components/sidemenu/editthdmenu/index.jsx
+++ b/src/templates/menuconfig/editthdmenu/index.jsx
@@ -14,7 +14,7 @@
 
 import Preview from './preview'
 import MenuForm from './menuform'
-import TransferForm from '@/components/transferform'
+import TransferForm from '@/templates/zshare/basetransferform'
 import Utils from '@/utils/utils.js'
 import DragElement from '../menuelement'
 import asyncLoadComponent from '@/utils/asyncLoadComponent'
diff --git a/src/components/sidemenu/editthdmenu/index.scss b/src/templates/menuconfig/editthdmenu/index.scss
similarity index 100%
rename from src/components/sidemenu/editthdmenu/index.scss
rename to src/templates/menuconfig/editthdmenu/index.scss
diff --git a/src/components/sidemenu/editthdmenu/menuform/index.jsx b/src/templates/menuconfig/editthdmenu/menuform/index.jsx
similarity index 100%
rename from src/components/sidemenu/editthdmenu/menuform/index.jsx
rename to src/templates/menuconfig/editthdmenu/menuform/index.jsx
diff --git a/src/components/sidemenu/editthdmenu/menuform/index.scss b/src/templates/menuconfig/editthdmenu/menuform/index.scss
similarity index 100%
rename from src/components/sidemenu/editthdmenu/menuform/index.scss
rename to src/templates/menuconfig/editthdmenu/menuform/index.scss
diff --git a/src/components/sidemenu/editthdmenu/preview/index.jsx b/src/templates/menuconfig/editthdmenu/preview/index.jsx
similarity index 100%
rename from src/components/sidemenu/editthdmenu/preview/index.jsx
rename to src/templates/menuconfig/editthdmenu/preview/index.jsx
diff --git a/src/components/sidemenu/editthdmenu/preview/index.scss b/src/templates/menuconfig/editthdmenu/preview/index.scss
similarity index 100%
rename from src/components/sidemenu/editthdmenu/preview/index.scss
rename to src/templates/menuconfig/editthdmenu/preview/index.scss
diff --git a/src/components/sidemenu/menuelement/card.jsx b/src/templates/menuconfig/menuelement/card.jsx
similarity index 100%
rename from src/components/sidemenu/menuelement/card.jsx
rename to src/templates/menuconfig/menuelement/card.jsx
diff --git a/src/components/sidemenu/menuelement/index.jsx b/src/templates/menuconfig/menuelement/index.jsx
similarity index 100%
rename from src/components/sidemenu/menuelement/index.jsx
rename to src/templates/menuconfig/menuelement/index.jsx
diff --git a/src/components/sidemenu/menuelement/index.scss b/src/templates/menuconfig/menuelement/index.scss
similarity index 100%
rename from src/components/sidemenu/menuelement/index.scss
rename to src/templates/menuconfig/menuelement/index.scss
diff --git a/src/components/sidemenu/menuelement/itemtypes.js b/src/templates/menuconfig/menuelement/itemtypes.js
similarity index 100%
rename from src/components/sidemenu/menuelement/itemtypes.js
rename to src/templates/menuconfig/menuelement/itemtypes.js
diff --git a/src/components/sidemenu/menuform/index.jsx b/src/templates/menuconfig/menuform/index.jsx
similarity index 100%
rename from src/components/sidemenu/menuform/index.jsx
rename to src/templates/menuconfig/menuform/index.jsx
diff --git a/src/components/header/menuform/index.scss b/src/templates/menuconfig/menuform/index.scss
similarity index 100%
rename from src/components/header/menuform/index.scss
rename to src/templates/menuconfig/menuform/index.scss
diff --git a/src/templates/zshare/adjustransferform/index.jsx b/src/templates/zshare/adjustransferform/index.jsx
new file mode 100644
index 0000000..4e492b5
--- /dev/null
+++ b/src/templates/zshare/adjustransferform/index.jsx
@@ -0,0 +1,114 @@
+import React, {Component} from 'react'
+import PropTypes from 'prop-types'
+import { Transfer, Icon } from 'antd'
+import './index.scss'
+
+class TransferForm extends Component {
+  static propTypes = {
+    columns: PropTypes.array,
+    selected: PropTypes.array,
+    dict: PropTypes.object, // 瀛楀吀椤�
+  }
+
+  state = {
+    data: [],
+    targetKeys: [],
+    selectedKeys: []
+  }
+
+  handleChange = (nextTargetKeys, direction, moveKeys) => {
+    this.setState({ targetKeys: nextTargetKeys })
+  }
+
+  handleSelectChange = (sourceSelectedKeys, targetSelectedKeys) => {
+    this.setState({ selectedKeys: [...sourceSelectedKeys, ...targetSelectedKeys] })
+  }
+  
+  UNSAFE_componentWillMount() {
+    let datas = new Map()
+    this.props.columns.forEach(item => {
+      if (item.field && item.Hide !== 'true') {
+        datas.set(item.uuid, item)
+      }
+    })
+
+    let selecteds = []
+
+    this.props.selected.forEach(item => {
+      if (datas.has(item)) {
+        selecteds.push(item)
+      }
+    })
+
+    this.setState({
+      data: [...datas.values()].map(item => {
+        return {
+          key: item.uuid,
+          title: item.label,
+          field: item.field,
+          description: ''
+        }
+      }),
+      targetKeys: selecteds
+    })
+  }
+
+  changeorder = (e, item, type) => {
+    const { targetKeys } = this.state
+    e.stopPropagation()
+
+    let _index = 0
+    let keys = targetKeys.filter((key, i) => {
+      if (key === item.key) {
+        _index = i
+        return false
+      } else {
+        return true
+      }
+    })
+
+    if ((_index === 0 && type === 'up') || (_index === targetKeys.length - 1 && type === 'down')) {
+      return
+    }
+
+    if (type === 'up') {
+      keys.splice(_index - 1, 0, item.key)
+    } else {
+      keys.splice(_index + 1, 0, item.key)
+    }
+
+    this.setState({
+      targetKeys: keys
+    })
+  }
+
+  getItem = (item) => {
+    let content = item.title + '(' + item.field + ')'
+    return <span title={content}>
+      {content}
+      <Icon type="arrow-up" onClick={(e) => {this.changeorder(e, item, 'up')}} />
+      <Icon type="arrow-down" onClick={(e) => {this.changeorder(e, item, 'down')}} />
+    </span>
+  }
+
+  render() {
+    const { targetKeys, selectedKeys } = this.state
+
+    return (
+      <div className="common-table-columns-transfer">
+        <Transfer
+          dataSource={this.state.data}
+          titles={[this.props.dict['header.form.column.source'], this.props.dict['header.form.column.target']]}
+          targetKeys={targetKeys}
+          locale={{itemUnit: this.props.dict['header.form.column.itemUnit'], itemsUnit: this.props.dict['header.form.column.itemsUnit']}}
+          selectedKeys={selectedKeys}
+          onChange={this.handleChange}
+          onSelectChange={this.handleSelectChange}
+          render={this.getItem}
+        />
+      </div>
+    )
+  }
+}
+
+export default TransferForm
diff --git a/src/templates/zshare/adjustransferform/index.scss b/src/templates/zshare/adjustransferform/index.scss
new file mode 100644
index 0000000..1ebb78b
--- /dev/null
+++ b/src/templates/zshare/adjustransferform/index.scss
@@ -0,0 +1,29 @@
+.common-table-columns-transfer {
+  padding-left: 18px;
+  .ant-transfer-list {
+    width: 296px;
+    i {
+      display: none;
+    }
+  }
+  .ant-transfer-operation + .ant-transfer-list {
+    .ant-transfer-list-content-item {
+      padding-right: 50px;
+      position: relative;
+      
+      i {
+        display: inline-block;
+      }
+      .anticon {
+        position: absolute;
+        right: 10px;
+        color: #ff4d4f;
+      }
+      .anticon-arrow-up {
+        position: absolute;
+        right: 30px;
+        color: #1890ff;
+      }
+    }
+  }
+}
\ No newline at end of file
diff --git a/src/templates/zshare/basetransferform/index.jsx b/src/templates/zshare/basetransferform/index.jsx
new file mode 100644
index 0000000..96907cd
--- /dev/null
+++ b/src/templates/zshare/basetransferform/index.jsx
@@ -0,0 +1,48 @@
+import React, {Component} from 'react'
+import PropTypes from 'prop-types'
+import { Transfer } from 'antd'
+
+import zhCN from '@/locales/zh-CN/share.js'
+import enUS from '@/locales/en-US/share.js'
+import './index.scss'
+
+class TransferForm extends Component {
+  static propTypes = {
+    menulist: PropTypes.array
+  }
+
+  state = {
+    dict: sessionStorage.getItem('lang') !== 'en-US' ? zhCN : enUS,
+    targetKeys: [],
+    selectedKeys: []
+  }
+
+  handleChange = (nextTargetKeys, direction, moveKeys) => {
+    this.setState({ targetKeys: nextTargetKeys })
+  }
+
+  handleSelectChange = (sourceSelectedKeys, targetSelectedKeys) => {
+    this.setState({ selectedKeys: [...sourceSelectedKeys, ...targetSelectedKeys] })
+  }
+
+  render() {
+    const { targetKeys, selectedKeys, dict } = this.state
+
+    return (
+      <div className="trawmenutransfer">
+        <Transfer
+          dataSource={this.props.menulist}
+          titles={[dict['thawmenu.source'], dict['thawmenu.target']]}
+          targetKeys={targetKeys}
+          locale={{itemUnit: dict['thawmenu.itemUnit'], itemsUnit: dict['thawmenu.itemsUnit']}}
+          selectedKeys={selectedKeys}
+          onChange={this.handleChange}
+          onSelectChange={this.handleSelectChange}
+          render={item => item.title}
+        />
+      </div>
+    )
+  }
+}
+
+export default TransferForm
diff --git a/src/templates/zshare/basetransferform/index.scss b/src/templates/zshare/basetransferform/index.scss
new file mode 100644
index 0000000..7959ddd
--- /dev/null
+++ b/src/templates/zshare/basetransferform/index.scss
@@ -0,0 +1,5 @@
+.trawmenutransfer {
+  .ant-transfer-list {
+    width: 210px;
+  }
+}
\ No newline at end of file
diff --git a/src/templates/zshare/editcomponent/index.jsx b/src/templates/zshare/editcomponent/index.jsx
index d8a5014..25c8cb3 100644
--- a/src/templates/zshare/editcomponent/index.jsx
+++ b/src/templates/zshare/editcomponent/index.jsx
@@ -4,7 +4,7 @@
 
 import Api from '@/api'
 import PasteForm from '@/templates/zshare/pasteform'
-import TransferForm from '@/components/transferform'
+import TransferForm from '@/templates/zshare/basetransferform'
 import './index.scss'
 
 class editComponent extends Component {
diff --git a/src/templates/zshare/transferform/index.jsx b/src/templates/zshare/transferform/index.jsx
index 2bc1f6c..4e492b5 100644
--- a/src/templates/zshare/transferform/index.jsx
+++ b/src/templates/zshare/transferform/index.jsx
@@ -37,7 +37,6 @@
     this.props.selected.forEach(item => {
       if (datas.has(item)) {
         selecteds.push(item)
-        // datas.delete(item)
       }
     })
 

--
Gitblit v1.8.0