| | |
| | | :data="treeData" |
| | | node-key="id" |
| | | default-expand-all |
| | | @node-click="checkNode" |
| | | :expand-on-click-node="false" |
| | | :check-on-click-node="true" |
| | | :highlight-current="true" |
| | | @node-click="checkNode" |
| | | @node-contextmenu="nodeContextMenu" |
| | | ></el-tree> |
| | | <div class="menuList" v-show="showMenu" :style="{top:menuTop+'px',left:menuLeft+'px'}"> |
| | | <ul> |
| | | <li>创建同级节点</li> |
| | | <li>删除节点</li> |
| | | <li>重命名节点</li> |
| | | <li>关闭</li> |
| | | <li @click="showMenu = false">关闭</li> |
| | | </ul> |
| | | </div> |
| | | </div> |
| | |
| | | <div> |
| | | <p class="tip"> |
| | | *请提前根据文件模板中的要求收集人员信息,在一个文件夹中存放人员照片和EXCEL文件 |
| | | (<a href="javascript:;" @mouseover="showDemo=true" @mouseout="showDemo=false">示例</a>),点击 |
| | | ( |
| | | <a href="javascript:;" @mouseover="showDemo=true" @mouseout="showDemo=false">示例</a>),点击 |
| | | <a href="javascript:;">下载模板.excel</a> |
| | | <img class="tip-demo" v-if="showDemo" :src="`${publicPath}images/shuohuang/tip.jpg`" alt=""> |
| | | <img class="tip-demo" v-if="showDemo" :src="`${publicPath}images/shuohuang/tip.jpg`" alt /> |
| | | </p> |
| | | <div class="flex-box"> |
| | | <label>上传文件:</label> |
| | | <el-button size="mini" type="primary" @click="uploadDirectoryTrigger" >点击上传</el-button> |
| | | <input ref="directoryInput" @change="importDirectory" hidden type="file" webkitdirectory > |
| | | <input ref="directoryInput" @change="importDirectory" hidden type="file" webkitdirectory /> |
| | | <!-- <el-button size="mini" type="primary" @click="uploadExeclTrigger" style="margin-left:10px;">点击上传Excel</el-button> |
| | | <input ref="excelInput" @change="importExecl" hidden type="file" accept=".xlsx"> --> |
| | | <!-- <el-upload |
| | |
| | | |
| | | }, |
| | | methods: { |
| | | |
| | | nodeContextMenu (e, data, node, comp) { |
| | | debugger |
| | | this.showMenu = true; |
| | | this.menuTop = e.pageY; |
| | | this.menuLeft = e.pageX; |
| | | }, |
| | | checkOrgNode (a, b, c) { |
| | | this.checkedOrg = a.id |
| | | }, |
| | |
| | | this.$set(this.memberEditForm, 'Surface', res.data) |
| | | }) |
| | | }, |
| | | openMenuList (t, l, frame) { |
| | | this.showMenu = true; |
| | | this.menuTop = t; |
| | | this.menuLeft = l; |
| | | }, |
| | | closeMenuList () { |
| | | this.showMenu = false; |
| | | }, |
| | | |
| | | deepNodeChildren (node) { |
| | | if (node.ChildDept && node.ChildDept.length > 0) { |
| | | return node.ChildDept.map(child => { |
| | |
| | | z-index: 100; |
| | | width: 180px; |
| | | text-align: left; |
| | | border: 1px solid #ccc; |
| | | border: 1px solid #ddd; |
| | | box-shadow: 4px 4px 3px 0px rgba(0, 0, 0, 0.1); |
| | | } |
| | | .menuList li { |
| | | line-height: 28px; |
| | |
| | | background: #fff; |
| | | } |
| | | .menuList li:hover { |
| | | background: rgba(152, 170, 190, 0.7); |
| | | background: #ecf0fc; |
| | | } |
| | | .right { |
| | | padding-left: 20px; |