Skip to content

M
mes-ui
Commit 6df392a6 authored by renjintao's avatar renjintao
Browse files
Options

部门管理 export，treegrid，org，getalldepartment ......

parent 06d2afa4
Show whitespace changes
Inline Side-by-side
Showing with 1135 additions and 963 deletions
components/page/treeGrid/index.vue
View file @ 6df392a6
<template> <template>
<div class="treeTbale"> <div class="treeTbale">
<div class="table-tools"> <div class="table-tools">
<div class="table-search"> <div class="table-search">
<slot name="easySearch"></slot> <slot name="easySearch"></slot>
...@@ -14,36 +14,22 @@ ...@@ -14,36 +14,22 @@
<table> <table>
<thead> <thead>
<tr> <tr>
<th v-for="(column,index) in cloneColumns" :key="index"> <th v-for="(column,index) in cloneColumns" :key="index" v-if="column.hide!=true">
<label v-if="column.type === 'selection'"> <label v-if="column.type === 'selection'">
<input type="checkbox" v-model="checks" @click="handleCheckAll" />全选 <input type="checkbox" v-model="checks" @click="handleCheckAll" />全选
</label> </label>
<label v-else> <label v-else>
{{ renderHeader(column, index) }} {{ renderHeader(column, index) }}
<span class="ivu-table-sort" v-if="column.sortable"> <span class="ivu-table-sort" v-if="column.sortable">
<Icon <Icon type="arrow-up-b" :class="{on: column._sortType === 'asc'}" @click.native="handleSort(index, 'asc')" />
type="arrow-up-b" <Icon type="arrow-down-b" :class="{on: column._sortType === 'desc'}" @click.native="handleSort(index, 'desc')" />
:class="{on: column._sortType === 'asc'}"
@click.native="handleSort(index, 'asc')"
/>
<Icon
type="arrow-down-b"
:class="{on: column._sortType === 'desc'}"
@click.native="handleSort(index, 'desc')"
/>
</span> </span>
</label> </label>
</th> </th>
</tr> </tr>
</thead> </thead>
<tbody> <tbody>
<tr <tr v-for="(item,index) in initItems" :key="item.id" v-show="show(item)" class="treetr" :class="{'child-tr':item.parent}">
v-for="(item,index) in initItems"
:key="item.id"
v-show="show(item)"
class="treetr"
:class="{'child-tr':item.parent}"
>
<td v-for="(column,snum) in columns" :key="column.key" :style="tdStyle(column)"> <td v-for="(column,snum) in columns" :key="column.key" :style="tdStyle(column)">
<!-- <label> <!-- <label>
<input <input
...@@ -56,13 +42,7 @@ ...@@ -56,13 +42,7 @@
</label>--> </label>-->
<!-- 图标 --> <!-- 图标 -->
<div v-if="column.type === 'icon'"> <div v-if="column.type === 'icon'">
<i <i class="icon-set" size="small" @click="RowClick(item,$event,index,action.text)" v-for="action in (column.actions)" :key="action.text">
class="icon-set"
size="small"
@click="RowClick(item,$event,index,action.text)"
v-for="action in (column.actions)"
:key="action.text"
>
<Icon :type="action.type" :title="action.text" :style="action.style" /> <Icon :type="action.type" :title="action.text" :style="action.style" />
</i> </i>
</div> </div>
...@@ -72,78 +52,52 @@ ...@@ -72,78 +52,52 @@
<state v-if="column.code" :code="column.code" :value="item[column.key]" /> <state v-if="column.code" :code="column.code" :value="item[column.key]" />
<!-- 操作 --> <!-- 操作 -->
<div v-if="column.type === 'action'" class="action" style="text-align:left;"> <div v-if="column.type === 'action'" class="action" style="text-align:left;">
<op <op v-for="action in (column.actions)" :key="action.text" @click="RowClick(item,$event,index,action.text)" :type="action.type" size="small" style=" margin:0 5px;" :class="action.text=='删除'? 'remove' : (action.text=='新增' ? 'add': (action.text=='编辑' ?'edit':''))" v-show="(item.type=='3'&&action.text=='新增')||(item.children.length>0&&action.text=='删除')?false:true">{{action.text}}</op>
v-for="action in (column.actions)"
:key="action.text"
@click="RowClick(item,$event,index,action.text)"
:type="action.type"
size="small"
style=" margin:0 5px;"
:class="action.text=='删除'? 'remove' : (action.text=='新增' ? 'add': (action.text=='编辑' ?'edit':''))"
v-show="(item.type=='3'&&action.text=='新增')||(item.children.length>0&&action.text=='删除')?false:true"
>{{action.text}}</op>
</div> </div>
<!-- 类型 --> <!-- 类型 -->
<div v-if="column.type === 'menuRender'" style="text-align:center;"> <div v-if="column.type === 'menuRender'" style="text-align:center;">
<Button <Button :ghost="item[column.key] ==0 ?false:true" size="small" :type="item[column.key] ==0 ? 'default' :item[column.key] == 1 ? 'info' :item[column.key] == 2?'error':'warning'">{{item[column.key] == 0 ? '子系统':item[column.key] == 1 ? '目录': item[column.key] == 2 ? '菜单' : '按钮'}}</Button>
:ghost="item[column.key] ==0 ?false:true"
size="small"
:type="item[column.key] ==0 ? 'default' :item[column.key] == 1 ? 'info' :item[column.key] == 2?'error':'warning'"
>{{item[column.key] == 0 ? '子系统':item[column.key] == 1 ? '目录': item[column.key] == 2 ? '菜单' : '按钮'}}</Button>
</div> </div>
<!-- 状态 --> <!-- 状态 -->
<div v-if="column.type === 'menuIsshow'" style="text-align:center;"> <div v-if="column.type === 'menuIsshow'" style="text-align:center;">
<Button <Button :ghost="item[column.key] == 1 ? true :false" :disabled="item[column.key] == 1 ? false :true" size="small" :type="item[column.key] == 1 ? 'info' :'default'">{{item[column.key] == 1 ? '显示': '隐藏'}}</Button>
:ghost="item[column.key] == 1 ? true :false"
:disabled="item[column.key] == 1 ? false :true"
size="small"
:type="item[column.key] == 1 ? 'info' :'default'"
>{{item[column.key] == 1 ? '显示': '隐藏'}}</Button>
</div> </div>
<!-- 打开方式 --> <!-- 打开方式 -->
<div v-if="column.type === 'menuTarget'"> <div v-if="column.type === 'menuTarget'">
<span <span :style="item[column.key] == 0?'color:#006699':item[column.key] == 1?'color:black':''">{{item[column.key] == 0 ? '本页面': item[column.key] == 1?'新页面':''}}</span>
:style="item[column.key] == 0?'color:#006699':item[column.key] == 1?'color:black':''"
>{{item[column.key] == 0 ? '本页面': item[column.key] == 1?'新页面':''}}</span>
</div> </div>
<!-- 菜单名称、排序、请求地址 --> <!-- 菜单名称、排序、请求地址 -->
<label @click="toggle(index,item)" v-if="!column.type&&!column.code&&!column.render"> <label @click="toggle(index,item)" v-if="!column.type&&!column.code&&!column.render">
<span v-if="snum==iconRow()"> <span v-if="snum==iconRow()">
<i v-html="item.spaceHtml"></i> <i v-html="item.spaceHtml"></i>
<a v-if="item.children&&item.children.length>0"> <a v-if="item.children&&item.children.length>0">
<i <i class="ivu-icon" :class="{'ivu-icon-ios-arrow-forward':!item.expanded,'ivu-icon-ios-arrow-down':item.expanded }"></i>
class="ivu-icon"
:class="{'ivu-icon-ios-arrow-forward':!item.expanded,'ivu-icon-ios-arrow-down':item.expanded }"
></i>
</a> </a>
<i v-else class="ms-tree-space"></i> <i v-else class="ms-tree-space"></i>
</span> </span>
{{renderBody(item,column) }} {{renderBody(item,column) }}
</label> </label>
<table-expand <table-expand v-if="column.render&&!column.type" :row="item" :column="column" :index="snum" :render="column.render"></table-expand>
v-if="column.render&&!column.type"
:row="item"
:column="column"
:index="snum"
:render="column.render"
></table-expand>
</td> </td>
</tr> </tr>
</tbody> </tbody>
</table> </table>
</div> </div>
</template> </template>
<script> <script>
import TableExpand from './expand' import TableExpand from './expand'
export default { export default {
name: 'treeGrid', name: 'treeGrid',
components: { TableExpand }, components: {
TableExpand
},
props: { props: {
columns: Array, columns: Array,
items: { items: {
type: Array, type: Array,
default() { default () {
return [] return []
} }
}, },
...@@ -164,9 +118,9 @@ export default { ...@@ -164,9 +118,9 @@ export default {
}, },
computed: { computed: {
tableWidth() { tableWidth() {
return this.tdsWidth > this.screenWidth && this.screenWidth > 0 return this.tdsWidth > this.screenWidth && this.screenWidth > 0 ?
? `${this.screenWidth}px` `${this.screenWidth}px` :
: '100%' '100%'
} }
}, },
watch: { watch: {
...@@ -243,6 +197,9 @@ export default { ...@@ -243,6 +197,9 @@ export default {
if (column.width) { if (column.width) {
style['width'] = `${column.width}px` style['width'] = `${column.width}px`
} }
if (column.hide == true) {
style['display'] = `none`
}
return style return style
}, },
...@@ -518,7 +475,9 @@ export default { ...@@ -518,7 +475,9 @@ export default {
}, },
// 返回树形数据长度 // 返回树形数据长度
Length(data) { Length(data) {
let { length } = data let {
length
} = data
data.forEach((child) => { data.forEach((child) => {
if (child.children) { if (child.children) {
length += this.Length(child.children) length += this.Length(child.children)
...@@ -578,7 +537,9 @@ export default { ...@@ -578,7 +537,9 @@ export default {
} }
}, },
type(obj) { type(obj) {
const { toString } = Object.prototype const {
toString
} = Object.prototype
const map = { const map = {
'[object Boolean]': 'boolean', '[object Boolean]': 'boolean',
'[object Number]': 'number', '[object Number]': 'number',
...@@ -599,51 +560,62 @@ export default { ...@@ -599,51 +560,62 @@ export default {
} }
} }
</script> </script>
<style lang="less"> <style lang="less">
.treeTbale { .treeTbale {
overflow: 0 auto; overflow: 0 auto;
width: 100% !important; width: 100% !important;
.table-tools { .table-tools {
line-height: 40px; line-height: 40px;
.table-search { .table-search {
float: left; float: left;
line-height: 40px; line-height: 40px;
min-width: 300px; min-width: 300px;
} }
.btns { .btns {
float: right; float: right;
line-height: 40px; line-height: 40px;
} }
tr:hover { tr:hover {
background: #f7f7f7; background: #f7f7f7;
} }
} }
.icon-set { .icon-set {
font-size: 17px; font-size: 17px;
margin-left: 5px; margin-left: 5px;
display: inline-block; display: inline-block;
} }
.icon-set .ivu-icon { .icon-set .ivu-icon {
cursor: pointer; cursor: pointer;
} }
table { table {
border-spacing: 0; border-spacing: 0;
border-collapse: collapse; border-collapse: collapse;
margin: 0 auto; margin: 0 auto;
width: 100%; width: 100%;
th { th {
background: #f8f8f9; background: #f8f8f9;
} }
td, td,
th { th {
border: #dcdee2 solid 1px; border: #dcdee2 solid 1px;
line-height: 40px; line-height: 40px;
padding: 0 5px; padding: 0 5px;
} }
tr.treetr:hover td { tr.treetr:hover td {
background: #f7f7f7; background: #f7f7f7;
} }
.ms-tree-space { .ms-tree-space {
position: relative; position: relative;
top: 1px; top: 1px;
......
i18n/locale/zh-CN.js
View file @ 6df392a6
...@@ -428,6 +428,10 @@ export default { ...@@ -428,6 +428,10 @@ export default {
cityName: '省市县', cityName: '省市县',
creationTime: '创建时间', creationTime: '创建时间',
upMent: '上级部门', upMent: '上级部门',
code:'部门编号',
location:'省市县',
parent_Id:'上级部门',
property:'属性',
}, },
instance: { instance: {
id: '主键', id: '主键',
......
libs/henq.js
View file @ 6df392a6
...@@ -139,6 +139,42 @@ henq.treeToList = (tree) => { ...@@ -139,6 +139,42 @@ henq.treeToList = (tree) => {
treeToList(tree, null) treeToList(tree, null)
return list; return list;
} }
//省市县pacc转为list
henq.treeToList1 = (tree) => {
let list = [];
function treeToList1(data) {
data.map(u => {
if (u.children&&u.level!=1) {
treeToList1(u.children, u)
}
else if(u.children&&u.level==1)
{
list=list.concat(u.children);
}
})
}
treeToList1(tree, null)
return list;
}
//根据departId返出上级所有name
henq.getDepartAllName = (list,id) => {
let names = '';
function getDepartAllName(list,id) {
list.map(u => {
if(id==u.id)
{
names=u.name+"-"+names
if (u.parent_Id>0) {
getDepartAllName(list, u.parent_Id)
}
}
})
}
getDepartAllName(list,id)
return names.slice(0,names.length-1);
}
//导出pdf //导出pdf
henq.outPdf = (ele, fileName) => { henq.outPdf = (ele, fileName) => {
// document.head.innerHTML = // document.head.innerHTML =
......
package-lock.json
View file @ 6df392a6
...@@ -4783,7 +4783,7 @@ ...@@ -4783,7 +4783,7 @@
"dependencies": { "dependencies": {
"commander": { "commander": {
"version": "2.14.1", "version": "2.14.1",
"resolved": "http://r.cnpmjs.org/commander/download/commander-2.14.1.tgz", "resolved": "https://registry.npm.taobao.org/commander/download/commander-2.14.1.tgz?cache=0&sync_timestamp=1595168224685&other_urls=https%3A%2F%2Fregistry.npm.taobao.org%2Fcommander%2Fdownload%2Fcommander-2.14.1.tgz",
"integrity": "sha1-IjUSPjevjKPGXfRbAm29NXsBuao=" "integrity": "sha1-IjUSPjevjKPGXfRbAm29NXsBuao="
} }
} }
...@@ -5340,7 +5340,7 @@ ...@@ -5340,7 +5340,7 @@
}, },
"crc-32": { "crc-32": {
"version": "1.2.0", "version": "1.2.0",
"resolved": "http://r.cnpmjs.org/crc-32/download/crc-32-1.2.0.tgz", "resolved": "https://registry.npm.taobao.org/crc-32/download/crc-32-1.2.0.tgz",
"integrity": "sha1-yy224puIUI4y2d0OwWk+e0Ghggg=", "integrity": "sha1-yy224puIUI4y2d0OwWk+e0Ghggg=",
"requires": { "requires": {
"exit-on-epipe": "~1.0.1", "exit-on-epipe": "~1.0.1",
...@@ -7127,7 +7127,7 @@ ...@@ -7127,7 +7127,7 @@
}, },
"exit-on-epipe": { "exit-on-epipe": {
"version": "1.0.1", "version": "1.0.1",
"resolved": "http://r.cnpmjs.org/exit-on-epipe/download/exit-on-epipe-1.0.1.tgz", "resolved": "https://registry.npm.taobao.org/exit-on-epipe/download/exit-on-epipe-1.0.1.tgz",
"integrity": "sha1-C92S6H1ShdJn2qgXHQ6wYVlolpI=" "integrity": "sha1-C92S6H1ShdJn2qgXHQ6wYVlolpI="
}, },
"expand-brackets": { "expand-brackets": {
...@@ -7814,7 +7814,7 @@ ...@@ -7814,7 +7814,7 @@
}, },
"frac": { "frac": {
"version": "1.1.2", "version": "1.1.2",
"resolved": "http://r.cnpmjs.org/frac/download/frac-1.1.2.tgz", "resolved": "https://registry.npm.taobao.org/frac/download/frac-1.1.2.tgz",
"integrity": "sha1-PXT39keMiKG1AgMG10fcYxPHTQs=" "integrity": "sha1-PXT39keMiKG1AgMG10fcYxPHTQs="
}, },
"fragment-cache": { "fragment-cache": {
...@@ -14419,7 +14419,7 @@ ...@@ -14419,7 +14419,7 @@
}, },
"printj": { "printj": {
"version": "1.1.2", "version": "1.1.2",
"resolved": "http://r.cnpmjs.org/printj/download/printj-1.1.2.tgz", "resolved": "https://registry.npm.taobao.org/printj/download/printj-1.1.2.tgz",
"integrity": "sha1-2Q3rKXWoufYA+zoclOP0xTx4oiI=" "integrity": "sha1-2Q3rKXWoufYA+zoclOP0xTx4oiI="
}, },
"private": { "private": {
...@@ -15893,7 +15893,7 @@ ...@@ -15893,7 +15893,7 @@
}, },
"script-loader": { "script-loader": {
"version": "0.7.2", "version": "0.7.2",
"resolved": "http://r.cnpmjs.org/script-loader/download/script-loader-0.7.2.tgz", "resolved": "https://registry.npm.taobao.org/script-loader/download/script-loader-0.7.2.tgz",
"integrity": "sha1-IBbbb4byX1z1baOJFdgzeLsWa6c=", "integrity": "sha1-IBbbb4byX1z1baOJFdgzeLsWa6c=",
"dev": true, "dev": true,
"requires": { "requires": {
...@@ -16473,7 +16473,7 @@ ...@@ -16473,7 +16473,7 @@
}, },
"ssf": { "ssf": {
"version": "0.10.3", "version": "0.10.3",
"resolved": "http://r.cnpmjs.org/ssf/download/ssf-0.10.3.tgz", "resolved": "https://registry.npm.taobao.org/ssf/download/ssf-0.10.3.tgz",
"integrity": "sha1-jq4fwpyQpVLnkhII+BiS1vd6yys=", "integrity": "sha1-jq4fwpyQpVLnkhII+BiS1vd6yys=",
"requires": { "requires": {
"frac": "~1.1.2" "frac": "~1.1.2"
...@@ -20196,7 +20196,7 @@ ...@@ -20196,7 +20196,7 @@
}, },
"wmf": { "wmf": {
"version": "1.0.2", "version": "1.0.2",
"resolved": "http://r.cnpmjs.org/wmf/download/wmf-1.0.2.tgz", "resolved": "https://registry.npm.taobao.org/wmf/download/wmf-1.0.2.tgz",
"integrity": "sha1-fRnWIQcaCMK9xrfmiKnENSmMwto=" "integrity": "sha1-fRnWIQcaCMK9xrfmiKnENSmMwto="
}, },
"word-wrap": { "word-wrap": {
...@@ -20315,7 +20315,7 @@ ...@@ -20315,7 +20315,7 @@
}, },
"xlsx": { "xlsx": {
"version": "0.15.6", "version": "0.15.6",
"resolved": "http://r.cnpmjs.org/xlsx/download/xlsx-0.15.6.tgz", "resolved": "https://registry.npm.taobao.org/xlsx/download/xlsx-0.15.6.tgz?cache=0&sync_timestamp=1597272342311&other_urls=https%3A%2F%2Fregistry.npm.taobao.org%2Fxlsx%2Fdownload%2Fxlsx-0.15.6.tgz",
"integrity": "sha1-Rh+EHW2eoag3XizSRr8jrs4IodU=", "integrity": "sha1-Rh+EHW2eoag3XizSRr8jrs4IodU=",
"requires": { "requires": {
"adler-32": "~1.2.0", "adler-32": "~1.2.0",
...@@ -20330,7 +20330,7 @@ ...@@ -20330,7 +20330,7 @@
"dependencies": { "dependencies": {
"commander": { "commander": {
"version": "2.17.1", "version": "2.17.1",
"resolved": "http://r.cnpmjs.org/commander/download/commander-2.17.1.tgz", "resolved": "https://registry.npm.taobao.org/commander/download/commander-2.17.1.tgz?cache=0&sync_timestamp=1595168224685&other_urls=https%3A%2F%2Fregistry.npm.taobao.org%2Fcommander%2Fdownload%2Fcommander-2.17.1.tgz",
"integrity": "sha1-vXerfebelCBc6sxy8XFtKfIKd78=" "integrity": "sha1-vXerfebelCBc6sxy8XFtKfIKd78="
} }
} }
......
pages/basicData/department/index.vue
View file @ 6df392a6
<template> <template>
<div id="department"> <div id="department">
<div class="tr"> <div class="tr">
<Button type="primary" @click="add()" class="mb10">新增部门</Button> <Button type="primary" @click="add()" class="mb10">新增部门</Button>
<Button>导入</Button>
<Button @click="export2Excel">导出</Button>
<RadioGroup v-model="img" type="button" size="small"> <RadioGroup v-model="img" type="button" size="small">
<Radio :label="1"><Icon type="ios-apps" /></Radio> <Radio :label="1">
<Radio :label="0"><Icon type="md-git-merge" /></Radio> <Icon type="ios-apps" />
</Radio>
<Radio :label="0">
<Icon type="md-git-merge" />
</Radio>
</RadioGroup> </RadioGroup>
<Cascader :data="citys" v-show="false"></Cascader>
</div> </div>
<div class="main"> <div class="main">
<TreeGrid v-if="img==1" :columns="columns" :items="treeData"></TreeGrid> <TreeGrid v-if="img==1" :columns="columns" :items="treeData"></TreeGrid>
<Org v-else :data="treeData" @nodeChange="nodeChange"/> <Org v-else :datas="treeData" @nodeChange="nodeChange" />
</div> </div>
<Modal v-model="addModal" title="新增部门" width="800" footer-hide> <Modal v-model="addModal" title="新增部门" width="800" footer-hide>
<Add @on-close="cancel" @on-ok="addOk" /> <Add @on-close="cancel" @on-ok="addOk" />
...@@ -20,14 +27,16 @@ ...@@ -20,14 +27,16 @@
<Modal v-model="editModal" title="编辑" width="800" footer-hide> <Modal v-model="editModal" title="编辑" width="800" footer-hide>
<Edit :row="rowData" @on-close="cancel" @on-ok="addOk" /> <Edit :row="rowData" @on-close="cancel" @on-ok="addOk" />
</Modal> </Modal>
</div> </div>
</template> </template>
<script> <script>
import Api from "./api"; import Api from "./api";
import Add from "./add"; import Add from "./add";
import AddRow from "./Addrow"; import AddRow from "./Addrow";
import Edit from "./edit"; import Edit from "./edit";
import Org from "./org"; import Org from "./org";
import citys from "@/libs/citys";
export default { export default {
name: "list", name: "list",
components: { components: {
...@@ -60,87 +69,122 @@ export default { ...@@ -60,87 +69,122 @@ export default {
rowdata: null, rowdata: null,
aId: 0, aId: 0,
rowData: null, rowData: null,
columns: [ columns: [{
key: "parent_Id",
title: this.l("parent_Id"),
align: "left",
hide: true,
parentDepart: true,
import: true,
render: (h, params) => {
return h("span", {},
this.getParentDepart(params.row.parent_Id)
)
}
},
{ {
key: "name", key: "name",
title: this.l("name"), title: this.l("name"),
align: "left", align: "left",
high: true },
},
// {
// key: 'organizationType',
// title: this.l('organizationType'),
// align: 'left',
// easy: true,
// high: true
// },
{ {
key: "creationTime", key: "code",
title: this.l("creationTime"), title: this.l("code"),
align: "left",
},
{
key: "location",
title: this.l("location"),
align: "left", align: "left",
easy: true, location: true,
high: true import: true,
render: (h, params) => {
return h("span", {},
this.getCity(params.row.location ? params.row.location : 0))
}
}, },
{ {
key: "property", key: "property",
title: this.l("status"), title: this.l("property"),
align: "left", align: "left",
code: "department.property", code: "department.property",
easy: true, },
high: true {
key: "creationTime",
title: this.l("creationTime"),
align: "left",
}, },
{ {
title: "操作", title: "操作",
key: "id", key: "action",
align: "left", align: "left",
render: (h, params) => { render: (h, params) => {
let actions = [ let actions = [
h( h(
"op", "op", {
{ attrs: {
attrs: { oprate: "add" }, oprate: "add"
on: { click: () => this.addrow(params.row) } },
on: {
click: () => this.addrow(params.row)
}
}, },
"新增" "新增"
), ),
h( h(
"op", "op", {
{ attrs: {
attrs: { oprate: "edit" }, oprate: "edit"
on: { click: () => this.edit(params.row) } },
on: {
click: () => this.edit(params.row)
}
}, },
"编辑" "编辑"
), ),
h( h(
"op", "op", {
{ attrs: {
attrs: { oprate: "delete" }, oprate: "delete"
on: { click: () => this.remove(params.row.id) } },
on: {
click: () => this.remove(params.row.id)
}
}, },
"删除" "删除"
) )
]; ];
return h("div", { class: "action" }, actions); return h("div", {
class: "action"
}, actions);
} }
} }
] ],
treeList: [],
citys: citys(),
cityDatas: [], //省市县在一起
}; };
}, },
async fetch({ store, params }) { async fetch({
store,
params
}) {
await store.dispatch("loadDictionary"); // 加载数据字典 await store.dispatch("loadDictionary"); // 加载数据字典
}, },
mounted() { mounted() {
this.init(); this.init();
this.formatCity();
}, },
methods: { methods: {
init() { init() {
Api.getpaged().then(r => { Api.getpaged().then(r => {
this.treeData = []; this.treeData = [];
this.treeList = r.result.items;
this.treeData = this.$u.toTree( this.treeData = this.$u.toTree(
r.result.items, r.result.items,
0, 0,
(u)=>{ (u) => {
u.label=u.name u.label = u.name
}, },
"parent_Id" "parent_Id"
); );
...@@ -165,21 +209,21 @@ export default { ...@@ -165,21 +209,21 @@ export default {
this.editModal = true; this.editModal = true;
this.rowData = row; this.rowData = row;
}, },
nodeChange(key,node){ nodeChange(key, node) {
if(key=="edit"){ if (key == "edit") {
this.edit(node); this.edit(node);
}else if(key=="delete"){ } else if (key == "delete") {
this.$Modal.confirm({ this.$Modal.confirm({
title:"确认", title: "确认",
content:"确认要删除吗？", content: "确认要删除吗？",
onOk:()=>{ onOk: () => {
this.remove(node.id) this.remove(node.id)
} }
}) })
} else if(key=="add"){ } else if (key == "add") {
if(node.id>0){ if (node.id > 0) {
this.addrow(node) this.addrow(node)
}else{ } else {
this.add() this.add()
} }
} }
...@@ -187,7 +231,9 @@ export default { ...@@ -187,7 +231,9 @@ export default {
remove(id) { remove(id) {
this.editModal = false; this.editModal = false;
this.deletelModal = true; this.deletelModal = true;
Api.delete({ id: id }).then(res => { Api.delete({
id: id
}).then(res => {
if (res.result == 1) { if (res.result == 1) {
this.init(); //刷新列表： this.init(); //刷新列表：
this.$Message.info("删除成功!"); this.$Message.info("删除成功!");
...@@ -212,18 +258,114 @@ export default { ...@@ -212,18 +258,114 @@ export default {
l(key) { l(key) {
let vkey = "DipartLocation" + "." + key; let vkey = "DipartLocation" + "." + key;
return this.$t(vkey) || key; return this.$t(vkey) || key;
},
//获取省市县信息
formatCity() {
let list = this.$u.clone(this.treeList);
let cityData = this.$u.clone(this.citys);
let temp = this.$u.treeToList1(cityData);
this.cityDatas = [];
temp.forEach(ele => {
let objTem = {
label: ele.__label.replace(/\s*/g, ""),
value: ele.__value
}
this.cityDatas.push(objTem)
})
},
//根据value获取当前cityname
getCity(val) {
let cities = this.$u.clone(this.cityDatas)
let label = "";
cities.forEach(ele => {
if (val == ele.value) {
label = ele.label
}
})
return label
},
//根据Id获取上级到本级的部门名称
getParentDepart(val) {
let departList = this.$u.clone(this.treeList)
return this.$u.getDepartAllName(departList, val)
},
//导出excel
export2Excel() {
//当前显示数据
let list = this.$u.clone(this.treeList)
const tHeader = []; // 设置Excel的表格第一行的标题
const filterVal = []; //list里对象的属性
var tempCol = [];
var tempCol1 = []; //省市县
var tempCol2 = []; //上级部门名称
var columnsCur = this.$u.clone(this.columns); //导出列标题信息griddata this.$refs.grid.columnsCur
columnsCur.forEach((el) => {
if ((el.hide && !el.import) || (!el.hide && el.key != "action") || (el.hide && el.import)) {
if (el.code) {
//tHeader.push(el.key + "DirName");
//filterVal.push(el.key + "DirName");
//tempCol.push({ key: el.key + "DirName", code: el.code }); //临时存放code数据字典的字段及对应的数据字典code
tempCol.push({
key: el.key,
code: el.code
}); //临时存放code数据字典的字段及对应的数据字典code
}
if (el.location) {
tempCol1.push({
key: el.key,
code: el.key
}); //临时存放省事县
}
if (el.parentDepart) {
tempCol2.push({
key: el.key,
code: el.key
}); //临时存放上级部门所有name
} }
tHeader.push(this.l(el.key));
filterVal.push(el.key);
}
});
list.forEach((e) => {
//给导出数据增加数据字典对应的name
tempCol.forEach((ele) => {
e[ele.key] = this.$u.dirName(
this.$store.getters.dictionaryByKey(ele.code),
e[ele.key]
);
});
tempCol1.forEach((ele1) => {
e[ele1.key] = this.getCity(e[ele1.key]);
});
tempCol2.forEach((ele2) => {
e[ele2.key] = this.getParentDepart(e[ele2.key]);
});
});
let nowDate = this.$u.getNowTime(); //年月日时分秒yyyyMMddhhmmss
//获取导出数据结束
this.$u.outExcel(
"部门管理(" + nowDate + ")",
tHeader,
filterVal,
list
);
},
//导入excel
} }
}; };
</script> </script>
<style lang="less"> <style lang="less">
#department{ #department {
height: calc(100vh - 150px); height: calc(100vh - 150px);
overflow: auto; overflow: auto;
.tr{
.tr {
line-height: 50px; line-height: 50px;
} }
.main{
.main {
height: 100%; height: 100%;
} }
} }
......
pages/basicData/department/org.vue
View file @ 6df392a6
<template> <template>
<Card shadow style="height:100%;width:100%;overflow:hidden; position: relative;"> <Card shadow style="height:100%;width:100%;overflow:hidden; position: relative;">
<div class="department-outer"> <div class="department-outer">
<div class="zoom-box"> <div class="zoom-box">
<zoom-controller v-model="zoom" :min="20" :max="200"></zoom-controller> <zoom-controller v-model="zoom" :min="20" :max="200"></zoom-controller>
...@@ -8,8 +8,9 @@ ...@@ -8,8 +8,9 @@
<org-view :data="rootData" :zoom-handled="zoomHandled" @on-menu-click="handleMenuClick"></org-view> <org-view :data="rootData" :zoom-handled="zoomHandled" @on-menu-click="handleMenuClick"></org-view>
</div> </div>
</div> </div>
</Card> </Card>
</template> </template>
<script> <script>
import OrgView from "@/components/department/org-view.vue"; import OrgView from "@/components/department/org-view.vue";
import ZoomController from "@/components/department/zoom-controller.vue"; import ZoomController from "@/components/department/zoom-controller.vue";
...@@ -26,7 +27,7 @@ export default { ...@@ -26,7 +27,7 @@ export default {
ZoomController ZoomController
}, },
props: { props: {
data: { datas: {
type: Array, type: Array,
default: () => { default: () => {
return []; return [];
...@@ -63,11 +64,11 @@ export default { ...@@ -63,11 +64,11 @@ export default {
return this.zoom / 100; return this.zoom / 100;
}, },
rootData() { rootData() {
console.warn(this.data); console.warn(this.datas);
var root = { var root = {
id: 0, id: 0,
label: "根节点", label: "根节点",
children: this.data children: this.datas
}; };
return root; return root;
} }
...@@ -77,13 +78,16 @@ export default { ...@@ -77,13 +78,16 @@ export default {
data.isRoot = true; data.isRoot = true;
return data; return data;
}, },
handleMenuClick({ data, key }) { handleMenuClick({
this.$emit("nodeChange",key,data) data,
key
}) {
this.$emit("nodeChange", key, data)
}, },
}, },
mounted() { mounted() {
console.warn(this.data); console.warn(this.datas);
} }
}; };
</script> </script>
...@@ -94,25 +98,30 @@ export default { ...@@ -94,25 +98,30 @@ export default {
z-index: 66; z-index: 66;
right: 10px; right: 10px;
} }
.percent-100 { .percent-100 {
width: 100%; width: 100%;
height: 100%; height: 100%;
} }
.department-outer { .department-outer {
.percent-100; .percent-100;
overflow: hidden; overflow: hidden;
.tip-box { .tip-box {
position: absolute; position: absolute;
left: 20px; left: 20px;
top: 20px; top: 20px;
z-index: 12; z-index: 12;
} }
.zoom-box { .zoom-box {
position: absolute; position: absolute;
right: 30px; right: 30px;
bottom: 30px; bottom: 30px;
z-index: 2; z-index: 2;
} }
.view-box { .view-box {
position: absolute; position: absolute;
top: 0; top: 0;
...@@ -121,21 +130,26 @@ export default { ...@@ -121,21 +130,26 @@ export default {
right: 0; right: 0;
z-index: 1; z-index: 1;
cursor: move; cursor: move;
.org-tree-drag-wrapper { .org-tree-drag-wrapper {
width: 100%; width: 100%;
height: 100%; height: 100%;
} }
.org-tree-wrapper { .org-tree-wrapper {
display: inline-block; display: inline-block;
position: absolute; position: absolute;
left: 50%; left: 50%;
top: 50%; top: 50%;
transition: transform 0.2s ease-out; transition: transform 0.2s ease-out;
.org-tree-node-label { .org-tree-node-label {
box-shadow: 0px 2px 12px 0px rgba(5, 123, 241, 0.4); box-shadow: 0px 2px 12px 0px rgba(5, 123, 241, 0.4);
border-radius: 4px; border-radius: 4px;
.org-tree-node-label-inner { .org-tree-node-label-inner {
padding: 0; padding: 0;
.custom-org-node { .custom-org-node {
padding: 14px 41px; padding: 14px 41px;
background: #0672dd; background: #0672dd;
...@@ -149,13 +163,16 @@ export default { ...@@ -149,13 +163,16 @@ export default {
line-height: 20px; line-height: 20px;
transition: background 0.1s ease-in; transition: background 0.1s ease-in;
cursor: default; cursor: default;
&:hover { &:hover {
background: #4194e7; background: #4194e7;
transition: background 0.1s ease-in; transition: background 0.1s ease-in;
} }
&.has-children-label { &.has-children-label {
cursor: pointer; cursor: pointer;
} }
.context-menu { .context-menu {
position: absolute; position: absolute;
right: -10px; right: -10px;
...@@ -168,13 +185,14 @@ export default { ...@@ -168,13 +185,14 @@ export default {
} }
} }
} }
.info-p { .info-p {
height: 40px; height: 40px;
line-height: 40px; line-height: 40px;
margin-left: 20px; margin-left: 20px;
span { span {
font-size: 13px; font-size: 13px;
} }
} }
</style> </style>
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment