init
@@ -0,0 +1,11 @@
|
||||
module.exports = {
|
||||
presets: [
|
||||
[
|
||||
"@vue/app",
|
||||
{
|
||||
polyfills: ["es6.promise", "es6.symbol", "es6.array.iterator", "es6.object.assign"],
|
||||
useBuiltIns: "entry"
|
||||
}
|
||||
]
|
||||
]
|
||||
};
|
||||
@@ -0,0 +1,7 @@
|
||||
window.conf = {
|
||||
baseHost: "http://base.bestsch.com",
|
||||
ssoHost: "http://sso.bestsch.com",
|
||||
serviceUrl: "http://192.168.10.166:8087",
|
||||
fileHost:'http://base.bestsch.com/ClassroomMan/file',
|
||||
isLayoutOld: false,
|
||||
};
|
||||
@@ -0,0 +1,28 @@
|
||||
{
|
||||
"name": "bschstandard",
|
||||
"version": "0.1.0",
|
||||
"private": true,
|
||||
"scripts": {
|
||||
"dev": "vue-cli-service serve",
|
||||
"build": "vue-cli-service build"
|
||||
},
|
||||
"dependencies": {
|
||||
"@babel/polyfill": "^7.12.1",
|
||||
"core-js": "^3.6.5",
|
||||
"node-sass": "latest",
|
||||
"sortablejs": "^1.15.7",
|
||||
"view-design": "^4.3.2",
|
||||
"vue": "^2.6.11",
|
||||
"vue-router": "^3.2.0",
|
||||
"vuedraggable": "^2.24.3"
|
||||
},
|
||||
"devDependencies": {
|
||||
"@vue/cli-plugin-babel": "~4.5.0",
|
||||
"@vue/cli-plugin-router": "~4.5.0",
|
||||
"@vue/cli-service": "~4.5.0",
|
||||
"sass": "^1.56.1",
|
||||
"node-sass": "^6.0.1",
|
||||
"sass-loader": "^10.2.0",
|
||||
"vue-template-compiler": "^2.6.11"
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,133 @@
|
||||
{
|
||||
"msg": null,
|
||||
"data": {
|
||||
"ssoUrl": "http://ssodebug.bestsch.com",
|
||||
"username": "朱浩东",
|
||||
"pathList": [{
|
||||
"id": 1051,
|
||||
"appId": 337,
|
||||
"modId": 1,
|
||||
"name": "默认列表",
|
||||
"parentId": 0,
|
||||
"path": null,
|
||||
"level": 0,
|
||||
"page": "/",
|
||||
"icon": "",
|
||||
"orderNumber": 0,
|
||||
"usable": true,
|
||||
"children": [],
|
||||
"modules": []
|
||||
}, {
|
||||
"id": 1058,
|
||||
"appId": 337,
|
||||
"modId": 2,
|
||||
"name": "tab页",
|
||||
"parentId": 0,
|
||||
"path": null,
|
||||
"level": 0,
|
||||
"page": "/tabs",
|
||||
"icon": "",
|
||||
"orderNumber": 0,
|
||||
"usable": true,
|
||||
"children": [],
|
||||
"modules": []
|
||||
}, {
|
||||
"id": 1069,
|
||||
"appId": 339,
|
||||
"modId": 3,
|
||||
"name": "表单组件",
|
||||
"parentId": 0,
|
||||
"path": null,
|
||||
"level": 0,
|
||||
"page": "/add",
|
||||
"icon": "",
|
||||
"orderNumber": 0,
|
||||
"usable": true,
|
||||
"children": [],
|
||||
"modules": []
|
||||
}, {
|
||||
"id": 1057,
|
||||
"appId": 337,
|
||||
"modId": 4,
|
||||
"name": "默认空页面",
|
||||
"parentId": 0,
|
||||
"path": null,
|
||||
"level": 0,
|
||||
"page": "/defaults",
|
||||
"icon": "",
|
||||
"orderNumber": 0,
|
||||
"usable": true,
|
||||
"children": [{
|
||||
"id": 1062,
|
||||
"appId": 337,
|
||||
"modId": 41,
|
||||
"name": "详情页",
|
||||
"parentId": 1057,
|
||||
"path": null,
|
||||
"level": 0,
|
||||
"page": "/details",
|
||||
"icon": "",
|
||||
"orderNumber": 0,
|
||||
"usable": true,
|
||||
"children": [],
|
||||
"modules": []
|
||||
}],
|
||||
"modules": []
|
||||
}, {
|
||||
"id": 10620,
|
||||
"appId": 321,
|
||||
"modId": 5,
|
||||
"name": "树结构",
|
||||
"parentId": 0,
|
||||
"path": null,
|
||||
"level": 0,
|
||||
"page": "/tree",
|
||||
"icon": "",
|
||||
"orderNumber": 0,
|
||||
"usable": true,
|
||||
"children": [],
|
||||
"modules": []
|
||||
}, {
|
||||
"modId": 6,
|
||||
"name": "通用字段管理",
|
||||
"parentId": 0,
|
||||
"page": "/field",
|
||||
"children": []
|
||||
}, {
|
||||
"modId": 7,
|
||||
"name": "选择人员",
|
||||
"parentId": 0,
|
||||
"page": "/userCheck",
|
||||
"children": []
|
||||
}, {
|
||||
"modId": 9,
|
||||
"name": "组件代码下载",
|
||||
"parentId": 0,
|
||||
"page": "/code",
|
||||
"children": []
|
||||
}, {
|
||||
"id": 1069,
|
||||
"appId": 339,
|
||||
"modId": 10,
|
||||
"name": "项目下载",
|
||||
"parentId": 0,
|
||||
"path": null,
|
||||
"level": 0,
|
||||
"page": "/down",
|
||||
"icon": "",
|
||||
"orderNumber": 0,
|
||||
"usable": true,
|
||||
"children": [],
|
||||
"modules": []
|
||||
}],
|
||||
"id": 161225,
|
||||
"avatar": "http://basedebug.bestsch.com/upload/userPicture/161225_9493246f",
|
||||
"topName": "应用名称",
|
||||
"pageUrl": "http://basedebug.bestsch.com/v/",
|
||||
"logoUrl": "http://basedebug.bestsch.com/img/logo.png",
|
||||
"isSuperAdmin": false,
|
||||
"initUrl": "",
|
||||
"isLeader": false
|
||||
},
|
||||
"code": 0
|
||||
}
|
||||
@@ -0,0 +1,145 @@
|
||||
{
|
||||
"code": 0,
|
||||
"msg": "",
|
||||
"data":[{
|
||||
"SerID": 5414,
|
||||
"leave_typeName": "婚假",
|
||||
"teaname": "朱浩东西",
|
||||
"leave_date": "2021-04-29",
|
||||
"leave_enddate": "2021-04-29",
|
||||
"remake": "我是备注我是备注我是备注我是备注我是备注我是备注我是备注我是备注我是备注我是备注我是备注我是备注我是备注我是备注我是备注我是备注我是备注我是备注我是备注我是备注我是备注我是备注我是备注我是备注我是备注我是备注"
|
||||
}, {
|
||||
"SerID": 5414,
|
||||
"leave_typeName": "婚假",
|
||||
"teaname": "朱浩东西",
|
||||
"leave_date": "2021-04-29",
|
||||
"leave_enddate": "2021-04-29",
|
||||
"remake": ""
|
||||
},{
|
||||
"SerID": 5414,
|
||||
"leave_typeName": "婚假",
|
||||
"teaname": "朱浩东西",
|
||||
"leave_date": "2021-04-29",
|
||||
"leave_enddate": "2021-04-29",
|
||||
"remake": ""
|
||||
},{
|
||||
"SerID": 5414,
|
||||
"leave_typeName": "婚假",
|
||||
"teaname": "朱浩东西",
|
||||
"leave_date": "2021-04-29",
|
||||
"leave_enddate": "2021-04-29",
|
||||
"remake": ""
|
||||
},{
|
||||
"SerID": 5414,
|
||||
"leave_typeName": "婚假",
|
||||
"teaname": "朱浩东西",
|
||||
"leave_date": "2021-04-29",
|
||||
"leave_enddate": "2021-04-29",
|
||||
"remake": ""
|
||||
},{
|
||||
"SerID": 5414,
|
||||
"leave_typeName": "婚假",
|
||||
"teaname": "朱浩东西",
|
||||
"leave_date": "2021-04-29",
|
||||
"leave_enddate": "2021-04-29",
|
||||
"remake": ""
|
||||
},{
|
||||
"SerID": 5414,
|
||||
"leave_typeName": "婚假",
|
||||
"teaname": "朱浩东西",
|
||||
"leave_date": "2021-04-29",
|
||||
"leave_enddate": "2021-04-29",
|
||||
"remake": ""
|
||||
},{
|
||||
"SerID": 5414,
|
||||
"leave_typeName": "婚假",
|
||||
"teaname": "朱浩东西",
|
||||
"leave_date": "2021-04-29",
|
||||
"leave_enddate": "2021-04-29",
|
||||
"remake": ""
|
||||
},{
|
||||
"SerID": 5414,
|
||||
"leave_typeName": "婚假",
|
||||
"teaname": "朱浩东西",
|
||||
"leave_date": "2021-04-29",
|
||||
"leave_enddate": "2021-04-29",
|
||||
"remake": ""
|
||||
},{
|
||||
"SerID": 5414,
|
||||
"leave_typeName": "婚假",
|
||||
"teaname": "朱浩东西",
|
||||
"leave_date": "2021-04-29",
|
||||
"leave_enddate": "2021-04-29",
|
||||
"remake": ""
|
||||
},{
|
||||
"SerID": 5414,
|
||||
"leave_typeName": "婚假",
|
||||
"teaname": "朱浩东西",
|
||||
"leave_date": "2021-04-29",
|
||||
"leave_enddate": "2021-04-29",
|
||||
"remake": ""
|
||||
},{
|
||||
"SerID": 5414,
|
||||
"leave_typeName": "婚假",
|
||||
"teaname": "朱浩东西",
|
||||
"leave_date": "2021-04-29",
|
||||
"leave_enddate": "2021-04-29",
|
||||
"remake": ""
|
||||
},{
|
||||
"SerID": 5414,
|
||||
"leave_typeName": "婚假",
|
||||
"teaname": "朱浩东西",
|
||||
"leave_date": "2021-04-29",
|
||||
"leave_enddate": "2021-04-29",
|
||||
"remake": ""
|
||||
},{
|
||||
"SerID": 5414,
|
||||
"leave_typeName": "婚假",
|
||||
"teaname": "朱浩东西",
|
||||
"leave_date": "2021-04-29",
|
||||
"leave_enddate": "2021-04-29",
|
||||
"remake": ""
|
||||
},{
|
||||
"SerID": 5414,
|
||||
"leave_typeName": "婚假",
|
||||
"teaname": "朱浩东西",
|
||||
"leave_date": "2021-04-29",
|
||||
"leave_enddate": "2021-04-29",
|
||||
"remake": ""
|
||||
},{
|
||||
"SerID": 5414,
|
||||
"leave_typeName": "婚假",
|
||||
"teaname": "朱浩东西",
|
||||
"leave_date": "2021-04-29",
|
||||
"leave_enddate": "2021-04-29",
|
||||
"remake": ""
|
||||
},{
|
||||
"SerID": 5414,
|
||||
"leave_typeName": "婚假",
|
||||
"teaname": "朱浩东西",
|
||||
"leave_date": "2021-04-29",
|
||||
"leave_enddate": "2021-04-29",
|
||||
"remake": ""
|
||||
},{
|
||||
"SerID": 5414,
|
||||
"leave_typeName": "婚假",
|
||||
"teaname": "朱浩东西",
|
||||
"leave_date": "2021-04-29",
|
||||
"leave_enddate": "2021-04-29",
|
||||
"remake": ""
|
||||
},{
|
||||
"SerID": 5414,
|
||||
"leave_typeName": "婚假",
|
||||
"teaname": "朱浩东西",
|
||||
"leave_date": "2021-04-29",
|
||||
"leave_enddate": "2021-04-29",
|
||||
"remake": ""
|
||||
},{
|
||||
"SerID": 5414,
|
||||
"leave_typeName": "婚假",
|
||||
"teaname": "朱浩东西",
|
||||
"leave_date": "2021-04-29",
|
||||
"leave_enddate": "2021-04-29",
|
||||
"remake": ""
|
||||
}]
|
||||
}
|
||||
@@ -0,0 +1,124 @@
|
||||
{
|
||||
"code": 0,
|
||||
"msg": "",
|
||||
"data": [{
|
||||
"id": 1051,
|
||||
"appId": 337,
|
||||
"modId": 1,
|
||||
"name": "默认列表",
|
||||
"parentId": 0,
|
||||
"path": null,
|
||||
"level": 0,
|
||||
"page": "/",
|
||||
"icon": "",
|
||||
"orderNumber": 0,
|
||||
"usable": true,
|
||||
"children": [],
|
||||
"modules": []
|
||||
},{
|
||||
"id": 1058,
|
||||
"appId": 337,
|
||||
"modId": 2,
|
||||
"name": "tab页",
|
||||
"parentId": 0,
|
||||
"path": null,
|
||||
"level": 0,
|
||||
"page": "/tabs",
|
||||
"icon": "",
|
||||
"orderNumber": 0,
|
||||
"usable": true,
|
||||
"children": [],
|
||||
"modules": []
|
||||
}, {
|
||||
"id": 1069,
|
||||
"appId": 339,
|
||||
"modId": 3,
|
||||
"name": "表单组件",
|
||||
"parentId": 0,
|
||||
"path": null,
|
||||
"level": 0,
|
||||
"page": "/add",
|
||||
"icon": "",
|
||||
"orderNumber": 0,
|
||||
"usable": true,
|
||||
"children": [],
|
||||
"modules": []
|
||||
}, {
|
||||
"id": 1057,
|
||||
"appId": 337,
|
||||
"modId": 4,
|
||||
"name": "默认空页面",
|
||||
"parentId": 0,
|
||||
"path": null,
|
||||
"level": 0,
|
||||
"page": "/defaults",
|
||||
"icon": "",
|
||||
"orderNumber": 0,
|
||||
"usable": true,
|
||||
"children": [{
|
||||
"id": 1062,
|
||||
"appId": 337,
|
||||
"modId": 41,
|
||||
"name": "详情页",
|
||||
"parentId": 1057,
|
||||
"path": null,
|
||||
"level": 0,
|
||||
"page": "/details",
|
||||
"icon": "",
|
||||
"orderNumber": 0,
|
||||
"usable": true,
|
||||
"children": [],
|
||||
"modules": []
|
||||
}],
|
||||
"modules": []
|
||||
}, {
|
||||
"id": 10620,
|
||||
"appId": 321,
|
||||
"modId": 5,
|
||||
"name": "树结构",
|
||||
"parentId": 0,
|
||||
"path": null,
|
||||
"level": 0,
|
||||
"page": "/tree",
|
||||
"icon": "",
|
||||
"orderNumber": 0,
|
||||
"usable": true,
|
||||
"children": [],
|
||||
"modules": []
|
||||
}
|
||||
,{
|
||||
"modId": 6,
|
||||
"name": "通用字段管理",
|
||||
"parentId": 0,
|
||||
"page": "/field",
|
||||
"children": []
|
||||
}
|
||||
,{
|
||||
"modId": 7,
|
||||
"name": "选择人员",
|
||||
"parentId": 0,
|
||||
"page": "/userCheck",
|
||||
"children": []
|
||||
}
|
||||
,{
|
||||
"modId": 9,
|
||||
"name": "组件代码下载",
|
||||
"parentId": 0,
|
||||
"page": "/code",
|
||||
"children": []
|
||||
},{
|
||||
"id": 1069,
|
||||
"appId": 339,
|
||||
"modId": 10,
|
||||
"name": "项目下载",
|
||||
"parentId": 0,
|
||||
"path": null,
|
||||
"level": 0,
|
||||
"page": "/down",
|
||||
"icon": "",
|
||||
"orderNumber": 0,
|
||||
"usable": true,
|
||||
"children": [],
|
||||
"modules": []
|
||||
}]
|
||||
}
|
||||
@@ -0,0 +1 @@
|
||||
{"code":0,"msg":"","data":{"id":100000,"account":"bestsch","name":"超管","idcard":"350301198906180060","phone":"18121455267","email":"service@bestsch.com","birthday":null,"gender":0,"profilePicture":"http://base.bestsch.com/upload/userPicture/100000_67741393.png","groupId":0,"type":1,"status":0,"orderNumber":0,"createUser":0,"createDate":null,"roleIds":[3],"dept":null,"school":null,"bureau":null,"schools":null,"groups":null,"roleList":null,"phone2":null,"schId":0,"groupName":null,"role":[3]}}
|
||||
@@ -0,0 +1,216 @@
|
||||
<template>
|
||||
<div id="app" v-if="isLogin">
|
||||
<layout-old v-if="isLayoutOld" :layoutData="layoutData"></layout-old>
|
||||
<layout v-else :layoutData="layoutData"></layout>
|
||||
<div :class="['base-wrap-main', layoutData.isAlone ? 'alone-page' : '']">
|
||||
<transition v-if="!isNoAuthority" :name="!isBack ? 'fade' : 'back'" :mode="!isBack ? 'out-in' : 'in-out'">
|
||||
<router-view v-if="isRouterAlive"></router-view>
|
||||
</transition>
|
||||
<div v-else class="no-authority-wrap">
|
||||
<h3>暂无权限</h3>
|
||||
<h6>如需查看,请联络管理员为您分配权限</h6>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import layout from "./frame/layout.vue";
|
||||
import layoutOld from "./frame/layout_old.vue";
|
||||
|
||||
const appendLink = (baseHost, name, version) => {
|
||||
var headHTML = `<link type="text/css" rel="stylesheet" href="${baseHost}/BschHome/front/css/${name}.css?v=${version}">`;
|
||||
$("head:eq(0)").append(headHTML);
|
||||
};
|
||||
|
||||
export default {
|
||||
components: { layout, layoutOld },
|
||||
name: "app",
|
||||
data() {
|
||||
return {
|
||||
isRouterAlive: true,
|
||||
isBack: false,
|
||||
isLogin: false,
|
||||
isNoAuthority: false,
|
||||
layoutData: {},
|
||||
isLayoutOld: conf.isLayoutOld,
|
||||
};
|
||||
},
|
||||
provide() {
|
||||
return {
|
||||
reload: this.reload,
|
||||
};
|
||||
},
|
||||
async created() {
|
||||
try {
|
||||
const baseHost = window.conf.baseHost,
|
||||
ssoHost = window.conf.ssoHost;
|
||||
var version = localStorage.getItem("themeVersion") || new Date().getTime();
|
||||
appendLink(baseHost, "base.layout", version);
|
||||
var info = await this.getUserInfo();
|
||||
var bschResult = await this.getBschHomeJsonp(baseHost, info.id);
|
||||
this.setCurrentRole(bschResult, baseHost);
|
||||
var mod = await this.getUserMod();
|
||||
this.layoutInit(info, mod, bschResult.appList, baseHost, ssoHost);
|
||||
this.isLogin = true;
|
||||
} catch (error) {
|
||||
console.error(error);
|
||||
this.$Message.error("载入用户信息失败!");
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
var isTrident = navigator.userAgent.indexOf("Trident") > -1; // 是否是IE内核
|
||||
if (isTrident) {
|
||||
$("html").css("overflow", "hidden");
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
reload() {
|
||||
this.isRouterAlive = false;
|
||||
this.$nextTick(() => (this.isRouterAlive = true));
|
||||
},
|
||||
getUserInfo() {
|
||||
const _this = this;
|
||||
return new Promise((resolve, reject) => {
|
||||
_this.$api.get(
|
||||
APIConfig.Base.GetUserInfo,
|
||||
null,
|
||||
resp => {
|
||||
resolve(resp.data);
|
||||
},
|
||||
error => reject(error)
|
||||
);
|
||||
});
|
||||
},
|
||||
getUserMod() {
|
||||
const _this = this;
|
||||
return new Promise((resolve, reject) => {
|
||||
_this.$api.get(
|
||||
APIConfig.Base.GetUserMod,
|
||||
null,
|
||||
resp => {
|
||||
resolve(resp.data);
|
||||
},
|
||||
error => reject(error)
|
||||
);
|
||||
});
|
||||
},
|
||||
getBschHomeJsonp(baseHost, userId) {
|
||||
var version = localStorage.getItem("themeVersion") || new Date().getTime();
|
||||
return new Promise((resolve, reject) => {
|
||||
var crossStorage,
|
||||
crossUrl = `${baseHost}/BschHome/front/libs/cross`;
|
||||
try {
|
||||
var HEAD = document.getElementsByTagName("head")[0];
|
||||
var node = document.createElement("script");
|
||||
node.src = `${crossUrl}/client.js?v=${version}`;
|
||||
node.onload = function () {
|
||||
crossStorage = new Client(`${crossUrl}/middle.html?v=${version}`, () => {
|
||||
crossStorage.getRoteData({ userId }, resp => {
|
||||
resolve(resp);
|
||||
});
|
||||
|
||||
//分页数据默认条数
|
||||
const customPageCount = localStorage.getItem("customPageCount");
|
||||
crossStorage.getItem("customPageCount", resp => {
|
||||
if (resp == null) return false;
|
||||
if (customPageCount == null) localStorage.setItem("customPageCount", resp);
|
||||
else if (resp != customPageCount) {
|
||||
crossStorage.setItem({
|
||||
key: "customPageCount",
|
||||
value: customPageCount,
|
||||
});
|
||||
}
|
||||
});
|
||||
});
|
||||
};
|
||||
HEAD.appendChild(node);
|
||||
} catch (error) {
|
||||
console.error(error);
|
||||
console.error("获取身份信息失败!");
|
||||
resolve(null);
|
||||
}
|
||||
});
|
||||
},
|
||||
layoutInit(info, mod, appList, baseHost, ssoHost) {
|
||||
this.layoutData.appName = "应用页规范示例";
|
||||
this.layoutData.baseHost = baseHost;
|
||||
this.layoutData.ssoHost = ssoHost;
|
||||
const routes = this.$router.options.routes;
|
||||
let arr = [];
|
||||
mod.forEach(element => {
|
||||
let iconIndex = routes.findIndex(x => typeof x.meta !== "undefined" && typeof x.meta.modId !== "undefined" && typeof x.meta.icon !== "undefined" && x.meta.modId == element.modId);
|
||||
let icon = iconIndex > -1 ? "iconfont " + routes[iconIndex].meta.icon : ""; //icon不传则为默认
|
||||
arr.push({
|
||||
id: element.id,
|
||||
name: element.name,
|
||||
modId: element.modId,
|
||||
page: element.page,
|
||||
children: element.children || [],
|
||||
icon,
|
||||
});
|
||||
});
|
||||
// arr[0].icon = "iconfont icon-apps"; //icon样式示例,参见static/style/font 目录
|
||||
this.layoutData.modList = arr.sort((a, b) => a.modId - b.modId);
|
||||
this.layoutData.isAlone = arr.length == 1; //当只有一个选项卡时,隐藏menu和nav
|
||||
let { id, name, profilePicture } = info;
|
||||
this.layoutData.userInfo = { id, name, avatar: profilePicture };
|
||||
this.layoutData.appList = appList || [];
|
||||
//无权限
|
||||
if (arr.length == 0) {
|
||||
this.layoutData.isAlone = true;
|
||||
this.isNoAuthority = true;
|
||||
}
|
||||
},
|
||||
setCurrentRole(result, baseHost) {
|
||||
if (result) {
|
||||
let { childId, roleId, schId } = result.checkRole;
|
||||
localStorage.setItem("currentRole", encodeURI(JSON.stringify({ childId, roleId, schId })));
|
||||
localStorage.setItem("themeVersion", result.themeVersion);
|
||||
appendLink(baseHost, result.themeName, result.themeVersion);
|
||||
} else {
|
||||
appendLink(baseHost, "default-theme", new Date().getTime());
|
||||
}
|
||||
},
|
||||
},
|
||||
};
|
||||
</script>
|
||||
|
||||
|
||||
<style lang="scss">
|
||||
#loging-box,
|
||||
.mop-load-div {
|
||||
display: none;
|
||||
}
|
||||
/* 开始过渡阶段,动画出去阶段 */
|
||||
.fade-enter-active,
|
||||
.fade-leave-active {
|
||||
transition: all 1ms cubic-bezier(0, 0.99, 1, 0.03);
|
||||
}
|
||||
/* 进入开始 */
|
||||
.fade-enter {
|
||||
// transform: translateY(10px);
|
||||
opacity: 0;
|
||||
}
|
||||
/* 出去终点 */
|
||||
.fade-leave-active {
|
||||
// transform: translateY(-10px);
|
||||
// opacity: 0;
|
||||
}
|
||||
|
||||
.back-enter-active,
|
||||
.back-leave-active {
|
||||
transition: all 1ms cubic-bezier(0, 0.99, 1, 0.03);
|
||||
}
|
||||
/* 进入开始 */
|
||||
.back-enter {
|
||||
display: none;
|
||||
}
|
||||
/* 出去终点 */
|
||||
.back-leave-active {
|
||||
display: none;
|
||||
}
|
||||
#app {
|
||||
height: 100%;
|
||||
}
|
||||
</style>
|
||||
@@ -0,0 +1,23 @@
|
||||
import Vue from "vue";
|
||||
import confirm from "./confirm.vue";
|
||||
export default props => {
|
||||
// 创建实例
|
||||
const vm = new Vue({
|
||||
render(h) {
|
||||
// h为createElement,返回VNode虚拟Node
|
||||
return h(confirm, { props });
|
||||
}
|
||||
}).$mount();
|
||||
|
||||
// 手动挂载实例到body
|
||||
document.body.appendChild(vm.$el);
|
||||
|
||||
const comp = vm.$children[0];
|
||||
// 销毁方法
|
||||
// comp.remove = function() {
|
||||
// document.body.removeChild(vm.$el);
|
||||
// vm.$destroy();
|
||||
// };
|
||||
// 返回组件
|
||||
return comp;
|
||||
};
|
||||
@@ -0,0 +1,64 @@
|
||||
<template>
|
||||
<Modal v-model="modal" @on-visible-change="showChange" :title="title || '提示'">
|
||||
<Alert type="warning" class="mb-1" show-icon>
|
||||
<Icon type="ios-bulb-outline" :class="{ 'mt-5': !info }" slot="icon" :size="28"></Icon>
|
||||
<div v-if="msg" :class="['message-box', info ? '' : 'mt-10 mb-10 ml-10']">{{ msg }}</div>
|
||||
<span v-if="info" slot="desc">{{ info }}</span>
|
||||
</Alert>
|
||||
<div slot="footer">
|
||||
<Button type="primary" @click="ok">确定</Button>
|
||||
<Button @click="cancle">取消</Button>
|
||||
</div>
|
||||
</Modal>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
props: {
|
||||
title: String,
|
||||
msg: String,
|
||||
info: String,
|
||||
onOk: Function,
|
||||
onCancel: Function,
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
modal: false,
|
||||
};
|
||||
},
|
||||
mounted() {
|
||||
this.$nextTick(() => {
|
||||
this.modal = true;
|
||||
});
|
||||
},
|
||||
methods: {
|
||||
ok() {
|
||||
this.modal = false;
|
||||
typeof this.onOk === "function" && this.onOk();
|
||||
},
|
||||
cancle() {
|
||||
this.modal = false;
|
||||
typeof this.onCancel === "function" && this.onCancel();
|
||||
},
|
||||
showChange(state) {
|
||||
if (!state) this.destroy();
|
||||
},
|
||||
destroy() {
|
||||
setTimeout(() => {
|
||||
document.body.removeChild(this.$el);
|
||||
}, 300);
|
||||
},
|
||||
},
|
||||
};
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.my-confirwm {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
.message-box {
|
||||
font-size: 16px;
|
||||
color: #17233d;
|
||||
display: block;
|
||||
}
|
||||
</style>
|
||||
@@ -0,0 +1,332 @@
|
||||
<template>
|
||||
<div class="page-wrapper">
|
||||
<div class="main-container">
|
||||
<div class="fix mb-12" v-if="true">
|
||||
<Button class="fl" type="primary" size="large">新增数据</Button>
|
||||
<Dropdown class="fr">
|
||||
<Button type="success" size="large">
|
||||
导入/导出
|
||||
<Icon type="ios-arrow-down"></Icon>
|
||||
</Button>
|
||||
<DropdownMenu slot="list">
|
||||
<DropdownItem>批量导入文件</DropdownItem>
|
||||
<DropdownItem>批量导出文件</DropdownItem>
|
||||
</DropdownMenu>
|
||||
</Dropdown>
|
||||
<Button class="fr mr-12" type="success" size="large">上传文件</Button>
|
||||
<Button class="fr mr-12" size="large">普通操作</Button>
|
||||
</div>
|
||||
<div class="search-wrap fix" v-if="true">
|
||||
<div class="search-wrap_date fl">
|
||||
<DatePicker
|
||||
type="date"
|
||||
placeholder="开始时间"
|
||||
v-model="dataParmas.startDt"
|
||||
@on-change="search"
|
||||
></DatePicker>
|
||||
<span class="ml-8 mr-8">至</span>
|
||||
<DatePicker
|
||||
type="date"
|
||||
placeholder="结束时间"
|
||||
v-model="dataParmas.endDt"
|
||||
@on-change="search"
|
||||
></DatePicker>
|
||||
</div>
|
||||
<Select
|
||||
v-model="dataParmas.classId"
|
||||
@on-change="search"
|
||||
class="search-wrap_sel ml-12"
|
||||
clearable
|
||||
placeholder="请选择年级"
|
||||
>
|
||||
<Option :value="1">高一</Option>
|
||||
<Option :value="2">高二</Option>
|
||||
<Option :value="3">高三</Option>
|
||||
</Select>
|
||||
<Input
|
||||
placeholder="输入关键字搜索"
|
||||
class="fr"
|
||||
search
|
||||
@on-search="search"
|
||||
suffix="ios-search"
|
||||
style="width: 200px"
|
||||
v-model="dataParmas.name"
|
||||
/>
|
||||
<Tooltip class="fr mr-15" content="查看代码">
|
||||
<Button icon="md-code" @click="showCode({ name: '默认列表', url: 'default.vue' })"></Button>
|
||||
</Tooltip>
|
||||
<!-- <Button type="primary" class="fl ml-10" @click="search">搜索</Button> -->
|
||||
</div>
|
||||
<!-- {{ useTableHeight({ otherH: 4 }) }} -->
|
||||
<!-- <div :style="{ background: 'green', height: useTableHeight({ otherH: 0 }) + 'px' }"></div> -->
|
||||
<Table
|
||||
:columns="columns"
|
||||
:data="listData"
|
||||
@on-selection-change="selectChange"
|
||||
class="link-table table-bottom-box"
|
||||
:height="useTableHeight({ isSearch: true, isOperat: true })"
|
||||
no-data-text="暂无数据"
|
||||
></Table>
|
||||
<div class="page-panel">
|
||||
<div class="fl ml-15 align-middle">
|
||||
<Button type="error" ghost @click="removeData">删除</Button>
|
||||
</div>
|
||||
<Page
|
||||
class="page-box"
|
||||
:total="total"
|
||||
:current="dataParmas.page"
|
||||
:page-size="dataParmas.count"
|
||||
:page-size-opts="[10, 20, 30, 40]"
|
||||
@on-page-size-change="pageSizeUpdate"
|
||||
@on-change="pageUpdate"
|
||||
placement="top"
|
||||
show-total
|
||||
show-sizer
|
||||
></Page>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import myConfirm from "../components/myConfirm";
|
||||
import { self_viewport } from "../mixins/self_viewport";
|
||||
export default {
|
||||
mixins: [self_viewport],
|
||||
data() {
|
||||
return {
|
||||
dataUrl: APIConfig.Leave.GetLeaveList,
|
||||
columns: [
|
||||
{
|
||||
type: "selection",
|
||||
width: 60,
|
||||
align: "center",
|
||||
},
|
||||
{
|
||||
type: "index",
|
||||
title: "序号",
|
||||
width: 70,
|
||||
align: "center",
|
||||
},
|
||||
{
|
||||
title: "开始时间",
|
||||
width: 120,
|
||||
align: "center",
|
||||
key: "leave_date",
|
||||
},
|
||||
{
|
||||
title: "结束时间",
|
||||
width: 120,
|
||||
align: "center",
|
||||
key: "leave_enddate",
|
||||
},
|
||||
{
|
||||
title: "类型",
|
||||
width: 100,
|
||||
align: "center",
|
||||
key: "leave_typeName",
|
||||
},
|
||||
{
|
||||
title: "请假人",
|
||||
width: 100,
|
||||
align: "center",
|
||||
key: "teaname",
|
||||
},
|
||||
{
|
||||
title: "状态",
|
||||
align: "left",
|
||||
key: "status",
|
||||
width: 200,
|
||||
tooltip: true,
|
||||
},
|
||||
{
|
||||
title: "备注",
|
||||
align: "left",
|
||||
key: "remake",
|
||||
tooltip: true,
|
||||
},
|
||||
{
|
||||
title: "操作",
|
||||
width: 120,
|
||||
align: "center",
|
||||
fixed: "right",
|
||||
render: (h, params) => {
|
||||
// #2d8cf0
|
||||
// #656667
|
||||
return [
|
||||
h(
|
||||
"div",
|
||||
{
|
||||
attrs: {
|
||||
class: "operating-link",
|
||||
},
|
||||
on: {
|
||||
click: () => {
|
||||
this.$Message.success("hi");
|
||||
},
|
||||
},
|
||||
},
|
||||
"文字"
|
||||
),
|
||||
h(
|
||||
"div",
|
||||
{
|
||||
attrs: {
|
||||
class: "operating-link",
|
||||
},
|
||||
on: {
|
||||
click: () => {
|
||||
this.$Message.success("hi");
|
||||
},
|
||||
},
|
||||
},
|
||||
"按钮"
|
||||
),
|
||||
];
|
||||
},
|
||||
},
|
||||
{
|
||||
title: "操作",
|
||||
width: 180,
|
||||
align: "center",
|
||||
fixed: "right",
|
||||
render: (h, params) => {
|
||||
var operatingHandle = (info, iconClass, callback) => {
|
||||
return h(
|
||||
"Tooltip",
|
||||
{
|
||||
props: {
|
||||
content: info,
|
||||
placement: "bottom",
|
||||
transfer: true,
|
||||
},
|
||||
},
|
||||
[
|
||||
h(
|
||||
"div",
|
||||
{
|
||||
attrs: {
|
||||
class: `operating-btn iconfont ${iconClass}`,
|
||||
},
|
||||
on: {
|
||||
click: () => {
|
||||
callback();
|
||||
},
|
||||
},
|
||||
},
|
||||
""
|
||||
),
|
||||
]
|
||||
);
|
||||
};
|
||||
return [
|
||||
operatingHandle("查看", "icon-browse", () => {
|
||||
console.log("查看", params.row);
|
||||
this.$Message.success("hi");
|
||||
}),
|
||||
operatingHandle("编辑", "icon-edit", () => {
|
||||
console.log("编辑", params.row);
|
||||
this.$Message.success("hi");
|
||||
}),
|
||||
operatingHandle("撤销", "icon-back disabled", () => {
|
||||
console.log("撤销", params.row);
|
||||
this.$Message.success("hi");
|
||||
}),
|
||||
operatingHandle("删除", "icon-ashbin", () => {
|
||||
console.log("删除", params.row);
|
||||
myConfirm({
|
||||
title: "删除",
|
||||
msg: "确定删除吗?",
|
||||
info: "删除后不可恢复",
|
||||
onOk: () => {
|
||||
this.$Message.success("操作成功");
|
||||
},
|
||||
});
|
||||
}),
|
||||
];
|
||||
},
|
||||
},
|
||||
],
|
||||
dataParmas: {
|
||||
name: "",
|
||||
classId: null,
|
||||
startDt: null,
|
||||
endDt: null,
|
||||
page: 1,
|
||||
count: 10,
|
||||
},
|
||||
listData: [],
|
||||
selectList: [],
|
||||
tableHeight: 0,
|
||||
total: 30,
|
||||
};
|
||||
},
|
||||
created() {
|
||||
this.dataParmas.count = parseInt(localStorage.getItem("customPageCount") || 10);
|
||||
this.getData();
|
||||
},
|
||||
mounted() {
|
||||
const _this = this;
|
||||
},
|
||||
methods: {
|
||||
getData() {
|
||||
const _this = this;
|
||||
let item = {},
|
||||
{ dataUrl, dataParmas } = this;
|
||||
for (const key in dataParmas) {
|
||||
const element = dataParmas[key];
|
||||
item[key] = element;
|
||||
}
|
||||
|
||||
_this.$api.get(dataUrl, item, resp => {
|
||||
let rData = JSON.parse(JSON.stringify(resp.data));
|
||||
if (_this.dataFilter) _this.listData = this.dataFilter(rData);
|
||||
else _this.listData = resp.data;
|
||||
});
|
||||
},
|
||||
removeData() {
|
||||
if (this.selectList.length == 0) this.$Message.info("请选择");
|
||||
console.log(this.selectList.map(x => x.SerID));
|
||||
},
|
||||
search() {
|
||||
this.$Message.success("search");
|
||||
this.getData();
|
||||
},
|
||||
selectChange(selection) {
|
||||
this.selectList = selection;
|
||||
},
|
||||
pageUpdate(page) {
|
||||
this.dataParmas.page = page;
|
||||
this.getData();
|
||||
},
|
||||
pageSizeUpdate(size) {
|
||||
this.dataParmas.page = 1;
|
||||
this.dataParmas.count = size;
|
||||
localStorage.setItem("customPageCount", size);
|
||||
this.getData();
|
||||
},
|
||||
reloadData() {
|
||||
this.getData();
|
||||
},
|
||||
|
||||
dataFilter(data) {
|
||||
data.forEach((element, index) => {
|
||||
let type = index % 4;
|
||||
var arrText = ["审核中", "审核通过", "审核撤销", "审核拒绝"];
|
||||
var arrClass = ["shenhe", "tongguo", "chexiao", "jujue"];
|
||||
element.status = "朱浩东西 " + arrText[type];
|
||||
let className = `status-${arrClass[type]}`;
|
||||
|
||||
element.cellClassName = {
|
||||
status: className,
|
||||
};
|
||||
});
|
||||
console.log(data);
|
||||
return data;
|
||||
},
|
||||
},
|
||||
};
|
||||
</script>
|
||||
|
||||
<style>
|
||||
</style>
|
||||
@@ -0,0 +1,11 @@
|
||||
<template>
|
||||
<div class="main-wrapper">
|
||||
<div class="main-container"></div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {};
|
||||
</script>
|
||||
|
||||
<style></style>
|
||||
@@ -0,0 +1,91 @@
|
||||
<template>
|
||||
<div class="main-wrapper">
|
||||
<div class="main-container">
|
||||
<ul class="fix">
|
||||
<li v-for="item in typeData" class="fl">
|
||||
<type-set-box :type="{ name: item.name, id: item.id }" :active="item.active" @active="activeSave" @edit="editSave" @remove="removeSave" />
|
||||
</li>
|
||||
</ul>
|
||||
<br />
|
||||
<br />
|
||||
<Tooltip content="查看代码">
|
||||
<Button icon="md-code" @click="showCode({ name: '字段管理', url: 'field.vue' })"></Button>
|
||||
</Tooltip>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import myConfirm from "../components/myConfirm";
|
||||
import TypeSetBox from "../components/type_set_box.vue";
|
||||
|
||||
export default {
|
||||
components: { TypeSetBox },
|
||||
data() {
|
||||
return {
|
||||
typeData: [
|
||||
{
|
||||
id: 1,
|
||||
name: "矿泉水",
|
||||
active: true, //是否启用
|
||||
},
|
||||
{
|
||||
id: 2,
|
||||
name: "矿泉水",
|
||||
active: true,
|
||||
},
|
||||
{
|
||||
id: 3,
|
||||
name: "矿泉水",
|
||||
active: true,
|
||||
},
|
||||
{
|
||||
id: 4,
|
||||
name: "矿泉水矿泉水矿泉水矿泉水矿泉水",
|
||||
active: true,
|
||||
},
|
||||
{
|
||||
id: 5,
|
||||
name: "矿泉水",
|
||||
active: false,
|
||||
},
|
||||
],
|
||||
};
|
||||
},
|
||||
created() {},
|
||||
methods: {
|
||||
activeSave(id) {
|
||||
console.log(id);
|
||||
var typeFind = this.typeData.find(x => x.id == id);
|
||||
myConfirm({
|
||||
title: "修改状态",
|
||||
msg: "确定修改该物品状态吗?",
|
||||
info: (!typeFind.active ? "启用" : "停用") + "状态",
|
||||
onOk: () => {
|
||||
typeFind.active = !typeFind.active;
|
||||
this.$Message.success("操作成功!");
|
||||
},
|
||||
onCancel: () => {
|
||||
this.$Message.info("取消操作!");
|
||||
},
|
||||
});
|
||||
},
|
||||
editSave(id, name) {
|
||||
this.$Message.success("修改成功!");
|
||||
},
|
||||
removeSave(id) {
|
||||
myConfirm({
|
||||
msg: "确定删除该物品吗?",
|
||||
onOk: () => {
|
||||
let index = this.typeData.findIndex(x => x.id == id);
|
||||
this.typeData.splice(index, 1);
|
||||
this.$Message.success("删除成功!");
|
||||
},
|
||||
});
|
||||
},
|
||||
},
|
||||
};
|
||||
</script>
|
||||
|
||||
<style>
|
||||
</style>
|
||||
@@ -0,0 +1,87 @@
|
||||
<template>
|
||||
<div :id="domId" :ref="domId" class="ztree"></div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
require("@public/libs/ztree/zTreeStyle.css");
|
||||
import "@public/libs/ztree/jquery.ztree.all.min.js";
|
||||
export default {
|
||||
props: {
|
||||
treeData: {
|
||||
type: Object,
|
||||
},
|
||||
setting: {
|
||||
type: Object,
|
||||
},
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
domId: "",
|
||||
treeSetting: {
|
||||
view: {
|
||||
dblClickExpand: false,
|
||||
showIcon: false,
|
||||
},
|
||||
check: {
|
||||
enable: false,
|
||||
},
|
||||
callback: {},
|
||||
},
|
||||
};
|
||||
},
|
||||
created() {
|
||||
this.$watch("treeData", val => {
|
||||
if (val) {
|
||||
this.$nextTick(() => {
|
||||
this.initTree(this.treeData, this.domId);
|
||||
});
|
||||
}
|
||||
});
|
||||
},
|
||||
mounted() {
|
||||
this.domId = this.uuid();
|
||||
},
|
||||
methods: {
|
||||
uuid() {
|
||||
return "xxxxxxxx-xxxx-4xxx-yxxx-xxxxxxxxxxxx".replace(/[xy]/g, function (c) {
|
||||
var r = (Math.random() * 16) | 0,
|
||||
v = c == "x" ? r : (r & 0x3) | 0x8;
|
||||
return v.toString(16);
|
||||
});
|
||||
},
|
||||
initTree(_data, _domId) {
|
||||
const _this = this;
|
||||
_this.treeSetting.callback.onClick = (event, treeId, treeNode, clickFlag) => {
|
||||
// console.log(event, treeId, treeNode, clickFlag);
|
||||
_this.$emit("on-tree-click", treeNode);
|
||||
};
|
||||
var zNodes = _this.openFistNode(_data);
|
||||
$.fn.zTree.init($("#" + _domId), _this.treeSetting, zNodes);
|
||||
var treeObj = $.fn.zTree.getZTreeObj(_domId);
|
||||
var nodes = treeObj.getNodes();
|
||||
if (nodes && nodes.length > 0) {
|
||||
setTimeout(function () {
|
||||
$("#" + nodes[0].tId + "_a").click();
|
||||
}, 0);
|
||||
}
|
||||
},
|
||||
openFistNode(_zNodes) {
|
||||
//展开一级节点
|
||||
if (_zNodes && _zNodes.length > 0) {
|
||||
for (var key in _zNodes) {
|
||||
if (_zNodes.hasOwnProperty(key)) {
|
||||
var element = _zNodes[key];
|
||||
element.open = true;
|
||||
}
|
||||
}
|
||||
} else {
|
||||
_zNodes.open = true;
|
||||
}
|
||||
return _zNodes;
|
||||
},
|
||||
},
|
||||
};
|
||||
</script>
|
||||
|
||||
<style>
|
||||
</style>
|
||||
@@ -0,0 +1,34 @@
|
||||
export const self_viewport = {
|
||||
data() {
|
||||
return {
|
||||
height: null
|
||||
};
|
||||
},
|
||||
computed: {
|
||||
useTableHeight() {
|
||||
return (settings = {}) => {
|
||||
let { isSearch = true, isPage = true, otherH = 0 } = settings;
|
||||
let bodyH = this.height,
|
||||
headerH = 100,
|
||||
paddingH = 15,
|
||||
searchH = 62 + 10,
|
||||
pageH = 62,
|
||||
borderH = 4;
|
||||
let tableH = bodyH - headerH - paddingH - borderH;
|
||||
isSearch && (tableH -= searchH);
|
||||
isPage && (tableH -= pageH);
|
||||
otherH > 0 && (tableH -= otherH);
|
||||
console.log(tableH);
|
||||
return tableH;
|
||||
};
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
this.height = document.body.clientHeight;
|
||||
window.onresize = () => {
|
||||
return (() => {
|
||||
this.height = document.body.clientHeight;
|
||||
})();
|
||||
};
|
||||
}
|
||||
};
|
||||
@@ -0,0 +1,105 @@
|
||||
<template>
|
||||
<div>
|
||||
<Table :columns="columns" :data="listData" @on-selection-change="selectChange" class="link-table table-bottom-box" :height="tableHeight" no-data-text="暂无数据"></Table>
|
||||
<div class="page-panel">
|
||||
<div class="fl ml-15 align-middle">
|
||||
<slot :sel-ids="selectList"></slot>
|
||||
</div>
|
||||
<Page
|
||||
class="page-box fr mr-5 align-middle"
|
||||
:total="total"
|
||||
:current="dataParmas.page"
|
||||
:page-size="dataParmas.count"
|
||||
:page-size-opts="[10, 20, 30, 40]"
|
||||
@on-page-size-change="pageSizeUpdate"
|
||||
@on-change="pageUpdate"
|
||||
placement="top"
|
||||
show-total
|
||||
show-sizer
|
||||
></Page>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
props: {
|
||||
tableHeight: {
|
||||
default: 0,
|
||||
type: Number,
|
||||
},
|
||||
dataUrl: {
|
||||
default: "",
|
||||
type: String,
|
||||
},
|
||||
dataParmas: {
|
||||
default: {},
|
||||
type: Object,
|
||||
},
|
||||
dataFilter: {
|
||||
type: Function,
|
||||
default: null,
|
||||
},
|
||||
columns: {
|
||||
default: [],
|
||||
type: Array,
|
||||
},
|
||||
autoLoad: {
|
||||
default: true,
|
||||
Type: Boolean,
|
||||
},
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
listData: [],
|
||||
selectList: [],
|
||||
total: 30,
|
||||
};
|
||||
},
|
||||
|
||||
created() {
|
||||
this.dataParmas.page = 1;
|
||||
this.dataParmas.count = parseInt(localStorage.getItem("customPageCount") || 10);
|
||||
if (this.autoLoad) this.getData();
|
||||
},
|
||||
|
||||
methods: {
|
||||
getData() {
|
||||
const _this = this;
|
||||
let item = {},
|
||||
{ dataUrl, dataParmas } = this;
|
||||
// console.log("dataParmas", dataParmas);
|
||||
for (const key in dataParmas) {
|
||||
const element = dataParmas[key];
|
||||
item[key] = element;
|
||||
}
|
||||
_this.$api.get(dataUrl, item, resp => {
|
||||
let rData = resp.data;
|
||||
if (typeof _this.dataFilter === "function") {
|
||||
let fData = _this.dataFilter(rData);
|
||||
_this.listData = JSON.parse(JSON.stringify(fData));
|
||||
} else _this.listData = rData;
|
||||
});
|
||||
},
|
||||
selectChange(selection) {
|
||||
this.selectList = selection;
|
||||
},
|
||||
pageUpdate(page) {
|
||||
this.dataParmas.page = page;
|
||||
this.getData();
|
||||
},
|
||||
pageSizeUpdate(size) {
|
||||
this.dataParmas.page = 1;
|
||||
this.dataParmas.count = size;
|
||||
localStorage.setItem("customPageCount", size);
|
||||
this.getData();
|
||||
},
|
||||
reloadData() {
|
||||
this.getData();
|
||||
},
|
||||
},
|
||||
};
|
||||
</script>
|
||||
|
||||
<style>
|
||||
</style>
|
||||
@@ -0,0 +1,249 @@
|
||||
<template>
|
||||
<div class="main-wrapper">
|
||||
<Tabs class="tabs-panel" type="card" v-model="tabIndex">
|
||||
<TabPane label="普通分页" name="1"></TabPane>
|
||||
<TabPane label="多层tab" name="2"></TabPane>
|
||||
<TabPane label="带有提示" name="3"></TabPane>
|
||||
</Tabs>
|
||||
<!-- <div class="tabs-panel" style="background: green; height: 30px"></div> -->
|
||||
<div v-show="tabIndex == 1" class="main-container">
|
||||
<div class="fix mb-12" v-if="true">
|
||||
<Button class="fl" type="primary" size="large">新增数据</Button>
|
||||
<Dropdown class="fr">
|
||||
<Button type="success" size="large">
|
||||
导入\导出
|
||||
<Icon type="ios-arrow-down"></Icon>
|
||||
</Button>
|
||||
<DropdownMenu slot="list">
|
||||
<DropdownItem>批量导入文件</DropdownItem>
|
||||
<DropdownItem>批量导出文件</DropdownItem>
|
||||
</DropdownMenu>
|
||||
</Dropdown>
|
||||
<Button class="fr mr-12" type="success" size="large">上传文件</Button>
|
||||
<Button class="fr mr-12" size="large">普通操作</Button>
|
||||
</div>
|
||||
<div class="search-wrap fix">
|
||||
<div class="search-wrap_date fl">
|
||||
<DatePicker
|
||||
type="date"
|
||||
placeholder="开始时间"
|
||||
v-model="dataParmas.startDt"
|
||||
@on-change="search"
|
||||
></DatePicker>
|
||||
<span class="ml-8 mr-8">至</span>
|
||||
<DatePicker
|
||||
type="date"
|
||||
placeholder="结束时间"
|
||||
v-model="dataParmas.endDt"
|
||||
@on-change="search"
|
||||
></DatePicker>
|
||||
</div>
|
||||
<Input
|
||||
placeholder="输入关键字搜索"
|
||||
class="fr"
|
||||
search
|
||||
@on-search="search"
|
||||
suffix="ios-search"
|
||||
style="width: 200px"
|
||||
v-model="dataParmas.name"
|
||||
/>
|
||||
<Tooltip class="fr mr-15" content="查看代码">
|
||||
<Button icon="md-code" @click="showCode({ name: 'tabs页', url: 'tabs.vue' })"></Button>
|
||||
</Tooltip>
|
||||
</div>
|
||||
<table-page
|
||||
v-show="useTableHeight({ isTabs: true }) > 0"
|
||||
:tableHeight="useTableHeight({ isTabs: true })"
|
||||
:dataFilter="dataFilter"
|
||||
:dataUrl="tableUrl"
|
||||
:columns="columns"
|
||||
:dataParmas="dataParmas"
|
||||
ref="tablePage"
|
||||
>
|
||||
<template v-slot="slotProps">
|
||||
<Button type="error" ghost @click="removeData(slotProps.selIds)">删除</Button>
|
||||
</template>
|
||||
</table-page>
|
||||
</div>
|
||||
<div v-show="tabIndex == 2" class="main-container">
|
||||
<Tabs>
|
||||
<TabPane label="二级tab1" name="1"></TabPane>
|
||||
<TabPane label="二级tab2" name="2"></TabPane>
|
||||
</Tabs>
|
||||
<div v-for="n in 100">{{ n }}</div>
|
||||
</div>
|
||||
<div v-show="tabIndex == 3" class="main-container">
|
||||
<Alert show-icon>
|
||||
请注意
|
||||
<template slot="desc">
|
||||
此处设置资源管理的节点 请假统计的时间按此处设置的时间计算为1天
|
||||
<br />
|
||||
如:此处设置的工作时间为8小时,一天按8小时计算。此处设置的工作时间为9小时,则一天按9小时计算。以此类推
|
||||
</template>
|
||||
</Alert>
|
||||
<div class="search-wrap fix" v-if="true">
|
||||
<div class="search-wrap_date fl">
|
||||
<DatePicker
|
||||
type="date"
|
||||
placeholder="开始时间"
|
||||
v-model="dataParmas.startDt"
|
||||
@on-change="search"
|
||||
></DatePicker>
|
||||
<span class="ml-8 mr-8">至</span>
|
||||
<DatePicker
|
||||
type="date"
|
||||
placeholder="结束时间"
|
||||
v-model="dataParmas.endDt"
|
||||
@on-change="search"
|
||||
></DatePicker>
|
||||
</div>
|
||||
<Select
|
||||
v-model="dataParmas.classId"
|
||||
@on-change="search"
|
||||
class="search-wrap_sel ml-12"
|
||||
clearable
|
||||
placeholder="请选择年级"
|
||||
>
|
||||
<Option :value="1">高一</Option>
|
||||
<Option :value="2">高二</Option>
|
||||
<Option :value="3">高三</Option>
|
||||
</Select>
|
||||
<Input
|
||||
placeholder="输入关键字搜索"
|
||||
class="fr"
|
||||
search
|
||||
@on-search="search"
|
||||
suffix="ios-search"
|
||||
style="width: 200px"
|
||||
v-model="dataParmas.name"
|
||||
/>
|
||||
<!-- <Button type="primary" class="fl ml-10" @click="search">搜索</Button> -->
|
||||
</div>
|
||||
<!-- <div class="search-wrap mb-10 fix">
|
||||
<Input style="width: 250px" class="fl" search enter-button placeholder="输入关键字搜索" />
|
||||
</div> -->
|
||||
<table-page
|
||||
v-show="useTableHeight({ otherH: 114, isOperat: false, isTabs: true }) > 0"
|
||||
:tableHeight="useTableHeight({ otherH: 114, isOperat: false, isTabs: true })"
|
||||
:dataUrl="tableUrl"
|
||||
:columns="columns"
|
||||
:dataParmas="dataParmas"
|
||||
:dataFilter="dataFilter"
|
||||
ref="tablePage2"
|
||||
>
|
||||
<template v-slot="slotProps">
|
||||
<Button type="error" ghost @click="removeData(slotProps.selIds)">删除</Button>
|
||||
</template>
|
||||
</table-page>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import tablePage from "../components/table_page";
|
||||
import { self_viewport } from "../mixins/self_viewport";
|
||||
import myConfirm from "../components/myConfirm";
|
||||
export default {
|
||||
components: { tablePage },
|
||||
data() {
|
||||
return {
|
||||
tableUrl: APIConfig.Leave.GetLeaveList,
|
||||
columns: [
|
||||
{
|
||||
type: "selection",
|
||||
width: 60,
|
||||
align: "center",
|
||||
},
|
||||
{
|
||||
type: "index",
|
||||
title: "序号",
|
||||
width: 70,
|
||||
align: "center",
|
||||
},
|
||||
{
|
||||
title: "开始时间",
|
||||
width: 120,
|
||||
align: "center",
|
||||
key: "leave_date",
|
||||
},
|
||||
{
|
||||
title: "结束时间",
|
||||
width: 120,
|
||||
align: "center",
|
||||
key: "leave_enddate",
|
||||
},
|
||||
{
|
||||
title: "类型",
|
||||
width: 100,
|
||||
align: "center",
|
||||
key: "leave_typeName",
|
||||
},
|
||||
{
|
||||
title: "请假人",
|
||||
width: 100,
|
||||
align: "center",
|
||||
key: "teaname",
|
||||
},
|
||||
{
|
||||
title: "状态",
|
||||
align: "left",
|
||||
key: "status",
|
||||
width: 200,
|
||||
tooltip: true,
|
||||
},
|
||||
{
|
||||
title: "备注",
|
||||
align: "left",
|
||||
key: "remake",
|
||||
tooltip: true,
|
||||
},
|
||||
],
|
||||
dataParmas: {
|
||||
name: "",
|
||||
startDt: null,
|
||||
endDt: null,
|
||||
},
|
||||
tabIndex: "1",
|
||||
};
|
||||
},
|
||||
mixins: [self_viewport],
|
||||
created() {},
|
||||
|
||||
methods: {
|
||||
removeData(row) {
|
||||
if (row.length == 0) {
|
||||
this.$Message.info("请选择数据");
|
||||
return;
|
||||
}
|
||||
myConfirm({
|
||||
title: "删除",
|
||||
msg: "确定删除选中的数据吗?",
|
||||
info: "删除后不可恢复",
|
||||
onOk: () => {
|
||||
this.$Message.success("操作成功");
|
||||
this.$refs.tablePage.reloadData();
|
||||
},
|
||||
});
|
||||
},
|
||||
search() {
|
||||
this.$refs.tablePage.reloadData();
|
||||
},
|
||||
dataFilter(data) {
|
||||
data.forEach((element, index) => {
|
||||
let type = index % 4;
|
||||
var arrText = ["审核中", "审核通过", "审核撤销", "审核拒绝"];
|
||||
var arrClass = ["shenhe", "tongguo", "chexiao", "jujue"];
|
||||
element.status = "朱浩东西 " + arrText[type];
|
||||
let className = `status-${arrClass[type]}`;
|
||||
element.cellClassName = {
|
||||
status: className,
|
||||
};
|
||||
});
|
||||
return data;
|
||||
},
|
||||
},
|
||||
};
|
||||
</script>
|
||||
|
||||
<style>
|
||||
</style>
|
||||
@@ -0,0 +1,174 @@
|
||||
<template>
|
||||
<div class="page-wrapper tree-wrapper">
|
||||
<div class="tree-container">
|
||||
<my-tree :treeData="treeData" @on-tree-click="treeLink"></my-tree>
|
||||
</div>
|
||||
<div class="main-container">
|
||||
<div class="search-wrap fix">
|
||||
<Select class="search-wrap_sel">
|
||||
<Option value="0">请选择</Option>
|
||||
<Option :value="n" v-for="n in 5">选项{{ n }}</Option>
|
||||
</Select>
|
||||
<Input
|
||||
placeholder="输入关键字搜索"
|
||||
class="fr"
|
||||
search
|
||||
@on-search="search"
|
||||
suffix="ios-search"
|
||||
style="width: 200px"
|
||||
v-model="dataParmas.name"
|
||||
/>
|
||||
|
||||
<!-- <Button class="fr" type="success">导出</Button>
|
||||
<Button class="fr mr-10" type="success">导入</Button> -->
|
||||
<Tooltip class="fr mr-15" content="查看代码">
|
||||
<Button icon="md-code" @click="showCode({ name: '树结构', url: 'tree.vue' })"></Button>
|
||||
</Tooltip>
|
||||
</div>
|
||||
<table-page
|
||||
v-show="useTableHeight() > 0"
|
||||
:tableHeight="useTableHeight({ isOperat: false })"
|
||||
:dataUrl="tableUrl"
|
||||
:columns="columns"
|
||||
:dataParmas="dataParmas"
|
||||
:dataFilter="dataFilter"
|
||||
:autoLoad="false"
|
||||
ref="tablePage"
|
||||
>
|
||||
<template v-slot="slotProps">
|
||||
<Button type="error" ghost @click="removeData(slotProps.selIds)">删除</Button>
|
||||
</template>
|
||||
</table-page>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import myTree from "../components/my_tree";
|
||||
import tablePage from "../components/table_page";
|
||||
import { self_viewport } from "../mixins/self_viewport";
|
||||
import myConfirm from "../components/myConfirm";
|
||||
export default {
|
||||
components: { tablePage, myTree },
|
||||
data() {
|
||||
return {
|
||||
treeData: {},
|
||||
tableUrl: APIConfig.Leave.GetLeaveList,
|
||||
columns: [
|
||||
{
|
||||
type: "selection",
|
||||
width: 60,
|
||||
align: "center",
|
||||
},
|
||||
{
|
||||
type: "index",
|
||||
title: "序号",
|
||||
width: 70,
|
||||
align: "center",
|
||||
},
|
||||
{
|
||||
title: "开始时间",
|
||||
width: 120,
|
||||
align: "center",
|
||||
key: "leave_date",
|
||||
},
|
||||
{
|
||||
title: "结束时间",
|
||||
width: 120,
|
||||
align: "center",
|
||||
key: "leave_enddate",
|
||||
},
|
||||
{
|
||||
title: "类型",
|
||||
width: 100,
|
||||
align: "center",
|
||||
key: "leave_typeName",
|
||||
},
|
||||
{
|
||||
title: "请假人",
|
||||
width: 100,
|
||||
align: "center",
|
||||
key: "teaname",
|
||||
},
|
||||
{
|
||||
title: "状态",
|
||||
align: "left",
|
||||
key: "status",
|
||||
width: 200,
|
||||
tooltip: true,
|
||||
},
|
||||
{
|
||||
title: "备注",
|
||||
align: "center",
|
||||
key: "remake",
|
||||
tooltip: true,
|
||||
},
|
||||
],
|
||||
dataParmas: {
|
||||
groupId: 0,
|
||||
name: "",
|
||||
},
|
||||
};
|
||||
},
|
||||
mixins: [self_viewport],
|
||||
mounted() {
|
||||
const _this = this;
|
||||
this.treeData = {
|
||||
id: 1556,
|
||||
name: "弘育信息技术高级中学",
|
||||
pid: 0,
|
||||
type: 2,
|
||||
no: "9999",
|
||||
children: [
|
||||
{
|
||||
id: 1562,
|
||||
name: "学生组",
|
||||
pid: 1556,
|
||||
type: 8,
|
||||
no: "9999",
|
||||
children: [],
|
||||
},
|
||||
],
|
||||
};
|
||||
},
|
||||
methods: {
|
||||
removeData(row) {
|
||||
if (row.length == 0) {
|
||||
this.$Message.info("请选择数据!");
|
||||
return;
|
||||
}
|
||||
myConfirm({
|
||||
title: "删除",
|
||||
msg: "确定删除选中的数据吗?",
|
||||
info: "删除后不可恢复",
|
||||
onOk: () => {
|
||||
this.$Message.success("操作成功");
|
||||
this.$refs.tablePage.reloadData();
|
||||
},
|
||||
});
|
||||
},
|
||||
search() {
|
||||
this.$refs.tablePage.reloadData();
|
||||
},
|
||||
treeLink(treeNode) {
|
||||
const _this = this;
|
||||
_this.dataParmas.groupId = treeNode.id;
|
||||
_this.$refs.tablePage.reloadData();
|
||||
},
|
||||
dataFilter(data) {
|
||||
data.forEach((element, index) => {
|
||||
let type = index % 4;
|
||||
var arrText = ["审核中", "审核通过", "审核撤销", "审核拒绝"];
|
||||
var arrClass = ["shenhe", "tongguo", "chexiao", "jujue"];
|
||||
element.status = "朱浩东西 " + arrText[type];
|
||||
let className = `status-${arrClass[type]}`;
|
||||
|
||||
element.cellClassName = {
|
||||
status: className,
|
||||
};
|
||||
});
|
||||
return data;
|
||||
},
|
||||
},
|
||||
};
|
||||
</script>
|
||||
@@ -0,0 +1,169 @@
|
||||
<template>
|
||||
<div class="type_set-box">
|
||||
<div class="type_name">
|
||||
<i class="iconfont icon-stop fl mr-10" v-if="!isEdit && !active" style="color: #ff5959"></i>
|
||||
<Input v-if="isEdit" v-model="type.name" ref="type_input" @on-blur="update" @on-enter="update" />
|
||||
<span v-else class="fl">{{ type.name }}</span>
|
||||
</div>
|
||||
<div class="type_action flex">
|
||||
<div class="action_item" @click="open">
|
||||
<span v-if="active">停用</span>
|
||||
<span v-else>启用</span>
|
||||
</div>
|
||||
<div class="action_edit" @click="edit">
|
||||
<span>编辑</span>
|
||||
</div>
|
||||
<div class="action_delete" @click="remove">
|
||||
<span>删除</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="divider"></div>
|
||||
<div class="divider2"></div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
name: "TypeSetBox",
|
||||
props: {
|
||||
type: {
|
||||
name: { type: String, default: "" },
|
||||
id: { type: String, default: "" },
|
||||
},
|
||||
active: { type: Boolean, default: true },
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
isEdit: false,
|
||||
eventType: "",
|
||||
};
|
||||
},
|
||||
watch: {
|
||||
type: {
|
||||
deep: true,
|
||||
handler(newVal) {
|
||||
if (this.isEdit) {
|
||||
this.isEdit = false;
|
||||
}
|
||||
},
|
||||
},
|
||||
"type.name"(newVal) {
|
||||
if (this.isEdit) {
|
||||
this.isEdit = false;
|
||||
}
|
||||
},
|
||||
},
|
||||
methods: {
|
||||
open() {
|
||||
this.$emit("active", this.type.id);
|
||||
},
|
||||
edit() {
|
||||
this.isEdit = !this.isEdit;
|
||||
if (this.isEdit) this.$nextTick(() => this.$refs["type_input"].focus());
|
||||
},
|
||||
update(e) {
|
||||
if (!this.type.name) {
|
||||
this.$Message.error("值不得为空!");
|
||||
return;
|
||||
}
|
||||
|
||||
if (this.eventType == "") {
|
||||
this.eventType = e.type;
|
||||
this.isEdit = false;
|
||||
this.$emit("edit", this.type.id, this.type.name);
|
||||
setTimeout(() => {
|
||||
this.eventType = "";
|
||||
}, 500);
|
||||
}
|
||||
},
|
||||
remove() {
|
||||
this.$emit("remove", this.type.id);
|
||||
},
|
||||
},
|
||||
};
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.flex {
|
||||
display: flex;
|
||||
}
|
||||
.type_set-box {
|
||||
width: 222px;
|
||||
background: #ffffff;
|
||||
margin-right: 15px;
|
||||
margin-bottom: 15px;
|
||||
.type_name {
|
||||
height: 66px;
|
||||
border: 1px solid #e9e9e9;
|
||||
border-bottom: none;
|
||||
padding-left: 15px;
|
||||
padding-right: 15px;
|
||||
line-height: 66px;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
span {
|
||||
height: 24px;
|
||||
font-size: 15px;
|
||||
font-family: PingFangSC-Semibold, PingFang SC;
|
||||
font-weight: 500;
|
||||
color: #272829;
|
||||
line-height: 24px;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
width: 222px;
|
||||
display: inline-block;
|
||||
}
|
||||
.iconfont {
|
||||
font-size: 26px;
|
||||
}
|
||||
}
|
||||
.type_action {
|
||||
flex-wrap: wrap;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
width: 222px;
|
||||
height: 30px;
|
||||
line-height: 30px;
|
||||
background: #f7f7f7;
|
||||
border-radius: 0px 0px 2px 2px;
|
||||
border-top: none;
|
||||
border: 1px solid #e9e9e9;
|
||||
span {
|
||||
font-size: 12px;
|
||||
}
|
||||
|
||||
div {
|
||||
cursor: pointer;
|
||||
flex: 1;
|
||||
text-align: center;
|
||||
}
|
||||
div:hover {
|
||||
color: #6c91f0;
|
||||
}
|
||||
}
|
||||
.divider {
|
||||
// position: relative;
|
||||
height: 14px;
|
||||
width: 1px;
|
||||
background: #e8e8e8;
|
||||
// left: 73px;
|
||||
// top: -23px;
|
||||
float: left;
|
||||
margin-left: 71px;
|
||||
margin-top: -22px;
|
||||
}
|
||||
.divider2 {
|
||||
// position: relative;
|
||||
// left: 146px;
|
||||
// top: -37px;
|
||||
height: 14px;
|
||||
width: 1px;
|
||||
background: #e8e8e8;
|
||||
float: left;
|
||||
margin-left: 147px;
|
||||
margin-top: -22px;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@@ -0,0 +1,141 @@
|
||||
<template>
|
||||
<div class="tabs-wrapper">
|
||||
<Tabs class="tabs-panel" type="card" v-model="tabIndex">
|
||||
<TabPane label="PC选择人员" name="1"></TabPane>
|
||||
<TabPane label="WebApp选择人员" name="2"></TabPane>
|
||||
</Tabs>
|
||||
<div class="main-container" v-show="tabIndex === '1'">
|
||||
<Checkbox v-model="isAddto">是否追加</Checkbox>
|
||||
<Button type="primary" @click="show">选择人员</Button>
|
||||
<Tooltip content="查看代码">
|
||||
<Button class="ml-15" icon="md-code" @click="showCode({ name: '选择人员', url: 'userCheck.vue' })"></Button>
|
||||
</Tooltip>
|
||||
<user-check ref="userCheck" :treeData="treeData" v-model="userids" @on-submit="submit" :isDisabled="isAddto" />
|
||||
<br />
|
||||
ids: {{ userids }}
|
||||
<br />
|
||||
names:{{ userNames }}
|
||||
</div>
|
||||
<div class="main-container" v-show="tabIndex === '2'">
|
||||
<div class="webapp-panel fl">
|
||||
<Button type="primary" @click="showWebAppUserCheck">选择人员</Button>
|
||||
<br />
|
||||
ids: {{ userids }}
|
||||
<br />
|
||||
names:{{ userNames }}
|
||||
<app-user-check v-model="userids" :treeData="treeData" @on-submit="submit" ref="userChecks"></app-user-check>
|
||||
</div>
|
||||
<p class="mt-30">../components/UserCheck 文件夹内</p>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import userCheck from "../components/user_check.vue";
|
||||
import appUserCheck from "../components/UserCheck/index.vue";
|
||||
export default {
|
||||
components: { userCheck, appUserCheck },
|
||||
data() {
|
||||
return {
|
||||
treeData: [],
|
||||
tabIndex: "1",
|
||||
userids: [161240, 162190, 162666, 162667, 162698, 162699, 162710, 162711, 161225],
|
||||
userNames: [],
|
||||
isAddto: false,
|
||||
};
|
||||
},
|
||||
created() {
|
||||
const _this = this;
|
||||
this.treeData = [
|
||||
{
|
||||
name: "教师",
|
||||
data: [
|
||||
{
|
||||
name: "基础平台",
|
||||
data: _this.getTreeData2(),
|
||||
},
|
||||
{
|
||||
name: "教学组",
|
||||
data: _this.getTreeData2(),
|
||||
},
|
||||
{
|
||||
name: "自定义组",
|
||||
data: _this.getTreeData(3),
|
||||
},
|
||||
{
|
||||
name: "自定义组",
|
||||
data: _this.getTreeData(3),
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
name: "班级",
|
||||
data: [
|
||||
{
|
||||
name: "必修班",
|
||||
data: _this.getTreeData(4),
|
||||
},
|
||||
{
|
||||
name: "选修班",
|
||||
data: _this.getTreeData(5),
|
||||
},
|
||||
],
|
||||
},
|
||||
];
|
||||
},
|
||||
methods: {
|
||||
show() {
|
||||
this.$refs.userCheck.show();
|
||||
},
|
||||
submit(arr) {
|
||||
this.userNames = arr.map(x => x.name);
|
||||
},
|
||||
getTreeData(type) {
|
||||
return () =>
|
||||
new Promise((resolve, reject) => {
|
||||
console.time("time");
|
||||
function randomFun(index) {
|
||||
const id = Math.floor(Math.random() * index);
|
||||
return id;
|
||||
}
|
||||
var arr = Array.from({ length: 2000 }, (item, index) => {
|
||||
return {
|
||||
id: index + 1,
|
||||
name: `dep:${index + 1}`,
|
||||
pid: randomFun(index),
|
||||
};
|
||||
});
|
||||
function treeArr(arr = []) {
|
||||
arr.forEach(item => {
|
||||
const children = arr.filter(_ => _.pid === item.id);
|
||||
if (children.length) {
|
||||
item.children = children;
|
||||
}
|
||||
});
|
||||
return arr.find(item => item.pid === 0);
|
||||
}
|
||||
var tree = [treeArr(arr, 0)];
|
||||
setTimeout(() => {
|
||||
console.log("请求完成!");
|
||||
resolve(tree);
|
||||
}, 200);
|
||||
});
|
||||
},
|
||||
getTreeData2() {
|
||||
return () =>
|
||||
new Promise((resolve, reject) => {
|
||||
this.$api.get(APIConfig.Base.GetSchoolAll, null, resp => {
|
||||
console.log("请求完成!");
|
||||
resolve(resp.Data);
|
||||
});
|
||||
});
|
||||
},
|
||||
showWebAppUserCheck() {
|
||||
this.$refs["userChecks"].show();
|
||||
},
|
||||
},
|
||||
};
|
||||
</script>
|
||||
|
||||
<style>
|
||||
</style>
|
||||
@@ -0,0 +1,447 @@
|
||||
<template>
|
||||
<Modal v-model="modal" title="选择用户" width="720px" :mask-closable="false" :closable="false">
|
||||
<Tabs class="tabs-panel" type="card" v-if="firstTabIndex && firstTabIndex.length > 1" v-model="firstTabIndex" @on-click="firstTabChange">
|
||||
<TabPane v-for="(item, index) in firstTabData" :label="item" :name="index + ''"></TabPane>
|
||||
</Tabs>
|
||||
<AutoComplete @on-search="handleSearch" @on-select="handleSelect" placeholder="输入名字搜索" v-model="searchTreeName" :clearable="true" class="auto-box">
|
||||
<Option v-for="item in currentFlatten" :value="item.name">
|
||||
<span>{{ item.name }}</span>
|
||||
<span class="fr info">{{ item.group }}</span>
|
||||
</Option>
|
||||
</AutoComplete>
|
||||
<div class="tree-wrap fix">
|
||||
<div class="tree-panel fl">
|
||||
<ul class="tree-tab-ul fix">
|
||||
<li
|
||||
@click="secondTabChange(index)"
|
||||
:style="{ width: 100 / secondTabData.length + '%' }"
|
||||
:class="{ active: index == secondTabIndex, fl: true }"
|
||||
v-for="(item, index) in secondTabData"
|
||||
>
|
||||
{{ item }}
|
||||
</li>
|
||||
</ul>
|
||||
<div class="tree-box">
|
||||
<div :id="ztreeDomId" class="ztree"></div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="arrow-box fl">
|
||||
<svg t="1626916477711" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="10021" width="36" height="36">
|
||||
<path
|
||||
d="M138.935 256.078v511.844h63.42V256.078h-63.42z m126.842 0v511.844h127.215V256.078H265.777zM885.064 512L583.254 64.323v191.755H456.414v511.844h126.842v191.755L885.064 512z"
|
||||
p-id="10022"
|
||||
fill="#2d8cf0"
|
||||
></path>
|
||||
</svg>
|
||||
</div>
|
||||
<div class="user-panel fr">
|
||||
<div class="title-box fix">
|
||||
<Checkbox @on-change="checkAllUser" v-model="isCheckUserAll">全选</Checkbox>
|
||||
<div class="fr">{{ tempUserList.length }}</div>
|
||||
<a href="javascript:;" @click="delCheckUser" v-if="tempUserList.findIndex(x => x.isCheck) > -1">删除选中</a>
|
||||
</div>
|
||||
<ul class="user-box">
|
||||
<li :class="{ active: item.isCheck }" v-for="(item, index) in tempUserList" @click="checkUserOne(item)">
|
||||
{{ item.name }}
|
||||
<span class="info">{{ item.group }}</span>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
<div slot="footer">
|
||||
<i-Button type="primary" @click="submit">提交</i-Button>
|
||||
<i-Button @click="modal = false" style="margin-left: 8px">取消</i-Button>
|
||||
</div>
|
||||
</Modal>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
require("@public/libs/ztree/zTreeStyle.css");
|
||||
import "@public/libs/ztree/jquery.ztree.all.min.js";
|
||||
export default {
|
||||
props: {
|
||||
treeData: {
|
||||
type: Array,
|
||||
default() {
|
||||
return [];
|
||||
},
|
||||
},
|
||||
userids: {
|
||||
type: Array,
|
||||
default() {
|
||||
return [];
|
||||
},
|
||||
},
|
||||
ignoreIds: {
|
||||
type: Array,
|
||||
default() {
|
||||
return [];
|
||||
},
|
||||
},
|
||||
},
|
||||
model: {
|
||||
prop: "userids",
|
||||
event: "change",
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
ztreeDomId: null,
|
||||
modal: false,
|
||||
isCheckUserAll: false,
|
||||
firstTabIndex: 0,
|
||||
secondTabIndex: 0,
|
||||
cacheMap: new Map(),
|
||||
currentTree: [],
|
||||
currentFlatten: [],
|
||||
searchTreeName: null,
|
||||
tempUserList: [],
|
||||
isDisabled: false,
|
||||
};
|
||||
},
|
||||
watch: {
|
||||
searchTreeName(val) {
|
||||
this.handleSearch(val);
|
||||
},
|
||||
},
|
||||
computed: {
|
||||
firstTabData() {
|
||||
if (this.treeData.length > 1) return this.treeData.map(x => x.name);
|
||||
else return [];
|
||||
},
|
||||
secondTabData() {
|
||||
if (this.treeData.length == 0) return [];
|
||||
return this.treeData[this.firstTabIndex].data.map(x => x.name);
|
||||
},
|
||||
currentTreeFlatten() {
|
||||
const flatten = (data, pid, pname) => {
|
||||
return data.reduce((arr, { id, name, children = [], type }) => arr.concat([{ id, name, pid, type, group: pname }], flatten(children, id, name)), []);
|
||||
};
|
||||
if (!this.currentTree) return [];
|
||||
var newArr = flatten(this.currentTree, 0, "");
|
||||
return newArr;
|
||||
},
|
||||
},
|
||||
|
||||
mounted() {
|
||||
this.isDisabled = this.ignoreIds.length > 0;
|
||||
this.ztreeDomId = this.uuid();
|
||||
},
|
||||
methods: {
|
||||
show() {
|
||||
this.modal = true;
|
||||
this.firstTabChange("0");
|
||||
},
|
||||
firstTabChange(index) {
|
||||
this.firstTabIndex = index;
|
||||
this.secondTabChange(0);
|
||||
},
|
||||
secondTabChange(index) {
|
||||
const _this = this;
|
||||
if (index != 0 && this.secondTabIndex == index) return;
|
||||
this.secondTabIndex = index;
|
||||
this.changeEmpty();
|
||||
this.initTree();
|
||||
},
|
||||
handleSearch(query) {
|
||||
const _this = this;
|
||||
let arr = [],
|
||||
searchArr = this.currentTreeFlatten.filter(x => x.type == 2 && x.name.indexOf(query) != -1);
|
||||
for (const item of searchArr) {
|
||||
!arr.map(x => _this.getSplitId(x.id)).includes(_this.getSplitId(item.id)) && arr.push(item);
|
||||
}
|
||||
this.currentFlatten = arr;
|
||||
},
|
||||
handleSelect(query) {
|
||||
const _this = this;
|
||||
if (query.indexOf(",") != -1) query = query.split(",")[0];
|
||||
var treeObj = $.fn.zTree.getZTreeObj(this.ztreeDomId);
|
||||
var node = treeObj.getNodeByParam("name", query, null);
|
||||
if (!!node) treeObj.checkNode(node, true, true, true);
|
||||
},
|
||||
formatTree(tree, level = 0) {
|
||||
const _this = this;
|
||||
tree.forEach(element => {
|
||||
element.open = level == 0;
|
||||
element.type = 1;
|
||||
element.id = element.id + "," + element.pid;
|
||||
element.checked = false;
|
||||
if (typeof element.children !== "undefined" && element.children.length > 0) element.children = _this.formatTree(element.children, level + 1);
|
||||
else {
|
||||
element.type = 2;
|
||||
}
|
||||
});
|
||||
return tree;
|
||||
},
|
||||
initTree() {
|
||||
const _this = this;
|
||||
let first = _this.firstTabIndex,
|
||||
second = _this.secondTabIndex,
|
||||
cacheKey = first + "," + second,
|
||||
cacheMap = _this.cacheMap,
|
||||
tree = this.treeData[first].data[second].data;
|
||||
|
||||
if (!!tree && typeof tree === "function") {
|
||||
var cacheData = cacheMap.get(cacheKey);
|
||||
if (!cacheData) {
|
||||
tree().then(data => {
|
||||
cacheMap.set(cacheKey, data);
|
||||
_this.createTree(data, _this.ztreeDomId);
|
||||
});
|
||||
} else {
|
||||
_this.createTree(cacheData, _this.ztreeDomId);
|
||||
}
|
||||
} else {
|
||||
_this.createTree(tree, _this.ztreeDomId);
|
||||
}
|
||||
},
|
||||
createTree(_data, _domId) {
|
||||
const _this = this;
|
||||
var jtree = JSON.parse(JSON.stringify(_data));
|
||||
var ftree = _this.formatTree(jtree);
|
||||
_this.currentTree = ftree;
|
||||
//_this.tempUserList = JSON.parse(JSON.stringify(_this.userids));
|
||||
|
||||
let treeSetting = {
|
||||
view: {
|
||||
dblClickExpand: false,
|
||||
showIcon: false,
|
||||
},
|
||||
check: {
|
||||
enable: true,
|
||||
chkboxType: { Y: "ps", N: "ps" },
|
||||
},
|
||||
callback: {},
|
||||
};
|
||||
function formatUser(tree, checked) {
|
||||
const recursionCheckIds = tree => {
|
||||
let arrIds = [];
|
||||
for (const key in tree) {
|
||||
const element = tree[key];
|
||||
if (element.type == 2 && !element.chkDisabled) arrIds.push({ id: element.id, tid: element.tId });
|
||||
if (typeof element.children !== "undefined" && element.children) {
|
||||
var childIds = recursionCheckIds(element.children);
|
||||
arrIds = [...arrIds, ...childIds];
|
||||
}
|
||||
}
|
||||
return arrIds;
|
||||
};
|
||||
var checkIds = recursionCheckIds([tree]);
|
||||
var checkUserList = _this.currentTreeFlatten.filter(x => checkIds.map(x => x.id).includes(x.id));
|
||||
let checkUserArr = [];
|
||||
for (const element of checkUserList) {
|
||||
var findObj = checkIds.find(x => x.id == element.id);
|
||||
if (!!findObj && checkUserArr.findIndex(x => x.id == element.id) === -1 && _this.tempUserList.findIndex(x => x.id == element.id) === -1) {
|
||||
checkUserArr.push({ ...element, isCheck: false, tid: findObj.tid });
|
||||
}
|
||||
}
|
||||
if (checked) _this.tempUserList = _this.tempUserList.concat(checkUserArr);
|
||||
else {
|
||||
var ids = checkUserList.map(x => x.id);
|
||||
_this.tempUserList = _this.tempUserList.filter(x => !ids.includes(x.id));
|
||||
}
|
||||
}
|
||||
|
||||
//当禁止时,是否还显示在右侧
|
||||
var isCheckFormat = treeNode => {
|
||||
let id = _this.getSplitId(treeNode.id);
|
||||
return _this.ignoreIds.findIndex(x => x == id) === -1;
|
||||
};
|
||||
|
||||
treeSetting.callback.onClick = (event, treeId, treeNode, clickFlag) => {
|
||||
let check = treeNode.checked;
|
||||
let treeObj = $.fn.zTree.getZTreeObj(treeId);
|
||||
treeObj.checkNode(treeNode, !check, true);
|
||||
if (isCheckFormat(treeNode)) formatUser(treeNode, treeNode.checked);
|
||||
};
|
||||
treeSetting.callback.onCheck = (event, treeId, treeNode) => {
|
||||
if (isCheckFormat(treeNode)) formatUser(treeNode, treeNode.checked);
|
||||
};
|
||||
var treeObj = $.fn.zTree.init($("#" + _domId), treeSetting, ftree);
|
||||
//checkUser
|
||||
var nodes = treeObj.getNodesByFilter(x => _this.userids.includes(_this.getSplitId(x.id)));
|
||||
var arr = [];
|
||||
nodes.forEach(element => {
|
||||
var splitId = _this.getSplitId(element.id); //重复id只选择第一个
|
||||
if (!arr.includes(splitId)) treeObj.checkNode(element, true, true, true);
|
||||
arr.push(splitId);
|
||||
});
|
||||
|
||||
var ignorNodes = treeObj.getNodesByFilter(x => _this.ignoreIds.includes(_this.getSplitId(x.id)));
|
||||
ignorNodes.forEach(element => {
|
||||
treeObj.checkNode(element, true, true, true);
|
||||
treeObj.setChkDisabled(element, true);
|
||||
});
|
||||
},
|
||||
checkAllUser(check) {
|
||||
//全选用户
|
||||
const _this = this;
|
||||
_this.tempUserList.forEach(element => {
|
||||
element.isCheck = check;
|
||||
});
|
||||
},
|
||||
checkUserOne(item) {
|
||||
item.isCheck = !item.isCheck;
|
||||
let tlist = this.tempUserList;
|
||||
this.isCheckUserAll = tlist.length > 0 && tlist.filter(x => x.isCheck).length == tlist.length;
|
||||
},
|
||||
delCheckUser() {
|
||||
//删除选中用户
|
||||
const _this = this;
|
||||
let tlist = _this.tempUserList,
|
||||
delArr = [];
|
||||
for (const item of tlist) {
|
||||
item.isCheck && delArr.push(item);
|
||||
}
|
||||
var treeObj = $.fn.zTree.getZTreeObj(_this.ztreeDomId);
|
||||
delArr.forEach(element => {
|
||||
var node = treeObj.getNodeByTId(element.tid);
|
||||
treeObj.checkNode(node, false, true, true);
|
||||
});
|
||||
_this.isCheckUserAll = false;
|
||||
},
|
||||
changeEmpty() {
|
||||
this.tempUserList = [];
|
||||
this.searchTreeName = "";
|
||||
},
|
||||
submit() {
|
||||
const _this = this;
|
||||
let objArr = [],
|
||||
idsArr = this.tempUserList.map(x => _this.getSplitId(x.id));
|
||||
idsArr = Array.from(new Set(idsArr));
|
||||
this.$emit("change", idsArr);
|
||||
function delKey(obj, ...args) {
|
||||
args.forEach(v => {
|
||||
delete obj[v];
|
||||
});
|
||||
return obj;
|
||||
}
|
||||
idsArr.forEach(element => {
|
||||
let findObj = _this.tempUserList.find(x => _this.getSplitId(x.id) == element);
|
||||
delKey(findObj, "id", "isCheck", "tid", "pid", "type");
|
||||
let item = { ...findObj, id: element };
|
||||
if (_this.isDisabled) item.disabled = this.userids.findIndex(x => x == element) !== -1;
|
||||
objArr.push(item);
|
||||
});
|
||||
this.$emit("on-submit", objArr);
|
||||
this.modal = false;
|
||||
},
|
||||
getSplitId(strId) {
|
||||
if (typeof strId === "string" && strId.indexOf(",") != -1) return parseInt(strId.split(",")[0]);
|
||||
else return strId;
|
||||
},
|
||||
uuid() {
|
||||
return "xxxxxxxx-xxxx-4xxx-yxxx-xxxxxxxxxxxx".replace(/[xy]/g, function (c) {
|
||||
var r = (Math.random() * 16) | 0,
|
||||
v = c == "x" ? r : (r & 0x3) | 0x8;
|
||||
return v.toString(16);
|
||||
});
|
||||
},
|
||||
},
|
||||
};
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.tree-wrap {
|
||||
height: 430px;
|
||||
position: relative;
|
||||
}
|
||||
.tree-panel {
|
||||
border: 1px solid #eee;
|
||||
width: 280px;
|
||||
height: 430px;
|
||||
overflow: hidden;
|
||||
}
|
||||
.tree-tab-ul {
|
||||
li {
|
||||
background: #f7f7f7;
|
||||
border-bottom: 1px solid #eee;
|
||||
height: 34px;
|
||||
line-height: 34px;
|
||||
text-align: center;
|
||||
cursor: pointer;
|
||||
}
|
||||
li.active {
|
||||
background: #fff;
|
||||
color: #2d8cf0;
|
||||
border-bottom: none;
|
||||
cursor: default;
|
||||
}
|
||||
}
|
||||
.tree-box {
|
||||
padding: 4px 0;
|
||||
height: 394px;
|
||||
width: auto;
|
||||
overflow-y: auto;
|
||||
border: none;
|
||||
}
|
||||
.user-panel {
|
||||
border: 1px solid #eee;
|
||||
width: 280px;
|
||||
.title-box {
|
||||
background: #f7f7f7;
|
||||
height: 34px;
|
||||
line-height: 34px;
|
||||
padding: 0 12px;
|
||||
a {
|
||||
text-decoration: none;
|
||||
float: right;
|
||||
margin-right: 20px;
|
||||
outline: none;
|
||||
}
|
||||
}
|
||||
.user-box {
|
||||
height: 396px;
|
||||
overflow-y: auto;
|
||||
li {
|
||||
line-height: 32px;
|
||||
padding-left: 12px;
|
||||
cursor: pointer;
|
||||
.info {
|
||||
float: right;
|
||||
margin-right: 12px;
|
||||
font-size: 12px;
|
||||
color: gray;
|
||||
}
|
||||
}
|
||||
li:hover {
|
||||
background: #f3f3f3;
|
||||
}
|
||||
li.active {
|
||||
background: #e4edf6;
|
||||
}
|
||||
}
|
||||
}
|
||||
.arrow-box {
|
||||
width: 128px;
|
||||
text-align: center;
|
||||
position: relative;
|
||||
top: 50%;
|
||||
margin-top: -17px;
|
||||
}
|
||||
|
||||
.auto-box {
|
||||
width: 200px;
|
||||
margin-bottom: 10px;
|
||||
/deep/.ivu-select-item .info {
|
||||
font-size: 12px;
|
||||
color: gray;
|
||||
position: relative;
|
||||
top: 2px;
|
||||
}
|
||||
}
|
||||
|
||||
/deep/ .ztree li {
|
||||
overflow: hidden;
|
||||
}
|
||||
/deep/ .ztree li a {
|
||||
width: 100%;
|
||||
}
|
||||
/deep/ .ztree li a:hover {
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
/deep/ .ivu-auto-complete .ivu-select-dropdown-list {
|
||||
max-height: 310px;
|
||||
overflow-y: auto;
|
||||
}
|
||||
</style>
|
||||
|
After Width: | Height: | Size: 2.1 KiB |
|
After Width: | Height: | Size: 689 B |
|
After Width: | Height: | Size: 462 B |
|
After Width: | Height: | Size: 21 KiB |
|
After Width: | Height: | Size: 1.4 KiB |
|
After Width: | Height: | Size: 3.2 KiB |
|
After Width: | Height: | Size: 186 KiB |
|
After Width: | Height: | Size: 8.8 KiB |
|
After Width: | Height: | Size: 3.6 KiB |
|
After Width: | Height: | Size: 4.9 KiB |
|
After Width: | Height: | Size: 32 KiB |
|
After Width: | Height: | Size: 18 KiB |
|
After Width: | Height: | Size: 20 KiB |
|
After Width: | Height: | Size: 4.7 KiB |
|
After Width: | Height: | Size: 4.5 KiB |
|
After Width: | Height: | Size: 2.9 KiB |
@@ -0,0 +1,4 @@
|
||||
<svg width="40" height="40" viewBox="0 0 40 40" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<circle cx="20" cy="20" r="20" fill="white" fill-opacity="0.25"/>
|
||||
<path d="M28.2864 18.304C29.5397 19.0873 29.5397 20.9127 28.2864 21.696L18.06 28.0875C16.7279 28.9201 15 27.9624 15 26.3915L15 13.6085C15 12.0376 16.7279 11.0799 18.06 11.9125L28.2864 18.304Z" fill="white"/>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 377 B |
|
After Width: | Height: | Size: 3.7 KiB |
@@ -0,0 +1,22 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="utf-8" />
|
||||
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
|
||||
<meta name="viewport" content="width=device-width,initial-scale=1.0" />
|
||||
<meta content="telephone=no,email=no" name="format-detection" />
|
||||
<meta http-equiv="Access-Control-Allow-Origin" content="*" />
|
||||
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
||||
<title><%= htmlWebpackPlugin.options.title %></title>
|
||||
<script src="./config/index.js"></script>
|
||||
<link rel="stylesheet" href="//at.alicdn.com/t/c/font_4962449_bwzjcx59wz4.css" />
|
||||
</head>
|
||||
<body>
|
||||
<div id="app"></div>
|
||||
<script src="./libs/vue.js"></script>
|
||||
<script src="./libs/jquery.min.js"></script>
|
||||
<script src="./libs/axios.js"></script>
|
||||
<script src="./libs/clipboard.min.js"></script>
|
||||
</body>
|
||||
</html>
|
||||
@@ -0,0 +1,84 @@
|
||||
/*滚动条样式 */
|
||||
|
||||
/*第一种样式,所有的滚动条,都默认这个样子*/
|
||||
|
||||
*::-webkit-scrollbar {
|
||||
width: 10px;
|
||||
height: 10px;
|
||||
}
|
||||
|
||||
/*正常情况下滑块的样式*/
|
||||
*::-webkit-scrollbar-thumb {
|
||||
background-color: rgba(0, 0, 0, .05);
|
||||
border-radius: 10px;
|
||||
-webkit-box-shadow: inset 1px 1px 0 rgba(0, 0, 0, .1);
|
||||
}
|
||||
|
||||
/*鼠标悬浮在该类指向的控件上时滑块的样式*/
|
||||
*:hover::-webkit-scrollbar-thumb {
|
||||
background-color: rgba(0, 0, 0, .2);
|
||||
border-radius: 10px;
|
||||
-webkit-box-shadow: inset 1px 1px 0 rgba(0, 0, 0, .1);
|
||||
}
|
||||
|
||||
/*鼠标悬浮在滑块上时滑块的样式*/
|
||||
*::-webkit-scrollbar-thumb:hover {
|
||||
background-color: rgba(0, 0, 0, .3);
|
||||
-webkit-box-shadow: inset 1px 1px 0 rgba(0, 0, 0, .1);
|
||||
}
|
||||
|
||||
/*正常时候的主干部分*/
|
||||
*::-webkit-scrollbar-track {
|
||||
border-radius: 10px;
|
||||
-webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0);
|
||||
background-color: white;
|
||||
}
|
||||
|
||||
/*鼠标悬浮在滚动条上的主干部分*/
|
||||
*::-webkit-scrollbar-track:hover {
|
||||
-webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, .4);
|
||||
background-color: rgba(0, 0, 0, .01);
|
||||
}
|
||||
|
||||
/*第一种样式结束*/
|
||||
|
||||
|
||||
/*第二种样式*/
|
||||
|
||||
.scroll2::-webkit-scrollbar {
|
||||
width: 10px;
|
||||
height: 10px;
|
||||
}
|
||||
|
||||
/*正常时候的主干部分*/
|
||||
.scroll2::-webkit-scrollbar-track {
|
||||
border-radius: 10px;
|
||||
-webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0);
|
||||
background-color: white;
|
||||
}
|
||||
|
||||
/*正常情况下滑块的样式*/
|
||||
.scroll2::-webkit-scrollbar-thumb {
|
||||
background-color: rgba(0, 0, 0, .05);
|
||||
border-radius: 10px;
|
||||
-webkit-box-shadow: inset 1px 1px 0 rgba(0, 0, 0, .1);
|
||||
}
|
||||
|
||||
/*鼠标悬浮在该类指向的控件上时滑块的样式*/
|
||||
.scroll2:hover::-webkit-scrollbar-thumb {
|
||||
background-color: rgba(0, 0, 0, .2);
|
||||
border-radius: 10px;
|
||||
-webkit-box-shadow: inset 1px 1px 0 rgba(0, 0, 0, .1);
|
||||
}
|
||||
|
||||
/*鼠标悬浮在滚动条上的主干部分*/
|
||||
.scroll2::-webkit-scrollbar-track:hover {
|
||||
-webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, .4);
|
||||
}
|
||||
|
||||
/*鼠标悬浮在滑块上时滑块的样式*/
|
||||
.scroll2::-webkit-scrollbar-thumb:hover {
|
||||
-webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, .4);
|
||||
}
|
||||
|
||||
/*第二种样式结束*/
|
||||
|
After Width: | Height: | Size: 4.8 KiB |
|
After Width: | Height: | Size: 7.3 KiB |
|
After Width: | Height: | Size: 3.4 KiB |
|
After Width: | Height: | Size: 12 KiB |
|
After Width: | Height: | Size: 933 B |
|
After Width: | Height: | Size: 5.4 KiB |
@@ -0,0 +1,165 @@
|
||||
|
||||
/*
|
||||
* JQuery zTree core v3.5.29
|
||||
* http://treejs.cn/
|
||||
*
|
||||
* Copyright (c) 2010 Hunter.z
|
||||
*
|
||||
* Licensed same as jquery - MIT License
|
||||
* http://www.opensource.org/licenses/mit-license.php
|
||||
*
|
||||
* email: hunter.z@263.net
|
||||
* Date: 2017-06-19
|
||||
*/
|
||||
(function(r){var I,J,K,L,M,N,v,s={},w={},x={},O={treeId:"",treeObj:null,view:{addDiyDom:null,autoCancelSelected:!0,dblClickExpand:!0,expandSpeed:"fast",fontCss:{},nameIsHTML:!1,selectedMulti:!0,showIcon:!0,showLine:!0,showTitle:!0,txtSelectedEnable:!1},data:{key:{children:"children",name:"name",title:"",url:"url",icon:"icon"},simpleData:{enable:!1,idKey:"id",pIdKey:"pId",rootPId:null},keep:{parent:!1,leaf:!1}},async:{enable:!1,contentType:"application/x-www-form-urlencoded",type:"post",dataType:"text",
|
||||
url:"",autoParam:[],otherParam:[],dataFilter:null},callback:{beforeAsync:null,beforeClick:null,beforeDblClick:null,beforeRightClick:null,beforeMouseDown:null,beforeMouseUp:null,beforeExpand:null,beforeCollapse:null,beforeRemove:null,onAsyncError:null,onAsyncSuccess:null,onNodeCreated:null,onClick:null,onDblClick:null,onRightClick:null,onMouseDown:null,onMouseUp:null,onExpand:null,onCollapse:null,onRemove:null}},y=[function(b){var a=b.treeObj,c=f.event;a.bind(c.NODECREATED,function(a,c,g){j.apply(b.callback.onNodeCreated,
|
||||
[a,c,g])});a.bind(c.CLICK,function(a,c,g,k,h){j.apply(b.callback.onClick,[c,g,k,h])});a.bind(c.EXPAND,function(a,c,g){j.apply(b.callback.onExpand,[a,c,g])});a.bind(c.COLLAPSE,function(a,c,g){j.apply(b.callback.onCollapse,[a,c,g])});a.bind(c.ASYNC_SUCCESS,function(a,c,g,k){j.apply(b.callback.onAsyncSuccess,[a,c,g,k])});a.bind(c.ASYNC_ERROR,function(a,c,g,k,h,f){j.apply(b.callback.onAsyncError,[a,c,g,k,h,f])});a.bind(c.REMOVE,function(a,c,g){j.apply(b.callback.onRemove,[a,c,g])});a.bind(c.SELECTED,
|
||||
function(a,c,g){j.apply(b.callback.onSelected,[c,g])});a.bind(c.UNSELECTED,function(a,c,g){j.apply(b.callback.onUnSelected,[c,g])})}],z=[function(b){var a=f.event;b.treeObj.unbind(a.NODECREATED).unbind(a.CLICK).unbind(a.EXPAND).unbind(a.COLLAPSE).unbind(a.ASYNC_SUCCESS).unbind(a.ASYNC_ERROR).unbind(a.REMOVE).unbind(a.SELECTED).unbind(a.UNSELECTED)}],A=[function(b){var a=h.getCache(b);a||(a={},h.setCache(b,a));a.nodes=[];a.doms=[]}],B=[function(b,a,c,d,e,g){if(c){var k=h.getRoot(b),f=b.data.key.children;
|
||||
c.level=a;c.tId=b.treeId+"_"+ ++k.zId;c.parentTId=d?d.tId:null;c.open=typeof c.open=="string"?j.eqs(c.open,"true"):!!c.open;c[f]&&c[f].length>0?(c.isParent=!0,c.zAsync=!0):(c.isParent=typeof c.isParent=="string"?j.eqs(c.isParent,"true"):!!c.isParent,c.open=c.isParent&&!b.async.enable?c.open:!1,c.zAsync=!c.isParent);c.isFirstNode=e;c.isLastNode=g;c.getParentNode=function(){return h.getNodeCache(b,c.parentTId)};c.getPreNode=function(){return h.getPreNode(b,c)};c.getNextNode=function(){return h.getNextNode(b,
|
||||
c)};c.getIndex=function(){return h.getNodeIndex(b,c)};c.getPath=function(){return h.getNodePath(b,c)};c.isAjaxing=!1;h.fixPIdKeyValue(b,c)}}],u=[function(b){var a=b.target,c=h.getSetting(b.data.treeId),d="",e=null,g="",k="",p=null,i=null,q=null;if(j.eqs(b.type,"mousedown"))k="mousedown";else if(j.eqs(b.type,"mouseup"))k="mouseup";else if(j.eqs(b.type,"contextmenu"))k="contextmenu";else if(j.eqs(b.type,"click"))if(j.eqs(a.tagName,"span")&&a.getAttribute("treeNode"+f.id.SWITCH)!==null)d=j.getNodeMainDom(a).id,
|
||||
g="switchNode";else{if(q=j.getMDom(c,a,[{tagName:"a",attrName:"treeNode"+f.id.A}]))d=j.getNodeMainDom(q).id,g="clickNode"}else if(j.eqs(b.type,"dblclick")&&(k="dblclick",q=j.getMDom(c,a,[{tagName:"a",attrName:"treeNode"+f.id.A}])))d=j.getNodeMainDom(q).id,g="switchNode";if(k.length>0&&d.length==0&&(q=j.getMDom(c,a,[{tagName:"a",attrName:"treeNode"+f.id.A}])))d=j.getNodeMainDom(q).id;if(d.length>0)switch(e=h.getNodeCache(c,d),g){case "switchNode":e.isParent?j.eqs(b.type,"click")||j.eqs(b.type,"dblclick")&&
|
||||
j.apply(c.view.dblClickExpand,[c.treeId,e],c.view.dblClickExpand)?p=I:g="":g="";break;case "clickNode":p=J}switch(k){case "mousedown":i=K;break;case "mouseup":i=L;break;case "dblclick":i=M;break;case "contextmenu":i=N}return{stop:!1,node:e,nodeEventType:g,nodeEventCallback:p,treeEventType:k,treeEventCallback:i}}],C=[function(b){var a=h.getRoot(b);a||(a={},h.setRoot(b,a));a[b.data.key.children]=[];a.expandTriggerFlag=!1;a.curSelectedList=[];a.noSelection=!0;a.createdNodes=[];a.zId=0;a._ver=(new Date).getTime()}],
|
||||
D=[],E=[],F=[],G=[],H=[],h={addNodeCache:function(b,a){h.getCache(b).nodes[h.getNodeCacheId(a.tId)]=a},getNodeCacheId:function(b){return b.substring(b.lastIndexOf("_")+1)},addAfterA:function(b){E.push(b)},addBeforeA:function(b){D.push(b)},addInnerAfterA:function(b){G.push(b)},addInnerBeforeA:function(b){F.push(b)},addInitBind:function(b){y.push(b)},addInitUnBind:function(b){z.push(b)},addInitCache:function(b){A.push(b)},addInitNode:function(b){B.push(b)},addInitProxy:function(b,a){a?u.splice(0,0,
|
||||
b):u.push(b)},addInitRoot:function(b){C.push(b)},addNodesData:function(b,a,c,d){var e=b.data.key.children;a[e]?c>=a[e].length&&(c=-1):(a[e]=[],c=-1);if(a[e].length>0&&c===0)a[e][0].isFirstNode=!1,i.setNodeLineIcos(b,a[e][0]);else if(a[e].length>0&&c<0)a[e][a[e].length-1].isLastNode=!1,i.setNodeLineIcos(b,a[e][a[e].length-1]);a.isParent=!0;c<0?a[e]=a[e].concat(d):(b=[c,0].concat(d),a[e].splice.apply(a[e],b))},addSelectedNode:function(b,a){var c=h.getRoot(b);h.isSelectedNode(b,a)||c.curSelectedList.push(a)},
|
||||
addCreatedNode:function(b,a){(b.callback.onNodeCreated||b.view.addDiyDom)&&h.getRoot(b).createdNodes.push(a)},addZTreeTools:function(b){H.push(b)},exSetting:function(b){r.extend(!0,O,b)},fixPIdKeyValue:function(b,a){b.data.simpleData.enable&&(a[b.data.simpleData.pIdKey]=a.parentTId?a.getParentNode()[b.data.simpleData.idKey]:b.data.simpleData.rootPId)},getAfterA:function(b,a,c){for(var d=0,e=E.length;d<e;d++)E[d].apply(this,arguments)},getBeforeA:function(b,a,c){for(var d=0,e=D.length;d<e;d++)D[d].apply(this,
|
||||
arguments)},getInnerAfterA:function(b,a,c){for(var d=0,e=G.length;d<e;d++)G[d].apply(this,arguments)},getInnerBeforeA:function(b,a,c){for(var d=0,e=F.length;d<e;d++)F[d].apply(this,arguments)},getCache:function(b){return x[b.treeId]},getNodeIndex:function(b,a){if(!a)return null;for(var c=b.data.key.children,d=a.parentTId?a.getParentNode():h.getRoot(b),e=0,g=d[c].length-1;e<=g;e++)if(d[c][e]===a)return e;return-1},getNextNode:function(b,a){if(!a)return null;for(var c=b.data.key.children,d=a.parentTId?
|
||||
a.getParentNode():h.getRoot(b),e=0,g=d[c].length-1;e<=g;e++)if(d[c][e]===a)return e==g?null:d[c][e+1];return null},getNodeByParam:function(b,a,c,d){if(!a||!c)return null;for(var e=b.data.key.children,g=0,k=a.length;g<k;g++){if(a[g][c]==d)return a[g];var f=h.getNodeByParam(b,a[g][e],c,d);if(f)return f}return null},getNodeCache:function(b,a){if(!a)return null;var c=x[b.treeId].nodes[h.getNodeCacheId(a)];return c?c:null},getNodeName:function(b,a){return""+a[b.data.key.name]},getNodePath:function(b,a){if(!a)return null;
|
||||
var c;(c=a.parentTId?a.getParentNode().getPath():[])&&c.push(a);return c},getNodeTitle:function(b,a){return""+a[b.data.key.title===""?b.data.key.name:b.data.key.title]},getNodes:function(b){return h.getRoot(b)[b.data.key.children]},getNodesByParam:function(b,a,c,d){if(!a||!c)return[];for(var e=b.data.key.children,g=[],k=0,f=a.length;k<f;k++)a[k][c]==d&&g.push(a[k]),g=g.concat(h.getNodesByParam(b,a[k][e],c,d));return g},getNodesByParamFuzzy:function(b,a,c,d){if(!a||!c)return[];for(var e=b.data.key.children,
|
||||
g=[],d=d.toLowerCase(),k=0,f=a.length;k<f;k++)typeof a[k][c]=="string"&&a[k][c].toLowerCase().indexOf(d)>-1&&g.push(a[k]),g=g.concat(h.getNodesByParamFuzzy(b,a[k][e],c,d));return g},getNodesByFilter:function(b,a,c,d,e){if(!a)return d?null:[];for(var g=b.data.key.children,k=d?null:[],f=0,i=a.length;f<i;f++){if(j.apply(c,[a[f],e],!1)){if(d)return a[f];k.push(a[f])}var q=h.getNodesByFilter(b,a[f][g],c,d,e);if(d&&q)return q;k=d?q:k.concat(q)}return k},getPreNode:function(b,a){if(!a)return null;for(var c=
|
||||
b.data.key.children,d=a.parentTId?a.getParentNode():h.getRoot(b),e=0,g=d[c].length;e<g;e++)if(d[c][e]===a)return e==0?null:d[c][e-1];return null},getRoot:function(b){return b?w[b.treeId]:null},getRoots:function(){return w},getSetting:function(b){return s[b]},getSettings:function(){return s},getZTreeTools:function(b){return(b=this.getRoot(this.getSetting(b)))?b.treeTools:null},initCache:function(b){for(var a=0,c=A.length;a<c;a++)A[a].apply(this,arguments)},initNode:function(b,a,c,d,e,g){for(var k=
|
||||
0,f=B.length;k<f;k++)B[k].apply(this,arguments)},initRoot:function(b){for(var a=0,c=C.length;a<c;a++)C[a].apply(this,arguments)},isSelectedNode:function(b,a){for(var c=h.getRoot(b),d=0,e=c.curSelectedList.length;d<e;d++)if(a===c.curSelectedList[d])return!0;return!1},removeNodeCache:function(b,a){var c=b.data.key.children;if(a[c])for(var d=0,e=a[c].length;d<e;d++)h.removeNodeCache(b,a[c][d]);h.getCache(b).nodes[h.getNodeCacheId(a.tId)]=null},removeSelectedNode:function(b,a){for(var c=h.getRoot(b),
|
||||
d=0,e=c.curSelectedList.length;d<e;d++)if(a===c.curSelectedList[d]||!h.getNodeCache(b,c.curSelectedList[d].tId))c.curSelectedList.splice(d,1),b.treeObj.trigger(f.event.UNSELECTED,[b.treeId,a]),d--,e--},setCache:function(b,a){x[b.treeId]=a},setRoot:function(b,a){w[b.treeId]=a},setZTreeTools:function(b,a){for(var c=0,d=H.length;c<d;c++)H[c].apply(this,arguments)},transformToArrayFormat:function(b,a){if(!a)return[];var c=b.data.key.children,d=[];if(j.isArray(a))for(var e=0,g=a.length;e<g;e++)d.push(a[e]),
|
||||
a[e][c]&&(d=d.concat(h.transformToArrayFormat(b,a[e][c])));else d.push(a),a[c]&&(d=d.concat(h.transformToArrayFormat(b,a[c])));return d},transformTozTreeFormat:function(b,a){var c,d,e=b.data.simpleData.idKey,g=b.data.simpleData.pIdKey,k=b.data.key.children;if(!e||e==""||!a)return[];if(j.isArray(a)){var f=[],h={};for(c=0,d=a.length;c<d;c++)h[a[c][e]]=a[c];for(c=0,d=a.length;c<d;c++)h[a[c][g]]&&a[c][e]!=a[c][g]?(h[a[c][g]][k]||(h[a[c][g]][k]=[]),h[a[c][g]][k].push(a[c])):f.push(a[c]);return f}else return[a]}},
|
||||
m={bindEvent:function(b){for(var a=0,c=y.length;a<c;a++)y[a].apply(this,arguments)},unbindEvent:function(b){for(var a=0,c=z.length;a<c;a++)z[a].apply(this,arguments)},bindTree:function(b){var a={treeId:b.treeId},c=b.treeObj;b.view.txtSelectedEnable||c.bind("selectstart",v).css({"-moz-user-select":"-moz-none"});c.bind("click",a,m.proxy);c.bind("dblclick",a,m.proxy);c.bind("mouseover",a,m.proxy);c.bind("mouseout",a,m.proxy);c.bind("mousedown",a,m.proxy);c.bind("mouseup",a,m.proxy);c.bind("contextmenu",
|
||||
a,m.proxy)},unbindTree:function(b){b.treeObj.unbind("selectstart",v).unbind("click",m.proxy).unbind("dblclick",m.proxy).unbind("mouseover",m.proxy).unbind("mouseout",m.proxy).unbind("mousedown",m.proxy).unbind("mouseup",m.proxy).unbind("contextmenu",m.proxy)},doProxy:function(b){for(var a=[],c=0,d=u.length;c<d;c++){var e=u[c].apply(this,arguments);a.push(e);if(e.stop)break}return a},proxy:function(b){var a=h.getSetting(b.data.treeId);if(!j.uCanDo(a,b))return!0;for(var a=m.doProxy(b),c=!0,d=0,e=a.length;d<
|
||||
e;d++){var g=a[d];g.nodeEventCallback&&(c=g.nodeEventCallback.apply(g,[b,g.node])&&c);g.treeEventCallback&&(c=g.treeEventCallback.apply(g,[b,g.node])&&c)}return c}};I=function(b,a){var c=h.getSetting(b.data.treeId);if(a.open){if(j.apply(c.callback.beforeCollapse,[c.treeId,a],!0)==!1)return!0}else if(j.apply(c.callback.beforeExpand,[c.treeId,a],!0)==!1)return!0;h.getRoot(c).expandTriggerFlag=!0;i.switchNode(c,a);return!0};J=function(b,a){var c=h.getSetting(b.data.treeId),d=c.view.autoCancelSelected&&
|
||||
(b.ctrlKey||b.metaKey)&&h.isSelectedNode(c,a)?0:c.view.autoCancelSelected&&(b.ctrlKey||b.metaKey)&&c.view.selectedMulti?2:1;if(j.apply(c.callback.beforeClick,[c.treeId,a,d],!0)==!1)return!0;d===0?i.cancelPreSelectedNode(c,a):i.selectNode(c,a,d===2);c.treeObj.trigger(f.event.CLICK,[b,c.treeId,a,d]);return!0};K=function(b,a){var c=h.getSetting(b.data.treeId);j.apply(c.callback.beforeMouseDown,[c.treeId,a],!0)&&j.apply(c.callback.onMouseDown,[b,c.treeId,a]);return!0};L=function(b,a){var c=h.getSetting(b.data.treeId);
|
||||
j.apply(c.callback.beforeMouseUp,[c.treeId,a],!0)&&j.apply(c.callback.onMouseUp,[b,c.treeId,a]);return!0};M=function(b,a){var c=h.getSetting(b.data.treeId);j.apply(c.callback.beforeDblClick,[c.treeId,a],!0)&&j.apply(c.callback.onDblClick,[b,c.treeId,a]);return!0};N=function(b,a){var c=h.getSetting(b.data.treeId);j.apply(c.callback.beforeRightClick,[c.treeId,a],!0)&&j.apply(c.callback.onRightClick,[b,c.treeId,a]);return typeof c.callback.onRightClick!="function"};v=function(b){b=b.originalEvent.srcElement.nodeName.toLowerCase();
|
||||
return b==="input"||b==="textarea"};var j={apply:function(b,a,c){return typeof b=="function"?b.apply(P,a?a:[]):c},canAsync:function(b,a){var c=b.data.key.children;return b.async.enable&&a&&a.isParent&&!(a.zAsync||a[c]&&a[c].length>0)},clone:function(b){if(b===null)return null;var a=j.isArray(b)?[]:{},c;for(c in b)a[c]=b[c]instanceof Date?new Date(b[c].getTime()):typeof b[c]==="object"?j.clone(b[c]):b[c];return a},eqs:function(b,a){return b.toLowerCase()===a.toLowerCase()},isArray:function(b){return Object.prototype.toString.apply(b)===
|
||||
"[object Array]"},isElement:function(b){return typeof HTMLElement==="object"?b instanceof HTMLElement:b&&typeof b==="object"&&b!==null&&b.nodeType===1&&typeof b.nodeName==="string"},$:function(b,a,c){a&&typeof a!="string"&&(c=a,a="");return typeof b=="string"?r(b,c?c.treeObj.get(0).ownerDocument:null):r("#"+b.tId+a,c?c.treeObj:null)},getMDom:function(b,a,c){if(!a)return null;for(;a&&a.id!==b.treeId;){for(var d=0,e=c.length;a.tagName&&d<e;d++)if(j.eqs(a.tagName,c[d].tagName)&&a.getAttribute(c[d].attrName)!==
|
||||
null)return a;a=a.parentNode}return null},getNodeMainDom:function(b){return r(b).parent("li").get(0)||r(b).parentsUntil("li").parent().get(0)},isChildOrSelf:function(b,a){return r(b).closest("#"+a).length>0},uCanDo:function(){return!0}},i={addNodes:function(b,a,c,d,e){if(!b.data.keep.leaf||!a||a.isParent)if(j.isArray(d)||(d=[d]),b.data.simpleData.enable&&(d=h.transformTozTreeFormat(b,d)),a){var g=l(a,f.id.SWITCH,b),k=l(a,f.id.ICON,b),p=l(a,f.id.UL,b);if(!a.open)i.replaceSwitchClass(a,g,f.folder.CLOSE),
|
||||
i.replaceIcoClass(a,k,f.folder.CLOSE),a.open=!1,p.css({display:"none"});h.addNodesData(b,a,c,d);i.createNodes(b,a.level+1,d,a,c);e||i.expandCollapseParentNode(b,a,!0)}else h.addNodesData(b,h.getRoot(b),c,d),i.createNodes(b,0,d,null,c)},appendNodes:function(b,a,c,d,e,g,k){if(!c)return[];var f=[],j=b.data.key.children,q=(d?d:h.getRoot(b))[j],l,Q;if(!q||e>=q.length-c.length)e=-1;for(var t=0,m=c.length;t<m;t++){var o=c[t];g&&(l=(e===0||q.length==c.length)&&t==0,Q=e<0&&t==c.length-1,h.initNode(b,a,o,d,
|
||||
l,Q,k),h.addNodeCache(b,o));l=[];o[j]&&o[j].length>0&&(l=i.appendNodes(b,a+1,o[j],o,-1,g,k&&o.open));k&&(i.makeDOMNodeMainBefore(f,b,o),i.makeDOMNodeLine(f,b,o),h.getBeforeA(b,o,f),i.makeDOMNodeNameBefore(f,b,o),h.getInnerBeforeA(b,o,f),i.makeDOMNodeIcon(f,b,o),h.getInnerAfterA(b,o,f),i.makeDOMNodeNameAfter(f,b,o),h.getAfterA(b,o,f),o.isParent&&o.open&&i.makeUlHtml(b,o,f,l.join("")),i.makeDOMNodeMainAfter(f,b,o),h.addCreatedNode(b,o))}return f},appendParentULDom:function(b,a){var c=[],d=l(a,b);!d.get(0)&&
|
||||
a.parentTId&&(i.appendParentULDom(b,a.getParentNode()),d=l(a,b));var e=l(a,f.id.UL,b);e.get(0)&&e.remove();e=i.appendNodes(b,a.level+1,a[b.data.key.children],a,-1,!1,!0);i.makeUlHtml(b,a,c,e.join(""));d.append(c.join(""))},asyncNode:function(b,a,c,d){var e,g;if(a&&!a.isParent)return j.apply(d),!1;else if(a&&a.isAjaxing)return!1;else if(j.apply(b.callback.beforeAsync,[b.treeId,a],!0)==!1)return j.apply(d),!1;if(a)a.isAjaxing=!0,l(a,f.id.ICON,b).attr({style:"","class":f.className.BUTTON+" "+f.className.ICO_LOADING});
|
||||
var k={};for(e=0,g=b.async.autoParam.length;a&&e<g;e++){var p=b.async.autoParam[e].split("="),n=p;p.length>1&&(n=p[1],p=p[0]);k[n]=a[p]}if(j.isArray(b.async.otherParam))for(e=0,g=b.async.otherParam.length;e<g;e+=2)k[b.async.otherParam[e]]=b.async.otherParam[e+1];else for(var q in b.async.otherParam)k[q]=b.async.otherParam[q];var m=h.getRoot(b)._ver;r.ajax({contentType:b.async.contentType,cache:!1,type:b.async.type,url:j.apply(b.async.url,[b.treeId,a],b.async.url),data:b.async.contentType.indexOf("application/json")>
|
||||
-1?JSON.stringify(k):k,dataType:b.async.dataType,success:function(g){if(m==h.getRoot(b)._ver){var e=[];try{e=!g||g.length==0?[]:typeof g=="string"?eval("("+g+")"):g}catch(k){e=g}if(a)a.isAjaxing=null,a.zAsync=!0;i.setNodeLineIcos(b,a);e&&e!==""?(e=j.apply(b.async.dataFilter,[b.treeId,a,e],e),i.addNodes(b,a,-1,e?j.clone(e):[],!!c)):i.addNodes(b,a,-1,[],!!c);b.treeObj.trigger(f.event.ASYNC_SUCCESS,[b.treeId,a,g]);j.apply(d)}},error:function(c,d,g){if(m==h.getRoot(b)._ver){if(a)a.isAjaxing=null;i.setNodeLineIcos(b,
|
||||
a);b.treeObj.trigger(f.event.ASYNC_ERROR,[b.treeId,a,c,d,g])}}});return!0},cancelPreSelectedNode:function(b,a,c){var d=h.getRoot(b).curSelectedList,e,g;for(e=d.length-1;e>=0;e--)if(g=d[e],a===g||!a&&(!c||c!==g))if(l(g,f.id.A,b).removeClass(f.node.CURSELECTED),a){h.removeSelectedNode(b,a);break}else d.splice(e,1),b.treeObj.trigger(f.event.UNSELECTED,[b.treeId,g])},createNodeCallback:function(b){if(b.callback.onNodeCreated||b.view.addDiyDom)for(var a=h.getRoot(b);a.createdNodes.length>0;){var c=a.createdNodes.shift();
|
||||
j.apply(b.view.addDiyDom,[b.treeId,c]);b.callback.onNodeCreated&&b.treeObj.trigger(f.event.NODECREATED,[b.treeId,c])}},createNodes:function(b,a,c,d,e){if(c&&c.length!=0){var g=h.getRoot(b),k=b.data.key.children,k=!d||d.open||!!l(d[k][0],b).get(0);g.createdNodes=[];var a=i.appendNodes(b,a,c,d,e,!0,k),j,n;d?(d=l(d,f.id.UL,b),d.get(0)&&(j=d)):j=b.treeObj;j&&(e>=0&&(n=j.children()[e]),e>=0&&n?r(n).before(a.join("")):j.append(a.join("")));i.createNodeCallback(b)}},destroy:function(b){b&&(h.initCache(b),
|
||||
h.initRoot(b),m.unbindTree(b),m.unbindEvent(b),b.treeObj.empty(),delete s[b.treeId])},expandCollapseNode:function(b,a,c,d,e){var g=h.getRoot(b),k=b.data.key.children,p;if(a){if(g.expandTriggerFlag)p=e,e=function(){p&&p();a.open?b.treeObj.trigger(f.event.EXPAND,[b.treeId,a]):b.treeObj.trigger(f.event.COLLAPSE,[b.treeId,a])},g.expandTriggerFlag=!1;if(!a.open&&a.isParent&&(!l(a,f.id.UL,b).get(0)||a[k]&&a[k].length>0&&!l(a[k][0],b).get(0)))i.appendParentULDom(b,a),i.createNodeCallback(b);if(a.open==c)j.apply(e,
|
||||
[]);else{var c=l(a,f.id.UL,b),g=l(a,f.id.SWITCH,b),n=l(a,f.id.ICON,b);a.isParent?(a.open=!a.open,a.iconOpen&&a.iconClose&&n.attr("style",i.makeNodeIcoStyle(b,a)),a.open?(i.replaceSwitchClass(a,g,f.folder.OPEN),i.replaceIcoClass(a,n,f.folder.OPEN),d==!1||b.view.expandSpeed==""?(c.show(),j.apply(e,[])):a[k]&&a[k].length>0?c.slideDown(b.view.expandSpeed,e):(c.show(),j.apply(e,[]))):(i.replaceSwitchClass(a,g,f.folder.CLOSE),i.replaceIcoClass(a,n,f.folder.CLOSE),d==!1||b.view.expandSpeed==""||!(a[k]&&
|
||||
a[k].length>0)?(c.hide(),j.apply(e,[])):c.slideUp(b.view.expandSpeed,e))):j.apply(e,[])}}else j.apply(e,[])},expandCollapseParentNode:function(b,a,c,d,e){a&&(a.parentTId?(i.expandCollapseNode(b,a,c,d),a.parentTId&&i.expandCollapseParentNode(b,a.getParentNode(),c,d,e)):i.expandCollapseNode(b,a,c,d,e))},expandCollapseSonNode:function(b,a,c,d,e){var g=h.getRoot(b),f=b.data.key.children,g=a?a[f]:g[f],f=a?!1:d,j=h.getRoot(b).expandTriggerFlag;h.getRoot(b).expandTriggerFlag=!1;if(g)for(var n=0,l=g.length;n<
|
||||
l;n++)g[n]&&i.expandCollapseSonNode(b,g[n],c,f);h.getRoot(b).expandTriggerFlag=j;i.expandCollapseNode(b,a,c,d,e)},isSelectedNode:function(b,a){if(!a)return!1;var c=h.getRoot(b).curSelectedList,d;for(d=c.length-1;d>=0;d--)if(a===c[d])return!0;return!1},makeDOMNodeIcon:function(b,a,c){var d=h.getNodeName(a,c),d=a.view.nameIsHTML?d:d.replace(/&/g,"&").replace(/</g,"<").replace(/>/g,">");b.push("<span id='",c.tId,f.id.ICON,"' title='' treeNode",f.id.ICON," class='",i.makeNodeIcoClass(a,c),"' style='",
|
||||
i.makeNodeIcoStyle(a,c),"'></span><span id='",c.tId,f.id.SPAN,"' class='",f.className.NAME,"'>",d,"</span>")},makeDOMNodeLine:function(b,a,c){b.push("<span id='",c.tId,f.id.SWITCH,"' title='' class='",i.makeNodeLineClass(a,c),"' treeNode",f.id.SWITCH,"></span>")},makeDOMNodeMainAfter:function(b){b.push("</li>")},makeDOMNodeMainBefore:function(b,a,c){b.push("<li id='",c.tId,"' class='",f.className.LEVEL,c.level,"' tabindex='0' hidefocus='true' treenode>")},makeDOMNodeNameAfter:function(b){b.push("</a>")},
|
||||
makeDOMNodeNameBefore:function(b,a,c){var d=h.getNodeTitle(a,c),e=i.makeNodeUrl(a,c),g=i.makeNodeFontCss(a,c),k=[],p;for(p in g)k.push(p,":",g[p],";");b.push("<a id='",c.tId,f.id.A,"' class='",f.className.LEVEL,c.level,"' treeNode",f.id.A,' onclick="',c.click||"",'" ',e!=null&&e.length>0?"href='"+e+"'":""," target='",i.makeNodeTarget(c),"' style='",k.join(""),"'");j.apply(a.view.showTitle,[a.treeId,c],a.view.showTitle)&&d&&b.push("title='",d.replace(/'/g,"'").replace(/</g,"<").replace(/>/g,
|
||||
">"),"'");b.push(">")},makeNodeFontCss:function(b,a){var c=j.apply(b.view.fontCss,[b.treeId,a],b.view.fontCss);return c&&typeof c!="function"?c:{}},makeNodeIcoClass:function(b,a){var c=["ico"];a.isAjaxing||(c[0]=(a.iconSkin?a.iconSkin+"_":"")+c[0],a.isParent?c.push(a.open?f.folder.OPEN:f.folder.CLOSE):c.push(f.folder.DOCU));return f.className.BUTTON+" "+c.join("_")},makeNodeIcoStyle:function(b,a){var c=[];if(!a.isAjaxing){var d=a.isParent&&a.iconOpen&&a.iconClose?a.open?a.iconOpen:a.iconClose:
|
||||
a[b.data.key.icon];d&&c.push("background:url(",d,") 0 0 no-repeat;");(b.view.showIcon==!1||!j.apply(b.view.showIcon,[b.treeId,a],!0))&&c.push("width:0px;height:0px;")}return c.join("")},makeNodeLineClass:function(b,a){var c=[];b.view.showLine?a.level==0&&a.isFirstNode&&a.isLastNode?c.push(f.line.ROOT):a.level==0&&a.isFirstNode?c.push(f.line.ROOTS):a.isLastNode?c.push(f.line.BOTTOM):c.push(f.line.CENTER):c.push(f.line.NOLINE);a.isParent?c.push(a.open?f.folder.OPEN:f.folder.CLOSE):c.push(f.folder.DOCU);
|
||||
return i.makeNodeLineClassEx(a)+c.join("_")},makeNodeLineClassEx:function(b){return f.className.BUTTON+" "+f.className.LEVEL+b.level+" "+f.className.SWITCH+" "},makeNodeTarget:function(b){return b.target||"_blank"},makeNodeUrl:function(b,a){var c=b.data.key.url;return a[c]?a[c]:null},makeUlHtml:function(b,a,c,d){c.push("<ul id='",a.tId,f.id.UL,"' class='",f.className.LEVEL,a.level," ",i.makeUlLineClass(b,a),"' style='display:",a.open?"block":"none","'>");c.push(d);c.push("</ul>")},makeUlLineClass:function(b,
|
||||
a){return b.view.showLine&&!a.isLastNode?f.line.LINE:""},removeChildNodes:function(b,a){if(a){var c=b.data.key.children,d=a[c];if(d){for(var e=0,g=d.length;e<g;e++)h.removeNodeCache(b,d[e]);h.removeSelectedNode(b);delete a[c];b.data.keep.parent?l(a,f.id.UL,b).empty():(a.isParent=!1,a.open=!1,c=l(a,f.id.SWITCH,b),d=l(a,f.id.ICON,b),i.replaceSwitchClass(a,c,f.folder.DOCU),i.replaceIcoClass(a,d,f.folder.DOCU),l(a,f.id.UL,b).remove())}}},scrollIntoView:function(b){if(b){if(!Element.prototype.scrollIntoViewIfNeeded)Element.prototype.scrollIntoViewIfNeeded=
|
||||
function(a){function b(a,d,e,f){return{left:a,top:d,width:e,height:f,right:a+e,bottom:d+f,translate:function(g,k){return b(g+a,k+d,e,f)},relativeFromTo:function(k,h){var i=a,j=d,k=k.offsetParent,h=h.offsetParent;if(k===h)return g;for(;k;k=k.offsetParent)i+=k.offsetLeft+k.clientLeft,j+=k.offsetTop+k.clientTop;for(;h;h=h.offsetParent)i-=h.offsetLeft+h.clientLeft,j-=h.offsetTop+h.clientTop;return b(i,j,e,f)}}}for(var d,e=this,g=b(this.offsetLeft,this.offsetTop,this.offsetWidth,this.offsetHeight);j.isElement(d=
|
||||
e.parentNode);){var f=d.offsetLeft+d.clientLeft,h=d.offsetTop+d.clientTop,g=g.relativeFromTo(e,d).translate(-f,-h);d.scrollLeft=!1===a||g.left<=d.scrollLeft+d.clientWidth&&d.scrollLeft<=g.right-d.clientWidth+d.clientWidth?Math.min(g.left,Math.max(g.right-d.clientWidth,d.scrollLeft)):(g.right-d.clientWidth+g.left)/2;d.scrollTop=!1===a||g.top<=d.scrollTop+d.clientHeight&&d.scrollTop<=g.bottom-d.clientHeight+d.clientHeight?Math.min(g.top,Math.max(g.bottom-d.clientHeight,d.scrollTop)):(g.bottom-d.clientHeight+
|
||||
g.top)/2;g=g.translate(f-d.scrollLeft,h-d.scrollTop);e=d}};b.scrollIntoViewIfNeeded()}},setFirstNode:function(b,a){var c=b.data.key.children;if(a[c].length>0)a[c][0].isFirstNode=!0},setLastNode:function(b,a){var c=b.data.key.children,d=a[c].length;if(d>0)a[c][d-1].isLastNode=!0},removeNode:function(b,a){var c=h.getRoot(b),d=b.data.key.children,e=a.parentTId?a.getParentNode():c;a.isFirstNode=!1;a.isLastNode=!1;a.getPreNode=function(){return null};a.getNextNode=function(){return null};if(h.getNodeCache(b,
|
||||
a.tId)){l(a,b).remove();h.removeNodeCache(b,a);h.removeSelectedNode(b,a);for(var g=0,k=e[d].length;g<k;g++)if(e[d][g].tId==a.tId){e[d].splice(g,1);break}i.setFirstNode(b,e);i.setLastNode(b,e);var j,g=e[d].length;if(!b.data.keep.parent&&g==0)e.isParent=!1,e.open=!1,g=l(e,f.id.UL,b),k=l(e,f.id.SWITCH,b),j=l(e,f.id.ICON,b),i.replaceSwitchClass(e,k,f.folder.DOCU),i.replaceIcoClass(e,j,f.folder.DOCU),g.css("display","none");else if(b.view.showLine&&g>0){var n=e[d][g-1],g=l(n,f.id.UL,b),k=l(n,f.id.SWITCH,
|
||||
b);j=l(n,f.id.ICON,b);e==c?e[d].length==1?i.replaceSwitchClass(n,k,f.line.ROOT):(c=l(e[d][0],f.id.SWITCH,b),i.replaceSwitchClass(e[d][0],c,f.line.ROOTS),i.replaceSwitchClass(n,k,f.line.BOTTOM)):i.replaceSwitchClass(n,k,f.line.BOTTOM);g.removeClass(f.line.LINE)}}},replaceIcoClass:function(b,a,c){if(a&&!b.isAjaxing&&(b=a.attr("class"),b!=void 0)){b=b.split("_");switch(c){case f.folder.OPEN:case f.folder.CLOSE:case f.folder.DOCU:b[b.length-1]=c}a.attr("class",b.join("_"))}},replaceSwitchClass:function(b,
|
||||
a,c){if(a){var d=a.attr("class");if(d!=void 0){d=d.split("_");switch(c){case f.line.ROOT:case f.line.ROOTS:case f.line.CENTER:case f.line.BOTTOM:case f.line.NOLINE:d[0]=i.makeNodeLineClassEx(b)+c;break;case f.folder.OPEN:case f.folder.CLOSE:case f.folder.DOCU:d[1]=c}a.attr("class",d.join("_"));c!==f.folder.DOCU?a.removeAttr("disabled"):a.attr("disabled","disabled")}}},selectNode:function(b,a,c){c||i.cancelPreSelectedNode(b,null,a);l(a,f.id.A,b).addClass(f.node.CURSELECTED);h.addSelectedNode(b,a);
|
||||
b.treeObj.trigger(f.event.SELECTED,[b.treeId,a])},setNodeFontCss:function(b,a){var c=l(a,f.id.A,b),d=i.makeNodeFontCss(b,a);d&&c.css(d)},setNodeLineIcos:function(b,a){if(a){var c=l(a,f.id.SWITCH,b),d=l(a,f.id.UL,b),e=l(a,f.id.ICON,b),g=i.makeUlLineClass(b,a);g.length==0?d.removeClass(f.line.LINE):d.addClass(g);c.attr("class",i.makeNodeLineClass(b,a));a.isParent?c.removeAttr("disabled"):c.attr("disabled","disabled");e.removeAttr("style");e.attr("style",i.makeNodeIcoStyle(b,a));e.attr("class",i.makeNodeIcoClass(b,
|
||||
a))}},setNodeName:function(b,a){var c=h.getNodeTitle(b,a),d=l(a,f.id.SPAN,b);d.empty();b.view.nameIsHTML?d.html(h.getNodeName(b,a)):d.text(h.getNodeName(b,a));j.apply(b.view.showTitle,[b.treeId,a],b.view.showTitle)&&l(a,f.id.A,b).attr("title",!c?"":c)},setNodeTarget:function(b,a){l(a,f.id.A,b).attr("target",i.makeNodeTarget(a))},setNodeUrl:function(b,a){var c=l(a,f.id.A,b),d=i.makeNodeUrl(b,a);d==null||d.length==0?c.removeAttr("href"):c.attr("href",d)},switchNode:function(b,a){a.open||!j.canAsync(b,
|
||||
a)?i.expandCollapseNode(b,a,!a.open):b.async.enable?i.asyncNode(b,a)||i.expandCollapseNode(b,a,!a.open):a&&i.expandCollapseNode(b,a,!a.open)}};r.fn.zTree={consts:{className:{BUTTON:"button",LEVEL:"level",ICO_LOADING:"ico_loading",SWITCH:"switch",NAME:"node_name"},event:{NODECREATED:"ztree_nodeCreated",CLICK:"ztree_click",EXPAND:"ztree_expand",COLLAPSE:"ztree_collapse",ASYNC_SUCCESS:"ztree_async_success",ASYNC_ERROR:"ztree_async_error",REMOVE:"ztree_remove",SELECTED:"ztree_selected",UNSELECTED:"ztree_unselected"},
|
||||
id:{A:"_a",ICON:"_ico",SPAN:"_span",SWITCH:"_switch",UL:"_ul"},line:{ROOT:"root",ROOTS:"roots",CENTER:"center",BOTTOM:"bottom",NOLINE:"noline",LINE:"line"},folder:{OPEN:"open",CLOSE:"close",DOCU:"docu"},node:{CURSELECTED:"curSelectedNode"}},_z:{tools:j,view:i,event:m,data:h},getZTreeObj:function(b){return(b=h.getZTreeTools(b))?b:null},destroy:function(b){if(b&&b.length>0)i.destroy(h.getSetting(b));else for(var a in s)i.destroy(s[a])},init:function(b,a,c){var d=j.clone(O);r.extend(!0,d,a);d.treeId=
|
||||
b.attr("id");d.treeObj=b;d.treeObj.empty();s[d.treeId]=d;if(typeof document.body.style.maxHeight==="undefined")d.view.expandSpeed="";h.initRoot(d);b=h.getRoot(d);a=d.data.key.children;c=c?j.clone(j.isArray(c)?c:[c]):[];b[a]=d.data.simpleData.enable?h.transformTozTreeFormat(d,c):c;h.initCache(d);m.unbindTree(d);m.bindTree(d);m.unbindEvent(d);m.bindEvent(d);var e={setting:d,addNodes:function(a,b,c,e){function f(){i.addNodes(d,a,b,l,e==!0)}a||(a=null);if(a&&!a.isParent&&d.data.keep.leaf)return null;
|
||||
var h=parseInt(b,10);isNaN(h)?(e=!!c,c=b,b=-1):b=h;if(!c)return null;var l=j.clone(j.isArray(c)?c:[c]);j.canAsync(d,a)?i.asyncNode(d,a,e,f):f();return l},cancelSelectedNode:function(a){i.cancelPreSelectedNode(d,a)},destroy:function(){i.destroy(d)},expandAll:function(a){a=!!a;i.expandCollapseSonNode(d,null,a,!0);return a},expandNode:function(a,b,c,e,f){function m(){var b=l(a,d).get(0);b&&e!==!1&&i.scrollIntoView(b)}if(!a||!a.isParent)return null;b!==!0&&b!==!1&&(b=!a.open);if((f=!!f)&&b&&j.apply(d.callback.beforeExpand,
|
||||
[d.treeId,a],!0)==!1)return null;else if(f&&!b&&j.apply(d.callback.beforeCollapse,[d.treeId,a],!0)==!1)return null;b&&a.parentTId&&i.expandCollapseParentNode(d,a.getParentNode(),b,!1);if(b===a.open&&!c)return null;h.getRoot(d).expandTriggerFlag=f;!j.canAsync(d,a)&&c?i.expandCollapseSonNode(d,a,b,!0,m):(a.open=!b,i.switchNode(this.setting,a),m());return b},getNodes:function(){return h.getNodes(d)},getNodeByParam:function(a,b,c){return!a?null:h.getNodeByParam(d,c?c[d.data.key.children]:h.getNodes(d),
|
||||
a,b)},getNodeByTId:function(a){return h.getNodeCache(d,a)},getNodesByParam:function(a,b,c){return!a?null:h.getNodesByParam(d,c?c[d.data.key.children]:h.getNodes(d),a,b)},getNodesByParamFuzzy:function(a,b,c){return!a?null:h.getNodesByParamFuzzy(d,c?c[d.data.key.children]:h.getNodes(d),a,b)},getNodesByFilter:function(a,b,c,e){b=!!b;return!a||typeof a!="function"?b?null:[]:h.getNodesByFilter(d,c?c[d.data.key.children]:h.getNodes(d),a,b,e)},getNodeIndex:function(a){if(!a)return null;for(var b=d.data.key.children,
|
||||
c=a.parentTId?a.getParentNode():h.getRoot(d),e=0,f=c[b].length;e<f;e++)if(c[b][e]==a)return e;return-1},getSelectedNodes:function(){for(var a=[],b=h.getRoot(d).curSelectedList,c=0,e=b.length;c<e;c++)a.push(b[c]);return a},isSelectedNode:function(a){return h.isSelectedNode(d,a)},reAsyncChildNodesPromise:function(a,b,c){return new Promise(function(d,f){try{e.reAsyncChildNodes(a,b,c,function(){d(a)})}catch(h){f(h)}})},reAsyncChildNodes:function(a,b,c,e){if(this.setting.async.enable){var j=!a;j&&(a=h.getRoot(d));
|
||||
if(b=="refresh"){for(var b=this.setting.data.key.children,m=0,r=a[b]?a[b].length:0;m<r;m++)h.removeNodeCache(d,a[b][m]);h.removeSelectedNode(d);a[b]=[];j?this.setting.treeObj.empty():l(a,f.id.UL,d).empty()}i.asyncNode(this.setting,j?null:a,!!c,e)}},refresh:function(){this.setting.treeObj.empty();var a=h.getRoot(d),b=a[d.data.key.children];h.initRoot(d);a[d.data.key.children]=b;h.initCache(d);i.createNodes(d,0,a[d.data.key.children],null,-1)},removeChildNodes:function(a){if(!a)return null;var b=a[d.data.key.children];
|
||||
i.removeChildNodes(d,a);return b?b:null},removeNode:function(a,b){a&&(b=!!b,b&&j.apply(d.callback.beforeRemove,[d.treeId,a],!0)==!1||(i.removeNode(d,a),b&&this.setting.treeObj.trigger(f.event.REMOVE,[d.treeId,a])))},selectNode:function(a,b,c){function e(){if(!c){var b=l(a,d).get(0);i.scrollIntoView(b)}}if(a&&j.uCanDo(d)){b=d.view.selectedMulti&&b;if(a.parentTId)i.expandCollapseParentNode(d,a.getParentNode(),!0,!1,e);else if(!c)try{l(a,d).focus().blur()}catch(f){}i.selectNode(d,a,b)}},transformTozTreeNodes:function(a){return h.transformTozTreeFormat(d,
|
||||
a)},transformToArray:function(a){return h.transformToArrayFormat(d,a)},updateNode:function(a){a&&l(a,d).get(0)&&j.uCanDo(d)&&(i.setNodeName(d,a),i.setNodeTarget(d,a),i.setNodeUrl(d,a),i.setNodeLineIcos(d,a),i.setNodeFontCss(d,a))}};b.treeTools=e;h.setZTreeTools(d,e);b[a]&&b[a].length>0?i.createNodes(d,0,b[a],null,-1):d.async.enable&&d.async.url&&d.async.url!==""&&i.asyncNode(d);return e}};var P=r.fn.zTree,l=j.$,f=P.consts})(jQuery);
|
||||
|
||||
/*
|
||||
* JQuery zTree excheck v3.5.29
|
||||
* http://treejs.cn/
|
||||
*
|
||||
* Copyright (c) 2010 Hunter.z
|
||||
*
|
||||
* Licensed same as jquery - MIT License
|
||||
* http://www.opensource.org/licenses/mit-license.php
|
||||
*
|
||||
* email: hunter.z@263.net
|
||||
* Date: 2017-06-19
|
||||
*/
|
||||
(function(m){var p,q,r,o={event:{CHECK:"ztree_check"},id:{CHECK:"_check"},checkbox:{STYLE:"checkbox",DEFAULT:"chk",DISABLED:"disable",FALSE:"false",TRUE:"true",FULL:"full",PART:"part",FOCUS:"focus"},radio:{STYLE:"radio",TYPE_ALL:"all",TYPE_LEVEL:"level"}},v={check:{enable:!1,autoCheckTrigger:!1,chkStyle:o.checkbox.STYLE,nocheckInherit:!1,chkDisabledInherit:!1,radioType:o.radio.TYPE_LEVEL,chkboxType:{Y:"ps",N:"ps"}},data:{key:{checked:"checked"}},callback:{beforeCheck:null,onCheck:null}};p=function(c,
|
||||
a){if(a.chkDisabled===!0)return!1;var b=g.getSetting(c.data.treeId),d=b.data.key.checked;if(k.apply(b.callback.beforeCheck,[b.treeId,a],!0)==!1)return!0;a[d]=!a[d];e.checkNodeRelation(b,a);d=n(a,j.id.CHECK,b);e.setChkClass(b,d,a);e.repairParentChkClassWithSelf(b,a);b.treeObj.trigger(j.event.CHECK,[c,b.treeId,a]);return!0};q=function(c,a){if(a.chkDisabled===!0)return!1;var b=g.getSetting(c.data.treeId),d=n(a,j.id.CHECK,b);a.check_Focus=!0;e.setChkClass(b,d,a);return!0};r=function(c,a){if(a.chkDisabled===
|
||||
!0)return!1;var b=g.getSetting(c.data.treeId),d=n(a,j.id.CHECK,b);a.check_Focus=!1;e.setChkClass(b,d,a);return!0};m.extend(!0,m.fn.zTree.consts,o);m.extend(!0,m.fn.zTree._z,{tools:{},view:{checkNodeRelation:function(c,a){var b,d,h,i=c.data.key.children,l=c.data.key.checked;b=j.radio;if(c.check.chkStyle==b.STYLE){var f=g.getRadioCheckedList(c);if(a[l])if(c.check.radioType==b.TYPE_ALL){for(d=f.length-1;d>=0;d--)b=f[d],b[l]&&b!=a&&(b[l]=!1,f.splice(d,1),e.setChkClass(c,n(b,j.id.CHECK,c),b),b.parentTId!=
|
||||
a.parentTId&&e.repairParentChkClassWithSelf(c,b));f.push(a)}else{f=a.parentTId?a.getParentNode():g.getRoot(c);for(d=0,h=f[i].length;d<h;d++)b=f[i][d],b[l]&&b!=a&&(b[l]=!1,e.setChkClass(c,n(b,j.id.CHECK,c),b))}else if(c.check.radioType==b.TYPE_ALL)for(d=0,h=f.length;d<h;d++)if(a==f[d]){f.splice(d,1);break}}else a[l]&&(!a[i]||a[i].length==0||c.check.chkboxType.Y.indexOf("s")>-1)&&e.setSonNodeCheckBox(c,a,!0),!a[l]&&(!a[i]||a[i].length==0||c.check.chkboxType.N.indexOf("s")>-1)&&e.setSonNodeCheckBox(c,
|
||||
a,!1),a[l]&&c.check.chkboxType.Y.indexOf("p")>-1&&e.setParentNodeCheckBox(c,a,!0),!a[l]&&c.check.chkboxType.N.indexOf("p")>-1&&e.setParentNodeCheckBox(c,a,!1)},makeChkClass:function(c,a){var b=c.data.key.checked,d=j.checkbox,h=j.radio,i="",i=a.chkDisabled===!0?d.DISABLED:a.halfCheck?d.PART:c.check.chkStyle==h.STYLE?a.check_Child_State<1?d.FULL:d.PART:a[b]?a.check_Child_State===2||a.check_Child_State===-1?d.FULL:d.PART:a.check_Child_State<1?d.FULL:d.PART,b=c.check.chkStyle+"_"+(a[b]?d.TRUE:d.FALSE)+
|
||||
"_"+i,b=a.check_Focus&&a.chkDisabled!==!0?b+"_"+d.FOCUS:b;return j.className.BUTTON+" "+d.DEFAULT+" "+b},repairAllChk:function(c,a){if(c.check.enable&&c.check.chkStyle===j.checkbox.STYLE)for(var b=c.data.key.checked,d=c.data.key.children,h=g.getRoot(c),i=0,l=h[d].length;i<l;i++){var f=h[d][i];f.nocheck!==!0&&f.chkDisabled!==!0&&(f[b]=a);e.setSonNodeCheckBox(c,f,a)}},repairChkClass:function(c,a){if(a&&(g.makeChkFlag(c,a),a.nocheck!==!0)){var b=n(a,j.id.CHECK,c);e.setChkClass(c,b,a)}},repairParentChkClass:function(c,
|
||||
a){if(a&&a.parentTId){var b=a.getParentNode();e.repairChkClass(c,b);e.repairParentChkClass(c,b)}},repairParentChkClassWithSelf:function(c,a){if(a){var b=c.data.key.children;a[b]&&a[b].length>0?e.repairParentChkClass(c,a[b][0]):e.repairParentChkClass(c,a)}},repairSonChkDisabled:function(c,a,b,d){if(a){var h=c.data.key.children;if(a.chkDisabled!=b)a.chkDisabled=b;e.repairChkClass(c,a);if(a[h]&&d)for(var i=0,l=a[h].length;i<l;i++)e.repairSonChkDisabled(c,a[h][i],b,d)}},repairParentChkDisabled:function(c,
|
||||
a,b,d){if(a){if(a.chkDisabled!=b&&d)a.chkDisabled=b;e.repairChkClass(c,a);e.repairParentChkDisabled(c,a.getParentNode(),b,d)}},setChkClass:function(c,a,b){a&&(b.nocheck===!0?a.hide():a.show(),a.attr("class",e.makeChkClass(c,b)))},setParentNodeCheckBox:function(c,a,b,d){var h=c.data.key.children,i=c.data.key.checked,l=n(a,j.id.CHECK,c);d||(d=a);g.makeChkFlag(c,a);a.nocheck!==!0&&a.chkDisabled!==!0&&(a[i]=b,e.setChkClass(c,l,a),c.check.autoCheckTrigger&&a!=d&&c.treeObj.trigger(j.event.CHECK,[null,c.treeId,
|
||||
a]));if(a.parentTId){l=!0;if(!b)for(var h=a.getParentNode()[h],f=0,k=h.length;f<k;f++)if(h[f].nocheck!==!0&&h[f].chkDisabled!==!0&&h[f][i]||(h[f].nocheck===!0||h[f].chkDisabled===!0)&&h[f].check_Child_State>0){l=!1;break}l&&e.setParentNodeCheckBox(c,a.getParentNode(),b,d)}},setSonNodeCheckBox:function(c,a,b,d){if(a){var h=c.data.key.children,i=c.data.key.checked,l=n(a,j.id.CHECK,c);d||(d=a);var f=!1;if(a[h])for(var k=0,m=a[h].length;k<m;k++){var o=a[h][k];e.setSonNodeCheckBox(c,o,b,d);o.chkDisabled===
|
||||
!0&&(f=!0)}if(a!=g.getRoot(c)&&a.chkDisabled!==!0){f&&a.nocheck!==!0&&g.makeChkFlag(c,a);if(a.nocheck!==!0&&a.chkDisabled!==!0){if(a[i]=b,!f)a.check_Child_State=a[h]&&a[h].length>0?b?2:0:-1}else a.check_Child_State=-1;e.setChkClass(c,l,a);c.check.autoCheckTrigger&&a!=d&&a.nocheck!==!0&&a.chkDisabled!==!0&&c.treeObj.trigger(j.event.CHECK,[null,c.treeId,a])}}}},event:{},data:{getRadioCheckedList:function(c){for(var a=g.getRoot(c).radioCheckedList,b=0,d=a.length;b<d;b++)g.getNodeCache(c,a[b].tId)||(a.splice(b,
|
||||
1),b--,d--);return a},getCheckStatus:function(c,a){if(!c.check.enable||a.nocheck||a.chkDisabled)return null;var b=c.data.key.checked;return{checked:a[b],half:a.halfCheck?a.halfCheck:c.check.chkStyle==j.radio.STYLE?a.check_Child_State===2:a[b]?a.check_Child_State>-1&&a.check_Child_State<2:a.check_Child_State>0}},getTreeCheckedNodes:function(c,a,b,d){if(!a)return[];for(var h=c.data.key.children,i=c.data.key.checked,e=b&&c.check.chkStyle==j.radio.STYLE&&c.check.radioType==j.radio.TYPE_ALL,d=!d?[]:d,
|
||||
f=0,k=a.length;f<k;f++){if(a[f].nocheck!==!0&&a[f].chkDisabled!==!0&&a[f][i]==b&&(d.push(a[f]),e))break;g.getTreeCheckedNodes(c,a[f][h],b,d);if(e&&d.length>0)break}return d},getTreeChangeCheckedNodes:function(c,a,b){if(!a)return[];for(var d=c.data.key.children,h=c.data.key.checked,b=!b?[]:b,i=0,e=a.length;i<e;i++)a[i].nocheck!==!0&&a[i].chkDisabled!==!0&&a[i][h]!=a[i].checkedOld&&b.push(a[i]),g.getTreeChangeCheckedNodes(c,a[i][d],b);return b},makeChkFlag:function(c,a){if(a){var b=c.data.key.children,
|
||||
d=c.data.key.checked,h=-1;if(a[b])for(var i=0,e=a[b].length;i<e;i++){var f=a[b][i],g=-1;if(c.check.chkStyle==j.radio.STYLE)if(g=f.nocheck===!0||f.chkDisabled===!0?f.check_Child_State:f.halfCheck===!0?2:f[d]?2:f.check_Child_State>0?2:0,g==2){h=2;break}else g==0&&(h=0);else if(c.check.chkStyle==j.checkbox.STYLE)if(g=f.nocheck===!0||f.chkDisabled===!0?f.check_Child_State:f.halfCheck===!0?1:f[d]?f.check_Child_State===-1||f.check_Child_State===2?2:1:f.check_Child_State>0?1:0,g===1){h=1;break}else if(g===
|
||||
2&&h>-1&&i>0&&g!==h){h=1;break}else if(h===2&&g>-1&&g<2){h=1;break}else g>-1&&(h=g)}a.check_Child_State=h}}}});var m=m.fn.zTree,k=m._z.tools,j=m.consts,e=m._z.view,g=m._z.data,n=k.$;g.exSetting(v);g.addInitBind(function(c){c.treeObj.bind(j.event.CHECK,function(a,b,d,h){a.srcEvent=b;k.apply(c.callback.onCheck,[a,d,h])})});g.addInitUnBind(function(c){c.treeObj.unbind(j.event.CHECK)});g.addInitCache(function(){});g.addInitNode(function(c,a,b,d){if(b){a=c.data.key.checked;typeof b[a]=="string"&&(b[a]=
|
||||
k.eqs(b[a],"true"));b[a]=!!b[a];b.checkedOld=b[a];if(typeof b.nocheck=="string")b.nocheck=k.eqs(b.nocheck,"true");b.nocheck=!!b.nocheck||c.check.nocheckInherit&&d&&!!d.nocheck;if(typeof b.chkDisabled=="string")b.chkDisabled=k.eqs(b.chkDisabled,"true");b.chkDisabled=!!b.chkDisabled||c.check.chkDisabledInherit&&d&&!!d.chkDisabled;if(typeof b.halfCheck=="string")b.halfCheck=k.eqs(b.halfCheck,"true");b.halfCheck=!!b.halfCheck;b.check_Child_State=-1;b.check_Focus=!1;b.getCheckStatus=function(){return g.getCheckStatus(c,
|
||||
b)};c.check.chkStyle==j.radio.STYLE&&c.check.radioType==j.radio.TYPE_ALL&&b[a]&&g.getRoot(c).radioCheckedList.push(b)}});g.addInitProxy(function(c){var a=c.target,b=g.getSetting(c.data.treeId),d="",h=null,e="",l=null;if(k.eqs(c.type,"mouseover")){if(b.check.enable&&k.eqs(a.tagName,"span")&&a.getAttribute("treeNode"+j.id.CHECK)!==null)d=k.getNodeMainDom(a).id,e="mouseoverCheck"}else if(k.eqs(c.type,"mouseout")){if(b.check.enable&&k.eqs(a.tagName,"span")&&a.getAttribute("treeNode"+j.id.CHECK)!==null)d=
|
||||
k.getNodeMainDom(a).id,e="mouseoutCheck"}else if(k.eqs(c.type,"click")&&b.check.enable&&k.eqs(a.tagName,"span")&&a.getAttribute("treeNode"+j.id.CHECK)!==null)d=k.getNodeMainDom(a).id,e="checkNode";if(d.length>0)switch(h=g.getNodeCache(b,d),e){case "checkNode":l=p;break;case "mouseoverCheck":l=q;break;case "mouseoutCheck":l=r}return{stop:e==="checkNode",node:h,nodeEventType:e,nodeEventCallback:l,treeEventType:"",treeEventCallback:null}},!0);g.addInitRoot(function(c){g.getRoot(c).radioCheckedList=[]});
|
||||
g.addBeforeA(function(c,a,b){c.check.enable&&(g.makeChkFlag(c,a),b.push("<span ID='",a.tId,j.id.CHECK,"' class='",e.makeChkClass(c,a),"' treeNode",j.id.CHECK,a.nocheck===!0?" style='display:none;'":"","></span>"))});g.addZTreeTools(function(c,a){a.checkNode=function(a,b,c,g){var f=this.setting.data.key.checked;if(a.chkDisabled!==!0&&(b!==!0&&b!==!1&&(b=!a[f]),g=!!g,(a[f]!==b||c)&&!(g&&k.apply(this.setting.callback.beforeCheck,[this.setting.treeId,a],!0)==!1)&&k.uCanDo(this.setting)&&this.setting.check.enable&&
|
||||
a.nocheck!==!0))a[f]=b,b=n(a,j.id.CHECK,this.setting),(c||this.setting.check.chkStyle===j.radio.STYLE)&&e.checkNodeRelation(this.setting,a),e.setChkClass(this.setting,b,a),e.repairParentChkClassWithSelf(this.setting,a),g&&this.setting.treeObj.trigger(j.event.CHECK,[null,this.setting.treeId,a])};a.checkAllNodes=function(a){e.repairAllChk(this.setting,!!a)};a.getCheckedNodes=function(a){var b=this.setting.data.key.children;return g.getTreeCheckedNodes(this.setting,g.getRoot(this.setting)[b],a!==!1)};
|
||||
a.getChangeCheckedNodes=function(){var a=this.setting.data.key.children;return g.getTreeChangeCheckedNodes(this.setting,g.getRoot(this.setting)[a])};a.setChkDisabled=function(a,b,c,g){b=!!b;c=!!c;e.repairSonChkDisabled(this.setting,a,b,!!g);e.repairParentChkDisabled(this.setting,a.getParentNode(),b,c)};var b=a.updateNode;a.updateNode=function(c,g){b&&b.apply(a,arguments);if(c&&this.setting.check.enable&&n(c,this.setting).get(0)&&k.uCanDo(this.setting)){var i=n(c,j.id.CHECK,this.setting);(g==!0||this.setting.check.chkStyle===
|
||||
j.radio.STYLE)&&e.checkNodeRelation(this.setting,c);e.setChkClass(this.setting,i,c);e.repairParentChkClassWithSelf(this.setting,c)}}});var s=e.createNodes;e.createNodes=function(c,a,b,d,g){s&&s.apply(e,arguments);b&&e.repairParentChkClassWithSelf(c,d)};var t=e.removeNode;e.removeNode=function(c,a){var b=a.getParentNode();t&&t.apply(e,arguments);a&&b&&(e.repairChkClass(c,b),e.repairParentChkClass(c,b))};var u=e.appendNodes;e.appendNodes=function(c,a,b,d,h,i,j){var f="";u&&(f=u.apply(e,arguments));
|
||||
d&&g.makeChkFlag(c,d);return f}})(jQuery);
|
||||
|
||||
/*
|
||||
* JQuery zTree exedit v3.5.29
|
||||
* http://treejs.cn/
|
||||
*
|
||||
* Copyright (c) 2010 Hunter.z
|
||||
*
|
||||
* Licensed same as jquery - MIT License
|
||||
* http://www.opensource.org/licenses/mit-license.php
|
||||
*
|
||||
* email: hunter.z@263.net
|
||||
* Date: 2017-06-19
|
||||
*/
|
||||
(function(v){var J={event:{DRAG:"ztree_drag",DROP:"ztree_drop",RENAME:"ztree_rename",DRAGMOVE:"ztree_dragmove"},id:{EDIT:"_edit",INPUT:"_input",REMOVE:"_remove"},move:{TYPE_INNER:"inner",TYPE_PREV:"prev",TYPE_NEXT:"next"},node:{CURSELECTED_EDIT:"curSelectedNode_Edit",TMPTARGET_TREE:"tmpTargetzTree",TMPTARGET_NODE:"tmpTargetNode"}},x={onHoverOverNode:function(b,a){var c=m.getSetting(b.data.treeId),d=m.getRoot(c);if(d.curHoverNode!=a)x.onHoverOutNode(b);d.curHoverNode=a;f.addHoverDom(c,a)},onHoverOutNode:function(b){var b=
|
||||
m.getSetting(b.data.treeId),a=m.getRoot(b);if(a.curHoverNode&&!m.isSelectedNode(b,a.curHoverNode))f.removeTreeDom(b,a.curHoverNode),a.curHoverNode=null},onMousedownNode:function(b,a){function c(b){if(B.dragFlag==0&&Math.abs(O-b.clientX)<e.edit.drag.minMoveSize&&Math.abs(P-b.clientY)<e.edit.drag.minMoveSize)return!0;var a,c,n,k,i;i=e.data.key.children;M.css("cursor","pointer");if(B.dragFlag==0){if(g.apply(e.callback.beforeDrag,[e.treeId,l],!0)==!1)return r(b),!0;for(a=0,c=l.length;a<c;a++){if(a==0)B.dragNodeShowBefore=
|
||||
[];n=l[a];n.isParent&&n.open?(f.expandCollapseNode(e,n,!n.open),B.dragNodeShowBefore[n.tId]=!0):B.dragNodeShowBefore[n.tId]=!1}B.dragFlag=1;t.showHoverDom=!1;g.showIfameMask(e,!0);n=!0;k=-1;if(l.length>1){var j=l[0].parentTId?l[0].getParentNode()[i]:m.getNodes(e);i=[];for(a=0,c=j.length;a<c;a++)if(B.dragNodeShowBefore[j[a].tId]!==void 0&&(n&&k>-1&&k+1!==a&&(n=!1),i.push(j[a]),k=a),l.length===i.length){l=i;break}}n&&(I=l[0].getPreNode(),R=l[l.length-1].getNextNode());D=o("<ul class='zTreeDragUL'></ul>",
|
||||
e);for(a=0,c=l.length;a<c;a++)n=l[a],n.editNameFlag=!1,f.selectNode(e,n,a>0),f.removeTreeDom(e,n),a>e.edit.drag.maxShowNodeNum-1||(k=o("<li id='"+n.tId+"_tmp'></li>",e),k.append(o(n,d.id.A,e).clone()),k.css("padding","0"),k.children("#"+n.tId+d.id.A).removeClass(d.node.CURSELECTED),D.append(k),a==e.edit.drag.maxShowNodeNum-1&&(k=o("<li id='"+n.tId+"_moretmp'><a> ... </a></li>",e),D.append(k)));D.attr("id",l[0].tId+d.id.UL+"_tmp");D.addClass(e.treeObj.attr("class"));D.appendTo(M);A=o("<span class='tmpzTreeMove_arrow'></span>",
|
||||
e);A.attr("id","zTreeMove_arrow_tmp");A.appendTo(M);e.treeObj.trigger(d.event.DRAG,[b,e.treeId,l])}if(B.dragFlag==1){s&&A.attr("id")==b.target.id&&u&&b.clientX+G.scrollLeft()+2>v("#"+u+d.id.A,s).offset().left?(n=v("#"+u+d.id.A,s),b.target=n.length>0?n.get(0):b.target):s&&(s.removeClass(d.node.TMPTARGET_TREE),u&&v("#"+u+d.id.A,s).removeClass(d.node.TMPTARGET_NODE+"_"+d.move.TYPE_PREV).removeClass(d.node.TMPTARGET_NODE+"_"+J.move.TYPE_NEXT).removeClass(d.node.TMPTARGET_NODE+"_"+J.move.TYPE_INNER));
|
||||
u=s=null;K=!1;h=e;n=m.getSettings();for(var y in n)if(n[y].treeId&&n[y].edit.enable&&n[y].treeId!=e.treeId&&(b.target.id==n[y].treeId||v(b.target).parents("#"+n[y].treeId).length>0))K=!0,h=n[y];y=G.scrollTop();k=G.scrollLeft();i=h.treeObj.offset();a=h.treeObj.get(0).scrollHeight;n=h.treeObj.get(0).scrollWidth;c=b.clientY+y-i.top;var p=h.treeObj.height()+i.top-b.clientY-y,q=b.clientX+k-i.left,H=h.treeObj.width()+i.left-b.clientX-k;i=c<e.edit.drag.borderMax&&c>e.edit.drag.borderMin;var j=p<e.edit.drag.borderMax&&
|
||||
p>e.edit.drag.borderMin,F=q<e.edit.drag.borderMax&&q>e.edit.drag.borderMin,x=H<e.edit.drag.borderMax&&H>e.edit.drag.borderMin,p=c>e.edit.drag.borderMin&&p>e.edit.drag.borderMin&&q>e.edit.drag.borderMin&&H>e.edit.drag.borderMin,q=i&&h.treeObj.scrollTop()<=0,H=j&&h.treeObj.scrollTop()+h.treeObj.height()+10>=a,N=F&&h.treeObj.scrollLeft()<=0,Q=x&&h.treeObj.scrollLeft()+h.treeObj.width()+10>=n;if(b.target&&g.isChildOrSelf(b.target,h.treeId)){for(var E=b.target;E&&E.tagName&&!g.eqs(E.tagName,"li")&&E.id!=
|
||||
h.treeId;)E=E.parentNode;var S=!0;for(a=0,c=l.length;a<c;a++)if(n=l[a],E.id===n.tId){S=!1;break}else if(o(n,e).find("#"+E.id).length>0){S=!1;break}if(S&&b.target&&g.isChildOrSelf(b.target,E.id+d.id.A))s=v(E),u=E.id}n=l[0];if(p&&g.isChildOrSelf(b.target,h.treeId)){if(!s&&(b.target.id==h.treeId||q||H||N||Q)&&(K||!K&&n.parentTId))s=h.treeObj;i?h.treeObj.scrollTop(h.treeObj.scrollTop()-10):j&&h.treeObj.scrollTop(h.treeObj.scrollTop()+10);F?h.treeObj.scrollLeft(h.treeObj.scrollLeft()-10):x&&h.treeObj.scrollLeft(h.treeObj.scrollLeft()+
|
||||
10);s&&s!=h.treeObj&&s.offset().left<h.treeObj.offset().left&&h.treeObj.scrollLeft(h.treeObj.scrollLeft()+s.offset().left-h.treeObj.offset().left)}D.css({top:b.clientY+y+3+"px",left:b.clientX+k+3+"px"});c=a=0;if(s&&s.attr("id")!=h.treeId){var z=u==null?null:m.getNodeCache(h,u);i=(b.ctrlKey||b.metaKey)&&e.edit.drag.isMove&&e.edit.drag.isCopy||!e.edit.drag.isMove&&e.edit.drag.isCopy;k=!!(I&&u===I.tId);F=!!(R&&u===R.tId);j=n.parentTId&&n.parentTId==u;n=(i||!F)&&g.apply(h.edit.drag.prev,[h.treeId,l,z],
|
||||
!!h.edit.drag.prev);k=(i||!k)&&g.apply(h.edit.drag.next,[h.treeId,l,z],!!h.edit.drag.next);i=(i||!j)&&!(h.data.keep.leaf&&!z.isParent)&&g.apply(h.edit.drag.inner,[h.treeId,l,z],!!h.edit.drag.inner);j=function(){s=null;u="";w=d.move.TYPE_INNER;A.css({display:"none"});if(window.zTreeMoveTimer)clearTimeout(window.zTreeMoveTimer),window.zTreeMoveTargetNodeTId=null};if(!n&&!k&&!i)j();else if(F=v("#"+u+d.id.A,s),x=z.isLastNode?null:v("#"+z.getNextNode().tId+d.id.A,s.next()),p=F.offset().top,q=F.offset().left,
|
||||
H=n?i?0.25:k?0.5:1:-1,N=k?i?0.75:n?0.5:0:-1,y=(b.clientY+y-p)/F.height(),(H==1||y<=H&&y>=-0.2)&&n?(a=1-A.width(),c=p-A.height()/2,w=d.move.TYPE_PREV):(N==0||y>=N&&y<=1.2)&&k?(a=1-A.width(),c=x==null||z.isParent&&z.open?p+F.height()-A.height()/2:x.offset().top-A.height()/2,w=d.move.TYPE_NEXT):i?(a=5-A.width(),c=p,w=d.move.TYPE_INNER):j(),s){A.css({display:"block",top:c+"px",left:q+a+"px"});F.addClass(d.node.TMPTARGET_NODE+"_"+w);if(T!=u||U!=w)L=(new Date).getTime();if(z&&z.isParent&&w==d.move.TYPE_INNER&&
|
||||
(y=!0,window.zTreeMoveTimer&&window.zTreeMoveTargetNodeTId!==z.tId?(clearTimeout(window.zTreeMoveTimer),window.zTreeMoveTargetNodeTId=null):window.zTreeMoveTimer&&window.zTreeMoveTargetNodeTId===z.tId&&(y=!1),y))window.zTreeMoveTimer=setTimeout(function(){w==d.move.TYPE_INNER&&z&&z.isParent&&!z.open&&(new Date).getTime()-L>h.edit.drag.autoOpenTime&&g.apply(h.callback.beforeDragOpen,[h.treeId,z],!0)&&(f.switchNode(h,z),h.edit.drag.autoExpandTrigger&&h.treeObj.trigger(d.event.EXPAND,[h.treeId,z]))},
|
||||
h.edit.drag.autoOpenTime+50),window.zTreeMoveTargetNodeTId=z.tId}}else if(w=d.move.TYPE_INNER,s&&g.apply(h.edit.drag.inner,[h.treeId,l,null],!!h.edit.drag.inner)?s.addClass(d.node.TMPTARGET_TREE):s=null,A.css({display:"none"}),window.zTreeMoveTimer)clearTimeout(window.zTreeMoveTimer),window.zTreeMoveTargetNodeTId=null;T=u;U=w;e.treeObj.trigger(d.event.DRAGMOVE,[b,e.treeId,l])}return!1}function r(b){if(window.zTreeMoveTimer)clearTimeout(window.zTreeMoveTimer),window.zTreeMoveTargetNodeTId=null;U=T=
|
||||
null;G.unbind("mousemove",c);G.unbind("mouseup",r);G.unbind("selectstart",k);M.css("cursor","");s&&(s.removeClass(d.node.TMPTARGET_TREE),u&&v("#"+u+d.id.A,s).removeClass(d.node.TMPTARGET_NODE+"_"+d.move.TYPE_PREV).removeClass(d.node.TMPTARGET_NODE+"_"+J.move.TYPE_NEXT).removeClass(d.node.TMPTARGET_NODE+"_"+J.move.TYPE_INNER));g.showIfameMask(e,!1);t.showHoverDom=!0;if(B.dragFlag!=0){B.dragFlag=0;var a,i,j;for(a=0,i=l.length;a<i;a++)j=l[a],j.isParent&&B.dragNodeShowBefore[j.tId]&&!j.open&&(f.expandCollapseNode(e,
|
||||
j,!j.open),delete B.dragNodeShowBefore[j.tId]);D&&D.remove();A&&A.remove();var p=(b.ctrlKey||b.metaKey)&&e.edit.drag.isMove&&e.edit.drag.isCopy||!e.edit.drag.isMove&&e.edit.drag.isCopy;!p&&s&&u&&l[0].parentTId&&u==l[0].parentTId&&w==d.move.TYPE_INNER&&(s=null);if(s){var q=u==null?null:m.getNodeCache(h,u);if(g.apply(e.callback.beforeDrop,[h.treeId,l,q,w,p],!0)==!1)f.selectNodes(x,l);else{var C=p?g.clone(l):l;a=function(){if(K){if(!p)for(var a=0,c=l.length;a<c;a++)f.removeNode(e,l[a]);w==d.move.TYPE_INNER?
|
||||
f.addNodes(h,q,-1,C):f.addNodes(h,q.getParentNode(),w==d.move.TYPE_PREV?q.getIndex():q.getIndex()+1,C)}else if(p&&w==d.move.TYPE_INNER)f.addNodes(h,q,-1,C);else if(p)f.addNodes(h,q.getParentNode(),w==d.move.TYPE_PREV?q.getIndex():q.getIndex()+1,C);else if(w!=d.move.TYPE_NEXT)for(a=0,c=C.length;a<c;a++)f.moveNode(h,q,C[a],w,!1);else for(a=-1,c=C.length-1;a<c;c--)f.moveNode(h,q,C[c],w,!1);f.selectNodes(h,C);a=o(C[0],e).get(0);f.scrollIntoView(a);e.treeObj.trigger(d.event.DROP,[b,h.treeId,C,q,w,p])};
|
||||
w==d.move.TYPE_INNER&&g.canAsync(h,q)?f.asyncNode(h,q,!1,a):a()}}else f.selectNodes(x,l),e.treeObj.trigger(d.event.DROP,[b,e.treeId,l,null,null,null])}}function k(){return!1}var i,j,e=m.getSetting(b.data.treeId),B=m.getRoot(e),t=m.getRoots();if(b.button==2||!e.edit.enable||!e.edit.drag.isCopy&&!e.edit.drag.isMove)return!0;var p=b.target,q=m.getRoot(e).curSelectedList,l=[];if(m.isSelectedNode(e,a))for(i=0,j=q.length;i<j;i++){if(q[i].editNameFlag&&g.eqs(p.tagName,"input")&&p.getAttribute("treeNode"+
|
||||
d.id.INPUT)!==null)return!0;l.push(q[i]);if(l[0].parentTId!==q[i].parentTId){l=[a];break}}else l=[a];f.editNodeBlur=!0;f.cancelCurEditNode(e);var G=v(e.treeObj.get(0).ownerDocument),M=v(e.treeObj.get(0).ownerDocument.body),D,A,s,K=!1,h=e,x=e,I,R,T=null,U=null,u=null,w=d.move.TYPE_INNER,O=b.clientX,P=b.clientY,L=(new Date).getTime();g.uCanDo(e)&&G.bind("mousemove",c);G.bind("mouseup",r);G.bind("selectstart",k);b.preventDefault&&b.preventDefault();return!0}};v.extend(!0,v.fn.zTree.consts,J);v.extend(!0,
|
||||
v.fn.zTree._z,{tools:{getAbs:function(b){b=b.getBoundingClientRect();return[b.left+(document.body.scrollLeft+document.documentElement.scrollLeft),b.top+(document.body.scrollTop+document.documentElement.scrollTop)]},inputFocus:function(b){b.get(0)&&(b.focus(),g.setCursorPosition(b.get(0),b.val().length))},inputSelect:function(b){b.get(0)&&(b.focus(),b.select())},setCursorPosition:function(b,a){if(b.setSelectionRange)b.focus(),b.setSelectionRange(a,a);else if(b.createTextRange){var c=b.createTextRange();
|
||||
c.collapse(!0);c.moveEnd("character",a);c.moveStart("character",a);c.select()}},showIfameMask:function(b,a){for(var c=m.getRoot(b);c.dragMaskList.length>0;)c.dragMaskList[0].remove(),c.dragMaskList.shift();if(a)for(var d=o("iframe",b),f=0,i=d.length;f<i;f++){var j=d.get(f),e=g.getAbs(j),j=o("<div id='zTreeMask_"+f+"' class='zTreeMask' style='top:"+e[1]+"px; left:"+e[0]+"px; width:"+j.offsetWidth+"px; height:"+j.offsetHeight+"px;'></div>",b);j.appendTo(o("body",b));c.dragMaskList.push(j)}}},view:{addEditBtn:function(b,
|
||||
a){if(!(a.editNameFlag||o(a,d.id.EDIT,b).length>0)&&g.apply(b.edit.showRenameBtn,[b.treeId,a],b.edit.showRenameBtn)){var c=o(a,d.id.A,b),r="<span class='"+d.className.BUTTON+" edit' id='"+a.tId+d.id.EDIT+"' title='"+g.apply(b.edit.renameTitle,[b.treeId,a],b.edit.renameTitle)+"' treeNode"+d.id.EDIT+" style='display:none;'></span>";c.append(r);o(a,d.id.EDIT,b).bind("click",function(){if(!g.uCanDo(b)||g.apply(b.callback.beforeEditName,[b.treeId,a],!0)==!1)return!1;f.editNode(b,a);return!1}).show()}},
|
||||
addRemoveBtn:function(b,a){if(!(a.editNameFlag||o(a,d.id.REMOVE,b).length>0)&&g.apply(b.edit.showRemoveBtn,[b.treeId,a],b.edit.showRemoveBtn)){var c=o(a,d.id.A,b),r="<span class='"+d.className.BUTTON+" remove' id='"+a.tId+d.id.REMOVE+"' title='"+g.apply(b.edit.removeTitle,[b.treeId,a],b.edit.removeTitle)+"' treeNode"+d.id.REMOVE+" style='display:none;'></span>";c.append(r);o(a,d.id.REMOVE,b).bind("click",function(){if(!g.uCanDo(b)||g.apply(b.callback.beforeRemove,[b.treeId,a],!0)==!1)return!1;f.removeNode(b,
|
||||
a);b.treeObj.trigger(d.event.REMOVE,[b.treeId,a]);return!1}).bind("mousedown",function(){return!0}).show()}},addHoverDom:function(b,a){if(m.getRoots().showHoverDom)a.isHover=!0,b.edit.enable&&(f.addEditBtn(b,a),f.addRemoveBtn(b,a)),g.apply(b.view.addHoverDom,[b.treeId,a])},cancelCurEditNode:function(b,a,c){var r=m.getRoot(b),k=b.data.key.name,i=r.curEditNode;if(i){var j=r.curEditInput,a=a?a:c?i[k]:j.val();if(g.apply(b.callback.beforeRename,[b.treeId,i,a,c],!0)===!1)return!1;i[k]=a;o(i,d.id.A,b).removeClass(d.node.CURSELECTED_EDIT);
|
||||
j.unbind();f.setNodeName(b,i);i.editNameFlag=!1;r.curEditNode=null;r.curEditInput=null;f.selectNode(b,i,!1);b.treeObj.trigger(d.event.RENAME,[b.treeId,i,c])}return r.noSelection=!0},editNode:function(b,a){var c=m.getRoot(b);f.editNodeBlur=!1;if(m.isSelectedNode(b,a)&&c.curEditNode==a&&a.editNameFlag)setTimeout(function(){g.inputFocus(c.curEditInput)},0);else{var r=b.data.key.name;a.editNameFlag=!0;f.removeTreeDom(b,a);f.cancelCurEditNode(b);f.selectNode(b,a,!1);o(a,d.id.SPAN,b).html("<input type=text class='rename' id='"+
|
||||
a.tId+d.id.INPUT+"' treeNode"+d.id.INPUT+" >");var k=o(a,d.id.INPUT,b);k.attr("value",a[r]);b.edit.editNameSelectAll?g.inputSelect(k):g.inputFocus(k);k.bind("blur",function(){f.editNodeBlur||f.cancelCurEditNode(b)}).bind("keydown",function(a){a.keyCode=="13"?(f.editNodeBlur=!0,f.cancelCurEditNode(b)):a.keyCode=="27"&&f.cancelCurEditNode(b,null,!0)}).bind("click",function(){return!1}).bind("dblclick",function(){return!1});o(a,d.id.A,b).addClass(d.node.CURSELECTED_EDIT);c.curEditInput=k;c.noSelection=
|
||||
!1;c.curEditNode=a}},moveNode:function(b,a,c,r,k,i){var j=m.getRoot(b),e=b.data.key.children;if(a!=c&&(!b.data.keep.leaf||!a||a.isParent||r!=d.move.TYPE_INNER)){var g=c.parentTId?c.getParentNode():j,t=a===null||a==j;t&&a===null&&(a=j);if(t)r=d.move.TYPE_INNER;j=a.parentTId?a.getParentNode():j;if(r!=d.move.TYPE_PREV&&r!=d.move.TYPE_NEXT)r=d.move.TYPE_INNER;if(r==d.move.TYPE_INNER)if(t)c.parentTId=null;else{if(!a.isParent)a.isParent=!0,a.open=!!a.open,f.setNodeLineIcos(b,a);c.parentTId=a.tId}var p;
|
||||
t?p=t=b.treeObj:(!i&&r==d.move.TYPE_INNER?f.expandCollapseNode(b,a,!0,!1):i||f.expandCollapseNode(b,a.getParentNode(),!0,!1),t=o(a,b),p=o(a,d.id.UL,b),t.get(0)&&!p.get(0)&&(p=[],f.makeUlHtml(b,a,p,""),t.append(p.join(""))),p=o(a,d.id.UL,b));var q=o(c,b);q.get(0)?t.get(0)||q.remove():q=f.appendNodes(b,c.level,[c],null,-1,!1,!0).join("");p.get(0)&&r==d.move.TYPE_INNER?p.append(q):t.get(0)&&r==d.move.TYPE_PREV?t.before(q):t.get(0)&&r==d.move.TYPE_NEXT&&t.after(q);var l=-1,v=0,x=null,t=null,D=c.level;
|
||||
if(c.isFirstNode){if(l=0,g[e].length>1)x=g[e][1],x.isFirstNode=!0}else if(c.isLastNode)l=g[e].length-1,x=g[e][l-1],x.isLastNode=!0;else for(p=0,q=g[e].length;p<q;p++)if(g[e][p].tId==c.tId){l=p;break}l>=0&&g[e].splice(l,1);if(r!=d.move.TYPE_INNER)for(p=0,q=j[e].length;p<q;p++)j[e][p].tId==a.tId&&(v=p);if(r==d.move.TYPE_INNER){a[e]||(a[e]=[]);if(a[e].length>0)t=a[e][a[e].length-1],t.isLastNode=!1;a[e].splice(a[e].length,0,c);c.isLastNode=!0;c.isFirstNode=a[e].length==1}else a.isFirstNode&&r==d.move.TYPE_PREV?
|
||||
(j[e].splice(v,0,c),t=a,t.isFirstNode=!1,c.parentTId=a.parentTId,c.isFirstNode=!0,c.isLastNode=!1):a.isLastNode&&r==d.move.TYPE_NEXT?(j[e].splice(v+1,0,c),t=a,t.isLastNode=!1,c.parentTId=a.parentTId,c.isFirstNode=!1,c.isLastNode=!0):(r==d.move.TYPE_PREV?j[e].splice(v,0,c):j[e].splice(v+1,0,c),c.parentTId=a.parentTId,c.isFirstNode=!1,c.isLastNode=!1);m.fixPIdKeyValue(b,c);m.setSonNodeLevel(b,c.getParentNode(),c);f.setNodeLineIcos(b,c);f.repairNodeLevelClass(b,c,D);!b.data.keep.parent&&g[e].length<
|
||||
1?(g.isParent=!1,g.open=!1,a=o(g,d.id.UL,b),r=o(g,d.id.SWITCH,b),e=o(g,d.id.ICON,b),f.replaceSwitchClass(g,r,d.folder.DOCU),f.replaceIcoClass(g,e,d.folder.DOCU),a.css("display","none")):x&&f.setNodeLineIcos(b,x);t&&f.setNodeLineIcos(b,t);b.check&&b.check.enable&&f.repairChkClass&&(f.repairChkClass(b,g),f.repairParentChkClassWithSelf(b,g),g!=c.parent&&f.repairParentChkClassWithSelf(b,c));i||f.expandCollapseParentNode(b,c.getParentNode(),!0,k)}},removeEditBtn:function(b,a){o(a,d.id.EDIT,b).unbind().remove()},
|
||||
removeRemoveBtn:function(b,a){o(a,d.id.REMOVE,b).unbind().remove()},removeTreeDom:function(b,a){a.isHover=!1;f.removeEditBtn(b,a);f.removeRemoveBtn(b,a);g.apply(b.view.removeHoverDom,[b.treeId,a])},repairNodeLevelClass:function(b,a,c){if(c!==a.level){var f=o(a,b),g=o(a,d.id.A,b),b=o(a,d.id.UL,b),c=d.className.LEVEL+c,a=d.className.LEVEL+a.level;f.removeClass(c);f.addClass(a);g.removeClass(c);g.addClass(a);b.removeClass(c);b.addClass(a)}},selectNodes:function(b,a){for(var c=0,d=a.length;c<d;c++)f.selectNode(b,
|
||||
a[c],c>0)}},event:{},data:{setSonNodeLevel:function(b,a,c){if(c){var d=b.data.key.children;c.level=a?a.level+1:0;if(c[d])for(var a=0,f=c[d].length;a<f;a++)c[d][a]&&m.setSonNodeLevel(b,c,c[d][a])}}}});var I=v.fn.zTree,g=I._z.tools,d=I.consts,f=I._z.view,m=I._z.data,o=g.$;m.exSetting({edit:{enable:!1,editNameSelectAll:!1,showRemoveBtn:!0,showRenameBtn:!0,removeTitle:"remove",renameTitle:"rename",drag:{autoExpandTrigger:!1,isCopy:!0,isMove:!0,prev:!0,next:!0,inner:!0,minMoveSize:5,borderMax:10,borderMin:-5,
|
||||
maxShowNodeNum:5,autoOpenTime:500}},view:{addHoverDom:null,removeHoverDom:null},callback:{beforeDrag:null,beforeDragOpen:null,beforeDrop:null,beforeEditName:null,beforeRename:null,onDrag:null,onDragMove:null,onDrop:null,onRename:null}});m.addInitBind(function(b){var a=b.treeObj,c=d.event;a.bind(c.RENAME,function(a,c,d,f){g.apply(b.callback.onRename,[a,c,d,f])});a.bind(c.DRAG,function(a,c,d,f){g.apply(b.callback.onDrag,[c,d,f])});a.bind(c.DRAGMOVE,function(a,c,d,f){g.apply(b.callback.onDragMove,[c,
|
||||
d,f])});a.bind(c.DROP,function(a,c,d,f,e,m,o){g.apply(b.callback.onDrop,[c,d,f,e,m,o])})});m.addInitUnBind(function(b){var b=b.treeObj,a=d.event;b.unbind(a.RENAME);b.unbind(a.DRAG);b.unbind(a.DRAGMOVE);b.unbind(a.DROP)});m.addInitCache(function(){});m.addInitNode(function(b,a,c){if(c)c.isHover=!1,c.editNameFlag=!1});m.addInitProxy(function(b){var a=b.target,c=m.getSetting(b.data.treeId),f=b.relatedTarget,k="",i=null,j="",e=null,o=null;if(g.eqs(b.type,"mouseover")){if(o=g.getMDom(c,a,[{tagName:"a",
|
||||
attrName:"treeNode"+d.id.A}]))k=g.getNodeMainDom(o).id,j="hoverOverNode"}else if(g.eqs(b.type,"mouseout"))o=g.getMDom(c,f,[{tagName:"a",attrName:"treeNode"+d.id.A}]),o||(k="remove",j="hoverOutNode");else if(g.eqs(b.type,"mousedown")&&(o=g.getMDom(c,a,[{tagName:"a",attrName:"treeNode"+d.id.A}])))k=g.getNodeMainDom(o).id,j="mousedownNode";if(k.length>0)switch(i=m.getNodeCache(c,k),j){case "mousedownNode":e=x.onMousedownNode;break;case "hoverOverNode":e=x.onHoverOverNode;break;case "hoverOutNode":e=
|
||||
x.onHoverOutNode}return{stop:!1,node:i,nodeEventType:j,nodeEventCallback:e,treeEventType:"",treeEventCallback:null}});m.addInitRoot(function(b){var b=m.getRoot(b),a=m.getRoots();b.curEditNode=null;b.curEditInput=null;b.curHoverNode=null;b.dragFlag=0;b.dragNodeShowBefore=[];b.dragMaskList=[];a.showHoverDom=!0});m.addZTreeTools(function(b,a){a.cancelEditName=function(a){m.getRoot(this.setting).curEditNode&&f.cancelCurEditNode(this.setting,a?a:null,!0)};a.copyNode=function(a,b,k,i){if(!b)return null;
|
||||
if(a&&!a.isParent&&this.setting.data.keep.leaf&&k===d.move.TYPE_INNER)return null;var j=this,e=g.clone(b);if(!a)a=null,k=d.move.TYPE_INNER;k==d.move.TYPE_INNER?(b=function(){f.addNodes(j.setting,a,-1,[e],i)},g.canAsync(this.setting,a)?f.asyncNode(this.setting,a,i,b):b()):(f.addNodes(this.setting,a.parentNode,-1,[e],i),f.moveNode(this.setting,a,e,k,!1,i));return e};a.editName=function(a){a&&a.tId&&a===m.getNodeCache(this.setting,a.tId)&&(a.parentTId&&f.expandCollapseParentNode(this.setting,a.getParentNode(),
|
||||
!0),f.editNode(this.setting,a))};a.moveNode=function(a,b,k,i){function j(){f.moveNode(e.setting,a,b,k,!1,i)}if(!b)return b;if(a&&!a.isParent&&this.setting.data.keep.leaf&&k===d.move.TYPE_INNER)return null;else if(a&&(b.parentTId==a.tId&&k==d.move.TYPE_INNER||o(b,this.setting).find("#"+a.tId).length>0))return null;else a||(a=null);var e=this;g.canAsync(this.setting,a)&&k===d.move.TYPE_INNER?f.asyncNode(this.setting,a,i,j):j();return b};a.setEditable=function(a){this.setting.edit.enable=a;return this.refresh()}});
|
||||
var O=f.cancelPreSelectedNode;f.cancelPreSelectedNode=function(b,a){for(var c=m.getRoot(b).curSelectedList,d=0,g=c.length;d<g;d++)if(!a||a===c[d])if(f.removeTreeDom(b,c[d]),a)break;O&&O.apply(f,arguments)};var P=f.createNodes;f.createNodes=function(b,a,c,d,g){P&&P.apply(f,arguments);c&&f.repairParentChkClassWithSelf&&f.repairParentChkClassWithSelf(b,d)};var W=f.makeNodeUrl;f.makeNodeUrl=function(b,a){return b.edit.enable?null:W.apply(f,arguments)};var L=f.removeNode;f.removeNode=function(b,a){var c=
|
||||
m.getRoot(b);if(c.curEditNode===a)c.curEditNode=null;L&&L.apply(f,arguments)};var Q=f.selectNode;f.selectNode=function(b,a,c){var d=m.getRoot(b);if(m.isSelectedNode(b,a)&&d.curEditNode==a&&a.editNameFlag)return!1;Q&&Q.apply(f,arguments);f.addHoverDom(b,a);return!0};var V=g.uCanDo;g.uCanDo=function(b,a){var c=m.getRoot(b);if(a&&(g.eqs(a.type,"mouseover")||g.eqs(a.type,"mouseout")||g.eqs(a.type,"mousedown")||g.eqs(a.type,"mouseup")))return!0;if(c.curEditNode)f.editNodeBlur=!1,c.curEditInput.focus();
|
||||
return!c.curEditNode&&(V?V.apply(f,arguments):!0)}})(jQuery);
|
||||
|
||||
@@ -0,0 +1,628 @@
|
||||
/*
|
||||
* JQuery zTree excheck v3.5.28
|
||||
* http://treejs.cn/
|
||||
*
|
||||
* Copyright (c) 2010 Hunter.z
|
||||
*
|
||||
* Licensed same as jquery - MIT License
|
||||
* http://www.opensource.org/licenses/mit-license.php
|
||||
*
|
||||
* email: hunter.z@263.net
|
||||
* Date: 2017-01-20
|
||||
*/
|
||||
(function($){
|
||||
//default consts of excheck
|
||||
var _consts = {
|
||||
event: {
|
||||
CHECK: "ztree_check"
|
||||
},
|
||||
id: {
|
||||
CHECK: "_check"
|
||||
},
|
||||
checkbox: {
|
||||
STYLE: "checkbox",
|
||||
DEFAULT: "chk",
|
||||
DISABLED: "disable",
|
||||
FALSE: "false",
|
||||
TRUE: "true",
|
||||
FULL: "full",
|
||||
PART: "part",
|
||||
FOCUS: "focus"
|
||||
},
|
||||
radio: {
|
||||
STYLE: "radio",
|
||||
TYPE_ALL: "all",
|
||||
TYPE_LEVEL: "level"
|
||||
}
|
||||
},
|
||||
//default setting of excheck
|
||||
_setting = {
|
||||
check: {
|
||||
enable: false,
|
||||
autoCheckTrigger: false,
|
||||
chkStyle: _consts.checkbox.STYLE,
|
||||
nocheckInherit: false,
|
||||
chkDisabledInherit: false,
|
||||
radioType: _consts.radio.TYPE_LEVEL,
|
||||
chkboxType: {
|
||||
"Y": "ps",
|
||||
"N": "ps"
|
||||
}
|
||||
},
|
||||
data: {
|
||||
key: {
|
||||
checked: "checked"
|
||||
}
|
||||
},
|
||||
callback: {
|
||||
beforeCheck:null,
|
||||
onCheck:null
|
||||
}
|
||||
},
|
||||
//default root of excheck
|
||||
_initRoot = function (setting) {
|
||||
var r = data.getRoot(setting);
|
||||
r.radioCheckedList = [];
|
||||
},
|
||||
//default cache of excheck
|
||||
_initCache = function(treeId) {},
|
||||
//default bind event of excheck
|
||||
_bindEvent = function(setting) {
|
||||
var o = setting.treeObj,
|
||||
c = consts.event;
|
||||
o.bind(c.CHECK, function (event, srcEvent, treeId, node) {
|
||||
event.srcEvent = srcEvent;
|
||||
tools.apply(setting.callback.onCheck, [event, treeId, node]);
|
||||
});
|
||||
},
|
||||
_unbindEvent = function(setting) {
|
||||
var o = setting.treeObj,
|
||||
c = consts.event;
|
||||
o.unbind(c.CHECK);
|
||||
},
|
||||
//default event proxy of excheck
|
||||
_eventProxy = function(e) {
|
||||
var target = e.target,
|
||||
setting = data.getSetting(e.data.treeId),
|
||||
tId = "", node = null,
|
||||
nodeEventType = "", treeEventType = "",
|
||||
nodeEventCallback = null, treeEventCallback = null;
|
||||
|
||||
if (tools.eqs(e.type, "mouseover")) {
|
||||
if (setting.check.enable && tools.eqs(target.tagName, "span") && target.getAttribute("treeNode"+ consts.id.CHECK) !== null) {
|
||||
tId = tools.getNodeMainDom(target).id;
|
||||
nodeEventType = "mouseoverCheck";
|
||||
}
|
||||
} else if (tools.eqs(e.type, "mouseout")) {
|
||||
if (setting.check.enable && tools.eqs(target.tagName, "span") && target.getAttribute("treeNode"+ consts.id.CHECK) !== null) {
|
||||
tId = tools.getNodeMainDom(target).id;
|
||||
nodeEventType = "mouseoutCheck";
|
||||
}
|
||||
} else if (tools.eqs(e.type, "click")) {
|
||||
if (setting.check.enable && tools.eqs(target.tagName, "span") && target.getAttribute("treeNode"+ consts.id.CHECK) !== null) {
|
||||
tId = tools.getNodeMainDom(target).id;
|
||||
nodeEventType = "checkNode";
|
||||
}
|
||||
}
|
||||
if (tId.length>0) {
|
||||
node = data.getNodeCache(setting, tId);
|
||||
switch (nodeEventType) {
|
||||
case "checkNode" :
|
||||
nodeEventCallback = _handler.onCheckNode;
|
||||
break;
|
||||
case "mouseoverCheck" :
|
||||
nodeEventCallback = _handler.onMouseoverCheck;
|
||||
break;
|
||||
case "mouseoutCheck" :
|
||||
nodeEventCallback = _handler.onMouseoutCheck;
|
||||
break;
|
||||
}
|
||||
}
|
||||
var proxyResult = {
|
||||
stop: nodeEventType === "checkNode",
|
||||
node: node,
|
||||
nodeEventType: nodeEventType,
|
||||
nodeEventCallback: nodeEventCallback,
|
||||
treeEventType: treeEventType,
|
||||
treeEventCallback: treeEventCallback
|
||||
};
|
||||
return proxyResult
|
||||
},
|
||||
//default init node of excheck
|
||||
_initNode = function(setting, level, n, parentNode, isFirstNode, isLastNode, openFlag) {
|
||||
if (!n) return;
|
||||
var checkedKey = setting.data.key.checked;
|
||||
if (typeof n[checkedKey] == "string") n[checkedKey] = tools.eqs(n[checkedKey], "true");
|
||||
n[checkedKey] = !!n[checkedKey];
|
||||
n.checkedOld = n[checkedKey];
|
||||
if (typeof n.nocheck == "string") n.nocheck = tools.eqs(n.nocheck, "true");
|
||||
n.nocheck = !!n.nocheck || (setting.check.nocheckInherit && parentNode && !!parentNode.nocheck);
|
||||
if (typeof n.chkDisabled == "string") n.chkDisabled = tools.eqs(n.chkDisabled, "true");
|
||||
n.chkDisabled = !!n.chkDisabled || (setting.check.chkDisabledInherit && parentNode && !!parentNode.chkDisabled);
|
||||
if (typeof n.halfCheck == "string") n.halfCheck = tools.eqs(n.halfCheck, "true");
|
||||
n.halfCheck = !!n.halfCheck;
|
||||
n.check_Child_State = -1;
|
||||
n.check_Focus = false;
|
||||
n.getCheckStatus = function() {return data.getCheckStatus(setting, n);};
|
||||
|
||||
if (setting.check.chkStyle == consts.radio.STYLE && setting.check.radioType == consts.radio.TYPE_ALL && n[checkedKey] ) {
|
||||
var r = data.getRoot(setting);
|
||||
r.radioCheckedList.push(n);
|
||||
}
|
||||
},
|
||||
//add dom for check
|
||||
_beforeA = function(setting, node, html) {
|
||||
var checkedKey = setting.data.key.checked;
|
||||
if (setting.check.enable) {
|
||||
data.makeChkFlag(setting, node);
|
||||
html.push("<span ID='", node.tId, consts.id.CHECK, "' class='", view.makeChkClass(setting, node), "' treeNode", consts.id.CHECK, (node.nocheck === true?" style='display:none;'":""),"></span>");
|
||||
}
|
||||
},
|
||||
//update zTreeObj, add method of check
|
||||
_zTreeTools = function(setting, zTreeTools) {
|
||||
zTreeTools.checkNode = function(node, checked, checkTypeFlag, callbackFlag) {
|
||||
var checkedKey = this.setting.data.key.checked;
|
||||
if (node.chkDisabled === true) return;
|
||||
if (checked !== true && checked !== false) {
|
||||
checked = !node[checkedKey];
|
||||
}
|
||||
callbackFlag = !!callbackFlag;
|
||||
|
||||
if (node[checkedKey] === checked && !checkTypeFlag) {
|
||||
return;
|
||||
} else if (callbackFlag && tools.apply(this.setting.callback.beforeCheck, [this.setting.treeId, node], true) == false) {
|
||||
return;
|
||||
}
|
||||
if (tools.uCanDo(this.setting) && this.setting.check.enable && node.nocheck !== true) {
|
||||
node[checkedKey] = checked;
|
||||
var checkObj = $$(node, consts.id.CHECK, this.setting);
|
||||
if (checkTypeFlag || this.setting.check.chkStyle === consts.radio.STYLE) view.checkNodeRelation(this.setting, node);
|
||||
view.setChkClass(this.setting, checkObj, node);
|
||||
view.repairParentChkClassWithSelf(this.setting, node);
|
||||
if (callbackFlag) {
|
||||
this.setting.treeObj.trigger(consts.event.CHECK, [null, this.setting.treeId, node]);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
zTreeTools.checkAllNodes = function(checked) {
|
||||
view.repairAllChk(this.setting, !!checked);
|
||||
}
|
||||
|
||||
zTreeTools.getCheckedNodes = function(checked) {
|
||||
var childKey = this.setting.data.key.children;
|
||||
checked = (checked !== false);
|
||||
return data.getTreeCheckedNodes(this.setting, data.getRoot(this.setting)[childKey], checked);
|
||||
}
|
||||
|
||||
zTreeTools.getChangeCheckedNodes = function() {
|
||||
var childKey = this.setting.data.key.children;
|
||||
return data.getTreeChangeCheckedNodes(this.setting, data.getRoot(this.setting)[childKey]);
|
||||
}
|
||||
|
||||
zTreeTools.setChkDisabled = function(node, disabled, inheritParent, inheritChildren) {
|
||||
disabled = !!disabled;
|
||||
inheritParent = !!inheritParent;
|
||||
inheritChildren = !!inheritChildren;
|
||||
view.repairSonChkDisabled(this.setting, node, disabled, inheritChildren);
|
||||
view.repairParentChkDisabled(this.setting, node.getParentNode(), disabled, inheritParent);
|
||||
}
|
||||
|
||||
var _updateNode = zTreeTools.updateNode;
|
||||
zTreeTools.updateNode = function(node, checkTypeFlag) {
|
||||
if (_updateNode) _updateNode.apply(zTreeTools, arguments);
|
||||
if (!node || !this.setting.check.enable) return;
|
||||
var nObj = $$(node, this.setting);
|
||||
if (nObj.get(0) && tools.uCanDo(this.setting)) {
|
||||
var checkObj = $$(node, consts.id.CHECK, this.setting);
|
||||
if (checkTypeFlag == true || this.setting.check.chkStyle === consts.radio.STYLE) view.checkNodeRelation(this.setting, node);
|
||||
view.setChkClass(this.setting, checkObj, node);
|
||||
view.repairParentChkClassWithSelf(this.setting, node);
|
||||
}
|
||||
}
|
||||
},
|
||||
//method of operate data
|
||||
_data = {
|
||||
getRadioCheckedList: function(setting) {
|
||||
var checkedList = data.getRoot(setting).radioCheckedList;
|
||||
for (var i=0, j=checkedList.length; i<j; i++) {
|
||||
if(!data.getNodeCache(setting, checkedList[i].tId)) {
|
||||
checkedList.splice(i, 1);
|
||||
i--; j--;
|
||||
}
|
||||
}
|
||||
return checkedList;
|
||||
},
|
||||
getCheckStatus: function(setting, node) {
|
||||
if (!setting.check.enable || node.nocheck || node.chkDisabled) return null;
|
||||
var checkedKey = setting.data.key.checked,
|
||||
r = {
|
||||
checked: node[checkedKey],
|
||||
half: node.halfCheck ? node.halfCheck : (setting.check.chkStyle == consts.radio.STYLE ? (node.check_Child_State === 2) : (node[checkedKey] ? (node.check_Child_State > -1 && node.check_Child_State < 2) : (node.check_Child_State > 0)))
|
||||
};
|
||||
return r;
|
||||
},
|
||||
getTreeCheckedNodes: function(setting, nodes, checked, results) {
|
||||
if (!nodes) return [];
|
||||
var childKey = setting.data.key.children,
|
||||
checkedKey = setting.data.key.checked,
|
||||
onlyOne = (checked && setting.check.chkStyle == consts.radio.STYLE && setting.check.radioType == consts.radio.TYPE_ALL);
|
||||
results = !results ? [] : results;
|
||||
for (var i = 0, l = nodes.length; i < l; i++) {
|
||||
if (nodes[i].nocheck !== true && nodes[i].chkDisabled !== true && nodes[i][checkedKey] == checked) {
|
||||
results.push(nodes[i]);
|
||||
if(onlyOne) {
|
||||
break;
|
||||
}
|
||||
}
|
||||
data.getTreeCheckedNodes(setting, nodes[i][childKey], checked, results);
|
||||
if(onlyOne && results.length > 0) {
|
||||
break;
|
||||
}
|
||||
}
|
||||
return results;
|
||||
},
|
||||
getTreeChangeCheckedNodes: function(setting, nodes, results) {
|
||||
if (!nodes) return [];
|
||||
var childKey = setting.data.key.children,
|
||||
checkedKey = setting.data.key.checked;
|
||||
results = !results ? [] : results;
|
||||
for (var i = 0, l = nodes.length; i < l; i++) {
|
||||
if (nodes[i].nocheck !== true && nodes[i].chkDisabled !== true && nodes[i][checkedKey] != nodes[i].checkedOld) {
|
||||
results.push(nodes[i]);
|
||||
}
|
||||
data.getTreeChangeCheckedNodes(setting, nodes[i][childKey], results);
|
||||
}
|
||||
return results;
|
||||
},
|
||||
makeChkFlag: function(setting, node) {
|
||||
if (!node) return;
|
||||
var childKey = setting.data.key.children,
|
||||
checkedKey = setting.data.key.checked,
|
||||
chkFlag = -1;
|
||||
if (node[childKey]) {
|
||||
for (var i = 0, l = node[childKey].length; i < l; i++) {
|
||||
var cNode = node[childKey][i];
|
||||
var tmp = -1;
|
||||
if (setting.check.chkStyle == consts.radio.STYLE) {
|
||||
if (cNode.nocheck === true || cNode.chkDisabled === true) {
|
||||
tmp = cNode.check_Child_State;
|
||||
} else if (cNode.halfCheck === true) {
|
||||
tmp = 2;
|
||||
} else if (cNode[checkedKey]) {
|
||||
tmp = 2;
|
||||
} else {
|
||||
tmp = cNode.check_Child_State > 0 ? 2:0;
|
||||
}
|
||||
if (tmp == 2) {
|
||||
chkFlag = 2; break;
|
||||
} else if (tmp == 0){
|
||||
chkFlag = 0;
|
||||
}
|
||||
} else if (setting.check.chkStyle == consts.checkbox.STYLE) {
|
||||
if (cNode.nocheck === true || cNode.chkDisabled === true) {
|
||||
tmp = cNode.check_Child_State;
|
||||
} else if (cNode.halfCheck === true) {
|
||||
tmp = 1;
|
||||
} else if (cNode[checkedKey] ) {
|
||||
tmp = (cNode.check_Child_State === -1 || cNode.check_Child_State === 2) ? 2 : 1;
|
||||
} else {
|
||||
tmp = (cNode.check_Child_State > 0) ? 1 : 0;
|
||||
}
|
||||
if (tmp === 1) {
|
||||
chkFlag = 1; break;
|
||||
} else if (tmp === 2 && chkFlag > -1 && i > 0 && tmp !== chkFlag) {
|
||||
chkFlag = 1; break;
|
||||
} else if (chkFlag === 2 && tmp > -1 && tmp < 2) {
|
||||
chkFlag = 1; break;
|
||||
} else if (tmp > -1) {
|
||||
chkFlag = tmp;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
node.check_Child_State = chkFlag;
|
||||
}
|
||||
},
|
||||
//method of event proxy
|
||||
_event = {
|
||||
|
||||
},
|
||||
//method of event handler
|
||||
_handler = {
|
||||
onCheckNode: function (event, node) {
|
||||
if (node.chkDisabled === true) return false;
|
||||
var setting = data.getSetting(event.data.treeId),
|
||||
checkedKey = setting.data.key.checked;
|
||||
if (tools.apply(setting.callback.beforeCheck, [setting.treeId, node], true) == false) return true;
|
||||
node[checkedKey] = !node[checkedKey];
|
||||
view.checkNodeRelation(setting, node);
|
||||
var checkObj = $$(node, consts.id.CHECK, setting);
|
||||
view.setChkClass(setting, checkObj, node);
|
||||
view.repairParentChkClassWithSelf(setting, node);
|
||||
setting.treeObj.trigger(consts.event.CHECK, [event, setting.treeId, node]);
|
||||
return true;
|
||||
},
|
||||
onMouseoverCheck: function(event, node) {
|
||||
if (node.chkDisabled === true) return false;
|
||||
var setting = data.getSetting(event.data.treeId),
|
||||
checkObj = $$(node, consts.id.CHECK, setting);
|
||||
node.check_Focus = true;
|
||||
view.setChkClass(setting, checkObj, node);
|
||||
return true;
|
||||
},
|
||||
onMouseoutCheck: function(event, node) {
|
||||
if (node.chkDisabled === true) return false;
|
||||
var setting = data.getSetting(event.data.treeId),
|
||||
checkObj = $$(node, consts.id.CHECK, setting);
|
||||
node.check_Focus = false;
|
||||
view.setChkClass(setting, checkObj, node);
|
||||
return true;
|
||||
}
|
||||
},
|
||||
//method of tools for zTree
|
||||
_tools = {
|
||||
|
||||
},
|
||||
//method of operate ztree dom
|
||||
_view = {
|
||||
checkNodeRelation: function(setting, node) {
|
||||
var pNode, i, l,
|
||||
childKey = setting.data.key.children,
|
||||
checkedKey = setting.data.key.checked,
|
||||
r = consts.radio;
|
||||
if (setting.check.chkStyle == r.STYLE) {
|
||||
var checkedList = data.getRadioCheckedList(setting);
|
||||
if (node[checkedKey]) {
|
||||
if (setting.check.radioType == r.TYPE_ALL) {
|
||||
for (i = checkedList.length-1; i >= 0; i--) {
|
||||
pNode = checkedList[i];
|
||||
if (pNode[checkedKey] && pNode != node) {
|
||||
pNode[checkedKey] = false;
|
||||
checkedList.splice(i, 1);
|
||||
|
||||
view.setChkClass(setting, $$(pNode, consts.id.CHECK, setting), pNode);
|
||||
if (pNode.parentTId != node.parentTId) {
|
||||
view.repairParentChkClassWithSelf(setting, pNode);
|
||||
}
|
||||
}
|
||||
}
|
||||
checkedList.push(node);
|
||||
} else {
|
||||
var parentNode = (node.parentTId) ? node.getParentNode() : data.getRoot(setting);
|
||||
for (i = 0, l = parentNode[childKey].length; i < l; i++) {
|
||||
pNode = parentNode[childKey][i];
|
||||
if (pNode[checkedKey] && pNode != node) {
|
||||
pNode[checkedKey] = false;
|
||||
view.setChkClass(setting, $$(pNode, consts.id.CHECK, setting), pNode);
|
||||
}
|
||||
}
|
||||
}
|
||||
} else if (setting.check.radioType == r.TYPE_ALL) {
|
||||
for (i = 0, l = checkedList.length; i < l; i++) {
|
||||
if (node == checkedList[i]) {
|
||||
checkedList.splice(i, 1);
|
||||
break;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
} else {
|
||||
if (node[checkedKey] && (!node[childKey] || node[childKey].length==0 || setting.check.chkboxType.Y.indexOf("s") > -1)) {
|
||||
view.setSonNodeCheckBox(setting, node, true);
|
||||
}
|
||||
if (!node[checkedKey] && (!node[childKey] || node[childKey].length==0 || setting.check.chkboxType.N.indexOf("s") > -1)) {
|
||||
view.setSonNodeCheckBox(setting, node, false);
|
||||
}
|
||||
if (node[checkedKey] && setting.check.chkboxType.Y.indexOf("p") > -1) {
|
||||
view.setParentNodeCheckBox(setting, node, true);
|
||||
}
|
||||
if (!node[checkedKey] && setting.check.chkboxType.N.indexOf("p") > -1) {
|
||||
view.setParentNodeCheckBox(setting, node, false);
|
||||
}
|
||||
}
|
||||
},
|
||||
makeChkClass: function(setting, node) {
|
||||
var checkedKey = setting.data.key.checked,
|
||||
c = consts.checkbox, r = consts.radio,
|
||||
fullStyle = "";
|
||||
if (node.chkDisabled === true) {
|
||||
fullStyle = c.DISABLED;
|
||||
} else if (node.halfCheck) {
|
||||
fullStyle = c.PART;
|
||||
} else if (setting.check.chkStyle == r.STYLE) {
|
||||
fullStyle = (node.check_Child_State < 1)? c.FULL:c.PART;
|
||||
} else {
|
||||
fullStyle = node[checkedKey] ? ((node.check_Child_State === 2 || node.check_Child_State === -1) ? c.FULL:c.PART) : ((node.check_Child_State < 1)? c.FULL:c.PART);
|
||||
}
|
||||
var chkName = setting.check.chkStyle + "_" + (node[checkedKey] ? c.TRUE : c.FALSE) + "_" + fullStyle;
|
||||
chkName = (node.check_Focus && node.chkDisabled !== true) ? chkName + "_" + c.FOCUS : chkName;
|
||||
return consts.className.BUTTON + " " + c.DEFAULT + " " + chkName;
|
||||
},
|
||||
repairAllChk: function(setting, checked) {
|
||||
if (setting.check.enable && setting.check.chkStyle === consts.checkbox.STYLE) {
|
||||
var checkedKey = setting.data.key.checked,
|
||||
childKey = setting.data.key.children,
|
||||
root = data.getRoot(setting);
|
||||
for (var i = 0, l = root[childKey].length; i<l ; i++) {
|
||||
var node = root[childKey][i];
|
||||
if (node.nocheck !== true && node.chkDisabled !== true) {
|
||||
node[checkedKey] = checked;
|
||||
}
|
||||
view.setSonNodeCheckBox(setting, node, checked);
|
||||
}
|
||||
}
|
||||
},
|
||||
repairChkClass: function(setting, node) {
|
||||
if (!node) return;
|
||||
data.makeChkFlag(setting, node);
|
||||
if (node.nocheck !== true) {
|
||||
var checkObj = $$(node, consts.id.CHECK, setting);
|
||||
view.setChkClass(setting, checkObj, node);
|
||||
}
|
||||
},
|
||||
repairParentChkClass: function(setting, node) {
|
||||
if (!node || !node.parentTId) return;
|
||||
var pNode = node.getParentNode();
|
||||
view.repairChkClass(setting, pNode);
|
||||
view.repairParentChkClass(setting, pNode);
|
||||
},
|
||||
repairParentChkClassWithSelf: function(setting, node) {
|
||||
if (!node) return;
|
||||
var childKey = setting.data.key.children;
|
||||
if (node[childKey] && node[childKey].length > 0) {
|
||||
view.repairParentChkClass(setting, node[childKey][0]);
|
||||
} else {
|
||||
view.repairParentChkClass(setting, node);
|
||||
}
|
||||
},
|
||||
repairSonChkDisabled: function(setting, node, chkDisabled, inherit) {
|
||||
if (!node) return;
|
||||
var childKey = setting.data.key.children;
|
||||
if (node.chkDisabled != chkDisabled) {
|
||||
node.chkDisabled = chkDisabled;
|
||||
}
|
||||
view.repairChkClass(setting, node);
|
||||
if (node[childKey] && inherit) {
|
||||
for (var i = 0, l = node[childKey].length; i < l; i++) {
|
||||
var sNode = node[childKey][i];
|
||||
view.repairSonChkDisabled(setting, sNode, chkDisabled, inherit);
|
||||
}
|
||||
}
|
||||
},
|
||||
repairParentChkDisabled: function(setting, node, chkDisabled, inherit) {
|
||||
if (!node) return;
|
||||
if (node.chkDisabled != chkDisabled && inherit) {
|
||||
node.chkDisabled = chkDisabled;
|
||||
}
|
||||
view.repairChkClass(setting, node);
|
||||
view.repairParentChkDisabled(setting, node.getParentNode(), chkDisabled, inherit);
|
||||
},
|
||||
setChkClass: function(setting, obj, node) {
|
||||
if (!obj) return;
|
||||
if (node.nocheck === true) {
|
||||
obj.hide();
|
||||
} else {
|
||||
obj.show();
|
||||
}
|
||||
obj.attr('class', view.makeChkClass(setting, node));
|
||||
},
|
||||
setParentNodeCheckBox: function(setting, node, value, srcNode) {
|
||||
var childKey = setting.data.key.children,
|
||||
checkedKey = setting.data.key.checked,
|
||||
checkObj = $$(node, consts.id.CHECK, setting);
|
||||
if (!srcNode) srcNode = node;
|
||||
data.makeChkFlag(setting, node);
|
||||
if (node.nocheck !== true && node.chkDisabled !== true) {
|
||||
node[checkedKey] = value;
|
||||
view.setChkClass(setting, checkObj, node);
|
||||
if (setting.check.autoCheckTrigger && node != srcNode) {
|
||||
setting.treeObj.trigger(consts.event.CHECK, [null, setting.treeId, node]);
|
||||
}
|
||||
}
|
||||
if (node.parentTId) {
|
||||
var pSign = true;
|
||||
if (!value) {
|
||||
var pNodes = node.getParentNode()[childKey];
|
||||
for (var i = 0, l = pNodes.length; i < l; i++) {
|
||||
if ((pNodes[i].nocheck !== true && pNodes[i].chkDisabled !== true && pNodes[i][checkedKey])
|
||||
|| ((pNodes[i].nocheck === true || pNodes[i].chkDisabled === true) && pNodes[i].check_Child_State > 0)) {
|
||||
pSign = false;
|
||||
break;
|
||||
}
|
||||
}
|
||||
}
|
||||
if (pSign) {
|
||||
view.setParentNodeCheckBox(setting, node.getParentNode(), value, srcNode);
|
||||
}
|
||||
}
|
||||
},
|
||||
setSonNodeCheckBox: function(setting, node, value, srcNode) {
|
||||
if (!node) return;
|
||||
var childKey = setting.data.key.children,
|
||||
checkedKey = setting.data.key.checked,
|
||||
checkObj = $$(node, consts.id.CHECK, setting);
|
||||
if (!srcNode) srcNode = node;
|
||||
|
||||
var hasDisable = false;
|
||||
if (node[childKey]) {
|
||||
for (var i = 0, l = node[childKey].length; i < l; i++) {
|
||||
var sNode = node[childKey][i];
|
||||
view.setSonNodeCheckBox(setting, sNode, value, srcNode);
|
||||
if (sNode.chkDisabled === true) hasDisable = true;
|
||||
}
|
||||
}
|
||||
|
||||
if (node != data.getRoot(setting) && node.chkDisabled !== true) {
|
||||
if (hasDisable && node.nocheck !== true) {
|
||||
data.makeChkFlag(setting, node);
|
||||
}
|
||||
if (node.nocheck !== true && node.chkDisabled !== true) {
|
||||
node[checkedKey] = value;
|
||||
if (!hasDisable) node.check_Child_State = (node[childKey] && node[childKey].length > 0) ? (value ? 2 : 0) : -1;
|
||||
} else {
|
||||
node.check_Child_State = -1;
|
||||
}
|
||||
view.setChkClass(setting, checkObj, node);
|
||||
if (setting.check.autoCheckTrigger && node != srcNode && node.nocheck !== true && node.chkDisabled !== true) {
|
||||
setting.treeObj.trigger(consts.event.CHECK, [null, setting.treeId, node]);
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
},
|
||||
|
||||
_z = {
|
||||
tools: _tools,
|
||||
view: _view,
|
||||
event: _event,
|
||||
data: _data
|
||||
};
|
||||
$.extend(true, $.fn.zTree.consts, _consts);
|
||||
$.extend(true, $.fn.zTree._z, _z);
|
||||
|
||||
var zt = $.fn.zTree,
|
||||
tools = zt._z.tools,
|
||||
consts = zt.consts,
|
||||
view = zt._z.view,
|
||||
data = zt._z.data,
|
||||
event = zt._z.event,
|
||||
$$ = tools.$;
|
||||
|
||||
data.exSetting(_setting);
|
||||
data.addInitBind(_bindEvent);
|
||||
data.addInitUnBind(_unbindEvent);
|
||||
data.addInitCache(_initCache);
|
||||
data.addInitNode(_initNode);
|
||||
data.addInitProxy(_eventProxy, true);
|
||||
data.addInitRoot(_initRoot);
|
||||
data.addBeforeA(_beforeA);
|
||||
data.addZTreeTools(_zTreeTools);
|
||||
|
||||
var _createNodes = view.createNodes;
|
||||
view.createNodes = function(setting, level, nodes, parentNode, index) {
|
||||
if (_createNodes) _createNodes.apply(view, arguments);
|
||||
if (!nodes) return;
|
||||
view.repairParentChkClassWithSelf(setting, parentNode);
|
||||
}
|
||||
var _removeNode = view.removeNode;
|
||||
view.removeNode = function(setting, node) {
|
||||
var parentNode = node.getParentNode();
|
||||
if (_removeNode) _removeNode.apply(view, arguments);
|
||||
if (!node || !parentNode) return;
|
||||
view.repairChkClass(setting, parentNode);
|
||||
view.repairParentChkClass(setting, parentNode);
|
||||
}
|
||||
|
||||
var _appendNodes = view.appendNodes;
|
||||
view.appendNodes = function(setting, level, nodes, parentNode, index, initFlag, openFlag) {
|
||||
var html = "";
|
||||
if (_appendNodes) {
|
||||
html = _appendNodes.apply(view, arguments);
|
||||
}
|
||||
if (parentNode) {
|
||||
data.makeChkFlag(setting, parentNode);
|
||||
}
|
||||
return html;
|
||||
}
|
||||
})(jQuery);
|
||||
@@ -0,0 +1,95 @@
|
||||
/*-------------------------------------
|
||||
zTree Style
|
||||
|
||||
version: 3.4
|
||||
author: Hunter.z
|
||||
email: hunter.z@263.net
|
||||
website: http://code.google.com/p/jquerytree/
|
||||
|
||||
-------------------------------------*/
|
||||
.ztree * {padding:0; margin:0; font-size:14px; font-family: Verdana, Arial, Helvetica, AppleGothic, sans-serif}
|
||||
.ztree {margin:0; padding:5px; color:#333}
|
||||
.ztree li{padding:0; margin:0; list-style:none; line-height:17px; text-align:left; white-space:nowrap; outline:0}
|
||||
.ztree li ul{ margin:0; padding:0 0 0 18px}
|
||||
.ztree li ul.line{ background:url(./img/line_conn.png) 0 0 repeat-y;}
|
||||
|
||||
.ztree li a {padding-right:3px; margin:0; cursor:pointer; height:21px; color:#333; background-color: transparent; text-decoration:none; vertical-align:top; display: inline-block}
|
||||
.ztree li a:hover {text-decoration:underline}
|
||||
.ztree li a.curSelectedNode {padding-top:0px; background-color:#e5e5e5; color:black; height:21px; opacity:0.8;}
|
||||
.ztree li a.curSelectedNode_Edit {padding-top:0px; background-color:#e5e5e5; color:black; height:21px; border:1px #666 solid; opacity:0.8;}
|
||||
.ztree li a.tmpTargetNode_inner {padding-top:0px; background-color:#aaa; color:white; height:21px; border:1px #666 solid;
|
||||
opacity:0.8; filter:alpha(opacity=80)}
|
||||
.ztree li a.tmpTargetNode_prev {}
|
||||
.ztree li a.tmpTargetNode_next {}
|
||||
.ztree li a input.rename {height:14px; width:80px; padding:0; margin:0;
|
||||
font-size:12px; border:1px #585956 solid; *border:0px}
|
||||
.ztree li span {line-height:21px; margin-right:2px}
|
||||
.ztree li span.button {line-height:0; margin:0; padding: 0; width:21px; height:21px; display: inline-block; vertical-align:middle;
|
||||
border:0 none; cursor: pointer;outline:none;
|
||||
background-color:transparent; background-repeat:no-repeat; background-attachment: scroll;
|
||||
background-image:url("./img/bootstrap.png");}
|
||||
|
||||
.ztree li span.button.chk {width:13px; height:13px; margin:0 2px; cursor: auto}
|
||||
.ztree li span.button.chk.checkbox_false_full {background-position: -5px -5px;}
|
||||
.ztree li span.button.chk.checkbox_false_full_focus {background-position: -5px -26px;}
|
||||
.ztree li span.button.chk.checkbox_false_part {background-position: -5px -48px;}
|
||||
.ztree li span.button.chk.checkbox_false_part_focus {background-position: -5px -68px;}
|
||||
.ztree li span.button.chk.checkbox_false_disable {background-position: -5px -89px;}
|
||||
.ztree li span.button.chk.checkbox_true_full {background-position: -26px -5px;}
|
||||
.ztree li span.button.chk.checkbox_true_full_focus {background-position: -26px -26px;}
|
||||
.ztree li span.button.chk.checkbox_true_part {background-position: -26px -48px;}
|
||||
.ztree li span.button.chk.checkbox_true_part_focus {background-position: -26px -68px;}
|
||||
.ztree li span.button.chk.checkbox_true_disable {background-position: -26px -89px;}
|
||||
.ztree li span.button.chk.radio_false_full {background-position: -47px -5px;}
|
||||
.ztree li span.button.chk.radio_false_full_focus {background-position: -47px -26px;}
|
||||
.ztree li span.button.chk.radio_false_part {background-position: -47px -47px;}
|
||||
.ztree li span.button.chk.radio_false_part_focus {background-position: -47px -68px;}
|
||||
.ztree li span.button.chk.radio_false_disable {background-position: -47px -89px;}
|
||||
.ztree li span.button.chk.radio_true_full {background-position: -68px -5px;}
|
||||
.ztree li span.button.chk.radio_true_full_focus {background-position: -68px -26px;}
|
||||
.ztree li span.button.chk.radio_true_part {background-position: -68px -47px;}
|
||||
.ztree li span.button.chk.radio_true_part_focus {background-position: -68px -68px;}
|
||||
.ztree li span.button.chk.radio_true_disable {background-position: -68px -89px;}
|
||||
|
||||
.ztree li span.button.switch {width:21px; height:21px}
|
||||
.ztree li span.button.root_open{background-position:-105px -63px}
|
||||
.ztree li span.button.root_close{background-position:-126px -63px}
|
||||
.ztree li span.button.roots_open{background-position: -105px 0;}
|
||||
.ztree li span.button.roots_close{background-position: -126px 0;}
|
||||
.ztree li span.button.center_open{background-position: -105px -21px;}
|
||||
.ztree li span.button.center_close{background-position: -126px -21px;}
|
||||
.ztree li span.button.bottom_open{background-position: -105px -42px;}
|
||||
.ztree li span.button.bottom_close{background-position: -126px -42px;}
|
||||
.ztree li span.button.noline_open{background-position: -105px -84px;}
|
||||
.ztree li span.button.noline_close{background-position: -126px -84px;}
|
||||
.ztree li span.button.root_docu{ background:none;}
|
||||
.ztree li span.button.roots_docu{background-position: -84px 0;}
|
||||
.ztree li span.button.center_docu{background-position: -84px -21px;}
|
||||
.ztree li span.button.bottom_docu{background-position: -84px -42px;}
|
||||
.ztree li span.button.noline_docu{ background:none;}
|
||||
|
||||
.ztree li span.button.ico_open{margin-right:2px; background-position: -147px -21px; vertical-align:top; *vertical-align:middle}
|
||||
.ztree li span.button.ico_close{margin-right:2px; margin-right:2px; background-position: -147px 0; vertical-align:top; *vertical-align:middle}
|
||||
.ztree li span.button.ico_docu{margin-right:2px; background-position: -147px -43px; vertical-align:top; *vertical-align:middle}
|
||||
.ztree li span.button.edit {margin-left:2px; margin-right: -1px; background-position: -189px -21px; vertical-align:top; *vertical-align:middle}
|
||||
.ztree li span.button.edit:hover {
|
||||
background-position: -168px -21px;
|
||||
}
|
||||
.ztree li span.button.remove {margin-left:2px; margin-right: -1px; background-position: -189px -42px; vertical-align:top; *vertical-align:middle}
|
||||
.ztree li span.button.remove:hover {
|
||||
background-position: -168px -42px;
|
||||
}
|
||||
.ztree li span.button.add {margin-left:2px; margin-right: -1px; background-position: -189px 0; vertical-align:top; *vertical-align:middle}
|
||||
.ztree li span.button.add:hover {
|
||||
background-position: -168px 0;
|
||||
}
|
||||
|
||||
ul.tmpTargetzTree {background-color:#FFE6B0; opacity:0.8; filter:alpha(opacity=80)}
|
||||
|
||||
span.tmpzTreeMove_arrow {width:16px; height:21px; display: inline-block; padding:0; margin:2px 0 0 1px; border:0 none; position:absolute;
|
||||
background-color:transparent; background-repeat:no-repeat; background-attachment: scroll;
|
||||
background-position:-168px -84px; background-image:url("./img/bootstrap.png");}
|
||||
|
||||
ul.ztree.zTreeDragUL {margin:0; padding:0; position:absolute; width:auto; height:auto;overflow:hidden; background-color:#cfcfcf; border:1px #00B83F dotted; opacity:0.8; filter:alpha(opacity=80)}
|
||||
.ztreeMask {z-index:10000; background-color:#cfcfcf; opacity:0.0; filter:alpha(opacity=0); position:absolute}
|
||||
|
||||
@@ -0,0 +1,3 @@
|
||||
.ztree li span.button {background-image:url("./img/bootstrap3.png");}
|
||||
span.tmpzTreeMove_arrow {background-image:url("./img/bootstrap3.png");}
|
||||
|
||||
@@ -0,0 +1,211 @@
|
||||
<template>
|
||||
<div id="app" v-if="isLogin">
|
||||
<layout :layoutData="layoutData" ref="layout"></layout>
|
||||
<div :class="['base-wrap-main', layoutData.isAlone ? 'alone-page' : '']">
|
||||
<template v-if="!isNoAuthority">
|
||||
<transition name="fade" mode="out-in">
|
||||
<router-view v-if="isRouterAlive"></router-view>
|
||||
</transition>
|
||||
</template>
|
||||
<div v-else class="no-authority-wrap">
|
||||
<h3>暂无权限</h3>
|
||||
<h6>如需查看,请联络管理员为您分配权限</h6>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import layout from "@/frame/layout";
|
||||
const appendLink = (baseHost, name, version) => {
|
||||
var headHTML = `<link type="text/css" rel="stylesheet" href="${baseHost}/BschHome/front/css/${name}.css?v=${version}">`;
|
||||
$("head:eq(0)").append(headHTML);
|
||||
};
|
||||
export default {
|
||||
name: "App",
|
||||
data() {
|
||||
return {
|
||||
isRouterAlive: true,
|
||||
isFull: false,
|
||||
isLogin: false,
|
||||
layoutData: {},
|
||||
isNoAuthority: false,
|
||||
};
|
||||
},
|
||||
components: { layout },
|
||||
provide() {
|
||||
return {
|
||||
reload: this.reload,
|
||||
};
|
||||
},
|
||||
async created() {
|
||||
const _this = this;
|
||||
try {
|
||||
var data = await this.getLayoutData();
|
||||
const baseHost = data.pageUrl.replace("/v/", "");
|
||||
var version = localStorage.getItem("themeVersion");
|
||||
appendLink(baseHost, "base.layout", version ? version : new Date().getTime());
|
||||
var bschResult = await this.getBschHomeJsonp(baseHost, data.id);
|
||||
|
||||
this.setCurrentRole(bschResult, baseHost);
|
||||
data = await this.getLayoutData();
|
||||
this.layoutInit(data, bschResult.appList, baseHost);
|
||||
this.isLogin = true;
|
||||
} catch (error) {
|
||||
console.error(error);
|
||||
this.$Message.error("载入用户信息失败!");
|
||||
}
|
||||
//console.log(process.env);
|
||||
},
|
||||
methods: {
|
||||
reload() {
|
||||
this.isRouterAlive = false;
|
||||
this.$nextTick(() => (this.isRouterAlive = true));
|
||||
},
|
||||
getLayoutData() {
|
||||
const _this = this;
|
||||
return new Promise((resolve, reject) => {
|
||||
_this.$api.get(
|
||||
APIConfig.Base.GetLayout,
|
||||
null,
|
||||
resp => {
|
||||
resolve(resp.data);
|
||||
},
|
||||
error => {
|
||||
reject(error);
|
||||
}
|
||||
);
|
||||
});
|
||||
},
|
||||
getBschHomeJsonp(baseHost, userId) {
|
||||
var version = localStorage.getItem("themeVersion") || new Date().getTime();
|
||||
return new Promise((resolve, reject) => {
|
||||
var crossStorage,
|
||||
crossUrl = `${baseHost}/BschHome/front/libs/cross`;
|
||||
try {
|
||||
var HEAD = document.getElementsByTagName("head")[0];
|
||||
var node = document.createElement("script");
|
||||
node.src = `${crossUrl}/client.js?v=${version}`;
|
||||
node.onload = function () {
|
||||
crossStorage = new Client(`${crossUrl}/middle.html?v=${version}`, () => {
|
||||
crossStorage.getRoteData({ userId }, resp => {
|
||||
resolve(resp);
|
||||
});
|
||||
});
|
||||
|
||||
//分页数据默认条数
|
||||
const customPageCount = localStorage.getItem("customPageCount");
|
||||
crossStorage.getItem("customPageCount", resp => {
|
||||
if (resp == null) return false;
|
||||
if (customPageCount == null) localStorage.setItem("customPageCount", resp);
|
||||
else if (resp != customPageCount) {
|
||||
crossStorage.setItem({
|
||||
key: "customPageCount",
|
||||
value: customPageCount,
|
||||
});
|
||||
}
|
||||
});
|
||||
};
|
||||
HEAD.appendChild(node);
|
||||
} catch (error) {
|
||||
console.error(error);
|
||||
resolve(null);
|
||||
}
|
||||
});
|
||||
},
|
||||
layoutInit(data, appList, baseHost) {
|
||||
this.layoutData.appName = data.topName;
|
||||
this.layoutData.baseHost = baseHost;
|
||||
this.layoutData.ssoHost = data.ssoUrl;
|
||||
let arr = [];
|
||||
const routes = this.$router.options.routes;
|
||||
data.pathList.forEach(element => {
|
||||
let iconIndex = routes.findIndex(x => typeof x.meta !== "undefined" && typeof x.meta.modId !== "undefined" && typeof x.meta.icon !== "undefined" && x.meta.modId == element.modId);
|
||||
let icon = iconIndex > -1 ? "iconfont " + routes[iconIndex].meta.icon : ""; //icon不传则为默认
|
||||
arr.push({
|
||||
id: element.id,
|
||||
name: element.name,
|
||||
modId: element.modId,
|
||||
page: element.page,
|
||||
children: element.children || [],
|
||||
icon, //icon不传则为默认
|
||||
});
|
||||
});
|
||||
// arr[0].icon = "iconfont icon-qunzu"; //icon样式示例,参见static/style/font 目录
|
||||
//console.log(arr);
|
||||
this.layoutData.modList = arr.sort((a, b) => a.modId - b.modId);
|
||||
this.layoutData.isAlone = arr.length == 1; //当只有一个选项卡时,隐藏menu和nav
|
||||
// let { id, name, profilePicture } = data;
|
||||
let { id, username, avatar } = data;
|
||||
this.layoutData.userInfo = { id, name: username, avatar };
|
||||
this.layoutData.appList = appList || [];
|
||||
//无权限
|
||||
if (arr.length == 0) {
|
||||
this.layoutData.isAlone = true;
|
||||
this.isNoAuthority = true;
|
||||
}
|
||||
},
|
||||
setCurrentRole(result, baseHost) {
|
||||
if (result) {
|
||||
let { childId, roleId, schId } = result.checkRole;
|
||||
localStorage.setItem("currentRole", encodeURI(JSON.stringify({ childId, roleId, schId })));
|
||||
localStorage.setItem("themeVersion", result.themeVersion);
|
||||
appendLink(baseHost, result.themeName, result.themeVersion);
|
||||
} else {
|
||||
appendLink(baseHost, "default-theme", new Date().getTime());
|
||||
}
|
||||
},
|
||||
},
|
||||
};
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
#loging-box {
|
||||
display: none;
|
||||
}
|
||||
.fade-enter-active,
|
||||
.fade-leave-active {
|
||||
transition: all 1ms cubic-bezier(0, 0.99, 1, 0.03);
|
||||
}
|
||||
/* 进入开始 */
|
||||
.fade-enter {
|
||||
// transform: translateY(10px);
|
||||
opacity: 0;
|
||||
}
|
||||
/* 出去终点 */
|
||||
.fade-leave-active {
|
||||
// transform: translateY(-10px);
|
||||
// opacity: 0;
|
||||
}
|
||||
|
||||
.back-enter-active,
|
||||
.back-leave-active {
|
||||
transition: all 1ms cubic-bezier(0, 0.99, 1, 0.03);
|
||||
}
|
||||
/* 进入开始 */
|
||||
.back-enter {
|
||||
display: none;
|
||||
}
|
||||
/* 出去终点 */
|
||||
.back-leave-active {
|
||||
display: none;
|
||||
}
|
||||
.main-wrap {
|
||||
padding: 120px 0 0 200px;
|
||||
height: 100%;
|
||||
}
|
||||
.main-panel {
|
||||
height: 100%;
|
||||
overflow-y: auto;
|
||||
position: relative;
|
||||
box-sizing: border-box;
|
||||
padding: 15px;
|
||||
}
|
||||
.main-panel.is-page {
|
||||
height: calc(100% - 60px);
|
||||
}
|
||||
|
||||
.full {
|
||||
padding: 0;
|
||||
}
|
||||
</style>
|
||||
@@ -0,0 +1,255 @@
|
||||
<template>
|
||||
<div id="app" v-if="isLogin">
|
||||
<layout-old v-if="isLayoutOld" :layoutData="layoutData"></layout-old>
|
||||
<layout v-else :layoutData="layoutData"></layout>
|
||||
<div :class="['base-wrap-main', layoutData.isAlone ? 'alone-page' : '']">
|
||||
<transition v-if="!isNoAuthority" :name="!isBack ? 'fade' : 'back'" :mode="!isBack ? 'out-in' : 'in-out'">
|
||||
<router-view v-if="isRouterAlive"></router-view>
|
||||
</transition>
|
||||
<div v-else class="no-authority-wrap">
|
||||
<h3>暂无权限</h3>
|
||||
<h6>如需查看,请联络管理员为您分配权限</h6>
|
||||
</div>
|
||||
</div>
|
||||
<!-- <Modal v-model="isAlertModal" :closable="false" :mask-closable="false" title="更新提示" width="830">
|
||||
<Alert show-icon>
|
||||
因为铃铛等环境无法同一时间更新,为不影响正在运行的项目,所以新的标准样式名称改为base.layout.beta.css
|
||||
</Alert>
|
||||
<p>
|
||||
<img width="100%" src="./assets/image/1636426109.jpg" alt="" />
|
||||
</p>
|
||||
</Modal> -->
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import layout from "./frame/layout.vue";
|
||||
import layoutOld from "./frame/layout_old.vue";
|
||||
|
||||
const appendLink = (baseHost, name, version) => {
|
||||
var headHTML = `<link type="text/css" rel="stylesheet" href="${baseHost}/BschHome/front/css/${name}.css?v=${version}">`;
|
||||
$("head:eq(0)").append(headHTML);
|
||||
};
|
||||
|
||||
export default {
|
||||
components: { layout, layoutOld },
|
||||
name: "app",
|
||||
data() {
|
||||
return {
|
||||
isRouterAlive: true,
|
||||
isBack: false,
|
||||
isLogin: false,
|
||||
isNoAuthority: false,
|
||||
layoutData: {},
|
||||
isLayoutOld: conf.isLayoutOld,
|
||||
isAlertModal: false,
|
||||
};
|
||||
},
|
||||
provide() {
|
||||
return {
|
||||
reload: this.reload,
|
||||
};
|
||||
},
|
||||
async created() {
|
||||
try {
|
||||
const baseHost = window.conf.baseHost,
|
||||
ssoHost = window.conf.ssoHost;
|
||||
var version = localStorage.getItem("themeVersion") || new Date().getTime();
|
||||
appendLink(baseHost, "base.layout.beta", version);
|
||||
var info = await this.getUserInfo();
|
||||
var bschResult = await this.getBschHomeJsonp(baseHost, info.id);
|
||||
this.setCurrentRole(bschResult, baseHost, info.id);
|
||||
var mod = await this.getUserMod();
|
||||
this.layoutInit(info, mod, bschResult.appList, baseHost, ssoHost);
|
||||
|
||||
this.isLogin = true;
|
||||
} catch (error) {
|
||||
console.error(error);
|
||||
this.$Message.error("载入用户信息失败!");
|
||||
}
|
||||
|
||||
// this.isAlertModal = true;
|
||||
// if (localStorage.getItem("cook_is_alert") == null) {
|
||||
// localStorage.setItem("cook_is_alert", true);
|
||||
// this.isAlertModal = true;
|
||||
// }
|
||||
},
|
||||
mounted() {
|
||||
var isTrident = navigator.userAgent.indexOf("Trident") > -1; // 是否是IE内核
|
||||
if (isTrident) {
|
||||
$("html").css("overflow", "hidden");
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
reload() {
|
||||
this.isRouterAlive = false;
|
||||
this.$nextTick(() => (this.isRouterAlive = true));
|
||||
},
|
||||
getUserInfo() {
|
||||
const _this = this;
|
||||
return new Promise((resolve, reject) => {
|
||||
_this.$api.get(
|
||||
APIConfig.Base.GetUserInfo,
|
||||
null,
|
||||
resp => {
|
||||
resolve(resp.data);
|
||||
},
|
||||
error => reject(error)
|
||||
);
|
||||
});
|
||||
},
|
||||
getUserMod() {
|
||||
const _this = this;
|
||||
return new Promise((resolve, reject) => {
|
||||
_this.$api.get(
|
||||
APIConfig.Base.GetUserMod,
|
||||
null,
|
||||
resp => {
|
||||
let resps={"code":0,"msg":"","data":
|
||||
[
|
||||
{"id":1493,"appId":551,"modId":1,"name":"学制选择","parentId":0,"path":null,"level":0,"page":"/","icon":null,"orderNumber":1493,"usable":true,"children":[],"modules":[]},
|
||||
{"id":1494,"appId":551,"modId":2,"name":"时段设置","parentId":0,"path":null,"level":0,"page":"/itemSet","icon":null,"orderNumber":1494,"usable":true,"children":[],"modules":[]},
|
||||
{"id":1494,"appId":551,"modId":3,"name":"区域操作日志","parentId":0,"path":null,"level":0,"page":"/areaOperateDaily","icon":null,"orderNumber":1494,"usable":true,"children":[],"modules":[]},
|
||||
{"id":1494,"appId":551,"modId":4,"name":"学校设置","parentId":0,"path":null,"level":0,"page":"/schoolSetting","icon":null,"orderNumber":1494,"usable":true,"children":[],"modules":[]},
|
||||
{"id":1494,"appId":551,"modId":5,"name":"课程设置","parentId":0,"path":null,"level":0,"page":"/subjectManForZy","icon":null,"orderNumber":1494,"usable":true,"children":[],"modules":[]},
|
||||
{"id":1494,"appId":551,"modId":6,"name":"学科管理","parentId":0,"path":null,"level":0,"page":"/subjectSetzhi","icon":null,"orderNumber":1494,"usable":true,"children":[],"modules":[]},
|
||||
{"id":1494,"appId":551,"modId":7,"name":"班级管理","parentId":0,"path":null,"level":0,"page":"/classManage","icon":null,"orderNumber":1494,"usable":true,"children":[],"modules":[]},
|
||||
{"id":1494,"appId":551,"modId":8,"name":"选修班管理","parentId":0,"path":null,"level":0,"page":"/electiveClassManage","icon":null,"orderNumber":1494,"usable":true,"children":[],"modules":[]},
|
||||
{"id":1494,"appId":551,"modId":9,"name":"教师管理","parentId":0,"path":null,"level":0,"page":"/teacherManage","icon":null,"orderNumber":1494,"usable":true,"children":[],"modules":[]},
|
||||
{"id":1494,"appId":551,"modId":10,"name":"学生管理","parentId":0,"path":null,"level":0,"page":"/studentManage","icon":null,"orderNumber":1494,"usable":true,"children":[],"modules":[]},
|
||||
{"id":1494,"appId":551,"modId":11,"name":"历史查询","parentId":0,"path":null,"level":0,"page":"/historySearch","icon":null,"orderNumber":1494,"usable":true,"children":[],"modules":[]},
|
||||
{"id":1494,"appId":551,"modId":12,"name":"学生异动管理","parentId":0,"path":null,"level":0,"page":"/studentYDManage","icon":null,"orderNumber":1494,"usable":true,"children":[],"modules":[]},
|
||||
{"id":1494,"appId":551,"modId":13,"name":"教师转入管理","parentId":0,"path":null,"level":0,"page":"/zhuanruinfo","icon":null,"orderNumber":1494,"usable":true,"children":[],"modules":[]},
|
||||
{"id":1494,"appId":551,"modId":14,"name":"学生转入管理","parentId":0,"path":null,"level":0,"page":"/zhuanruinfostu","icon":null,"orderNumber":1494,"usable":true,"children":[],"modules":[]},
|
||||
{"id":1494,"appId":551,"modId":15,"name":"日志管理","parentId":0,"path":null,"level":0,"page":"/dailySearch","icon":null,"orderNumber":1494,"usable":true,"children":[],"modules":[]},
|
||||
],"timeNow":"2026-06-17 14:44:05"}
|
||||
resolve(resps.data);
|
||||
},
|
||||
error => reject(error)
|
||||
);
|
||||
});
|
||||
},
|
||||
getBschHomeJsonp(baseHost, userId) {
|
||||
var version = localStorage.getItem("themeVersion") || new Date().getTime();
|
||||
return new Promise((resolve, reject) => {
|
||||
var crossStorage,
|
||||
crossUrl = `${baseHost}/BschHome/front/libs/cross`;
|
||||
try {
|
||||
var HEAD = document.getElementsByTagName("head")[0];
|
||||
var node = document.createElement("script");
|
||||
node.src = `${crossUrl}/client.js?v=${version}`;
|
||||
node.onload = function () {
|
||||
crossStorage = new Client(`${crossUrl}/middle.html?v=${version}`, () => {
|
||||
crossStorage.getRoteData({ userId }, resp => {
|
||||
resolve(resp);
|
||||
});
|
||||
|
||||
//分页数据默认条数
|
||||
const customPageCount = localStorage.getItem("customPageCount");
|
||||
crossStorage.getItem("customPageCount", resp => {
|
||||
if (resp == null) return false;
|
||||
if (customPageCount == null) localStorage.setItem("customPageCount", resp);
|
||||
else if (resp != customPageCount) {
|
||||
crossStorage.setItem({
|
||||
key: "customPageCount",
|
||||
value: customPageCount,
|
||||
});
|
||||
}
|
||||
});
|
||||
});
|
||||
};
|
||||
HEAD.appendChild(node);
|
||||
} catch (error) {
|
||||
console.error(error);
|
||||
console.error("获取身份信息失败!");
|
||||
resolve(null);
|
||||
}
|
||||
});
|
||||
},
|
||||
layoutInit(info, mod, appList, baseHost, ssoHost) {
|
||||
this.layoutData.appName = "班级管理";
|
||||
this.layoutData.baseHost = baseHost;
|
||||
this.layoutData.ssoHost = ssoHost;
|
||||
const routes = this.$router.options.routes;
|
||||
let arr = [];
|
||||
mod.forEach(element => {
|
||||
let iconIndex = routes.findIndex(
|
||||
x =>
|
||||
typeof x.meta !== "undefined" &&
|
||||
typeof x.meta.modId !== "undefined" &&
|
||||
typeof x.meta.icon !== "undefined" &&
|
||||
x.meta.modId == element.modId
|
||||
);
|
||||
let icon = iconIndex > -1 ? "iconfont " + routes[iconIndex].meta.icon : ""; //icon不传则为默认
|
||||
arr.push({
|
||||
id: element.id,
|
||||
name: element.name,
|
||||
modId: element.modId,
|
||||
page: element.page,
|
||||
children: element.children || [],
|
||||
icon,
|
||||
});
|
||||
});
|
||||
// arr[0].icon = "iconfont icon-apps"; //icon样式示例,参见static/style/font 目录
|
||||
this.layoutData.modList = arr.sort((a, b) => a.modId - b.modId);
|
||||
this.layoutData.isAlone = arr.length == 1; //当只有一个选项卡时,隐藏menu和nav
|
||||
let { id, name, profilePicture } = info;
|
||||
this.layoutData.userInfo = { id, name, avatar: profilePicture };
|
||||
this.layoutData.appList = appList || [];
|
||||
//无权限
|
||||
if (arr.length == 0) {
|
||||
this.layoutData.isAlone = true;
|
||||
this.isNoAuthority = true;
|
||||
}
|
||||
},
|
||||
setCurrentRole(result, baseHost, userId) {
|
||||
if (result) {
|
||||
let { childId, roleId, schId } = result.checkRole;
|
||||
localStorage.setItem("currentRole", encodeURI(JSON.stringify({ childId, roleId, schId, userId })));
|
||||
localStorage.setItem("themeVersion", result.themeVersion);
|
||||
appendLink(baseHost, result.themeName, result.themeVersion);
|
||||
} else {
|
||||
appendLink(baseHost, "default-theme", new Date().getTime());
|
||||
}
|
||||
},
|
||||
},
|
||||
};
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
#loging-box,
|
||||
.mop-load-div {
|
||||
display: none;
|
||||
}
|
||||
/* 开始过渡阶段,动画出去阶段 */
|
||||
.fade-enter-active,
|
||||
.fade-leave-active {
|
||||
transition: all 1ms cubic-bezier(0, 0.99, 1, 0.03);
|
||||
}
|
||||
/* 进入开始 */
|
||||
.fade-enter {
|
||||
// transform: translateY(10px);
|
||||
opacity: 0;
|
||||
}
|
||||
/* 出去终点 */
|
||||
.fade-leave-active {
|
||||
// transform: translateY(-10px);
|
||||
// opacity: 0;
|
||||
}
|
||||
|
||||
.back-enter-active,
|
||||
.back-leave-active {
|
||||
transition: all 1ms cubic-bezier(0, 0.99, 1, 0.03);
|
||||
}
|
||||
/* 进入开始 */
|
||||
.back-enter {
|
||||
display: none;
|
||||
}
|
||||
/* 出去终点 */
|
||||
.back-leave-active {
|
||||
display: none;
|
||||
}
|
||||
#app {
|
||||
height: 100%;
|
||||
}
|
||||
</style>
|
||||
@@ -0,0 +1,198 @@
|
||||
// 配置API接口地址
|
||||
// var root = '/api/v1'
|
||||
// var root = '/api/debugapi'
|
||||
var root = "/api";
|
||||
// var root = ''
|
||||
// 引用axios
|
||||
var axios = require("axios");
|
||||
|
||||
// import Notice from 'iview/src/components/notice';
|
||||
import { Message } from "view-design";
|
||||
|
||||
// 自定义判断元素类型JS
|
||||
function toType(obj) {
|
||||
return {}.toString
|
||||
.call(obj)
|
||||
.match(/\s([a-zA-Z]+)/)[1]
|
||||
.toLowerCase();
|
||||
}
|
||||
// 参数过滤函数
|
||||
function filterNull(o) {
|
||||
for (var key in o) {
|
||||
if (o[key] === null) {
|
||||
delete o[key];
|
||||
}
|
||||
if (toType(o[key]) === "string") {
|
||||
o[key] = o[key].trim();
|
||||
} else if (toType(o[key]) === "object") {
|
||||
o[key] = filterNull(o[key]);
|
||||
} else if (toType(o[key]) === "array") {
|
||||
o[key] = filterNull(o[key]);
|
||||
}
|
||||
}
|
||||
return o;
|
||||
}
|
||||
/*
|
||||
接口处理函数
|
||||
这个函数每个项目都是不一样的,我现在调整的是适用于
|
||||
https://cnodejs.org/api/v1 的接口,如果是其他接口
|
||||
需要根据接口的参数进行调整。参考说明文档地址:
|
||||
https://cnodejs.org/topic/5378720ed6e2d16149fa16bd
|
||||
主要是,不同的接口的成功标识和失败提示是不一致的。
|
||||
另外,不同的项目的处理方法也是不一致的,这里出错就是简单的alert
|
||||
*/
|
||||
|
||||
function apiAxios(method, url, params, success, failure) {
|
||||
let conentTypeIsJosn = false;
|
||||
if (params && typeof params != "string") {
|
||||
params = filterNull(params);
|
||||
} else conentTypeIsJosn = true;
|
||||
|
||||
// if (!window.location.origin) {
|
||||
// window.location.origin = window.location.protocol + "//" + window.location.hostname + (window.location.port ? ':' + window.location.port: '');
|
||||
// }
|
||||
// let redirectUrl=window.location.origin + window.location.hash.replace('#','/xiaoxi/#');
|
||||
|
||||
// console.log(window.location);
|
||||
|
||||
axios({
|
||||
method: method,
|
||||
url: url,
|
||||
data: method === "POST" || method === "PUT" ? params : null,
|
||||
params: method === "GET" || method === "DELETE" ? params : null,
|
||||
baseURL: root,
|
||||
withCredentials: true,
|
||||
crossDomain: true,
|
||||
transformRequest: [
|
||||
function (data) {
|
||||
// Do whatever you want to transform the data
|
||||
if (conentTypeIsJosn) return data;
|
||||
let ret = "";
|
||||
for (let it in data) {
|
||||
ret += encodeURIComponent(it) + "=" + encodeURIComponent(data[it]) + "&";
|
||||
}
|
||||
return ret;
|
||||
},
|
||||
],
|
||||
headers: {
|
||||
// 'Content-Type': 'application/x-www-form-urlencoded',
|
||||
"Content-Type": conentTypeIsJosn ? "application/json" : "application/x-www-form-urlencoded",
|
||||
// bschapirequest: 1,
|
||||
yschapirequest:1,
|
||||
yschreferer: this.$utils.strToHexCharCode(window.location.href),
|
||||
},
|
||||
})
|
||||
.then(function (res) {
|
||||
let response = res.data;
|
||||
if (response.code == 302) {
|
||||
window.location.href = response.urlToRedirectTo;
|
||||
return;
|
||||
} else if (response.code == 0) {
|
||||
if (success) {
|
||||
success(response);
|
||||
}
|
||||
}else if (response.code == 4) {
|
||||
Message.error(response.msg); //错误处理
|
||||
} else {
|
||||
if (failure) {
|
||||
failure(response);
|
||||
} else {
|
||||
if (response.data == 2) {
|
||||
Message.error(response.msg); //错误处理
|
||||
setTimeout(() => {
|
||||
location.reload();
|
||||
}, 1000);
|
||||
} else {
|
||||
Message.info(response.msg); //错误处理
|
||||
}
|
||||
}
|
||||
}
|
||||
})
|
||||
.catch(function (err) {
|
||||
let res = err.response;
|
||||
console.error(res || err);
|
||||
if (res) {
|
||||
Message.destroy();
|
||||
clearTimeout(tiemObj);
|
||||
if (res.data.msg) {
|
||||
Message.error(res.data.msg); //错误处理
|
||||
} else {
|
||||
Message.error("网络请求出错"); //错误处理
|
||||
}
|
||||
return;
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
//字符串的16进制表达
|
||||
function strToHexCharCode(_str) {
|
||||
if (_str === "") return "";
|
||||
var hexCharCode = [];
|
||||
for (var i = 0; i < _str.length; i++) {
|
||||
var str = _str.charCodeAt(i).toString(16);
|
||||
if (_str.length == 1) str += "0" + _str;
|
||||
hexCharCode.push(str);
|
||||
}
|
||||
return hexCharCode.join("");
|
||||
}
|
||||
|
||||
let requestCount = 0,
|
||||
tiemObj;
|
||||
// http request 拦截器
|
||||
axios.interceptors.request.use(config => {
|
||||
requestCount++;
|
||||
if (requestCount == 1) {
|
||||
tiemObj = setTimeout(() => {
|
||||
Message.loading({ content: "加载中...", duration: 0 });
|
||||
}, 800);
|
||||
}
|
||||
// if (localStorage.getItem("currentRole"))
|
||||
// config.headers["currentRole"] = localStorage.getItem("currentRole");
|
||||
if (localStorage.getItem("currentRole")) {
|
||||
let currentRole = localStorage.getItem("currentRole");
|
||||
config.headers["currentrole"] = currentRole;
|
||||
let { schId, roleId, userId, childId } = JSON.parse(decodeURIComponent(currentRole));
|
||||
// config.headers["schoolId"] = schId;
|
||||
// config.headers["userId"] = userId;
|
||||
// config.headers["roleId"] = roleId;
|
||||
if (roleId == 3) {
|
||||
config.headers["userId"] = childId;
|
||||
}
|
||||
sessionStorage.setItem("userId",userId);
|
||||
}
|
||||
if(sessionStorage.getItem("uType")){
|
||||
config.headers["uType"] = sessionStorage.getItem("uType");
|
||||
}
|
||||
return config;
|
||||
});
|
||||
|
||||
// http response 拦截器
|
||||
axios.interceptors.response.use(response => {
|
||||
requestCount--;
|
||||
if (requestCount === 0) {
|
||||
setTimeout(() => {
|
||||
Message.destroy();
|
||||
}, 1500);
|
||||
clearTimeout(tiemObj);
|
||||
}
|
||||
return response;
|
||||
});
|
||||
// axios.defaults.headers.post['Content-Type'] = 'application/x-www-form-urlencoded';
|
||||
// axios.defaults.headers.post['Content-Type'] = 'application/json; charset=utf-8';
|
||||
// axios.defaults.withCredentials = true
|
||||
|
||||
// 返回在vue模板中的调用接口
|
||||
export default {
|
||||
get: function (url, params, success, failure) {
|
||||
return apiAxios("GET", url, params, success, failure);
|
||||
},
|
||||
post: function (url, params, success, failure) {
|
||||
return apiAxios("POST", url, params, success, failure);
|
||||
},
|
||||
put: function (url, params, success, failure) {
|
||||
return apiAxios("PUT", url, params, success, failure);
|
||||
},
|
||||
delete: function (url, params, success, failure) {
|
||||
return apiAxios("DELETE", url, params, success, failure);
|
||||
},
|
||||
};
|
||||
@@ -0,0 +1,180 @@
|
||||
// 配置API接口地址
|
||||
// var root = '/api/v1'
|
||||
// var root = '/api/debugapi'
|
||||
var root = "/api";
|
||||
// var root = ''
|
||||
// 引用axios
|
||||
var axios = require("axios");
|
||||
|
||||
// import Notice from 'iview/src/components/notice';
|
||||
import { Message } from "view-design";
|
||||
|
||||
// 自定义判断元素类型JS
|
||||
function toType(obj) {
|
||||
return {}.toString
|
||||
.call(obj)
|
||||
.match(/\s([a-zA-Z]+)/)[1]
|
||||
.toLowerCase();
|
||||
}
|
||||
// 参数过滤函数
|
||||
function filterNull(o) {
|
||||
for (var key in o) {
|
||||
if (o[key] === null) {
|
||||
delete o[key];
|
||||
}
|
||||
if (toType(o[key]) === "string") {
|
||||
o[key] = o[key].trim();
|
||||
} else if (toType(o[key]) === "object") {
|
||||
o[key] = filterNull(o[key]);
|
||||
} else if (toType(o[key]) === "array") {
|
||||
o[key] = filterNull(o[key]);
|
||||
}
|
||||
}
|
||||
return o;
|
||||
}
|
||||
/*
|
||||
接口处理函数
|
||||
这个函数每个项目都是不一样的,我现在调整的是适用于
|
||||
https://cnodejs.org/api/v1 的接口,如果是其他接口
|
||||
需要根据接口的参数进行调整。参考说明文档地址:
|
||||
https://cnodejs.org/topic/5378720ed6e2d16149fa16bd
|
||||
主要是,不同的接口的成功标识和失败提示是不一致的。
|
||||
另外,不同的项目的处理方法也是不一致的,这里出错就是简单的alert
|
||||
*/
|
||||
|
||||
function apiAxios(method, url, params, success, failure) {
|
||||
let conentTypeIsJosn = false;
|
||||
if (params && typeof params != "string") {
|
||||
params = filterNull(params);
|
||||
} else conentTypeIsJosn = true;
|
||||
|
||||
// if (!window.location.origin) {
|
||||
// window.location.origin = window.location.protocol + "//" + window.location.hostname + (window.location.port ? ':' + window.location.port: '');
|
||||
// }
|
||||
// let redirectUrl=window.location.origin + window.location.hash.replace('#','/xiaoxi/#');
|
||||
|
||||
// console.log(window.location);
|
||||
|
||||
axios({
|
||||
method: method,
|
||||
url: url,
|
||||
data: method === "POST" || method === "PUT" ? params : null,
|
||||
params: method === "GET" || method === "DELETE" ? params : null,
|
||||
baseURL: root,
|
||||
// withCredentials: true,
|
||||
crossDomain: true,
|
||||
transformRequest: [
|
||||
function(data) {
|
||||
// Do whatever you want to transform the data
|
||||
if (conentTypeIsJosn) return data;
|
||||
let ret = "";
|
||||
for (let it in data) {
|
||||
ret +=
|
||||
encodeURIComponent(it) + "=" + encodeURIComponent(data[it]) + "&";
|
||||
}
|
||||
return ret;
|
||||
},
|
||||
],
|
||||
headers: {
|
||||
// 'Content-Type': 'application/x-www-form-urlencoded',
|
||||
"Content-Type": conentTypeIsJosn
|
||||
? "application/json"
|
||||
: "application/x-www-form-urlencoded",
|
||||
},
|
||||
})
|
||||
.then(function(res) {
|
||||
let response = res.data;
|
||||
if (response.State) {
|
||||
if (success) {
|
||||
success(response);
|
||||
}
|
||||
} else {
|
||||
if (failure) {
|
||||
failure(response.Data);
|
||||
} else {
|
||||
if (response.Data == 2) {
|
||||
Message.error(response.Message); //错误处理
|
||||
setTimeout(() => {
|
||||
location.reload();
|
||||
}, 1000);
|
||||
} else {
|
||||
Message.info(response.Message); //错误处理
|
||||
}
|
||||
}
|
||||
}
|
||||
})
|
||||
.catch(function(err) {
|
||||
let res = err.response;
|
||||
console.error(res || err);
|
||||
if (res) {
|
||||
Message.destroy();
|
||||
clearTimeout(tiemObj);
|
||||
// if(res.status===401&&res.data.OtherData.ErrorCode==2){
|
||||
if (res.status === 401) {
|
||||
window.location.reload();
|
||||
// if(process.env.NODE_ENV === 'production')
|
||||
// Message.error(res.data.Message);//错误处理
|
||||
// setTimeout(() => {
|
||||
// location.reload();
|
||||
// }, 0);
|
||||
} else if (res.data.Message) {
|
||||
Message.error(res.data.Message); //错误处理
|
||||
} else {
|
||||
Message.error("网络请求出错"); //错误处理
|
||||
}
|
||||
return;
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
let requestCount = 0,
|
||||
tiemObj;
|
||||
// http request 拦截器
|
||||
axios.interceptors.request.use((config) => {
|
||||
requestCount++;
|
||||
if (requestCount == 1) {
|
||||
tiemObj = setTimeout(() => {
|
||||
Message.loading({ content: "加载中...", duration: 0 });
|
||||
}, 800);
|
||||
}
|
||||
if (localStorage.getItem("currentRole"))
|
||||
config.headers["currentRole"] = localStorage.getItem("currentRole");
|
||||
|
||||
if (process.env.NODE_ENV !== "production") {
|
||||
//如果是开发环境
|
||||
config.headers["DebugUser"] = "zhd";
|
||||
config.headers["DebugAppType"] = true;
|
||||
}
|
||||
return config;
|
||||
});
|
||||
|
||||
// http response 拦截器
|
||||
axios.interceptors.response.use((response) => {
|
||||
requestCount--;
|
||||
if (requestCount === 0) {
|
||||
setTimeout(() => {
|
||||
Message.destroy();
|
||||
}, 1500);
|
||||
clearTimeout(tiemObj);
|
||||
}
|
||||
return response;
|
||||
});
|
||||
// axios.defaults.headers.post['Content-Type'] = 'application/x-www-form-urlencoded';
|
||||
// axios.defaults.headers.post['Content-Type'] = 'application/json; charset=utf-8';
|
||||
// axios.defaults.withCredentials = true
|
||||
|
||||
// 返回在vue模板中的调用接口
|
||||
export default {
|
||||
get: function(url, params, success, failure) {
|
||||
return apiAxios("GET", url, params, success, failure);
|
||||
},
|
||||
post: function(url, params, success, failure) {
|
||||
return apiAxios("POST", url, params, success, failure);
|
||||
},
|
||||
put: function(url, params, success, failure) {
|
||||
return apiAxios("PUT", url, params, success, failure);
|
||||
},
|
||||
delete: function(url, params, success, failure) {
|
||||
return apiAxios("DELETE", url, params, success, failure);
|
||||
},
|
||||
};
|
||||
|
After Width: | Height: | Size: 31 KiB |
|
After Width: | Height: | Size: 14 KiB |
@@ -0,0 +1,59 @@
|
||||
var HtmlUtil = {
|
||||
/*1.用浏览器内部转换器实现html转码*/
|
||||
htmlEncode: function(html) {
|
||||
//1.首先动态创建一个容器标签元素,如DIV
|
||||
var temp = document.createElement("div");
|
||||
//2.然后将要转换的字符串设置为这个元素的innerText(ie支持)或者textContent(火狐,google支持)
|
||||
temp.textContent != undefined ? (temp.textContent = html) : (temp.innerText = html);
|
||||
//3.最后返回这个元素的innerHTML,即得到经过HTML编码转换的字符串了
|
||||
var output = temp.innerHTML;
|
||||
temp = null;
|
||||
return output;
|
||||
},
|
||||
/*2.用浏览器内部转换器实现html解码*/
|
||||
htmlDecode: function(text) {
|
||||
//1.首先动态创建一个容器标签元素,如DIV
|
||||
var temp = document.createElement("div");
|
||||
//2.然后将要转换的字符串设置为这个元素的innerHTML(ie,火狐,google都支持)
|
||||
temp.innerHTML = text;
|
||||
//3.最后返回这个元素的innerText(ie支持)或者textContent(火狐,google支持),即得到经过HTML解码的字符串了。
|
||||
var output = temp.innerText || temp.textContent;
|
||||
temp = null;
|
||||
return output;
|
||||
},
|
||||
/*3.用正则表达式实现html转码*/
|
||||
htmlEncodeByRegExp: function(str) {
|
||||
var s = "";
|
||||
if (str.length == 0) return "";
|
||||
s = str.replace(/&/g, "&");
|
||||
s = s.replace(/</g, "<");
|
||||
s = s.replace(/>/g, ">");
|
||||
s = s.replace(/ /g, " ");
|
||||
s = s.replace(/\'/g, "'");
|
||||
s = s.replace(/\"/g, """);
|
||||
return s;
|
||||
},
|
||||
/*4.用正则表达式实现html解码*/
|
||||
htmlDecodeByRegExp: function(str) {
|
||||
var s = "";
|
||||
if (str.length == 0) return "";
|
||||
s = str.replace(/&/g, "&");
|
||||
s = s.replace(/</g, "<");
|
||||
s = s.replace(/>/g, ">");
|
||||
s = s.replace(/ /g, " ");
|
||||
s = s.replace(/'/g, "'");
|
||||
s = s.replace(/"/g, '"');
|
||||
return s;
|
||||
}
|
||||
};
|
||||
|
||||
export const load = name => {
|
||||
let url = (process.env.NODE_ENV === "production" ? "/SchConfig/standard" : "") + "/code/" + name;
|
||||
// let url = "../code/" + name;
|
||||
return new Promise((resolve, reject) => {
|
||||
$.get(url, resp => {
|
||||
let encode = HtmlUtil.htmlEncode(resp);
|
||||
resolve({ html: resp, encode });
|
||||
});
|
||||
});
|
||||
};
|
||||
@@ -0,0 +1,97 @@
|
||||
ol,p,h1,h2,h3,h4,h5,ul,dd,dt,ol{padding:0px;margin:0px;list-style:none}
|
||||
html{-webkit-text-size-adjust:none}
|
||||
body{width:100%;margin:0;padding:0;position:relative;height:100%;color:#333;min-width:1200px}
|
||||
html,body,#app{margin:0;padding:0;height:100%;font-size:14px;}
|
||||
a{
|
||||
text-decoration:none;-webkit-tap-highlight-color:transparent;outline:none;
|
||||
&:hover,&:active{text-decoration:none}
|
||||
}
|
||||
*{border:0;margin:0;padding:0;box-sizing:border-box;font-family:'PingFang SC',tahoma,arial,'helvetica neue','hiragino sans gb','microsoft yahei',sans-serif}
|
||||
|
||||
|
||||
|
||||
//搜索框
|
||||
.search-wrap {
|
||||
background: #f7f7f7;
|
||||
padding: 15px;
|
||||
&_date {
|
||||
.ivu-date-picker {
|
||||
width: 150px;
|
||||
}
|
||||
}
|
||||
&_sel{
|
||||
width:150px;
|
||||
float: left;
|
||||
}
|
||||
&_input{
|
||||
width:200px;
|
||||
float: left;
|
||||
}
|
||||
}
|
||||
|
||||
.public {
|
||||
&-custom-switch {
|
||||
.ivu-radio-wrapper-checked {
|
||||
background: #6b8cf4 !important;
|
||||
border-color: #6b8cf4 !important;
|
||||
}
|
||||
.ivu-radio-group-item {
|
||||
width: 90px;
|
||||
text-align: center;
|
||||
}
|
||||
}
|
||||
|
||||
&-upload-img {
|
||||
li {
|
||||
width: 100px;
|
||||
height: 100px;
|
||||
border: 1px solid #eee;
|
||||
border-radius: 2px;
|
||||
padding: 4px;
|
||||
position: relative;
|
||||
float: left;
|
||||
margin: 0 10px 10px 0;
|
||||
|
||||
img {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
object-fit: contain;
|
||||
}
|
||||
|
||||
&:hover .upload-list-cover {
|
||||
display: block;
|
||||
}
|
||||
|
||||
.upload-list-cover {
|
||||
position: absolute;
|
||||
top: 4px;
|
||||
bottom: 4px;
|
||||
left: 4px;
|
||||
right: 4px;
|
||||
background: rgba(0, 0, 0, 0.6);
|
||||
text-align: center;
|
||||
display: none;
|
||||
transition: all 0.3s;
|
||||
|
||||
i {
|
||||
color: #fff;
|
||||
position: relative;
|
||||
top: 50%;
|
||||
cursor: pointer;
|
||||
transform: translateY(-50%);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
li.add-li {
|
||||
border: none;
|
||||
padding: 0;
|
||||
width: 100px;
|
||||
height: 100px;
|
||||
}
|
||||
|
||||
li .add-box i {
|
||||
line-height: 100px;
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1 @@
|
||||
article,aside,details,figcaption,figure,footer,header,hgroup,main,nav,section,summary{display:block;}audio,canvas,video{display:inline-block;}audio:not([controls]){display:none;height:0;}[hidden]{display:none;}html{font-family:sans-serif;-ms-text-size-adjust:100%;-webkit-text-size-adjust:100%;}body{margin:0;}a:focus{outline:thin dotted;}a:active,a:hover{outline:0;}h1{font-size:2em;margin:0.67em 0;}abbr[title]{border-bottom:1px dotted;}b,strong{font-weight:bold;}dfn{font-style:italic;}hr{-moz-box-sizing:content-box;box-sizing:content-box;height:0;}mark{background:#ff0;color:#000;}code,kbd,pre,samp{font-family:monospace,serif;font-size:1em;}pre{white-space:pre-wrap;}q{quotes:"\201C" "\201D" "\2018" "\2019";}small{font-size:80%;}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline;}sup{top:-0.5em;}sub{bottom:-0.25em;}img{border:0;}svg:not(:root){overflow:hidden;}figure{margin:0;}fieldset{border:1px solid #c0c0c0;margin:0 2px;padding:0.35em 0.625em 0.75em;}legend{border:0;padding:0;}button,input,select,textarea{font-family:inherit;font-size:100%;margin:0;}button,input{line-height:normal;}button,select{text-transform:none;}button,html input[type="button"],input[type="reset"],input[type="submit"]{-webkit-appearance:button;cursor:pointer;}button[disabled],html input[disabled]{cursor:default;}input[type="checkbox"],input[type="radio"]{box-sizing:border-box;padding:0;}input[type="search"]{-webkit-appearance:textfield;-moz-box-sizing:content-box;-webkit-box-sizing:content-box;box-sizing:content-box;}input[type="search"]::-webkit-search-cancel-button,input[type="search"]::-webkit-search-decoration{-webkit-appearance:none;}button::-moz-focus-inner,input::-moz-focus-inner{border:0;padding:0;}textarea{overflow:auto;vertical-align:top;}table{border-collapse:collapse;border-spacing:0;}
|
||||
@@ -0,0 +1,161 @@
|
||||
.f10 {
|
||||
font-size: 10px;
|
||||
}
|
||||
.f12 {
|
||||
font-size: 12px;
|
||||
}
|
||||
.f13 {
|
||||
font-size: 13px;
|
||||
}
|
||||
.f14 {
|
||||
font-size: 14px;
|
||||
}
|
||||
.f15 {
|
||||
font-size: 15px;
|
||||
}
|
||||
.f16 {
|
||||
font-size: 16px;
|
||||
}
|
||||
.f17 {
|
||||
font-size: 17px;
|
||||
}
|
||||
.f18 {
|
||||
font-size: 18px;
|
||||
}
|
||||
.f20 {
|
||||
font-size: 20px;
|
||||
}
|
||||
.f24 {
|
||||
font-size: 24px;
|
||||
}
|
||||
// 文字对齐
|
||||
.tl {
|
||||
text-align: left;
|
||||
}
|
||||
.tc {
|
||||
text-align: center;
|
||||
}
|
||||
.tr {
|
||||
text-align: right;
|
||||
}
|
||||
//浮动
|
||||
.fr {
|
||||
float: right !important;
|
||||
}
|
||||
.fl {
|
||||
float: left !important;
|
||||
}
|
||||
.fix {
|
||||
*zoom: 1;
|
||||
}
|
||||
.fix:after {
|
||||
display: table;
|
||||
content: "";
|
||||
clear: both;
|
||||
}
|
||||
.clearfix {
|
||||
@extend .fix;
|
||||
}
|
||||
// 显示
|
||||
.dn {
|
||||
display: none;
|
||||
}
|
||||
.di {
|
||||
display: inline;
|
||||
}
|
||||
.db {
|
||||
display: block;
|
||||
}
|
||||
.dib {
|
||||
display: inline-block;
|
||||
}
|
||||
.dt {
|
||||
display: table;
|
||||
}
|
||||
div.dib {
|
||||
*display: inline;
|
||||
*zoom: 1;
|
||||
}
|
||||
.vm {
|
||||
vertical-align: middle;
|
||||
}
|
||||
.vib {
|
||||
display: inline-block;
|
||||
vertical-align: middle;
|
||||
}
|
||||
|
||||
// 定位
|
||||
.pr {
|
||||
position: relative;
|
||||
}
|
||||
.pa {
|
||||
position: absolute;
|
||||
}
|
||||
.pf {
|
||||
position: fixed;
|
||||
}
|
||||
|
||||
.oh {
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
@for $i from 1 through 100 {
|
||||
.width-#{$i} {
|
||||
width: $i * 1px;
|
||||
}
|
||||
.height-#{$i} {
|
||||
height: $i * 1px;
|
||||
}
|
||||
.ml-#{$i} {
|
||||
margin-left: $i * 1px;
|
||||
}
|
||||
.mr-#{$i} {
|
||||
margin-right: $i * 1px;
|
||||
}
|
||||
.mt-#{$i} {
|
||||
margin-top: $i * 1px;
|
||||
}
|
||||
.mb-#{$i} {
|
||||
margin-bottom: $i * 1px;
|
||||
}
|
||||
}
|
||||
|
||||
.align-middle {
|
||||
position: relative;
|
||||
top: 50%;
|
||||
transform: translateY(-50%);
|
||||
}
|
||||
.align-middle-wrap {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
//0.5px
|
||||
@mixin border(
|
||||
$borderWidth: 1px,
|
||||
$borderStyle: solid,
|
||||
$borderColor: #ddd,
|
||||
$borderRadius: 0
|
||||
) {
|
||||
position: relative;
|
||||
&:before {
|
||||
content: "";
|
||||
position: absolute;
|
||||
width: 200%;
|
||||
height: 200%;
|
||||
top: 0;
|
||||
left: 0;
|
||||
transform-origin: left top;
|
||||
-webkit-transform-origin: left top;
|
||||
-webkit-transform: scale(0.5);
|
||||
box-sizing: border-box;
|
||||
pointer-events: none;
|
||||
}
|
||||
|
||||
&:before {
|
||||
border-width: $borderWidth;
|
||||
border-style: $borderStyle;
|
||||
border-color: $borderColor;
|
||||
border-radius: $borderRadius;
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,84 @@
|
||||
/*滚动条样式 */
|
||||
|
||||
/*第一种样式,所有的滚动条,都默认这个样子*/
|
||||
|
||||
*::-webkit-scrollbar {
|
||||
width: 10px;
|
||||
height: 10px;
|
||||
}
|
||||
|
||||
/*正常情况下滑块的样式*/
|
||||
*::-webkit-scrollbar-thumb {
|
||||
background-color: rgba(0, 0, 0, .05);
|
||||
border-radius: 10px;
|
||||
-webkit-box-shadow: inset 1px 1px 0 rgba(0, 0, 0, .1);
|
||||
}
|
||||
|
||||
/*鼠标悬浮在该类指向的控件上时滑块的样式*/
|
||||
*:hover::-webkit-scrollbar-thumb {
|
||||
background-color: rgba(0, 0, 0, .2);
|
||||
border-radius: 10px;
|
||||
-webkit-box-shadow: inset 1px 1px 0 rgba(0, 0, 0, .1);
|
||||
}
|
||||
|
||||
/*鼠标悬浮在滑块上时滑块的样式*/
|
||||
*::-webkit-scrollbar-thumb:hover {
|
||||
background-color: rgba(0, 0, 0, .3);
|
||||
-webkit-box-shadow: inset 1px 1px 0 rgba(0, 0, 0, .1);
|
||||
}
|
||||
|
||||
/*正常时候的主干部分*/
|
||||
*::-webkit-scrollbar-track {
|
||||
border-radius: 10px;
|
||||
-webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0);
|
||||
background-color: white;
|
||||
}
|
||||
|
||||
/*鼠标悬浮在滚动条上的主干部分*/
|
||||
*::-webkit-scrollbar-track:hover {
|
||||
-webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, .4);
|
||||
background-color: rgba(0, 0, 0, .01);
|
||||
}
|
||||
|
||||
/*第一种样式结束*/
|
||||
|
||||
|
||||
/*第二种样式*/
|
||||
|
||||
.scroll2::-webkit-scrollbar {
|
||||
width: 10px;
|
||||
height: 10px;
|
||||
}
|
||||
|
||||
/*正常时候的主干部分*/
|
||||
.scroll2::-webkit-scrollbar-track {
|
||||
border-radius: 10px;
|
||||
-webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0);
|
||||
background-color: white;
|
||||
}
|
||||
|
||||
/*正常情况下滑块的样式*/
|
||||
.scroll2::-webkit-scrollbar-thumb {
|
||||
background-color: rgba(0, 0, 0, .05);
|
||||
border-radius: 10px;
|
||||
-webkit-box-shadow: inset 1px 1px 0 rgba(0, 0, 0, .1);
|
||||
}
|
||||
|
||||
/*鼠标悬浮在该类指向的控件上时滑块的样式*/
|
||||
.scroll2:hover::-webkit-scrollbar-thumb {
|
||||
background-color: rgba(0, 0, 0, .2);
|
||||
border-radius: 10px;
|
||||
-webkit-box-shadow: inset 1px 1px 0 rgba(0, 0, 0, .1);
|
||||
}
|
||||
|
||||
/*鼠标悬浮在滚动条上的主干部分*/
|
||||
.scroll2::-webkit-scrollbar-track:hover {
|
||||
-webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, .4);
|
||||
}
|
||||
|
||||
/*鼠标悬浮在滑块上时滑块的样式*/
|
||||
.scroll2::-webkit-scrollbar-thumb:hover {
|
||||
-webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, .4);
|
||||
}
|
||||
|
||||
/*第二种样式结束*/
|
||||
@@ -0,0 +1,31 @@
|
||||
@import "base";
|
||||
@import "normalize";
|
||||
@import "utils";
|
||||
@import "bscroll.css";
|
||||
// @import "iview_override";
|
||||
|
||||
.webapp-panel{
|
||||
background: url(../image/phone.png) no-repeat;
|
||||
width: 337px;
|
||||
height: 580px;
|
||||
padding: 50px 35px 60px 35px;
|
||||
}
|
||||
.ivu-tree-arrow .ivu-icon-ios-arrow-forward:before {
|
||||
content: "\e65c"; /* 例如,使用阿里巴巴矢量图标库的某个图标 */
|
||||
font-family: "iconfont"; /* 替换为你的图标字体 */
|
||||
color: #8e9397;
|
||||
}
|
||||
.ivu-tree-arrow-open .ivu-icon-ios-arrow-forward:before {
|
||||
content: "\e65d"; /* 例如,使用阿里巴巴矢量图标库的某个图标 */
|
||||
font-family: "iconfont"; /* 替换为你的图标字体 */
|
||||
color: #8e9397;
|
||||
}
|
||||
.ivu-tree-arrow-open i{
|
||||
transform: rotate(0deg);
|
||||
}
|
||||
|
||||
@media screen and (max-width: 1366px) {
|
||||
html {
|
||||
zoom: 0.9;
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,473 @@
|
||||
$tabBtnColor: #577ae9;//tab主题色
|
||||
$treeCheckColor: #577ae9;//树主题色
|
||||
$treeCheckBorderColor: #dddee1;//边框色
|
||||
$treeCheckGroupColor: #f7f7f7;
|
||||
|
||||
.fix {
|
||||
*zoom: 1;
|
||||
&::before,
|
||||
&::after {
|
||||
display: table;
|
||||
content: "";
|
||||
line-height: 0;
|
||||
}
|
||||
&::after {
|
||||
clear: both;
|
||||
}
|
||||
}
|
||||
.fl {
|
||||
float: left;
|
||||
}
|
||||
.fr {
|
||||
float: right;
|
||||
}
|
||||
.align-middle {
|
||||
position: relative;
|
||||
top: 50%;
|
||||
transform: translateY(-50%);
|
||||
}
|
||||
|
||||
.my-tab_btn {
|
||||
margin: 10px auto;
|
||||
position: relative;
|
||||
.item-tab_btn {
|
||||
font-size: 16px;
|
||||
font-weight: 550;
|
||||
color: #656667;
|
||||
float: left;
|
||||
text-align: center;
|
||||
position: relative;
|
||||
box-sizing: border-box;
|
||||
height: 32px;
|
||||
line-height: 32px;
|
||||
margin-left: 15px;
|
||||
}
|
||||
|
||||
.item-tab_btn.active {
|
||||
color: #272829;
|
||||
}
|
||||
|
||||
.my-tab_slider {
|
||||
width: 42px;
|
||||
position: absolute;
|
||||
left: 0px;
|
||||
bottom: -1px;
|
||||
z-index: 1;
|
||||
transition: transform 0.3s ease-in-out;
|
||||
transform-origin: 0 0;
|
||||
& > .indicator {
|
||||
height: 2px;
|
||||
width: 17px;
|
||||
background: $tabBtnColor;
|
||||
margin: 0 auto;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.my-tab_card {
|
||||
margin: 15px 0 15px 10px;
|
||||
padding-right: 30px;
|
||||
position: relative;
|
||||
.item-wrap{
|
||||
white-space: nowrap;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
overflow: hidden;
|
||||
overflow-x: scroll;
|
||||
}
|
||||
.item-tab_card {
|
||||
float: left;
|
||||
font-size: 13px;
|
||||
padding: 0px 15px;
|
||||
color: #808080;
|
||||
height: 27px;
|
||||
line-height: 27px;
|
||||
transition: all 200ms;
|
||||
}
|
||||
.item-tab_card.active {
|
||||
color: #272829;
|
||||
background: #f7f7f7;
|
||||
border-radius: 27px;
|
||||
}
|
||||
}
|
||||
|
||||
.my-modal {
|
||||
position: fixed;
|
||||
left: 0;
|
||||
top: 0;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
opacity: 0.5;
|
||||
background: #000;
|
||||
z-index: 100;
|
||||
}
|
||||
|
||||
.tree-popup {
|
||||
position: fixed;
|
||||
background: #fff;
|
||||
top: 100%;
|
||||
left: 0;
|
||||
transform: translateY(0);
|
||||
backface-visibility: hidden;
|
||||
transition: 0.2s ease-in;
|
||||
width: 100%;
|
||||
height: 85%;
|
||||
z-index: 101;
|
||||
border-radius: 8px 8px 0 0;
|
||||
&_show {
|
||||
transform: translateY(-100%);
|
||||
}
|
||||
&_hide {
|
||||
transform: translateY(0%);
|
||||
}
|
||||
|
||||
&_header {
|
||||
position: relative;
|
||||
overflow: hidden;
|
||||
@extend .my-border_bottom;
|
||||
|
||||
& .close-btn {
|
||||
position: absolute;
|
||||
padding: 5px;
|
||||
right: 3%;
|
||||
top: 10px;
|
||||
}
|
||||
}
|
||||
&_body {
|
||||
overflow-y: auto;
|
||||
min-height: 250px;
|
||||
}
|
||||
|
||||
&_footer {
|
||||
height: 60px;
|
||||
width: 100%;
|
||||
box-sizing: border-box;
|
||||
background: #fff;
|
||||
position: relative;
|
||||
padding: 0 10px 0 20px;
|
||||
@extend .my-border_top;
|
||||
.check-box {
|
||||
float: left;
|
||||
&_text {
|
||||
margin-left: 3px;
|
||||
margin-right: 30px;
|
||||
vertical-align: middle;
|
||||
font-size: 16px;
|
||||
}
|
||||
}
|
||||
|
||||
& p {
|
||||
font-size: 16px;
|
||||
color: #808080;
|
||||
|
||||
span {
|
||||
font-size: 18px;
|
||||
color: $treeCheckColor;
|
||||
}
|
||||
}
|
||||
& button {
|
||||
width: 80px;
|
||||
height: 40px;
|
||||
color: #fff;
|
||||
background: $treeCheckColor;
|
||||
border-radius: 5px;
|
||||
outline: none;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.search-list {
|
||||
background: #f7f7f7;
|
||||
height: calc(100% - 46px);
|
||||
margin-top:46px;
|
||||
box-sizing: border-box;
|
||||
overflow-y: auto;
|
||||
.search-head {
|
||||
height: 46px;
|
||||
line-height: 46px;
|
||||
padding: 0 10px 0 15px;
|
||||
width: 100%;
|
||||
position: fixed;
|
||||
box-sizing: border-box;
|
||||
background: #f7f7f7;
|
||||
input {
|
||||
background: #efefef;
|
||||
-webkit-appearance: none;
|
||||
outline: none;
|
||||
width: calc(100% - 70px);
|
||||
height: 30px;
|
||||
line-height: 30px;
|
||||
padding: 0 15px;
|
||||
border-radius: 28px;
|
||||
font-size: 14px;
|
||||
&::-webkit-input-placeholder {
|
||||
font-size: 14px;
|
||||
}
|
||||
}
|
||||
span {
|
||||
margin-left: 5px;
|
||||
color: #272829;
|
||||
font-size: 14px;
|
||||
}
|
||||
|
||||
.close-icon {
|
||||
width: 18px;
|
||||
line-height: 18px;
|
||||
height: 18px;
|
||||
position: absolute;
|
||||
right: 60px;
|
||||
top: 15px;
|
||||
}
|
||||
}
|
||||
.search-item {
|
||||
background: #fff;
|
||||
height: 46px;
|
||||
line-height: 46px;
|
||||
padding-left: 12px;
|
||||
a {
|
||||
position: relative;
|
||||
display: block;
|
||||
width: 100%;
|
||||
color: #333;
|
||||
outline: none;
|
||||
@extend .my-border_bottom;
|
||||
}
|
||||
&_text {
|
||||
margin-left: 2px;
|
||||
vertical-align: middle;
|
||||
}
|
||||
&_group {
|
||||
float: right;
|
||||
color: #808080;
|
||||
font-size: 12px;
|
||||
margin-right: 15px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.user-popup {
|
||||
position: fixed;
|
||||
background: #fff;
|
||||
top: 100%;
|
||||
left: 0;
|
||||
transform: translateY(0);
|
||||
backface-visibility: hidden;
|
||||
transition: 0.2s ease-in;
|
||||
width: 100%;
|
||||
height: 75%;
|
||||
z-index: 105;
|
||||
border-radius: 8px 8px 0 0;
|
||||
&_show {
|
||||
transform: translateY(-100%);
|
||||
}
|
||||
&_hide {
|
||||
transform: translateY(0%);
|
||||
}
|
||||
&_header {
|
||||
position: relative;
|
||||
overflow: hidden;
|
||||
@extend .my-border_bottom;
|
||||
h4 {
|
||||
font-size: 18px;
|
||||
margin: 12px 0 5px;
|
||||
color: #272829;
|
||||
text-align: center;
|
||||
}
|
||||
h6 {
|
||||
color: #595959;
|
||||
font-size: 13px;
|
||||
margin: 5px 0 15px;
|
||||
text-align: center;
|
||||
}
|
||||
& .close-btn {
|
||||
position: absolute;
|
||||
padding: 5px;
|
||||
right: 3%;
|
||||
top: 10px;
|
||||
}
|
||||
}
|
||||
&_body {
|
||||
overflow-y: auto;
|
||||
height: calc(100% - 70px);
|
||||
padding: 12px 12px;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
&_ul {
|
||||
@extend .fix;
|
||||
li {
|
||||
background: #f4f8ff;
|
||||
float: left;
|
||||
margin: 4px;
|
||||
width: calc(33.333% - 8px);
|
||||
border-radius: 4px;
|
||||
padding: 8px;
|
||||
box-sizing: border-box;
|
||||
h4,
|
||||
h6 {
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
}
|
||||
h4 {
|
||||
font-size: 16px;
|
||||
margin: 6px 0;
|
||||
color: #272829;
|
||||
text-align: center;
|
||||
}
|
||||
h6 {
|
||||
color: #595959;
|
||||
font-size: 12px;
|
||||
height: 16px;
|
||||
margin: 6px 0;
|
||||
text-align: center;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.search-box {
|
||||
position: absolute;
|
||||
right: 10px;
|
||||
width: 20px;
|
||||
height: 20px;
|
||||
box-sizing: border-box;
|
||||
padding: 2px;
|
||||
top: 2px;
|
||||
background: #fff;
|
||||
}
|
||||
|
||||
.bg-arrow_grey {
|
||||
background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACQAAAAkCAYAAADhAJiYAAABE0lEQVRYR+3VMQ6CMBQG4PdImPUIHsEjeBRZCJ30KDqVsNSjeASPwBF0Y6KmiSQM0NfXdiDmsZDQ0n79Wx4IG7twYx4QELUjkpAkRCVAtcsZ+p+EjDH7YRj2SqmeWhWnveu6Y1mWfVVV76X3Vs9Q27Y3RLyM41gppR6cSdf6aq3PRVEYa+29aZorC+RWYq19AsAuB2rCAMAHEU91Xb9YINc5FyoU4+YkP/tUFAcTBEpJiosJBsWgYjAsEAcVi2GDQlApmCiQD5WKiQYtodwzV/SoOkMVWPKz9w0wLwm/ft6iR2GSEpoGn6HAV4FDMFlAbhCt9cHdc/yIk7YsdNWcfgKi0pKEJCEqAapdzpAkRCVAtX8BqXjGJWAVZBoAAAAASUVORK5CYII=");
|
||||
background-repeat: no-repeat;
|
||||
display: inline-block;
|
||||
width: 64px;
|
||||
height: 64px;
|
||||
zoom: 0.3;
|
||||
background-size: contain;
|
||||
}
|
||||
|
||||
.conta-wrap {
|
||||
position: relative;
|
||||
.tree-item {
|
||||
padding: 12px;
|
||||
color: #333;
|
||||
position: relative;
|
||||
a {
|
||||
color: #333;
|
||||
display: inline-block;
|
||||
outline: none;
|
||||
text-decoration: none;
|
||||
}
|
||||
input {
|
||||
display: none;
|
||||
}
|
||||
label {
|
||||
position: relative;
|
||||
vertical-align: middle;
|
||||
margin-left: 2px;
|
||||
}
|
||||
&_group {
|
||||
background: $treeCheckGroupColor;
|
||||
@extend .my-border_bottom;
|
||||
}
|
||||
|
||||
&_arrow {
|
||||
&::before {
|
||||
@extend .bg-arrow_grey;
|
||||
content: "";
|
||||
display: block;
|
||||
position: absolute;
|
||||
right: 2%;
|
||||
top: 0;
|
||||
bottom: 0;
|
||||
margin: auto 0;
|
||||
transition: 300ms cubic-bezier(0.47, 0, 0.745, 0.715);
|
||||
}
|
||||
}
|
||||
&_open,
|
||||
&_close {
|
||||
@extend .tree-item_arrow;
|
||||
}
|
||||
&_close::before {
|
||||
transform: rotate(180deg);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.my-checkbox-core {
|
||||
border-radius: 3px;
|
||||
width: 20px;
|
||||
height: 20px;
|
||||
display: inline-block;
|
||||
background-color: #fff;
|
||||
border: 1px solid $treeCheckBorderColor;
|
||||
position: relative;
|
||||
vertical-align: middle;
|
||||
}
|
||||
.my-checkbox-core.active {
|
||||
background-color: $treeCheckColor;
|
||||
border-color: $treeCheckColor;
|
||||
&::after {
|
||||
border: 2px solid transparent;
|
||||
border-left: 0;
|
||||
border-top: 0;
|
||||
content: " ";
|
||||
top: 3px;
|
||||
left: 7px;
|
||||
position: absolute;
|
||||
width: 4px;
|
||||
height: 8px;
|
||||
-webkit-transform: rotate(45deg) scale(0);
|
||||
transform: rotate(45deg) scale(0);
|
||||
transition: -webkit-transform 0.2s;
|
||||
-webkit-transition: -webkit-transform 0.2s;
|
||||
transition: transform 0.2s;
|
||||
transition: transform 0.2s, -webkit-transform 0.2s;
|
||||
border-color: #fff;
|
||||
-webkit-transform: rotate(45deg) scale(1);
|
||||
transform: rotate(45deg) scale(1);
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
.my-border_bottom::after {
|
||||
content: " ";
|
||||
position: absolute;
|
||||
color: #d9d9d9;
|
||||
-webkit-transform-origin: 0 0;
|
||||
transform-origin: 0 0;
|
||||
border-bottom: 1px solid #d9d9d9;
|
||||
height: 1px;
|
||||
left: 0;
|
||||
bottom: 0;
|
||||
right: 0;
|
||||
-webkit-transform: scaleY(0.5);
|
||||
transform: scaleY(0.5);
|
||||
transition: 0;
|
||||
}
|
||||
|
||||
.my-border_top::after {
|
||||
content: " ";
|
||||
position: absolute;
|
||||
color: #d9d9d9;
|
||||
-webkit-transform-origin: 0 0;
|
||||
transform-origin: 0 0;
|
||||
border-top: 1px solid #d9d9d9;
|
||||
width: 100%;
|
||||
height: 1px;
|
||||
left: 0;
|
||||
top: 0;
|
||||
right: 0;
|
||||
-webkit-transform: scaleY(0.5);
|
||||
transform: scaleY(0.5);
|
||||
transition: 0;
|
||||
}
|
||||
|
||||
.fade-enter-active,
|
||||
.fade-leave-active {
|
||||
transition: opacity 300ms ease-in-out;
|
||||
}
|
||||
.fade-enter,
|
||||
.fade-leave-to {
|
||||
opacity: 0;
|
||||
}
|
||||
@@ -0,0 +1,505 @@
|
||||
<template>
|
||||
<div>
|
||||
<div :id="domId" :class="['tree-popup', isPopupShow ? 'tree-popup_show' : 'tree-popup_hide']">
|
||||
<div class="tree-popup_header">
|
||||
<div class="my-tab_btn fix">
|
||||
<div
|
||||
:class="{
|
||||
'item-tab_btn': true,
|
||||
active: firstTabIndex == tindex,
|
||||
}"
|
||||
@click="tabBtnChange(tindex)"
|
||||
v-for="(titem, tindex) in firstTabData"
|
||||
>
|
||||
{{ titem }}
|
||||
</div>
|
||||
<div class="my-tab_slider" v-if="firstTabData.length > 0" :style="tabSliderStyle">
|
||||
<div class="indicator"></div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="my-tab_card fix" v-if="secondTabData.length > 1">
|
||||
<div class="item-wrap">
|
||||
<div
|
||||
:class="{
|
||||
'item-tab_card': true,
|
||||
active: secondTabIndex == tindex,
|
||||
}"
|
||||
@click="tabCardChange(tindex)"
|
||||
v-for="(titem, tindex) in secondTabData"
|
||||
>
|
||||
{{ titem }}
|
||||
</div>
|
||||
</div>
|
||||
<div class="search-box" @click="isSearchShow = !isSearchShow">
|
||||
<svg t="1626398915347" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="4152" width="16" height="16">
|
||||
<path
|
||||
d="M921.3 874L738.1 690.8c51.3-62.6 82.1-142.5 82.1-229.6 0-200.1-162.8-363-363-363-200.1 0-363 162.8-363 363s162.8 363 363 363c87 0 167-30.8 229.6-82.1L870 925.3c7.1 7.1 16.4 10.6 25.7 10.6s18.6-3.5 25.7-10.6c14.1-14.2 14.1-37.2-0.1-51.3zM166.8 461.2c0-160.1 130.3-290.4 290.4-290.4s290.4 130.3 290.4 290.4-130.3 290.4-290.4 290.4-290.4-130.3-290.4-290.4z"
|
||||
p-id="4153"
|
||||
fill="#808080"
|
||||
></path>
|
||||
</svg>
|
||||
</div>
|
||||
</div>
|
||||
<div class="close-btn" @click="popupColse">
|
||||
<svg t="1626397122082" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="3133" width="14" height="14">
|
||||
<path d="M877.216 491.808" p-id="3134" fill="#595959"></path>
|
||||
<path
|
||||
d="M575.328 510.496 946.784 140.672c17.568-17.504 17.664-45.824 0.192-63.424-17.504-17.632-45.792-17.664-63.36-0.192L512.032 446.944 143.712 77.216C126.304 59.712 97.92 59.648 80.384 77.12 62.848 94.624 62.816 123.008 80.288 140.576l368.224 369.632L77.216 879.808c-17.568 17.504-17.664 45.824-0.192 63.424 8.736 8.8 20.256 13.216 31.776 13.216 11.424 0 22.848-4.352 31.584-13.056l371.36-369.696 371.68 373.088C892.192 955.616 903.68 960 915.168 960c11.456 0 22.912-4.384 31.648-13.088 17.504-17.504 17.568-45.824 0.096-63.392L575.328 510.496 575.328 510.496zM575.328 510.496"
|
||||
p-id="3135"
|
||||
fill="#595959"
|
||||
></path>
|
||||
</svg>
|
||||
</div>
|
||||
</div>
|
||||
<div class="tree-popup_body">
|
||||
<tree v-if="!isSearchShow" :treeData="currentTree" :userids="tempUserIds"></tree>
|
||||
<div v-else class="search-list">
|
||||
<div class="search-head" :style="searchHeadStyle">
|
||||
<input type="text" placeholder="请输入关键字" v-model="searchText" />
|
||||
<div class="close-icon" v-show="searchText" @click="searchText = null">
|
||||
<svg t="1626484787749" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="2043" width="18" height="18">
|
||||
<path
|
||||
d="M512 51.2C258.048 51.2 51.2 258.048 51.2 512s206.848 460.8 460.8 460.8 460.8-206.848 460.8-460.8S765.952 51.2 512 51.2z m181.248 612.352c8.192 8.192 8.192 20.48 0 28.672-4.096 4.096-9.216 6.144-14.336 6.144s-10.24-2.048-14.336-6.144L512 540.672 360.448 693.248c-4.096 4.096-9.216 6.144-14.336 6.144s-10.24-2.048-14.336-6.144c-8.192-8.192-8.192-20.48 0-28.672L483.328 512 330.752 360.448c-8.192-8.192-8.192-20.48 0-28.672s20.48-8.192 28.672 0L512 483.328l151.552-151.552c8.192-8.192 20.48-8.192 28.672 0s8.192 20.48 0 28.672L540.672 512l152.576 151.552z"
|
||||
p-id="2044"
|
||||
fill="#cccccc"
|
||||
></path>
|
||||
</svg>
|
||||
</div>
|
||||
<span @click="isSearchShow = false">取消</span>
|
||||
</div>
|
||||
<div class="search-item" v-for="item in searchList">
|
||||
<a href="javascript:;" @click="checkTreeById(item.id, !item.isCheck)">
|
||||
<span :class="['my-checkbox-core', item.isCheck ? 'active' : '']"></span>
|
||||
<span class="search-item_text">{{ item.name }}</span>
|
||||
|
||||
<span class="search-item_group">{{ item.group }}</span>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="tree-popup_footer fix">
|
||||
<div class="check-box align-middle" v-show="!isSearchShow">
|
||||
<label @click="saveAllCheck">
|
||||
<span :class="['my-checkbox-core', isAllTreeCheck ? 'active' : '']"></span>
|
||||
<span class="check-box_text">全选</span>
|
||||
</label>
|
||||
</div>
|
||||
<p class="fl align-middle" @click="isUserModalShow = true">
|
||||
已选人数:
|
||||
<span>{{ tempUserIds.length }}</span>
|
||||
</p>
|
||||
<button v-show="isSearchShow" class="fr align-middle" @click="isSearchShow = false">确认</button>
|
||||
<button v-show="!isSearchShow" class="fr align-middle" @click="submit">提交</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div v-if="isModalShow" class="my-modal" @click="popupColse"></div>
|
||||
<div :class="['user-popup', isUserModalShow ? 'user-popup_show' : 'user-popup_hide']">
|
||||
<div class="user-popup_header">
|
||||
<h4>已选人员</h4>
|
||||
<h6>共{{ tempUserToNames.length }}人</h6>
|
||||
<div class="close-btn" @click="isUserModalShow = false">
|
||||
<svg t="1626397122082" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="3133" width="14" height="14">
|
||||
<path d="M877.216 491.808" p-id="3134" fill="#595959"></path>
|
||||
<path
|
||||
d="M575.328 510.496 946.784 140.672c17.568-17.504 17.664-45.824 0.192-63.424-17.504-17.632-45.792-17.664-63.36-0.192L512.032 446.944 143.712 77.216C126.304 59.712 97.92 59.648 80.384 77.12 62.848 94.624 62.816 123.008 80.288 140.576l368.224 369.632L77.216 879.808c-17.568 17.504-17.664 45.824-0.192 63.424 8.736 8.8 20.256 13.216 31.776 13.216 11.424 0 22.848-4.352 31.584-13.056l371.36-369.696 371.68 373.088C892.192 955.616 903.68 960 915.168 960c11.456 0 22.912-4.384 31.648-13.088 17.504-17.504 17.568-45.824 0.096-63.392L575.328 510.496 575.328 510.496zM575.328 510.496"
|
||||
p-id="3135"
|
||||
fill="#595959"
|
||||
></path>
|
||||
</svg>
|
||||
</div>
|
||||
</div>
|
||||
<div class="user-popup_body">
|
||||
<ul class="user-popup_ul">
|
||||
<li v-for="item in tempUserToNames">
|
||||
<h4>{{ item.name }}</h4>
|
||||
<h6>{{ item.group }}</h6>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
<div v-if="isUserModalShow" style="z-index: 103" class="my-modal" @click="isUserModalShow = false"></div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
// import { Toast } from "vant";
|
||||
require("./index.scss");
|
||||
import tree from "./tree.vue";
|
||||
export default {
|
||||
components: { tree },
|
||||
props: {
|
||||
treeData: {
|
||||
type: Array,
|
||||
default: [],
|
||||
},
|
||||
userids: {
|
||||
type: Array,
|
||||
default: [],
|
||||
},
|
||||
},
|
||||
model: {
|
||||
prop: "userids",
|
||||
event: "change",
|
||||
},
|
||||
provide() {
|
||||
return {
|
||||
checkTreeById: this.checkTreeById,
|
||||
};
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
tempUserIds: [],
|
||||
firstTabIndex: 0,
|
||||
secondTabIndex: 0,
|
||||
tabData: [],
|
||||
currentTree: [],
|
||||
tabSliderStyle: {},
|
||||
searchHeadStyle: {},
|
||||
isPopupShow: false,
|
||||
isModalShow: false,
|
||||
isUserModalShow: false,
|
||||
isAllTreeCheck: false,
|
||||
isSearchShow: false,
|
||||
searchText: null,
|
||||
cacheMap: new Map(),
|
||||
duplicateIds: [],
|
||||
domId: "dom_" + new Date().getTime(),
|
||||
};
|
||||
},
|
||||
computed: {
|
||||
firstTabData() {
|
||||
if (this.treeData.length > 0) return this.treeData.map(x => x.name);
|
||||
else return [];
|
||||
},
|
||||
secondTabData() {
|
||||
if (this.treeData.length == 0) return [];
|
||||
return this.treeData[this.firstTabIndex].data.map(x => x.name);
|
||||
},
|
||||
currentTreeFlatten() {
|
||||
const flatten = (data, pid, pname) => {
|
||||
return data.reduce((arr, { id, name, children = [], type, isCheck }) => arr.concat([{ id, name, pid, type, isCheck, group: pname }], flatten(children, id, name)), []);
|
||||
};
|
||||
if (!this.currentTree) return [];
|
||||
var newArr = flatten(this.currentTree, 0, "");
|
||||
return newArr;
|
||||
},
|
||||
searchList() {
|
||||
const _this = this;
|
||||
let flattenArr = _this.currentTreeFlatten;
|
||||
flattenArr = flattenArr.filter(x => x.type == 2);
|
||||
if (!_this.searchText) return flattenArr;
|
||||
else return flattenArr.filter(x => x.name.indexOf(_this.searchText) > -1);
|
||||
},
|
||||
tempUserToNames() {
|
||||
const _this = this;
|
||||
let flattenArr = _this.currentTreeFlatten;
|
||||
var arr = flattenArr.filter(x => _this.tempUserIds.includes(x.id));
|
||||
return arr;
|
||||
},
|
||||
},
|
||||
created() {
|
||||
this.tabData = this.treeData.map(x => x.name);
|
||||
},
|
||||
mounted() {},
|
||||
methods: {
|
||||
show() {
|
||||
let timer = null;
|
||||
if (this.firstTabData.length == 0) {
|
||||
Toast.loading({ forbidClick: true });
|
||||
timer = setTimeout(() => {
|
||||
this.show();
|
||||
}, 100);
|
||||
return;
|
||||
} else {
|
||||
Toast.clear();
|
||||
if (!!timer) {
|
||||
clearTimeout(timer);
|
||||
}
|
||||
}
|
||||
|
||||
this.isModalShow = this.isPopupShow = true;
|
||||
this.tabBtnChange(0);
|
||||
var parentId = "#" + this.domId;
|
||||
setTimeout(() => {
|
||||
let treeH = document.querySelector(parentId + ".tree-popup").offsetHeight,
|
||||
headerH = document.querySelector(parentId + " .tree-popup_header").offsetHeight;
|
||||
document.querySelector(parentId + " .tree-popup_body").style.height = treeH - headerH - 60 + "px";
|
||||
this.searchHeadStyle = { top: headerH + "px" };
|
||||
}, 0);
|
||||
},
|
||||
popupColse() {
|
||||
this.isPopupShow = false;
|
||||
this.firstTabIndex = 0;
|
||||
this.secondTabIndex = 0;
|
||||
setTimeout(() => {
|
||||
this.isModalShow = false;
|
||||
}, 250);
|
||||
},
|
||||
tabBtnChange(index) {
|
||||
this.firstTabIndex = index;
|
||||
this.getTabSliderStyle(index);
|
||||
this.changeEmpty();
|
||||
this.tabCardChange(0);
|
||||
},
|
||||
tabCardChange(index) {
|
||||
const _this = this;
|
||||
var wrap = document.querySelector("#" + this.domId + " .item-wrap");
|
||||
var tabs = document.querySelectorAll("#" + this.domId + " .item-tab_card");
|
||||
let currentItem = tabs[index];
|
||||
var pageX = document.documentElement.clientWidth,
|
||||
blockW = currentItem.scrollWidth,
|
||||
moveX = 0;
|
||||
for (let i = 0; i < tabs.length; i++) {
|
||||
const element = tabs[i];
|
||||
if (i > index) break;
|
||||
moveX += element.scrollWidth;
|
||||
}
|
||||
var left = moveX - pageX / 2 + blockW / 2;
|
||||
wrap.scrollLeft = left;
|
||||
|
||||
this.secondTabIndex = index;
|
||||
this.isAllTreeCheck = false;
|
||||
this.isSearchShow = false;
|
||||
this.initTreeData();
|
||||
},
|
||||
initTreeData() {
|
||||
const _this = this;
|
||||
const checkTree = tree => {
|
||||
_this.currentTree = tree;
|
||||
_this.tempUserIds = JSON.parse(JSON.stringify(_this.userids));
|
||||
let duplArr = _this.duplicateIds.map(x => x.id);
|
||||
_this.tempUserIds.forEach(element => {
|
||||
let id = element;
|
||||
if (duplArr.length > 0 && duplArr.includes(element)) {
|
||||
let parent = _this.duplicateIds.find(x => x.id == element);
|
||||
//处理重复id逻辑,仅选择第一个
|
||||
parent && (id += "," + parent.pid[0]);
|
||||
}
|
||||
_this.checkTreeById(id, true);
|
||||
});
|
||||
};
|
||||
let first = _this.firstTabIndex,
|
||||
second = _this.secondTabIndex,
|
||||
cacheMap = _this.cacheMap,
|
||||
tData = _this.treeData;
|
||||
var tree = tData[first].data[second].data;
|
||||
var cacheKey = first + "," + second;
|
||||
if (!!tree && typeof tree === "function") {
|
||||
var cacheData = cacheMap.get(cacheKey);
|
||||
if (!cacheData) {
|
||||
tree().then(data => {
|
||||
_this.duplicateIds = _this.dupTreeIds(data);
|
||||
var jtree = JSON.parse(JSON.stringify(data));
|
||||
cacheMap.set(cacheKey, jtree);
|
||||
var ftree = _this.formatTree(jtree);
|
||||
checkTree(ftree);
|
||||
});
|
||||
} else {
|
||||
var ftree = _this.formatTree(cacheData);
|
||||
checkTree(ftree);
|
||||
}
|
||||
} else {
|
||||
_this.duplicateIds = _this.dupTreeIds(tree);
|
||||
var jtree = JSON.parse(JSON.stringify(tree));
|
||||
var ftree = _this.formatTree(jtree);
|
||||
checkTree(ftree);
|
||||
}
|
||||
},
|
||||
getTabSliderStyle(index) {
|
||||
var dom = document.querySelectorAll(".item-tab_btn")[index];
|
||||
if (!dom) return;
|
||||
this.tabSliderStyle = {
|
||||
width: dom.offsetWidth + "px",
|
||||
transform: `translateX(${dom.offsetLeft}px)`,
|
||||
};
|
||||
},
|
||||
saveAllCheck() {
|
||||
const _this = this;
|
||||
_this.isAllTreeCheck = !_this.isAllTreeCheck;
|
||||
const recursionCheckAll = (tree, checked) => {
|
||||
tree.forEach(element => {
|
||||
element.isCheck = checked;
|
||||
if (typeof element.children !== "undefined" && element.children.length > 0) recursionCheckAll(element.children, checked);
|
||||
});
|
||||
};
|
||||
recursionCheckAll(_this.currentTree, _this.isAllTreeCheck);
|
||||
_this.getTreeCheckIds();
|
||||
},
|
||||
changeEmpty() {
|
||||
this.tempUserIds = [];
|
||||
},
|
||||
submit() {
|
||||
const _this = this;
|
||||
let objArr = [],
|
||||
idsArr = this.tempUserIds.map(x => _this.getSplitId(x));
|
||||
idsArr = Array.from(new Set(idsArr));
|
||||
this.$emit("change", idsArr);
|
||||
function delKey(obj, ...args) {
|
||||
args.forEach(v => delete obj[v]);
|
||||
return obj;
|
||||
}
|
||||
idsArr.forEach(element => {
|
||||
let findObj = _this.currentTreeFlatten.find(x => _this.getSplitId(x.id) == element);
|
||||
delKey(findObj, "id", "isCheck", "pid", "type");
|
||||
objArr.push({ ...findObj, id: element });
|
||||
});
|
||||
this.$emit("on-submit", objArr);
|
||||
this.popupColse();
|
||||
},
|
||||
getSplitId(strId) {
|
||||
if (typeof strId === "string" && strId.indexOf(",") != -1) return parseInt(strId.split(",")[0]);
|
||||
else return strId;
|
||||
},
|
||||
//#region treeOpera
|
||||
formatTree(tree, level = 0) {
|
||||
const _this = this;
|
||||
tree.forEach(element => {
|
||||
var findObj = _this.duplicateIds.map(x => x.id).find(x => x == element.id);
|
||||
if (!!findObj) element.id = element.id + "," + element.pid; //重复id加上组id以免重复
|
||||
element.show = level == 0;
|
||||
element.isCheck = false;
|
||||
element.type = 1;
|
||||
if (typeof element.children !== "undefined" && element.children.length > 0) element.children = _this.formatTree(element.children, level + 1);
|
||||
else {
|
||||
// element.id = element.id + "," + element.pid; //防止用户在多个组重复id,加上组id以免重复
|
||||
element.type = 2;
|
||||
}
|
||||
});
|
||||
return tree;
|
||||
},
|
||||
flattenTree(tree) {
|
||||
const flatten = (data, pid) => {
|
||||
return data.reduce((arr, { id, name, children = [], type }) => arr.concat([{ id, name, type, pid }], flatten(children, id)), []);
|
||||
};
|
||||
return flatten(tree, 0);
|
||||
},
|
||||
dupTreeIds(tree) {
|
||||
//一个人可能在多个组,取出这些id
|
||||
const flatten = (data, pid) => {
|
||||
return data.reduce((arr, { id, name, children = [] }) => arr.concat([{ id, name, pid }], flatten(children, id)), []);
|
||||
};
|
||||
// var flattenArr = flatten(tree, 0);
|
||||
|
||||
var flattenArr = this.flattenTree(tree);
|
||||
var ctnArr = flattenArr.reduce((arr, { id, pid }) => {
|
||||
var findObj = arr.find(x => x.id == id);
|
||||
if (!!findObj) {
|
||||
findObj.count += 1;
|
||||
findObj.pid.push(pid);
|
||||
} else arr.push({ id, count: 1, pid: [pid] });
|
||||
return arr;
|
||||
}, []);
|
||||
// var dupArr = ctnArr.filter((x) => x.count > 1).map((x) => x.id);
|
||||
var dupArr = ctnArr.filter(x => x.count > 1);
|
||||
return dupArr;
|
||||
},
|
||||
findTreePids(id, tree) {
|
||||
const _this = this;
|
||||
var flattenArr = _this.flattenTree(tree);
|
||||
var arr = [];
|
||||
while (id > 0) {
|
||||
var findObj = flattenArr.find(x => x.id == id);
|
||||
if (findObj) {
|
||||
id = findObj.pid;
|
||||
arr.push(id);
|
||||
} else {
|
||||
id = -1;
|
||||
}
|
||||
}
|
||||
return arr;
|
||||
},
|
||||
findTreeChildIds(id, tree) {
|
||||
const _this = this;
|
||||
const recursionChildIds = tree => {
|
||||
let arrIds = [];
|
||||
for (const key in tree) {
|
||||
const element = tree[key];
|
||||
arrIds.push(element.id);
|
||||
if (typeof element.children !== "undefined" && element.children) {
|
||||
var childIds = recursionChildIds(element.children);
|
||||
arrIds = [...arrIds, ...childIds];
|
||||
}
|
||||
}
|
||||
return arrIds;
|
||||
};
|
||||
let childTree = [];
|
||||
if (id == 0) childTree = tree;
|
||||
else {
|
||||
var ctree = _this.findTreeByid(id, tree);
|
||||
if (ctree && typeof ctree.children !== "undefined" && ctree.children) childTree = ctree.children;
|
||||
else return [];
|
||||
}
|
||||
|
||||
var ids = recursionChildIds(childTree);
|
||||
return ids;
|
||||
},
|
||||
findTreeByid(id, tree) {
|
||||
const _this = this;
|
||||
var findTree;
|
||||
for (const key in tree) {
|
||||
const element = tree[key];
|
||||
if (element.id == id) findTree = element;
|
||||
if (typeof element.children !== "undefined" && element.children && !findTree) {
|
||||
findTree = _this.findTreeByid(id, element.children);
|
||||
}
|
||||
}
|
||||
return findTree;
|
||||
},
|
||||
findTreeByPid(id, tree) {
|
||||
const _this = this;
|
||||
var findId;
|
||||
for (const key in tree) {
|
||||
const element = tree[key];
|
||||
if (element.id == id) {
|
||||
findId = element.pid;
|
||||
}
|
||||
if (typeof element.children !== "undefined" && element.children && !findId) {
|
||||
findId = _this.findTreeByPid(id, element.children);
|
||||
}
|
||||
}
|
||||
return findId;
|
||||
},
|
||||
checkTreeById(id, checked) {
|
||||
const _this = this;
|
||||
var pids = this.findTreePids(id, this.currentTree);
|
||||
var cids = this.findTreeChildIds(id, this.currentTree);
|
||||
var idArr = [...cids, id];
|
||||
checked && (idArr = [...pids, ...idArr]);
|
||||
idArr.forEach(element => {
|
||||
var t = this.findTreeByid(element, this.currentTree);
|
||||
t && (t.isCheck = checked);
|
||||
});
|
||||
|
||||
if (!checked) {
|
||||
pids.forEach(element => {
|
||||
var t = _this.findTreeByid(element, this.currentTree);
|
||||
if (!t || typeof t.children === "undefined") return;
|
||||
var findIndex = t.children.findIndex(x => x.isCheck && x.id != id);
|
||||
findIndex === -1 && (t.isCheck = false);
|
||||
});
|
||||
}
|
||||
this.getTreeCheckIds();
|
||||
},
|
||||
getTreeCheckIds() {
|
||||
const _this = this;
|
||||
var isEndWithType = true; //是否只返回最末端的结点(type=2)
|
||||
const recursionCheckIds = tree => {
|
||||
let arrIds = [];
|
||||
for (const key in tree) {
|
||||
const element = tree[key];
|
||||
if (element.isCheck && (isEndWithType ? element.type == 2 : true)) arrIds.push(element.id);
|
||||
if (typeof element.children !== "undefined" && element.children) {
|
||||
var childIds = recursionCheckIds(element.children);
|
||||
arrIds = [...arrIds, ...childIds];
|
||||
}
|
||||
}
|
||||
return arrIds;
|
||||
};
|
||||
var t = recursionCheckIds(_this.currentTree);
|
||||
this.tempUserIds = t;
|
||||
},
|
||||
//#endregion
|
||||
},
|
||||
};
|
||||
</script>
|
||||
@@ -0,0 +1,80 @@
|
||||
<template>
|
||||
<ul class="conta-wrap">
|
||||
<li v-for="(item, index) in treeData">
|
||||
<div
|
||||
:class="['tree-item', getItemClass(item)]"
|
||||
:style="{ 'padding-left': 30 * level + 12 + 'px' }"
|
||||
@click="itemClick(item)"
|
||||
>
|
||||
<a
|
||||
href="javascript:;"
|
||||
style="dispaly: block"
|
||||
@click.stop="itemCheck(item, $event)"
|
||||
>
|
||||
<input type="checkbox" v-model="item.isCheck" />
|
||||
<span
|
||||
:class="[
|
||||
'my-checkbox-core',
|
||||
item.isCheck ? 'active' : '',
|
||||
]"
|
||||
></span>
|
||||
<label>{{ item.name }}</label>
|
||||
</a>
|
||||
</div>
|
||||
<transition name="fade">
|
||||
<tree
|
||||
v-if="item.show"
|
||||
:userids="userids"
|
||||
:treeData="item.children"
|
||||
:level="level + 1"
|
||||
></tree>
|
||||
</transition>
|
||||
</li>
|
||||
</ul>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
require("./index.scss");
|
||||
export default {
|
||||
name: "tree",
|
||||
inject: ["checkTreeById"],
|
||||
props: {
|
||||
level: {
|
||||
type: Number,
|
||||
default: 0,
|
||||
},
|
||||
treeData: {
|
||||
type: Array,
|
||||
default: [],
|
||||
},
|
||||
userids: {
|
||||
type: Array,
|
||||
default: [],
|
||||
},
|
||||
},
|
||||
methods: {
|
||||
getItemClass(item) {
|
||||
if (item.type == 2) return;
|
||||
let className = " tree-item_" + (item.show ? "open" : "close");
|
||||
className += this.level === 0 ? " tree-item_group " : "";
|
||||
return className;
|
||||
},
|
||||
itemCheck(item, e) {
|
||||
if (
|
||||
typeof e !== "undefined" &&
|
||||
e.target.tagName.toLowerCase() === "input"
|
||||
)
|
||||
return;
|
||||
this.checkTreeById(item.id, !item.isCheck);
|
||||
},
|
||||
itemClick(item) {
|
||||
if (item.type == 2) {
|
||||
// this.itemCheck(item);
|
||||
this.checkTreeById(item.id, !item.isCheck);
|
||||
} else if (item.type == 1) {
|
||||
item.show = !item.show;
|
||||
}
|
||||
},
|
||||
},
|
||||
};
|
||||
</script>
|
||||
@@ -0,0 +1,54 @@
|
||||
<template>
|
||||
<Modal v-model="modal" :title="name" @on-visible-change="showChange" width="70%" footer-hide>
|
||||
<Button class="js_copy_code" data-clipboard-action="copy" :data-clipboard-text="currentHtml">复制代码</Button>
|
||||
<div v-highlight>
|
||||
<pre v-show="isLoad">
|
||||
<code id="test" class="html"></code>
|
||||
</pre>
|
||||
</div>
|
||||
</Modal>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { load } from "../../assets/js/code";
|
||||
export default {
|
||||
props: {
|
||||
name: String,
|
||||
url: String,
|
||||
type: String,
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
modal: false,
|
||||
isLoad: false,
|
||||
currentHtml: null,
|
||||
clipboard: null,
|
||||
};
|
||||
},
|
||||
async mounted() {
|
||||
const _this = this;
|
||||
this.modal = true;
|
||||
this.isLoad = false;
|
||||
let { html, encode } = await load(_this.url);
|
||||
$("#test").attr("class", _this.type).html(encode);
|
||||
this.isLoad = true;
|
||||
this.currentHtml = html;
|
||||
this.clipboard = new ClipboardJS(".js_copy_code");
|
||||
this.clipboard.on("success", function (e) {
|
||||
_this.$Message.success("copy success!");
|
||||
e.clearSelection();
|
||||
});
|
||||
},
|
||||
methods: {
|
||||
showChange(state) {
|
||||
if (!state) this.destroy();
|
||||
},
|
||||
destroy() {
|
||||
this.clipboard.destroy();
|
||||
setTimeout(() => {
|
||||
document.body.removeChild(this.$el);
|
||||
}, 300);
|
||||
},
|
||||
},
|
||||
};
|
||||
</script>
|
||||
@@ -0,0 +1,24 @@
|
||||
import Vue from "vue";
|
||||
import codemodal from "./code_modal.vue";
|
||||
import { Message } from "view-design";
|
||||
export default props => {
|
||||
// 创建实例
|
||||
const vm = new Vue({
|
||||
render(h) {
|
||||
// h为createElement,返回VNode虚拟Node
|
||||
return h(codemodal, { props });
|
||||
}
|
||||
}).$mount();
|
||||
|
||||
// 手动挂载实例到body
|
||||
document.body.appendChild(vm.$el);
|
||||
|
||||
const comp = vm.$children[0];
|
||||
// 销毁方法
|
||||
// comp.remove = function() {
|
||||
// document.body.removeChild(vm.$el);
|
||||
// vm.$destroy();
|
||||
// };
|
||||
// 返回组件
|
||||
return comp;
|
||||
};
|
||||
@@ -0,0 +1,240 @@
|
||||
<template>
|
||||
<div>
|
||||
<!-- 富文本编辑器 -->
|
||||
<quill-editor v-model="content"
|
||||
ref="myTextEditor"
|
||||
:options="editorOption"
|
||||
@change="onChange"
|
||||
>
|
||||
<div id="toolbar" slot="toolbar">
|
||||
<span class="ql-formats"><button type="button" class="ql-bold"></button></span>
|
||||
<span class="ql-formats"><button type="button" class="ql-italic"></button></span>
|
||||
<span class="ql-formats"><button type="button" class="ql-underline"></button></span>
|
||||
<span class="ql-formats"><button type="button" class="ql-strike"></button></span>
|
||||
<!-- 有序和无序 -->
|
||||
<span class="ql-formats"><button type="button" class="ql-list" value="ordered"></button></span>
|
||||
<span class="ql-formats"><button type="button" class="ql-list" value="bullet"></button></span>
|
||||
<!-- 缩进 -->
|
||||
<span class="ql-formats"><button type="button" class="ql-indent" value="-1"></button></span>
|
||||
<span class="ql-formats"><button type="button" class="ql-indent" value="+1"></button></span>
|
||||
<span class="ql-formats"> <button type="button" class="ql-direction" value="rtl"></button></span>
|
||||
<!-- 自定义下拉 -->
|
||||
<span class="ql-formats">
|
||||
<select class="ql-size" id="ql-size">
|
||||
<option value="small">小号</option>
|
||||
<option value="">正常</option>
|
||||
<option value="large">大号</option>
|
||||
<option value="huge">特大</option>
|
||||
</select>
|
||||
<!-- <i-select size="small" @on-change="mychange">
|
||||
<i-option value="small">小号</i-option>
|
||||
<i-option value="large">正常</i-option>
|
||||
<i-option value="huge">特大</i-option>
|
||||
</i-select> -->
|
||||
</span>
|
||||
<span class="ql-formats">
|
||||
<select class="ql-header">
|
||||
<option value="1">标题1</option>
|
||||
<option value="2">标题2</option>
|
||||
<option value="3">标题3</option>
|
||||
<option value="4">标题4</option>
|
||||
<option value="5">标题5</option>
|
||||
<option value="6">标题6</option>
|
||||
<option selected="selected">正文</option>
|
||||
</select>
|
||||
</span>
|
||||
<span class="ql-formats">
|
||||
<select class="ql-color" v-model="fontColor">
|
||||
<option v-for="item in colorArry" :key="item" :value="'#'+item"></option>
|
||||
</select>
|
||||
</span>
|
||||
<span class="ql-formats">
|
||||
<select class="ql-background" v-model="bgColor">
|
||||
<option v-for="item in colorArry" :key="item" :value="'#'+item"></option>
|
||||
</select>
|
||||
</span>
|
||||
<span class="ql-formats">
|
||||
<select class="ql-font">
|
||||
<option selected="selected"></option>
|
||||
<option value="serif"></option>
|
||||
<option value="monospace"></option>
|
||||
</select>
|
||||
</span>
|
||||
<span class="ql-formats">
|
||||
<select class="ql-align">
|
||||
<option selected="selected"></option>
|
||||
<option value="center"></option>
|
||||
<option value="right"></option>
|
||||
<option value="justify"></option>
|
||||
</select>
|
||||
</span>
|
||||
<!-- <span class="ql-formats">
|
||||
<button type="button" @click="isLink=true" class="ql-link"></button>
|
||||
</span> -->
|
||||
<span class="ql-formats">
|
||||
<button type="button" class="my-formats-image">
|
||||
<Upload
|
||||
:action="formItem.uploadUrl"
|
||||
:on-success="handleSuccess"
|
||||
:data="uploadData"
|
||||
accept="image/gif,image/jpeg,image/jpg,image/png">
|
||||
<Icon type="image" size="16"></Icon>
|
||||
</Upload>
|
||||
</button>
|
||||
</span>
|
||||
</div>
|
||||
</quill-editor>
|
||||
<!-- 添加链接 -->
|
||||
<Modal v-model="isLink" title="添加链接" width="450px">
|
||||
<i-form :label-width="85" class="myform" ref="formItem.link" :model="formItem.link">
|
||||
<Form-Item label="链接地址:" prop="url">
|
||||
<i-input v-model="formItem.link.url" placeholder="请输入链接地址"></i-input>
|
||||
</Form-Item>
|
||||
<Form-Item label="链接名称:" prop="tit">
|
||||
<i-input v-model="formItem.link.tit" placeholder="请输入链接名称"></i-input>
|
||||
</Form-Item>
|
||||
</i-form>
|
||||
<div slot="footer">
|
||||
<i-Button type="primary" @click="addLinkSave()">提交</i-Button>
|
||||
<i-Button type="ghost" @click="myCancel('isLink','formItem.link')" style="margin-left: 8px">取消</i-Button>
|
||||
</div>
|
||||
|
||||
</Modal>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
// import {quillEditor} from 'vue-quill-editor'
|
||||
|
||||
export default {
|
||||
// components: {quillEditor},
|
||||
props: {
|
||||
// 提示内容
|
||||
placeholder:{
|
||||
type: String
|
||||
},
|
||||
/*编辑器内容*/
|
||||
value: {
|
||||
type: String
|
||||
},
|
||||
/*上传图片的地址*/
|
||||
uploadUrl: {
|
||||
type: String
|
||||
},
|
||||
readonly:Boolean,
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
content:this.value,
|
||||
size:'',
|
||||
fontColor:"000000",
|
||||
bgColor:"ffffff",
|
||||
colorArry:['000000','e60000','ff9900','ffff00','008a00','0066cc','9933ff','ffffff','facccc','ffebcc','ffffcc','cce8cc','cce0f5','ebd6ff','bbbbbb','f06666','ffc266','ffff66','66b966','66a3e0','c285ff','888888','a10000','b26b00','b2b200','006100','0047b2','6b24b2','444444','5c0000','663d00','666600','003700','002966','3d1466'],
|
||||
editorOption: {
|
||||
modules: {
|
||||
toolbar: '#toolbar',
|
||||
},
|
||||
placeholder:this.placeholder || '请输入内容……',
|
||||
readOnly: this.readonly,
|
||||
},
|
||||
showCrop:false,
|
||||
isLink:false,
|
||||
isImage:false,
|
||||
formItem:{
|
||||
link:{
|
||||
url:'',
|
||||
tit:'',
|
||||
},
|
||||
uploadUrl:this.uploadUrl || '',
|
||||
},
|
||||
uploadData:{
|
||||
AppType:window.location.pathname.split('/')[1],
|
||||
},
|
||||
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
onChange(){
|
||||
this.$emit('input', this.content)
|
||||
},
|
||||
myCancel(name, resetName) {
|
||||
var vm = this;
|
||||
vm[name] = false;
|
||||
if (resetName) {
|
||||
console.log(vm.$refs[resetName])
|
||||
this.$refs[resetName].resetFields();
|
||||
}
|
||||
},
|
||||
addLinkSave(){
|
||||
var _that=this;
|
||||
_that.isLink=false;
|
||||
_that.editor.focus();
|
||||
_that.editor.insertText(_that.editor.getSelection().index, ' ', '', true);
|
||||
_that.editor.insertText(_that.editor.getSelection().index-1, _that.formItem.link.tit+' ', 'link','http://'+ _that.formItem.link.url);
|
||||
},
|
||||
handleSuccess(res, file){
|
||||
this.editor.focus();
|
||||
console.log(res);
|
||||
var url=res.host+res.fileurl;
|
||||
this.editor.insertEmbed(this.editor.getSelection().index, 'image', url);
|
||||
},
|
||||
// onFocus(){
|
||||
// $(".ql-editor img").removeClass("active");
|
||||
// },
|
||||
},
|
||||
computed: {
|
||||
editor() {
|
||||
return this.$refs.myTextEditor.quill;
|
||||
}
|
||||
},
|
||||
|
||||
mounted(){
|
||||
var _that=this;
|
||||
// $(".ql-editor img").on('click',function(){
|
||||
// _that.editor.blur();
|
||||
// $(this).addClass("active");
|
||||
// })
|
||||
},
|
||||
watch: {
|
||||
'value'(newVal, oldVal) {
|
||||
if (this.editor) {
|
||||
if (newVal !== this.content) {
|
||||
this.content = newVal
|
||||
}
|
||||
}
|
||||
},
|
||||
}
|
||||
}
|
||||
</script>
|
||||
<style lang="scss">
|
||||
.ql-tooltip{
|
||||
display: none !important;
|
||||
}
|
||||
|
||||
.my-formats-image{
|
||||
outline: none;
|
||||
ul.ivu-upload-list{
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
.ql-container .ql-editor {
|
||||
min-height: 20em;
|
||||
padding-bottom: 1em;
|
||||
max-height: 25em;
|
||||
}
|
||||
.ql-editor{
|
||||
position: relative;
|
||||
img{
|
||||
position: relative;
|
||||
}
|
||||
img::after {
|
||||
content:'123123';
|
||||
display: block;
|
||||
width: 12px;
|
||||
height: 12px;
|
||||
position: absolute;
|
||||
top:0;right: 0;
|
||||
background: red;
|
||||
}
|
||||
|
||||
}
|
||||
</style>
|
||||
@@ -0,0 +1,64 @@
|
||||
<template>
|
||||
<Modal v-model="modal" @on-visible-change="showChange" :title="title || '提示'">
|
||||
<Alert type="warning" class="mb-1" show-icon>
|
||||
<Icon type="ios-bulb-outline" :class="{ 'mt-5': !info }" slot="icon" :size="28"></Icon>
|
||||
<div v-if="msg" :class="['message-box', info ? '' : 'mt-10 mb-10 ml-10']">{{ msg }}</div>
|
||||
<span v-if="info" slot="desc">{{ info }}</span>
|
||||
</Alert>
|
||||
<div slot="footer">
|
||||
<Button type="primary" @click="ok">确定</Button>
|
||||
<Button @click="cancle">取消</Button>
|
||||
</div>
|
||||
</Modal>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
props: {
|
||||
title: String,
|
||||
msg: String,
|
||||
info: String,
|
||||
onOk: Function,
|
||||
onCancel: Function,
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
modal: false,
|
||||
};
|
||||
},
|
||||
mounted() {
|
||||
this.$nextTick(() => {
|
||||
this.modal = true;
|
||||
});
|
||||
},
|
||||
methods: {
|
||||
ok() {
|
||||
this.modal = false;
|
||||
typeof this.onOk === "function" && this.onOk();
|
||||
},
|
||||
cancle() {
|
||||
this.modal = false;
|
||||
typeof this.onCancel === "function" && this.onCancel();
|
||||
},
|
||||
showChange(state) {
|
||||
if (!state) this.destroy();
|
||||
},
|
||||
destroy() {
|
||||
setTimeout(() => {
|
||||
document.body.removeChild(this.$el);
|
||||
}, 300);
|
||||
},
|
||||
},
|
||||
};
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.my-confirwm {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
.message-box {
|
||||
font-size: 16px;
|
||||
color: #17233d;
|
||||
display: block;
|
||||
}
|
||||
</style>
|
||||
@@ -0,0 +1,23 @@
|
||||
import Vue from "vue";
|
||||
import confirm from "./confirm.vue";
|
||||
export default props => {
|
||||
// 创建实例
|
||||
const vm = new Vue({
|
||||
render(h) {
|
||||
// h为createElement,返回VNode虚拟Node
|
||||
return h(confirm, { props });
|
||||
}
|
||||
}).$mount();
|
||||
|
||||
// 手动挂载实例到body
|
||||
document.body.appendChild(vm.$el);
|
||||
|
||||
const comp = vm.$children[0];
|
||||
// 销毁方法
|
||||
// comp.remove = function() {
|
||||
// document.body.removeChild(vm.$el);
|
||||
// vm.$destroy();
|
||||
// };
|
||||
// 返回组件
|
||||
return comp;
|
||||
};
|
||||
@@ -0,0 +1,95 @@
|
||||
<template>
|
||||
<div :id="domId" :ref="domId" class="ztree"></div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
require("@public/libs/ztree/zTreeStyle.css");
|
||||
import "@public/libs/ztree/jquery.ztree.all.min.js";
|
||||
export default {
|
||||
props: {
|
||||
treeData: {
|
||||
type: Object,
|
||||
},
|
||||
setting: {
|
||||
type: Object,
|
||||
},
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
domId: "",
|
||||
treeSetting: {
|
||||
view: {
|
||||
dblClickExpand: false,
|
||||
showIcon: false,
|
||||
},
|
||||
check: {
|
||||
enable: false,
|
||||
},
|
||||
callback: {},
|
||||
},
|
||||
};
|
||||
},
|
||||
created() {
|
||||
this.$watch("treeData", (val) => {
|
||||
if (val) {
|
||||
this.$nextTick(() => {
|
||||
this.initTree(this.treeData, this.domId);
|
||||
});
|
||||
}
|
||||
});
|
||||
},
|
||||
mounted() {
|
||||
this.domId = this.uuid();
|
||||
},
|
||||
methods: {
|
||||
uuid() {
|
||||
return "xxxxxxxx-xxxx-4xxx-yxxx-xxxxxxxxxxxx".replace(
|
||||
/[xy]/g,
|
||||
function (c) {
|
||||
var r = (Math.random() * 16) | 0,
|
||||
v = c == "x" ? r : (r & 0x3) | 0x8;
|
||||
return v.toString(16);
|
||||
}
|
||||
);
|
||||
},
|
||||
initTree(_data, _domId) {
|
||||
const _this = this;
|
||||
_this.treeSetting.callback.onClick = (
|
||||
event,
|
||||
treeId,
|
||||
treeNode,
|
||||
clickFlag
|
||||
) => {
|
||||
// console.log(event, treeId, treeNode, clickFlag);
|
||||
_this.$emit("on-tree-click", treeNode);
|
||||
};
|
||||
var zNodes = _this.openFistNode(_data);
|
||||
$.fn.zTree.init($("#" + _domId), _this.treeSetting, zNodes);
|
||||
var treeObj = $.fn.zTree.getZTreeObj(_domId);
|
||||
var nodes = treeObj.getNodes();
|
||||
if (nodes && nodes.length > 0) {
|
||||
setTimeout(function () {
|
||||
$("#" + nodes[0].tId + "_a").click();
|
||||
}, 0);
|
||||
}
|
||||
},
|
||||
openFistNode(_zNodes) {
|
||||
//展开一级节点
|
||||
if (_zNodes && _zNodes.length > 0) {
|
||||
for (var key in _zNodes) {
|
||||
if (_zNodes.hasOwnProperty(key)) {
|
||||
var element = _zNodes[key];
|
||||
element.open = true;
|
||||
}
|
||||
}
|
||||
} else {
|
||||
_zNodes.open = true;
|
||||
}
|
||||
return _zNodes;
|
||||
},
|
||||
},
|
||||
};
|
||||
</script>
|
||||
|
||||
<style>
|
||||
</style>
|
||||
@@ -0,0 +1,159 @@
|
||||
<template>
|
||||
<div :id="domId" :ref="domId" class="ztree"></div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
require("@public/libs/ztree/zTreeStyle.css");
|
||||
import "@public/libs/ztree/jquery.ztree.all.min.js";
|
||||
export default {
|
||||
props: {
|
||||
treeData: {
|
||||
type: Object,
|
||||
default: () => ({})
|
||||
},
|
||||
setting: {
|
||||
type: Object,
|
||||
default: () => ({})
|
||||
},
|
||||
// 外部传入需要默认选中的节点id,不传则选中第一个一级节点
|
||||
selectId: {
|
||||
type: [Number, String],
|
||||
default: null
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
domId: "",
|
||||
treeSetting: {
|
||||
view: {
|
||||
dblClickExpand: false,
|
||||
showIcon: false,
|
||||
},
|
||||
check: {
|
||||
enable: false,
|
||||
},
|
||||
callback: {},
|
||||
},
|
||||
};
|
||||
},
|
||||
watch: {
|
||||
treeData(val) {
|
||||
if (val && val.length) {
|
||||
this.$nextTick(() => {
|
||||
this.initTree(this.treeData, this.domId);
|
||||
});
|
||||
}
|
||||
},
|
||||
// 监听外部传入选中id变化,自动重新选中
|
||||
selectId() {
|
||||
this.$nextTick(() => {
|
||||
this.handleDefaultSelect();
|
||||
})
|
||||
}
|
||||
},
|
||||
created() {
|
||||
this.$watch("treeData", (val) => {
|
||||
if (val) {
|
||||
this.$nextTick(() => {
|
||||
this.initTree(this.treeData, this.domId);
|
||||
});
|
||||
}
|
||||
});
|
||||
},
|
||||
mounted() {
|
||||
this.domId = this.uuid();
|
||||
},
|
||||
methods: {
|
||||
getZtreeInstance() {
|
||||
return $.fn.zTree.getZTreeObj(this.domId);
|
||||
},
|
||||
uuid() {
|
||||
return "xxxxxxxx-xxxx-4xxx-yxxx-xxxxxxxxxxxx".replace(
|
||||
/[xy]/g,
|
||||
function (c) {
|
||||
var r = (Math.random() * 16) | 0,
|
||||
v = c == "x" ? r : (r & 0x3) | 0x8;
|
||||
return v.toString(16);
|
||||
}
|
||||
);
|
||||
},
|
||||
/**
|
||||
* 核心方法:根据节点id选中节点,并逐层展开所有父节点
|
||||
* @param {String|Number} targetId 目标节点id
|
||||
*/
|
||||
selectNodeById(targetId) {
|
||||
const treeObj = $.fn.zTree.getZTreeObj(this.domId);
|
||||
if (!treeObj || !targetId) return;
|
||||
|
||||
const targetNode = treeObj.getNodeByParam('id', targetId);
|
||||
if (!targetNode) return;
|
||||
|
||||
// 高亮选中节点
|
||||
treeObj.selectNode(targetNode);
|
||||
|
||||
// 循环向上展开所有父节点
|
||||
let currNode = targetNode;
|
||||
while (currNode) {
|
||||
treeObj.expandNode(currNode, true, false, false);
|
||||
currNode = currNode.getParentNode();
|
||||
}
|
||||
},
|
||||
/**
|
||||
* 默认选中逻辑:有selectId选对应节点,无则选第一个一级节点
|
||||
*/
|
||||
handleDefaultSelect() {
|
||||
const treeObj = $.fn.zTree.getZTreeObj(this.domId);
|
||||
if (!treeObj) return;
|
||||
|
||||
const rootNodes = treeObj.getNodes();
|
||||
if (!rootNodes || rootNodes.length === 0) return;
|
||||
|
||||
if (this.selectId !== null && this.selectId !== undefined) {
|
||||
// 外部传入id,选中指定节点
|
||||
this.selectNodeById(this.selectId);
|
||||
} else {
|
||||
// 无传入id,默认选中第一个一级节点
|
||||
const firstRoot = rootNodes[0];
|
||||
treeObj.selectNode(firstRoot);
|
||||
treeObj.expandNode(firstRoot, true, false, false);
|
||||
}
|
||||
},
|
||||
initTree(_data, _domId) {
|
||||
const _this = this;
|
||||
// 合并自定义setting
|
||||
_this.treeSetting = Object.assign({}, _this.treeSetting, _this.setting);
|
||||
|
||||
// 绑定点击回调
|
||||
_this.treeSetting.callback.onClick = (event, treeId, treeNode) => {
|
||||
_this.$emit("on-tree-click", treeNode);
|
||||
};
|
||||
// 绑定复选框点击回调
|
||||
_this.treeSetting.callback.onCheck = (event, treeId, treeNode) => {
|
||||
const zTreeObj = $.fn.zTree.getZTreeObj(treeId);
|
||||
// getCheckedNodes(true) 获取所有手动勾选节点,不分层级
|
||||
const allChecked = zTreeObj.getCheckedNodes(true);
|
||||
this.$emit('on-tree-Check', allChecked);
|
||||
};
|
||||
// 展开所有一级节点
|
||||
var zNodes = _this.openFistNode(_data);
|
||||
// 初始化树
|
||||
$.fn.zTree.init($("#" + _domId), _this.treeSetting, zNodes);
|
||||
// 执行默认选中逻辑
|
||||
this.$nextTick(() => {
|
||||
this.handleDefaultSelect();
|
||||
})
|
||||
},
|
||||
openFistNode(_zNodes) {
|
||||
if (_zNodes && _zNodes.length > 0) {
|
||||
for (var i = 0; i < _zNodes.length; i++) {
|
||||
_zNodes[i].open = true;
|
||||
}
|
||||
}
|
||||
return _zNodes;
|
||||
}
|
||||
},
|
||||
};
|
||||
</script>
|
||||
|
||||
<style>
|
||||
</style>
|
||||
@@ -0,0 +1,112 @@
|
||||
<template>
|
||||
<div>
|
||||
<Table
|
||||
:columns="columns"
|
||||
:data="listData"
|
||||
@on-selection-change="selectChange"
|
||||
class="link-table table-bottom-box"
|
||||
:height="tableHeight"
|
||||
no-data-text="暂无数据"
|
||||
></Table>
|
||||
<div class="page-panel">
|
||||
<div class="fl">
|
||||
<slot :sel-ids="selectList"></slot>
|
||||
</div>
|
||||
<Page
|
||||
class="fr"
|
||||
:total="total"
|
||||
:current="dataParmas.page"
|
||||
:page-size="dataParmas.count"
|
||||
:page-size-opts="[10, 20, 30, 40]"
|
||||
@on-page-size-change="pageSizeUpdate"
|
||||
@on-change="pageUpdate"
|
||||
placement="top"
|
||||
show-total
|
||||
show-sizer
|
||||
></Page>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
props: {
|
||||
tableHeight: {
|
||||
default: 0,
|
||||
type: Number,
|
||||
},
|
||||
dataUrl: {
|
||||
default: "",
|
||||
type: String,
|
||||
},
|
||||
dataParmas: {
|
||||
default: {},
|
||||
type: Object,
|
||||
},
|
||||
dataFilter: {
|
||||
type: Function,
|
||||
default: null,
|
||||
},
|
||||
columns: {
|
||||
default: [],
|
||||
type: Array,
|
||||
},
|
||||
autoLoad: {
|
||||
default: true,
|
||||
Type: Boolean,
|
||||
},
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
listData: [],
|
||||
selectList: [],
|
||||
total: 30,
|
||||
};
|
||||
},
|
||||
|
||||
created() {
|
||||
this.dataParmas.page = 1;
|
||||
this.dataParmas.count = parseInt(localStorage.getItem("customPageCount") || 10);
|
||||
if (this.autoLoad) this.getData();
|
||||
},
|
||||
|
||||
methods: {
|
||||
getData() {
|
||||
const _this = this;
|
||||
let item = {},
|
||||
{ dataUrl, dataParmas } = this;
|
||||
// console.log("dataParmas", dataParmas);
|
||||
for (const key in dataParmas) {
|
||||
const element = dataParmas[key];
|
||||
item[key] = element;
|
||||
}
|
||||
_this.$api.get(dataUrl, item, resp => {
|
||||
let rData = resp.data;
|
||||
if (typeof _this.dataFilter === "function") {
|
||||
let fData = _this.dataFilter(rData);
|
||||
_this.listData = JSON.parse(JSON.stringify(fData));
|
||||
} else _this.listData = rData;
|
||||
});
|
||||
},
|
||||
selectChange(selection) {
|
||||
this.selectList = selection;
|
||||
},
|
||||
pageUpdate(page) {
|
||||
this.dataParmas.page = page;
|
||||
this.getData();
|
||||
},
|
||||
pageSizeUpdate(size) {
|
||||
this.dataParmas.page = 1;
|
||||
this.dataParmas.count = size;
|
||||
localStorage.setItem("customPageCount", size);
|
||||
this.getData();
|
||||
},
|
||||
reloadData() {
|
||||
this.getData();
|
||||
},
|
||||
},
|
||||
};
|
||||
</script>
|
||||
|
||||
<style>
|
||||
</style>
|
||||
@@ -0,0 +1,169 @@
|
||||
<template>
|
||||
<div class="type_set-box">
|
||||
<div class="type_name">
|
||||
<i class="iconfont icon-stop fl mr-10" v-if="!isEdit && !active" style="color: #ff5959"></i>
|
||||
<Input v-if="isEdit" v-model="type.name" ref="type_input" @on-blur="update" @on-enter="update" />
|
||||
<span v-else class="fl">{{ type.name }}</span>
|
||||
</div>
|
||||
<div class="type_action flex">
|
||||
<div class="action_item" @click="open">
|
||||
<span v-if="active">停用</span>
|
||||
<span v-else>启用</span>
|
||||
</div>
|
||||
<div class="action_edit" @click="edit">
|
||||
<span>编辑</span>
|
||||
</div>
|
||||
<div class="action_delete" @click="remove">
|
||||
<span>删除</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="divider"></div>
|
||||
<div class="divider2"></div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
name: "TypeSetBox",
|
||||
props: {
|
||||
type: {
|
||||
name: { type: String, default: "" },
|
||||
id: { type: String, default: "" },
|
||||
},
|
||||
active: { type: Boolean, default: true },
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
isEdit: false,
|
||||
eventType: "",
|
||||
};
|
||||
},
|
||||
watch: {
|
||||
type: {
|
||||
deep: true,
|
||||
handler(newVal) {
|
||||
if (this.isEdit) {
|
||||
this.isEdit = false;
|
||||
}
|
||||
},
|
||||
},
|
||||
"type.name"(newVal) {
|
||||
if (this.isEdit) {
|
||||
this.isEdit = false;
|
||||
}
|
||||
},
|
||||
},
|
||||
methods: {
|
||||
open() {
|
||||
this.$emit("active", this.type.id);
|
||||
},
|
||||
edit() {
|
||||
this.isEdit = !this.isEdit;
|
||||
if (this.isEdit) this.$nextTick(() => this.$refs["type_input"].focus());
|
||||
},
|
||||
update(e) {
|
||||
if (!this.type.name) {
|
||||
this.$Message.error("值不得为空!");
|
||||
return;
|
||||
}
|
||||
|
||||
if (this.eventType == "") {
|
||||
this.eventType = e.type;
|
||||
this.isEdit = false;
|
||||
this.$emit("edit", this.type.id, this.type.name);
|
||||
setTimeout(() => {
|
||||
this.eventType = "";
|
||||
}, 500);
|
||||
}
|
||||
},
|
||||
remove() {
|
||||
this.$emit("remove", this.type.id);
|
||||
},
|
||||
},
|
||||
};
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.flex {
|
||||
display: flex;
|
||||
}
|
||||
.type_set-box {
|
||||
width: 222px;
|
||||
background: #ffffff;
|
||||
margin-right: 15px;
|
||||
margin-bottom: 15px;
|
||||
.type_name {
|
||||
height: 66px;
|
||||
border: 1px solid #e9e9e9;
|
||||
border-bottom: none;
|
||||
padding-left: 15px;
|
||||
padding-right: 15px;
|
||||
line-height: 66px;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
span {
|
||||
height: 24px;
|
||||
font-size: 15px;
|
||||
font-family: PingFangSC-Semibold, PingFang SC;
|
||||
font-weight: 500;
|
||||
color: #272829;
|
||||
line-height: 24px;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
width: 222px;
|
||||
display: inline-block;
|
||||
}
|
||||
.iconfont {
|
||||
font-size: 26px;
|
||||
}
|
||||
}
|
||||
.type_action {
|
||||
flex-wrap: wrap;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
width: 222px;
|
||||
height: 30px;
|
||||
line-height: 30px;
|
||||
background: #f7f7f7;
|
||||
border-radius: 0px 0px 2px 2px;
|
||||
border-top: none;
|
||||
border: 1px solid #e9e9e9;
|
||||
span {
|
||||
font-size: 12px;
|
||||
}
|
||||
|
||||
div {
|
||||
cursor: pointer;
|
||||
flex: 1;
|
||||
text-align: center;
|
||||
}
|
||||
div:hover {
|
||||
color: #6c91f0;
|
||||
}
|
||||
}
|
||||
.divider {
|
||||
// position: relative;
|
||||
height: 14px;
|
||||
width: 1px;
|
||||
background: #e8e8e8;
|
||||
// left: 73px;
|
||||
// top: -23px;
|
||||
float: left;
|
||||
margin-left: 71px;
|
||||
margin-top: -22px;
|
||||
}
|
||||
.divider2 {
|
||||
// position: relative;
|
||||
// left: 146px;
|
||||
// top: -37px;
|
||||
height: 14px;
|
||||
width: 1px;
|
||||
background: #e8e8e8;
|
||||
float: left;
|
||||
margin-left: 147px;
|
||||
margin-top: -22px;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@@ -0,0 +1,100 @@
|
||||
<template>
|
||||
<div>
|
||||
<ul class="public-upload-img fix">
|
||||
<li v-for="(item, index) in uploadList">
|
||||
<template v-if="item.status === 'finished'">
|
||||
<img :src="item.url" alt="" />
|
||||
<div class="upload-list-cover">
|
||||
<Icon type="ios-eye-outline" size="24" title="预览图片" @click.native="handleView(item.url)"></Icon>
|
||||
<Icon size="24" class="ml-10" title="删除图片" type="ios-trash-outline" @click.native="handleRemove(index)"></Icon>
|
||||
</div>
|
||||
</template>
|
||||
<template v-else>
|
||||
<Progress v-if="item.showProgress" :percent="item.percentage" class="mt-24" hide-info></Progress>
|
||||
</template>
|
||||
</li>
|
||||
<li class="add-li">
|
||||
<Upload
|
||||
ref="upload"
|
||||
:show-upload-list="false"
|
||||
:on-success="handleSuccess"
|
||||
:format="['jpg', 'jpeg', 'png', 'gif']"
|
||||
accept="image/gif,image/jpeg,image/jpg,image/png"
|
||||
:max-size="2048"
|
||||
:on-format-error="handleFormatError"
|
||||
:on-exceeded-size="handleMaxSize"
|
||||
:default-file-list="defaultList"
|
||||
type="drag"
|
||||
:action="uploadUrl"
|
||||
>
|
||||
<div class="add-box">
|
||||
<Icon type="ios-add" size="50"></Icon>
|
||||
</div>
|
||||
</Upload>
|
||||
</li>
|
||||
</ul>
|
||||
<Modal title="图片预览" v-model="visible" footer-hide>
|
||||
<img :src="imgName" v-if="visible" style="width: 100%" />
|
||||
</Modal>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
props: {
|
||||
baseUrl: { type: String, default: "" },
|
||||
imgList: { type: Array, default: [] },
|
||||
uploadUrl: { type: String, default: "" },
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
imgName: "",
|
||||
visible: false,
|
||||
uploadList: [],
|
||||
defaultList: [],
|
||||
};
|
||||
},
|
||||
created() {
|
||||
let arr = [];
|
||||
|
||||
this.imgList.forEach(element => {
|
||||
arr.push({
|
||||
name: "",
|
||||
url: this.baseUrl + element,
|
||||
});
|
||||
});
|
||||
this.defaultList = arr;
|
||||
},
|
||||
mounted() {
|
||||
console.log(this.$refs.upload.fileList);
|
||||
this.uploadList = this.$refs.upload.fileList;
|
||||
},
|
||||
methods: {
|
||||
handleView(name) {
|
||||
this.imgName = name;
|
||||
this.visible = true;
|
||||
},
|
||||
handleRemove(index) {
|
||||
this.$refs.upload.fileList.splice(index, 1);
|
||||
this.imgList.splice(index, 1);
|
||||
},
|
||||
handleSuccess(res, file) {
|
||||
console.log(res, file);
|
||||
file.url = this.baseUrl + res.data;
|
||||
this.imgList.push(res.data);
|
||||
},
|
||||
handleFormatError(file) {
|
||||
console.error(file);
|
||||
},
|
||||
handleMaxSize(file) {
|
||||
this.$Notice.warning({
|
||||
title: "图片过大",
|
||||
desc: "图片最大上传大小为20M.",
|
||||
});
|
||||
},
|
||||
},
|
||||
};
|
||||
</script>
|
||||
|
||||
<style>
|
||||
</style>
|
||||
@@ -0,0 +1,456 @@
|
||||
<template>
|
||||
<Modal v-model="modal" title="选择用户" width="720px" :mask-closable="false" :closable="false">
|
||||
<Tabs class="tabs-panel" type="card" v-if="firstTabIndex && firstTabIndex.length > 1" v-model="firstTabIndex" @on-click="firstTabChange">
|
||||
<TabPane v-for="(item, index) in firstTabData" :label="item" :name="index + ''"></TabPane>
|
||||
</Tabs>
|
||||
<AutoComplete @on-search="handleSearch" @on-select="handleSelect" placeholder="输入名字搜索" v-model="searchTreeName" :clearable="true" class="auto-box">
|
||||
<Option v-for="item in currentFlatten" :value="item.name">
|
||||
<span>{{ item.name }}</span>
|
||||
<span class="fr info">{{ item.group }}</span>
|
||||
</Option>
|
||||
</AutoComplete>
|
||||
<div class="tree-wrap fix">
|
||||
<div class="tree-panel fl">
|
||||
<ul class="tree-tab-ul fix">
|
||||
<li
|
||||
@click="secondTabChange(index)"
|
||||
:style="{ width: 100 / secondTabData.length + '%' }"
|
||||
:class="{ active: index == secondTabIndex, fl: true }"
|
||||
v-for="(item, index) in secondTabData"
|
||||
>
|
||||
{{ item }}
|
||||
</li>
|
||||
</ul>
|
||||
<div class="tree-box">
|
||||
<div :id="ztreeDomId" class="ztree"></div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="arrow-box fl">
|
||||
<svg t="1626916477711" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="10021" width="36" height="36">
|
||||
<path
|
||||
d="M138.935 256.078v511.844h63.42V256.078h-63.42z m126.842 0v511.844h127.215V256.078H265.777zM885.064 512L583.254 64.323v191.755H456.414v511.844h126.842v191.755L885.064 512z"
|
||||
p-id="10022"
|
||||
fill="#2d8cf0"
|
||||
></path>
|
||||
</svg>
|
||||
</div>
|
||||
<div class="user-panel fr">
|
||||
<div class="title-box fix">
|
||||
<Checkbox @on-change="checkAllUser" v-model="isCheckUserAll">全选</Checkbox>
|
||||
<div class="fr">{{ tempUserList.length }}</div>
|
||||
<a href="javascript:;" @click="delCheckUser" v-if="tempUserList.findIndex(x => x.isCheck) > -1">删除选中</a>
|
||||
</div>
|
||||
<ul class="user-box">
|
||||
<li :class="{ active: item.isCheck }" v-for="(item, index) in tempUserList" @click="checkUserOne(item)">
|
||||
{{ item.name }}
|
||||
<span class="info">{{ item.group }}</span>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
<div slot="footer">
|
||||
<i-Button type="primary" @click="submit">提交</i-Button>
|
||||
<i-Button @click="modal = false" style="margin-left: 8px">取消</i-Button>
|
||||
</div>
|
||||
</Modal>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
require("@public/libs/ztree/zTreeStyle.css");
|
||||
import "@public/libs/ztree/jquery.ztree.all.min.js";
|
||||
export default {
|
||||
props: {
|
||||
treeData: {
|
||||
type: Array,
|
||||
default() {
|
||||
return [];
|
||||
},
|
||||
},
|
||||
userids: {
|
||||
type: Array,
|
||||
default() {
|
||||
return [];
|
||||
},
|
||||
},
|
||||
ignoreIds: {
|
||||
type: Array,
|
||||
default() {
|
||||
return [];
|
||||
},
|
||||
},
|
||||
},
|
||||
model: {
|
||||
prop: "userids",
|
||||
event: "change",
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
ztreeDomId: null,
|
||||
modal: false,
|
||||
isCheckUserAll: false,
|
||||
firstTabIndex: 0,
|
||||
secondTabIndex: 0,
|
||||
cacheMap: new Map(),
|
||||
currentTree: [],
|
||||
currentFlatten: [],
|
||||
searchTreeName: null,
|
||||
tempUserList: [],
|
||||
isDisabled: false,
|
||||
};
|
||||
},
|
||||
watch: {
|
||||
searchTreeName(val) {
|
||||
this.handleSearch(val);
|
||||
},
|
||||
},
|
||||
computed: {
|
||||
firstTabData() {
|
||||
if (this.treeData.length > 1) return this.treeData.map(x => x.name);
|
||||
else return [];
|
||||
},
|
||||
secondTabData() {
|
||||
if (this.treeData.length == 0) return [];
|
||||
return this.treeData[this.firstTabIndex].data.map(x => x.name);
|
||||
},
|
||||
currentTreeFlatten() {
|
||||
const flatten = (data, pid, pname) => {
|
||||
return data.reduce((arr, { id, name, children = [], type }) => arr.concat([{ id, name, pid, type, group: pname }], flatten(children, id, name)), []);
|
||||
};
|
||||
if (!this.currentTree) return [];
|
||||
var newArr = flatten(this.currentTree, 0, "");
|
||||
return newArr;
|
||||
},
|
||||
},
|
||||
|
||||
mounted() {
|
||||
this.isDisabled = this.ignoreIds.length > 0;
|
||||
this.ztreeDomId = this.uuid();
|
||||
},
|
||||
methods: {
|
||||
show() {
|
||||
this.modal = true;
|
||||
this.firstTabChange("0");
|
||||
},
|
||||
firstTabChange(index) {
|
||||
this.firstTabIndex = index;
|
||||
this.secondTabChange(0);
|
||||
},
|
||||
secondTabChange(index) {
|
||||
const _this = this;
|
||||
if (index != 0 && this.secondTabIndex == index) return;
|
||||
this.secondTabIndex = index;
|
||||
this.changeEmpty();
|
||||
this.initTree();
|
||||
},
|
||||
handleSearch(query) {
|
||||
const _this = this;
|
||||
let arr = [],
|
||||
searchArr = this.currentTreeFlatten.filter(x => x.type == 2 && x.name.indexOf(query) != -1);
|
||||
for (const item of searchArr) {
|
||||
!arr.map(x => _this.getSplitId(x.id)).includes(_this.getSplitId(item.id)) && arr.push(item);
|
||||
}
|
||||
this.currentFlatten = arr;
|
||||
},
|
||||
handleSelect(query) {
|
||||
const _this = this;
|
||||
if (query.indexOf(",") != -1) query = query.split(",")[0];
|
||||
var treeObj = $.fn.zTree.getZTreeObj(this.ztreeDomId);
|
||||
var node = treeObj.getNodeByParam("name", query, null);
|
||||
if (!!node) treeObj.checkNode(node, true, true, true);
|
||||
},
|
||||
formatTree(tree, level = 0) {
|
||||
const _this = this;
|
||||
tree.forEach(element => {
|
||||
element.open = level == 0;
|
||||
element.type = 1;
|
||||
element.id = element.id + "," + element.pid;
|
||||
element.checked = false;
|
||||
if (typeof element.children !== "undefined" && element.children.length > 0) element.children = _this.formatTree(element.children, level + 1);
|
||||
else {
|
||||
element.type = 2;
|
||||
}
|
||||
});
|
||||
return tree;
|
||||
},
|
||||
initTree() {
|
||||
const _this = this;
|
||||
let first = _this.firstTabIndex,
|
||||
second = _this.secondTabIndex,
|
||||
cacheKey = first + "," + second,
|
||||
cacheMap = _this.cacheMap,
|
||||
tree = this.treeData[first].data[second].data;
|
||||
|
||||
if (!!tree && typeof tree === "function") {
|
||||
var cacheData = cacheMap.get(cacheKey);
|
||||
if (!cacheData) {
|
||||
tree().then(data => {
|
||||
cacheMap.set(cacheKey, data);
|
||||
_this.createTree(data, _this.ztreeDomId);
|
||||
});
|
||||
} else {
|
||||
_this.createTree(cacheData, _this.ztreeDomId);
|
||||
}
|
||||
} else {
|
||||
_this.createTree(tree, _this.ztreeDomId);
|
||||
}
|
||||
},
|
||||
createTree(_data, _domId) {
|
||||
const _this = this;
|
||||
var jtree = JSON.parse(JSON.stringify(_data));
|
||||
var ftree = _this.formatTree(jtree);
|
||||
_this.currentTree = ftree;
|
||||
//_this.tempUserList = JSON.parse(JSON.stringify(_this.userids));
|
||||
|
||||
let treeSetting = {
|
||||
view: {
|
||||
dblClickExpand: false,
|
||||
showIcon: false,
|
||||
},
|
||||
check: {
|
||||
enable: true,
|
||||
chkboxType: { Y: "ps", N: "ps" },
|
||||
},
|
||||
callback: {},
|
||||
};
|
||||
function formatUser(tree, checked) {
|
||||
const recursionCheckIds = tree => {
|
||||
let arrIds = [];
|
||||
for (const key in tree) {
|
||||
const element = tree[key];
|
||||
if (element.type == 2 && !element.chkDisabled) arrIds.push({ id: element.id, tid: element.tId });
|
||||
if (typeof element.children !== "undefined" && element.children) {
|
||||
var childIds = recursionCheckIds(element.children);
|
||||
arrIds = [...arrIds, ...childIds];
|
||||
}
|
||||
}
|
||||
return arrIds;
|
||||
};
|
||||
var checkIds = recursionCheckIds([tree]);
|
||||
var checkUserList = _this.currentTreeFlatten.filter(x => checkIds.map(x => x.id).includes(x.id));
|
||||
let checkUserArr = [];
|
||||
for (const element of checkUserList) {
|
||||
var findObj = checkIds.find(x => x.id == element.id);
|
||||
if (!!findObj && checkUserArr.findIndex(x => x.id == element.id) === -1 && _this.tempUserList.findIndex(x => x.id == element.id) === -1) {
|
||||
checkUserArr.push({ ...element, isCheck: false, tid: findObj.tid });
|
||||
}
|
||||
}
|
||||
if (checked) _this.tempUserList = _this.tempUserList.concat(checkUserArr);
|
||||
else {
|
||||
var ids = checkUserList.map(x => x.id);
|
||||
_this.tempUserList = _this.tempUserList.filter(x => !ids.includes(x.id));
|
||||
}
|
||||
}
|
||||
|
||||
//当禁止时,是否还显示在右侧
|
||||
var isCheckFormat = treeNode => {
|
||||
let id = _this.getSplitId(treeNode.id);
|
||||
return _this.ignoreIds.findIndex(x => x == id) === -1;
|
||||
};
|
||||
|
||||
treeSetting.callback.onClick = (event, treeId, treeNode, clickFlag) => {
|
||||
let check = treeNode.checked;
|
||||
let treeObj = $.fn.zTree.getZTreeObj(treeId);
|
||||
treeObj.checkNode(treeNode, !check, true);
|
||||
if (isCheckFormat(treeNode)) formatUser(treeNode, treeNode.checked);
|
||||
};
|
||||
treeSetting.callback.onCheck = (event, treeId, treeNode) => {
|
||||
if (isCheckFormat(treeNode)) formatUser(treeNode, treeNode.checked);
|
||||
};
|
||||
var treeObj = $.fn.zTree.init($("#" + _domId), treeSetting, ftree);
|
||||
//checkUser
|
||||
var nodes = treeObj.getNodesByFilter(x => _this.userids.includes(_this.getSplitId(x.id)));
|
||||
var arr = [];
|
||||
nodes.forEach(element => {
|
||||
var splitId = _this.getSplitId(element.id); //重复id只选择第一个
|
||||
if (!arr.includes(splitId)) treeObj.checkNode(element, true, true, true);
|
||||
arr.push(splitId);
|
||||
});
|
||||
|
||||
var ignorNodes = treeObj.getNodesByFilter(x => _this.ignoreIds.includes(_this.getSplitId(x.id)));
|
||||
ignorNodes.forEach(element => {
|
||||
treeObj.checkNode(element, true, true, true);
|
||||
treeObj.setChkDisabled(element, true);
|
||||
});
|
||||
},
|
||||
checkAllUser(check) {
|
||||
//全选用户
|
||||
const _this = this;
|
||||
_this.tempUserList.forEach(element => {
|
||||
element.isCheck = check;
|
||||
});
|
||||
},
|
||||
checkUserOne(item) {
|
||||
item.isCheck = !item.isCheck;
|
||||
let tlist = this.tempUserList;
|
||||
this.isCheckUserAll = tlist.length > 0 && tlist.filter(x => x.isCheck).length == tlist.length;
|
||||
},
|
||||
delCheckUser() {
|
||||
//删除选中用户
|
||||
const _this = this;
|
||||
let tlist = _this.tempUserList,
|
||||
delArr = [];
|
||||
for (const item of tlist) {
|
||||
item.isCheck && delArr.push(item);
|
||||
}
|
||||
var treeObj = $.fn.zTree.getZTreeObj(_this.ztreeDomId);
|
||||
delArr.forEach(element => {
|
||||
var node = treeObj.getNodeByTId(element.tid);
|
||||
treeObj.checkNode(node, false, true, true);
|
||||
});
|
||||
_this.isCheckUserAll = false;
|
||||
},
|
||||
changeEmpty() {
|
||||
this.tempUserList = [];
|
||||
this.searchTreeName = "";
|
||||
},
|
||||
submit() {
|
||||
const _this = this;
|
||||
let objArr = [],
|
||||
idsArr = this.tempUserList.map(x => _this.getSplitId(x.id));
|
||||
idsArr = Array.from(new Set(idsArr));
|
||||
this.$emit("change", idsArr);
|
||||
function delKey(obj, ...args) {
|
||||
args.forEach(v => {
|
||||
delete obj[v];
|
||||
});
|
||||
return obj;
|
||||
}
|
||||
idsArr.forEach(element => {
|
||||
let findObj = _this.tempUserList.find(x => _this.getSplitId(x.id) == element);
|
||||
delKey(findObj, "id", "isCheck", "tid", "pid", "type");
|
||||
let item = { ...findObj, id: element };
|
||||
if (_this.isDisabled) item.disabled = this.userids.findIndex(x => x == element) !== -1;
|
||||
objArr.push(item);
|
||||
});
|
||||
|
||||
if (_this.isDisabled) {
|
||||
var treeObj = $.fn.zTree.getZTreeObj(_this.ztreeDomId);
|
||||
var nodes = treeObj.getNodesByFilter(x => x.chkDisabled);
|
||||
var disIds = nodes.map(x => _this.getSplitId(x.id));
|
||||
objArr.forEach(element => {
|
||||
element.disabled = disIds.findIndex(x => element.id == x) > -1;
|
||||
});
|
||||
}
|
||||
this.$emit("on-submit", objArr);
|
||||
this.modal = false;
|
||||
},
|
||||
getSplitId(strId) {
|
||||
if (typeof strId === "string" && strId.indexOf(",") != -1) return parseInt(strId.split(",")[0]);
|
||||
else return strId;
|
||||
},
|
||||
uuid() {
|
||||
return "xxxxxxxx-xxxx-4xxx-yxxx-xxxxxxxxxxxx".replace(/[xy]/g, function (c) {
|
||||
var r = (Math.random() * 16) | 0,
|
||||
v = c == "x" ? r : (r & 0x3) | 0x8;
|
||||
return v.toString(16);
|
||||
});
|
||||
},
|
||||
},
|
||||
};
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.tree-wrap {
|
||||
height: 430px;
|
||||
position: relative;
|
||||
}
|
||||
.tree-panel {
|
||||
border: 1px solid #eee;
|
||||
width: 280px;
|
||||
height: 430px;
|
||||
overflow: hidden;
|
||||
}
|
||||
.tree-tab-ul {
|
||||
li {
|
||||
background: #f7f7f7;
|
||||
border-bottom: 1px solid #eee;
|
||||
height: 34px;
|
||||
line-height: 34px;
|
||||
text-align: center;
|
||||
cursor: pointer;
|
||||
}
|
||||
li.active {
|
||||
background: #fff;
|
||||
color: #2d8cf0;
|
||||
border-bottom: none;
|
||||
cursor: default;
|
||||
}
|
||||
}
|
||||
.tree-box {
|
||||
padding: 4px 0;
|
||||
height: 394px;
|
||||
width: auto;
|
||||
overflow-y: auto;
|
||||
border: none;
|
||||
}
|
||||
.user-panel {
|
||||
border: 1px solid #eee;
|
||||
width: 280px;
|
||||
.title-box {
|
||||
background: #f7f7f7;
|
||||
height: 34px;
|
||||
line-height: 34px;
|
||||
padding: 0 12px;
|
||||
a {
|
||||
text-decoration: none;
|
||||
float: right;
|
||||
margin-right: 20px;
|
||||
outline: none;
|
||||
}
|
||||
}
|
||||
.user-box {
|
||||
height: 396px;
|
||||
overflow-y: auto;
|
||||
li {
|
||||
line-height: 32px;
|
||||
padding-left: 12px;
|
||||
cursor: pointer;
|
||||
.info {
|
||||
float: right;
|
||||
margin-right: 12px;
|
||||
font-size: 12px;
|
||||
color: gray;
|
||||
}
|
||||
}
|
||||
li:hover {
|
||||
background: #f3f3f3;
|
||||
}
|
||||
li.active {
|
||||
background: #e4edf6;
|
||||
}
|
||||
}
|
||||
}
|
||||
.arrow-box {
|
||||
width: 128px;
|
||||
text-align: center;
|
||||
position: relative;
|
||||
top: 50%;
|
||||
margin-top: -17px;
|
||||
}
|
||||
|
||||
.auto-box {
|
||||
width: 200px;
|
||||
margin-bottom: 10px;
|
||||
.ivu-select-item .info {
|
||||
font-size: 12px;
|
||||
color: gray;
|
||||
position: relative;
|
||||
top: 2px;
|
||||
}
|
||||
}
|
||||
|
||||
.ztree li {
|
||||
overflow: hidden;
|
||||
}
|
||||
.ztree li a {
|
||||
width: 100%;
|
||||
}
|
||||
.ztree li a:hover {
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
.ivu-auto-complete .ivu-select-dropdown-list {
|
||||
max-height: 310px;
|
||||
overflow-y: auto;
|
||||
}
|
||||
</style>
|
||||
@@ -0,0 +1,157 @@
|
||||
import conf from "./hostConf.js";
|
||||
let BaseUrl = conf.serviceUrl;
|
||||
|
||||
export default {
|
||||
Base: {
|
||||
GetUserInfo: BaseUrl + "/api/GetUserInfo",
|
||||
GetUserMod: BaseUrl + "/api/GetUserMod",
|
||||
},
|
||||
BschClassSystem: {
|
||||
//年级树
|
||||
getGradeTree:BaseUrl + "/api/tree/getGradeTree",//获取年级树
|
||||
getClassTree:BaseUrl + "/api/tree/getClassTree",//获取班级树
|
||||
getTeaTree:BaseUrl + "/api/tree/getTeaTree",//获取教师树
|
||||
getGroupTree:BaseUrl + "/api/tree/getGroupTree",//获取全区树
|
||||
getHigherSchGradeTree:BaseUrl + "/api/tree/getHigherSchGradeTree",//获取高校年级树
|
||||
getHigherSchClassTree:BaseUrl + "/api/tree/getHigherSchClassTree",//获取高校班级树
|
||||
getgradeselect:BaseUrl + "/api/grade/select",//获取年级下拉
|
||||
getschclassselect:BaseUrl + "/api/schclass/select",//获取班级下拉
|
||||
getSchoolList:BaseUrl + "/api/tree/getSchoolList",//获取学校下拉
|
||||
getselectBySchId:BaseUrl + "/api/grade/selectBySchId",//通过学校ID获取年级下拉
|
||||
getselectBySchIdAndGradeId:BaseUrl + "/api/schclass/selectBySchIdAndGradeId",//通过学校ID、年级ID获取班级下拉
|
||||
getselectBySchsystemId:BaseUrl + "/api/grade/selectBySchsystemId",//通过学制ID获取年级下拉
|
||||
getTeacherTree:BaseUrl + "/api/tree/getTeacherTree",//获取教师选人树
|
||||
|
||||
//学制选择
|
||||
getschsystemlist: BaseUrl + "/api/schsystem/list",//获取学校绑定学制列表
|
||||
schsystemsave: BaseUrl + "/api/schsystem/save",//保存学制
|
||||
getschsystemselect: BaseUrl + "/api/schsystem/select",//获取选择的学制
|
||||
getType: BaseUrl + "/api/schsystem/getType",//获取学制类型
|
||||
|
||||
//时段设置
|
||||
getyeartermlist: BaseUrl + "/api/yearterm/list",//获取学年学期
|
||||
yeartermadd: BaseUrl + "/api/yearterm/add",//添加学年学期
|
||||
yeartermedit: BaseUrl + "/api/yearterm/edit",//编辑学年学期
|
||||
|
||||
//区域日志管理
|
||||
systemSearch: BaseUrl + "/api/log/systemSearch",//获取日志
|
||||
|
||||
//学校设置
|
||||
getcampuslist: BaseUrl + "/api/campus/list",//获取校区
|
||||
campussave: BaseUrl + "/api/campus/save",//保存校区
|
||||
campusdelete: BaseUrl + "/api/campus/delete/",//删除校区
|
||||
campussort: BaseUrl + "/api/campus/sort",//校区排序
|
||||
getcampusselect: BaseUrl + "/api/campus/select",//校区下拉
|
||||
|
||||
//系部设置
|
||||
getdivisionlist: BaseUrl + "/api/division/list",//获取系部列表
|
||||
divisionsave: BaseUrl + "/api/division/save",//保存系部
|
||||
divisiondelete: BaseUrl + "/api/division/delete/",//删除系部
|
||||
divisionsort: BaseUrl + "/api/division/sort",//系部排序
|
||||
getdivisionselect: BaseUrl + "/api/division/select",//系部下拉
|
||||
|
||||
//专业设置
|
||||
getmajorslist: BaseUrl + "/api/majors/list",//获取专业列表
|
||||
majorssave: BaseUrl + "/api/majors/save",//保存专业
|
||||
majorsdelete: BaseUrl + "/api/majors/delete/",//删除专业
|
||||
majorssort: BaseUrl + "/api/majors/sort",//专业排序
|
||||
getmajorsselect: BaseUrl + "/api/majors/select",//专业下拉
|
||||
|
||||
//课程管理
|
||||
getcourselist: BaseUrl + "/api/course/search",//获取课程列表
|
||||
coursesave: BaseUrl + "/api/course/save",//保存课程
|
||||
coursedelete: BaseUrl + "/api/course/delete/",//删除课程
|
||||
getcoursetypeselect: BaseUrl + "/api/course/typeSelect/",//课程类别下拉
|
||||
|
||||
//学科设置
|
||||
getsubjectlist: BaseUrl + "/api/subject/list",//获取学科列表
|
||||
subjectsave: BaseUrl + "/api/subject/save",//添加/编辑学科
|
||||
subjectsort: BaseUrl + "/api/subject/sort",//学科排序
|
||||
subjectdelete: BaseUrl + "/api/subject/delete/",//学科删除
|
||||
getsubjectselect: BaseUrl + "/api/subject/select",//获取学科下拉
|
||||
|
||||
//K12班级管理
|
||||
getsearcBaseSchClass: BaseUrl + "/api/schclass/searcBaseSchClass",//获取班级列表
|
||||
addBaseSchClass: BaseUrl + "/api/schclass/addBaseSchClass",//添加班级列表
|
||||
deleteBaseSchClass: BaseUrl + "/api/schclass/delete/",//删除班级列表
|
||||
editClassName: BaseUrl + "/api/schclass/editClassName",//编辑班级别名
|
||||
editClassFirstTeacher: BaseUrl + "/api/schclass/editClassFirstTeacher",//编辑班主任
|
||||
editClassSecondTeacher: BaseUrl + "/api/schclass/editClassSecondTeacher",//编辑副班主任
|
||||
editClassCampus: BaseUrl + "/api/schclass/editClassCampus",//编辑校区
|
||||
schclassdownloadTemplate: BaseUrl + "/api/schclass/downloadTemplate",//下载模版
|
||||
schclassImport: BaseUrl + "/api/schclass/importClasses",//导入班级
|
||||
|
||||
//高校班级管理
|
||||
getsearcHigherSchClass: BaseUrl + "/api/schclass/searcHigherSchClass",//获取班级列表
|
||||
saveHigherSchClass: BaseUrl + "/api/schclass/saveHigherSchClass",//添加班级列表
|
||||
deleteHigherSchClass: BaseUrl + "/api/schclass/HigherSchClassdelete/",//删除班级列表
|
||||
downloadHeightTemplate: BaseUrl + "/api/schclass/downloadHeightTemplate",//高校下载模版
|
||||
importHeightClasses: BaseUrl + "/api/schclass/importHeightClasses",//导入高校班级
|
||||
|
||||
//教师管理
|
||||
getteachersearch: BaseUrl + "/api/teacher/search",//获取教师列表
|
||||
getgroupteacherSelect: BaseUrl + "/api/teacher/groupSelect",//获取教师组下拉
|
||||
getgroupSelectBySchId: BaseUrl + "/api/teacher/groupSelectBySchId",//获取教师学科组下拉
|
||||
getteacherSelect: BaseUrl + "/api/teacher/select",//获取教师下拉
|
||||
teachersave: BaseUrl + "/api/teacher/save",//保存教师
|
||||
teacherdelete: BaseUrl + "/api/teacher/delete/",//删除教师
|
||||
teachersetStatus: BaseUrl + "/api/teacher/setStatus",//设置教师状态
|
||||
transferOut: BaseUrl + "/api/teacher/setTransferOut/",//设置移出教师
|
||||
moveGroup: BaseUrl + "/api/teacher/moveGroup",//移动教师
|
||||
setTransferIn: BaseUrl + "/api/teacher/setTransferIn",//教师转入
|
||||
transferOutSchSelect: BaseUrl + "/api/teacher/transferOutSchSelect",//教师转出学校下拉
|
||||
getsearchTransferOut: BaseUrl + "/api/teacher/searchTransferOut",//教师转出教师列表
|
||||
teacherdownloadTemplate: BaseUrl + "/api/teacher/downloadTemplate",//下载教师模版
|
||||
teacherImport: BaseUrl + "/api/teacher/Import",//教师导入
|
||||
|
||||
// 教师任教
|
||||
getteachssearch: BaseUrl + "/api/teachs/search",//获取任教列表
|
||||
teachssave: BaseUrl + "/api/teachs/save",//保存任教
|
||||
teachsdelete: BaseUrl + "/api/teachs/delete/",//删除任教
|
||||
delClassTeach: BaseUrl + "/api/teachs/delClassTeach",//删除班级任教
|
||||
teachsexport: BaseUrl + "/api/teachs/export",//导出任教
|
||||
TeachdownloadTemplate: BaseUrl + "/api/teachs/downloadTemplate",//导出任教模版
|
||||
importTeach: BaseUrl + "/api/teachs/importTeach",//导入任教
|
||||
getSchClassTeach: BaseUrl + "/api/teachs/getSchClassTeach",//通过班级ID获取任教
|
||||
|
||||
//教师分组管理
|
||||
getSchCustomGroup: BaseUrl + "/api/group/getSchCustomGroup",//获取教师分组列表
|
||||
saveSchCustomGroup: BaseUrl + "/api/group/saveSchCustomGroup",//保存教师分组
|
||||
saveMembers: BaseUrl + "/api/group/saveMembers",//设置组员
|
||||
setLeaders: BaseUrl + "/api/group/setLeaders",//设置组长
|
||||
deleteSchCustomGroup: BaseUrl + "/api/group/deleteSchCustomGroup",//删除分组
|
||||
GroupdownloadTemplate: BaseUrl + "/api/group/downloadTemplate",//导入分组模版
|
||||
importCustomGroup: BaseUrl + "/api/group/importCustomGroup",//导入分组
|
||||
|
||||
//k12学生管理
|
||||
getstudentsearch: BaseUrl + "/api/student/baseSchSearch",//获取学生列表
|
||||
studentsave: BaseUrl + "/api/student/save",//保存学生
|
||||
studentdelete: BaseUrl + "/api/student/delete/",//删除学生
|
||||
getstudentabnormal: BaseUrl + "/api/student/abnormal",//获取学生状态
|
||||
studenttransferClass: BaseUrl + "/api/student/transferClass",//学生调班
|
||||
studentsetAbnormalStatus: BaseUrl + "/api/student/setAbnormalStatus",//学生异动
|
||||
studenttransferOut: BaseUrl + "/api/student/setTransferOut/",//设置移出学生
|
||||
studenttransferOutSchSelect: BaseUrl + "/api/student/transferOutSchSelect",//学生转出学校下拉
|
||||
getstudentsearchTransferOut: BaseUrl + "/api/student/searchTransferOut",//学生转出列表
|
||||
studentsetTransferIn: BaseUrl + "/api/student/setTransferIn",//学生转入
|
||||
studentdownloadTemplate: BaseUrl + "/api/student/downloadTemplate",//下载学生导入模版
|
||||
importStudents: BaseUrl + "/api/student/importStudents",//学生导入
|
||||
studentClassNoTemplate: BaseUrl + "/api/student/studentClassNoTemplate",//下载学生学号导入模版
|
||||
importStudentClassNo: BaseUrl + "/api/student/importStudentClassNo",//学生学号导入
|
||||
searchSchClassStudent: BaseUrl + "/api/student/searchSchClassStudent",//通过班级ID获取学生
|
||||
|
||||
//高校学生管理
|
||||
gethigherSchSearch: BaseUrl + "/api/student/higherSchSearch",//获取学生列表
|
||||
|
||||
|
||||
// 学生异动管理
|
||||
getbaseSchAbnormalSearch: BaseUrl + "/api/student/baseSchAbnormalSearch",//获取K12学生异动列表
|
||||
gethigherSchAbnormalSearch: BaseUrl + "/api/student/higherSchAbnormalSearch",//获取高校学生异动列表
|
||||
|
||||
//日志管理
|
||||
getlogsearch: BaseUrl + "/api/log/search",//获取日志列表
|
||||
|
||||
//公共接口
|
||||
uploadFile: BaseUrl + "/api/uploadFile",//上传文件
|
||||
}
|
||||
};
|
||||
@@ -0,0 +1,12 @@
|
||||
let conf = {
|
||||
baseHost: "http://base.bestsch.com",
|
||||
ssoHost: "http://sso.bestsch.com",
|
||||
serviceUrl: "http://192.168.10.166:8087",
|
||||
fileHost:'http://base.bestsch.com/ClassroomMan/file',
|
||||
isLayoutOld: false
|
||||
// serviceUrl: "http://basedebug.bestsch.com/BschHome/",
|
||||
};
|
||||
|
||||
if (typeof window.conf !== "undefined") conf = window.conf;
|
||||
|
||||
export default conf;
|
||||
@@ -0,0 +1,251 @@
|
||||
<template>
|
||||
<div class="layout-wrap">
|
||||
<header class="header-container fix">
|
||||
<div class="fl align-middle icon-box">
|
||||
<div :class="['icon-btn', isPanel ? 'active' : '']" @click="showPanel">
|
||||
<svg width="22" height="22" viewBox="0 0 24 25" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<g clip-path="url(#clip0)">
|
||||
<path d="M24 0.972656H0V24.9727H24V0.972656Z" fill="white" fill-opacity="0.01" />
|
||||
<path
|
||||
d="M9 2.97266H3C2.44772 2.97266 2 3.42037 2 3.97266V9.97266C2 10.5249 2.44772 10.9727 3 10.9727H9C9.55228 10.9727 10 10.5249 10 9.97266V3.97266C10 3.42037 9.55228 2.97266 9 2.97266Z"
|
||||
stroke="white"
|
||||
stroke-width="1.6"
|
||||
stroke-linejoin="round"
|
||||
/>
|
||||
<path
|
||||
d="M9 14.9727H3C2.44772 14.9727 2 15.4204 2 15.9727V21.9727C2 22.5249 2.44772 22.9727 3 22.9727H9C9.55228 22.9727 10 22.5249 10 21.9727V15.9727C10 15.4204 9.55228 14.9727 9 14.9727Z"
|
||||
stroke="white"
|
||||
stroke-width="1.6"
|
||||
stroke-linejoin="round"
|
||||
/>
|
||||
<path
|
||||
d="M21 2.97266H15C14.4477 2.97266 14 3.42037 14 3.97266V9.97266C14 10.5249 14.4477 10.9727 15 10.9727H21C21.5523 10.9727 22 10.5249 22 9.97266V3.97266C22 3.42037 21.5523 2.97266 21 2.97266Z"
|
||||
stroke="white"
|
||||
stroke-width="1.6"
|
||||
stroke-linejoin="round"
|
||||
/>
|
||||
<path
|
||||
d="M14 14.9727H22"
|
||||
stroke="white"
|
||||
stroke-width="1.6"
|
||||
stroke-linecap="round"
|
||||
stroke-linejoin="round"
|
||||
/>
|
||||
<path
|
||||
d="M18 18.9727H22"
|
||||
stroke="white"
|
||||
stroke-width="1.6"
|
||||
stroke-linecap="round"
|
||||
stroke-linejoin="round"
|
||||
/>
|
||||
<path
|
||||
d="M14 22.9727H22"
|
||||
stroke="white"
|
||||
stroke-width="1.6"
|
||||
stroke-linecap="round"
|
||||
stroke-linejoin="round"
|
||||
/>
|
||||
</g>
|
||||
<defs>
|
||||
<clipPath id="clip0">
|
||||
<rect width="24" height="24" fill="white" transform="translate(0 0.972656)" />
|
||||
</clipPath>
|
||||
</defs>
|
||||
</svg>
|
||||
</div>
|
||||
</div>
|
||||
<div class="delimiter fl align-middle"></div>
|
||||
<h4 class="fl align-middle">{{ appName }}</h4>
|
||||
<div class="school-bg"></div>
|
||||
<div class="header-aside fr">
|
||||
<img :src="userInfo.avatar" class="fl align-middle" @click="linkUserInfo" />
|
||||
<a class="name fl align-middle text-ellipsis" href="javascript:void(0);" @click="linkUserInfo">
|
||||
{{ userInfo.name }}
|
||||
</a>
|
||||
<div class="delimiter fl align-middle"></div>
|
||||
<a href="javascript:;" @click="logout" class="logout fl align-middle" title="退出登陆">
|
||||
<svg
|
||||
t="1615536538850"
|
||||
viewBox="0 0 1024 1024"
|
||||
version="1.1"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
p-id="3048"
|
||||
width="18"
|
||||
height="18"
|
||||
>
|
||||
<path
|
||||
d="M554.666667 426.666667a42.666667 42.666667 0 0 1-85.333334 0V128a42.666667 42.666667 0 0 1 85.333334 0v298.666667z m101.973333-133.376a42.666667 42.666667 0 0 1 41.429333-74.581334 384 384 0 1 1-372.138666 0 42.666667 42.666667 0 0 1 41.386666 74.581334 298.666667 298.666667 0 1 0 289.365334 0z"
|
||||
p-id="3049"
|
||||
fill="#ffffff"
|
||||
></path>
|
||||
</svg>
|
||||
</a>
|
||||
</div>
|
||||
</header>
|
||||
|
||||
<div class="left-menu" v-if="!isAlone">
|
||||
<div class="menu-top-box"></div>
|
||||
<ul>
|
||||
<li
|
||||
:class="item.page == currPath ? 'active' : ''"
|
||||
v-for="(item, index) in modList"
|
||||
:key="'menu_li_' + index"
|
||||
>
|
||||
<a href="javascript:;" @click="linkMenu(item.page)">
|
||||
<div v-if="item.icon" :class="['icon-box fl', item.icon]"></div>
|
||||
<div v-else class="icon-box fl">
|
||||
<svg
|
||||
t="1615860353141"
|
||||
class="icon"
|
||||
viewBox="0 0 1024 1024"
|
||||
version="1.1"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
p-id="6624"
|
||||
width="14"
|
||||
height="14"
|
||||
>
|
||||
<path
|
||||
d="M0 102.4h307.2v307.2H0zM0 614.4h307.2v307.2H0zM409.6 102.4h614.4v102.4H409.6zM409.6 307.2h614.4v102.4H409.6zM409.6 614.4h614.4v102.4H409.6zM409.6 819.2h614.4v102.4H409.6z"
|
||||
p-id="6625"
|
||||
fill="#656667"
|
||||
></path>
|
||||
</svg>
|
||||
</div>
|
||||
{{ item.name }}
|
||||
</a>
|
||||
</li>
|
||||
</ul>
|
||||
<div class="clear-box"></div>
|
||||
</div>
|
||||
<template v-if="!isAlone">
|
||||
<div class="path-nav">
|
||||
<Breadcrumb separator=">">
|
||||
<a :href="baseHost + '/BschHome/front/index.html'">
|
||||
<BreadcrumbItem>
|
||||
<Icon type="ios-home-outline" size="14"></Icon>
|
||||
首页
|
||||
</BreadcrumbItem>
|
||||
</a>
|
||||
<BreadcrumbItem to="/">{{ appName }}</BreadcrumbItem>
|
||||
<BreadcrumbItem v-if="typeof navPath === 'string'">{{ navPath }}</BreadcrumbItem>
|
||||
<template v-else v-for="(item, index) in navPath">
|
||||
<BreadcrumbItem v-if="index != navPath.length - 1" :to="item.page">
|
||||
{{ item.name }}
|
||||
</BreadcrumbItem>
|
||||
<BreadcrumbItem v-else>{{ item.name }}</BreadcrumbItem>
|
||||
</template>
|
||||
</Breadcrumb>
|
||||
</div>
|
||||
<!-- <div class="path-nav" v-else>
|
||||
{{ navPath }}
|
||||
</div> -->
|
||||
</template>
|
||||
|
||||
<transition name="fade_apps">
|
||||
<div class="app-panel" ref="appPanel" v-if="isPanel">
|
||||
<div class="tips-box"></div>
|
||||
<ul class="fix">
|
||||
<li class="fl" v-for="item in appList">
|
||||
<a :href="item.url" target="_bank" rel="noopener noreferrer">
|
||||
<div class="icon-box">
|
||||
<img :src="item.icon" alt="" />
|
||||
</div>
|
||||
<p class="text-ellipsis">{{ item.name }}</p>
|
||||
</a>
|
||||
</li>
|
||||
</ul>
|
||||
<div class="link-panel">
|
||||
<a :href="baseHost + '/BschHome/front/index.html#/apps'" target="_bank" rel="noopener noreferrer">
|
||||
全部应用
|
||||
<i>→</i>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</transition>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
inject: ["reload"],
|
||||
props: {
|
||||
layoutData: {
|
||||
appName: String,
|
||||
appList: Array,
|
||||
modList: Array,
|
||||
userInfo: Object,
|
||||
ssoHost: String,
|
||||
baseHost: String,
|
||||
isAlone: Boolean, //是否只有一个选项卡
|
||||
},
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
color: "#fff",
|
||||
isPanel: false,
|
||||
themeColor: [],
|
||||
currPath: "/layout",
|
||||
navPath: "默认列表",
|
||||
};
|
||||
},
|
||||
created() {
|
||||
const _this = this;
|
||||
for (const key in _this.layoutData) _this[key] = _this.layoutData[key];
|
||||
_this.routeChange(_this.$route); //初次加载时手动触发route的change
|
||||
this.$watch("$route", _this.routeChange);
|
||||
},
|
||||
mounted() {},
|
||||
methods: {
|
||||
showPanel() {
|
||||
const _this = this;
|
||||
if (_this.appList.length == 0) {
|
||||
_this.$Message.info("暂无常用应用!");
|
||||
return;
|
||||
}
|
||||
_this.isPanel = false;
|
||||
setTimeout(() => {
|
||||
_this.isPanel = true;
|
||||
setTimeout(showPanel, 0);
|
||||
}, 0);
|
||||
var showPanel = () => {
|
||||
_this.$refs["appPanel"].onclick = e => e.stopPropagation();
|
||||
document.onclick = () => (_this.isPanel = false);
|
||||
};
|
||||
},
|
||||
routeChange(router) {
|
||||
const _this = this;
|
||||
window.document.title = router.meta.title || "弘育云平台";
|
||||
let currentMod = router.meta.modId;
|
||||
//时间有限,仅支持一层.暂时写死,有需求再改
|
||||
_this.modList.forEach(element => {
|
||||
let childIndex = element.children.findIndex(x => x.modId == currentMod);
|
||||
if (currentMod == element.modId || childIndex > -1) {
|
||||
_this.currPath = element.page;
|
||||
if (childIndex > -1) {
|
||||
let navArr = [];
|
||||
navArr.push({ name: element.name, page: element.page });
|
||||
navArr.push({
|
||||
name: element.children[childIndex].name,
|
||||
page: element.children[childIndex].page,
|
||||
});
|
||||
_this.navPath = navArr;
|
||||
} else _this.navPath = element.name;
|
||||
}
|
||||
});
|
||||
},
|
||||
linkMenu(page) {
|
||||
const path = this.$route.path;
|
||||
if (page === path) this.reload();
|
||||
else this.$router.push(page);
|
||||
},
|
||||
linkUserInfo() {
|
||||
top.location.href = this.baseHost + "/v/userinfo";
|
||||
},
|
||||
logout() {
|
||||
let url = window.location.href;
|
||||
url = "/logout?service=" + url;
|
||||
top.location.href = this.ssoHost + url;
|
||||
},
|
||||
},
|
||||
};
|
||||
</script>
|
||||
@@ -0,0 +1,305 @@
|
||||
<template>
|
||||
<div class="layout-wrap">
|
||||
<header class="header-container fix">
|
||||
<div class="fl align-middle icon-box">
|
||||
<div
|
||||
:class="['icon-btn', isPanel ? 'active' : '']"
|
||||
@click="showPanel"
|
||||
>
|
||||
<svg
|
||||
t="1615518122113"
|
||||
class="icon"
|
||||
viewBox="0 0 1024 1024"
|
||||
version="1.1"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
p-id="1276"
|
||||
width="18"
|
||||
height="18"
|
||||
>
|
||||
<path
|
||||
d="M710.54933333 68.11733334a64 64 0 0 1 90.496 0l165.504 165.504a64 64 0 0 1 0 90.496l-165.504 165.504a64 64 0 0 1-90.496 0l-165.504-165.504a64 64 0 0 1 0-90.496l165.504-165.504zM165.33333333 69.33333334a96 96 0 0 0-96 96v224a96 96 0 0 0 96 96h224a96 96 0 0 0 96-96V165.33333334a96 96 0 0 0-96-96H165.33333333zM165.33333333 549.33333334a96 96 0 0 0-96 96v224a96 96 0 0 0 96 96h224a96 96 0 0 0 96-96v-224a96 96 0 0 0-96-96H165.33333333zM645.33333333 549.33333334a96 96 0 0 0-96 96v224a96 96 0 0 0 96 96h224a96 96 0 0 0 96-96v-224a96 96 0 0 0-96-96h-224z"
|
||||
p-id="1277"
|
||||
:fill="color"
|
||||
></path>
|
||||
</svg>
|
||||
</div>
|
||||
</div>
|
||||
<div class="delimiter fl align-middle"></div>
|
||||
<h4 class="fl align-middle">{{ appName }}</h4>
|
||||
<div class="school-bg"></div>
|
||||
<div class="header-aside fr">
|
||||
<img
|
||||
:src="userInfo.avatar"
|
||||
class="fl align-middle"
|
||||
@click="linkUserInfo"
|
||||
/>
|
||||
<a
|
||||
class="name fl align-middle text-ellipsis"
|
||||
href="javascript:void(0);"
|
||||
@click="linkUserInfo"
|
||||
>{{ userInfo.name }}</a
|
||||
>
|
||||
<div class="delimiter fl align-middle"></div>
|
||||
<a
|
||||
href="javascript:;"
|
||||
@click="logout"
|
||||
class="logout fl align-middle"
|
||||
title="退出登陆"
|
||||
>
|
||||
<svg
|
||||
t="1615536538850"
|
||||
viewBox="0 0 1024 1024"
|
||||
version="1.1"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
p-id="3048"
|
||||
width="18"
|
||||
height="18"
|
||||
>
|
||||
<path
|
||||
d="M554.666667 426.666667a42.666667 42.666667 0 0 1-85.333334 0V128a42.666667 42.666667 0 0 1 85.333334 0v298.666667z m101.973333-133.376a42.666667 42.666667 0 0 1 41.429333-74.581334 384 384 0 1 1-372.138666 0 42.666667 42.666667 0 0 1 41.386666 74.581334 298.666667 298.666667 0 1 0 289.365334 0z"
|
||||
p-id="3049"
|
||||
fill="#ffffff"
|
||||
></path>
|
||||
<!-- d5defe -->
|
||||
</svg>
|
||||
</a>
|
||||
</div>
|
||||
</header>
|
||||
|
||||
<div class="left-menu" v-if="!isAlone">
|
||||
<div class="menu-top-box"></div>
|
||||
<ul>
|
||||
<template v-for="(item, index) in modArr">
|
||||
<template v-if="item.children && item.children.length > 0">
|
||||
<li>
|
||||
<a href="javascript:;" @click="childChange(index)">
|
||||
<i
|
||||
:class="
|
||||
item.childState
|
||||
? 'arrow-down'
|
||||
: 'arrow-up'
|
||||
"
|
||||
></i>
|
||||
<div
|
||||
v-if="item.icon"
|
||||
:class="['icon-box fl', item.icon]"
|
||||
></div>
|
||||
<div v-else class="icon-box fl">
|
||||
<svg
|
||||
t="1615860353141"
|
||||
class="icon"
|
||||
viewBox="0 0 1024 1024"
|
||||
version="1.1"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
p-id="6624"
|
||||
width="14"
|
||||
height="14"
|
||||
>
|
||||
<path
|
||||
d="M0 102.4h307.2v307.2H0zM0 614.4h307.2v307.2H0zM409.6 102.4h614.4v102.4H409.6zM409.6 307.2h614.4v102.4H409.6zM409.6 614.4h614.4v102.4H409.6zM409.6 819.2h614.4v102.4H409.6z"
|
||||
p-id="6625"
|
||||
fill="#656667"
|
||||
></path>
|
||||
</svg>
|
||||
</div>
|
||||
{{ item.name }}
|
||||
</a>
|
||||
</li>
|
||||
<transition name="fade_child_ul">
|
||||
<div
|
||||
class="child-item-wrap"
|
||||
v-show="item.childState"
|
||||
>
|
||||
<li
|
||||
:class="
|
||||
citem.page == currPath
|
||||
? 'active child-item'
|
||||
: 'child-item'
|
||||
"
|
||||
v-for="citem in item.children"
|
||||
>
|
||||
<a
|
||||
href="javascript:;"
|
||||
@click="linkMenu(citem.page)"
|
||||
>
|
||||
{{ citem.name }}
|
||||
</a>
|
||||
</li>
|
||||
</div>
|
||||
</transition>
|
||||
</template>
|
||||
<li
|
||||
v-else
|
||||
:class="item.page == currPath ? 'active' : ''"
|
||||
:key="'menu_li_' + index"
|
||||
>
|
||||
<a href="javascript:;" @click="linkMenu(item.page)">
|
||||
<div
|
||||
v-if="item.icon"
|
||||
:class="['icon-box fl', item.icon]"
|
||||
></div>
|
||||
<div v-else class="icon-box fl">
|
||||
<svg
|
||||
t="1615860353141"
|
||||
class="icon"
|
||||
viewBox="0 0 1024 1024"
|
||||
version="1.1"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
p-id="6624"
|
||||
width="14"
|
||||
height="14"
|
||||
>
|
||||
<path
|
||||
d="M0 102.4h307.2v307.2H0zM0 614.4h307.2v307.2H0zM409.6 102.4h614.4v102.4H409.6zM409.6 307.2h614.4v102.4H409.6zM409.6 614.4h614.4v102.4H409.6zM409.6 819.2h614.4v102.4H409.6z"
|
||||
p-id="6625"
|
||||
fill="#656667"
|
||||
></path>
|
||||
</svg>
|
||||
</div>
|
||||
{{ item.name }}
|
||||
</a>
|
||||
</li>
|
||||
</template>
|
||||
</ul>
|
||||
<div class="clear-box"></div>
|
||||
</div>
|
||||
<template v-if="!isAlone">
|
||||
<div
|
||||
class="path-nav"
|
||||
v-if="navPath instanceof Array && navPath.length > 1"
|
||||
>
|
||||
<Breadcrumb separator=">">
|
||||
<template v-for="(item, index) in navPath">
|
||||
<BreadcrumbItem>{{ item.name }}</BreadcrumbItem>
|
||||
</template>
|
||||
</Breadcrumb>
|
||||
</div>
|
||||
<div class="path-nav" v-else>
|
||||
{{ navPath }}
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<transition name="fade_apps">
|
||||
<div class="app-panel" ref="appPanel" v-if="isPanel">
|
||||
<div class="tips-box"></div>
|
||||
<ul class="fix">
|
||||
<li class="fl" v-for="item in appList">
|
||||
<a
|
||||
:href="item.url"
|
||||
target="_bank"
|
||||
rel="noopener noreferrer"
|
||||
>
|
||||
<div class="icon-box">
|
||||
<img :src="item.icon" alt="" />
|
||||
</div>
|
||||
<p class="text-ellipsis">{{ item.name }}</p>
|
||||
</a>
|
||||
</li>
|
||||
</ul>
|
||||
<div class="link-panel">
|
||||
<a
|
||||
:href="baseHost + '/BschHome/front/index.html#/apps'"
|
||||
target="_bank"
|
||||
rel="noopener noreferrer"
|
||||
>全部应用<i>→</i></a
|
||||
>
|
||||
</div>
|
||||
</div>
|
||||
</transition>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
inject: ["reload"],
|
||||
props: {
|
||||
layoutData: {
|
||||
appName: String,
|
||||
appList: Array,
|
||||
modList: Array,
|
||||
userInfo: Object,
|
||||
ssoHost: String,
|
||||
baseHost: String,
|
||||
isAlone: Boolean, //是否只有一个选项卡
|
||||
},
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
color: "#fff",
|
||||
isPanel: false,
|
||||
themeColor: [],
|
||||
currPath: "",
|
||||
navPath: null,
|
||||
modArr: [],
|
||||
};
|
||||
},
|
||||
created() {
|
||||
const _this = this;
|
||||
for (const key in _this.layoutData) _this[key] = _this.layoutData[key];
|
||||
_this.routeChange(_this.$route); //初次加载时手动触发route的change
|
||||
this.$watch("$route", _this.routeChange);
|
||||
this.modList.forEach((element) => {
|
||||
element.childState = true;
|
||||
this.modArr.push(element);
|
||||
});
|
||||
},
|
||||
mounted() {},
|
||||
methods: {
|
||||
showPanel() {
|
||||
const _this = this;
|
||||
if (_this.appList.length == 0) {
|
||||
_this.$Message.info("暂无常用应用!");
|
||||
return;
|
||||
}
|
||||
_this.isPanel = false;
|
||||
setTimeout(() => {
|
||||
_this.isPanel = true;
|
||||
setTimeout(showPanel, 0);
|
||||
}, 0);
|
||||
var showPanel = () => {
|
||||
_this.$refs["appPanel"].onclick = (e) => e.stopPropagation();
|
||||
document.onclick = () => (_this.isPanel = false);
|
||||
};
|
||||
},
|
||||
routeChange(router) {
|
||||
const _this = this;
|
||||
window.document.title = router.meta.title || "弘育云平台";
|
||||
let currentMod = router.meta.modId;
|
||||
_this.currPath = router.path;
|
||||
//时间有限,仅支持一层.暂时写死,有需求再改
|
||||
_this.modList.forEach((element) => {
|
||||
let childIndex = element.children.findIndex(
|
||||
(x) => x.modId == currentMod
|
||||
);
|
||||
if (currentMod == element.modId || childIndex > -1) {
|
||||
if (childIndex > -1) {
|
||||
let navArr = [];
|
||||
navArr.push({ name: element.name, page: element.page });
|
||||
navArr.push({
|
||||
name: element.children[childIndex].name,
|
||||
page: element.children[childIndex].page,
|
||||
});
|
||||
_this.navPath = navArr;
|
||||
} else _this.navPath = element.name;
|
||||
}
|
||||
});
|
||||
},
|
||||
linkMenu(page) {
|
||||
const path = this.$route.path;
|
||||
if (page === path) this.reload();
|
||||
else this.$router.push(page);
|
||||
},
|
||||
linkUserInfo() {
|
||||
top.location.href = this.baseHost + "/v/userinfo";
|
||||
},
|
||||
childChange(index) {
|
||||
this.modArr[index].childState = !this.modArr[index].childState;
|
||||
},
|
||||
logout() {
|
||||
let url = window.location.href;
|
||||
url = "/logout?service=" + url;
|
||||
top.location.href = this.ssoHost + url;
|
||||
},
|
||||
},
|
||||
};
|
||||
</script>
|
||||
@@ -0,0 +1,263 @@
|
||||
<template>
|
||||
<div class="layout-wrap">
|
||||
<header class="header-container fix">
|
||||
<div class="fl align-middle icon-box">
|
||||
<div title="常用应用" :class="['icon-btn', isPanel ? 'active' : '']" @click="showPanel">
|
||||
<i class="iconfont icon-apps"></i>
|
||||
</div>
|
||||
</div>
|
||||
<div class="delimiter fl align-middle"></div>
|
||||
<h4 class="fl align-middle">{{ appName }}</h4>
|
||||
<div class="school-bg"></div>
|
||||
<div class="header-aside fr">
|
||||
<img :src="userInfo.avatar" class="fl align-middle" @click="linkUserInfo" />
|
||||
<a class="name fl align-middle text-ellipsis" href="javascript:void(0);" @click="linkUserInfo">
|
||||
{{ userInfo.name }}
|
||||
</a>
|
||||
<div class="delimiter fl align-middle"></div>
|
||||
<a href=" " @click="logout" class="logout fl align-middle" title="退出登陆">
|
||||
<i class="iconfont icon-logout"></i>
|
||||
</a>
|
||||
</div>
|
||||
</header>
|
||||
|
||||
<div class="left-menu" v-if="!isAlone">
|
||||
<div class="menu-top-box"></div>
|
||||
<ul>
|
||||
<template v-for="(item, index) in modArr">
|
||||
<template v-if="item.children && item.children.length > 0">
|
||||
<li>
|
||||
<a href="javascript:;" @click="childChange(index)">
|
||||
<i :class="item.childState ? 'arrow-down' : 'arrow-up'"></i>
|
||||
<div v-if="item.icon" :class="['icon-box fl', item.icon]"></div>
|
||||
<div v-else class="icon-box fl">
|
||||
<svg
|
||||
t="1615860353141"
|
||||
class="icon"
|
||||
viewBox="0 0 1024 1024"
|
||||
version="1.1"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
p-id="6624"
|
||||
width="14"
|
||||
height="14"
|
||||
>
|
||||
<path
|
||||
d="M0 102.4h307.2v307.2H0zM0 614.4h307.2v307.2H0zM409.6 102.4h614.4v102.4H409.6zM409.6 307.2h614.4v102.4H409.6zM409.6 614.4h614.4v102.4H409.6zM409.6 819.2h614.4v102.4H409.6z"
|
||||
p-id="6625"
|
||||
fill="#656667"
|
||||
></path>
|
||||
</svg>
|
||||
</div>
|
||||
{{ item.name }}
|
||||
</a>
|
||||
</li>
|
||||
<transition name="fade_child_ul">
|
||||
<div class="child-item-wrap" v-show="item.childState">
|
||||
<li
|
||||
:class="citem.page == currPath ? 'active child-item' : 'child-item'"
|
||||
v-for="citem in item.children"
|
||||
>
|
||||
<a href="javascript:;" @click="linkMenu(citem.page)">
|
||||
{{ citem.name }}
|
||||
</a>
|
||||
</li>
|
||||
</div>
|
||||
</transition>
|
||||
</template>
|
||||
<li v-else :class="item.page == currPath ? 'active' : ''" :key="'menu_li_' + index">
|
||||
<a href="javascript:;" @click="linkMenu(item.page)">
|
||||
<div v-if="item.icon" :class="['icon-box fl', item.icon]"></div>
|
||||
<div v-else class="icon-box fl">
|
||||
<svg
|
||||
t="1615860353141"
|
||||
class="icon"
|
||||
viewBox="0 0 1024 1024"
|
||||
version="1.1"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
p-id="6624"
|
||||
width="14"
|
||||
height="14"
|
||||
>
|
||||
<path
|
||||
d="M0 102.4h307.2v307.2H0zM0 614.4h307.2v307.2H0zM409.6 102.4h614.4v102.4H409.6zM409.6 307.2h614.4v102.4H409.6zM409.6 614.4h614.4v102.4H409.6zM409.6 819.2h614.4v102.4H409.6z"
|
||||
p-id="6625"
|
||||
fill="#656667"
|
||||
></path>
|
||||
</svg>
|
||||
</div>
|
||||
{{ item.name }}
|
||||
</a>
|
||||
</li>
|
||||
</template>
|
||||
</ul>
|
||||
<div class="clear-box"></div>
|
||||
</div>
|
||||
<div class="path-nav" v-if="!isAlone">
|
||||
<Breadcrumb separator=">">
|
||||
<a :href="baseHost + '/BschHome/front/index.html'">
|
||||
<BreadcrumbItem>
|
||||
<i class="iconfont icon-category"></i>
|
||||
首页
|
||||
</BreadcrumbItem>
|
||||
</a>
|
||||
<BreadcrumbItem to="/">{{ appName }}</BreadcrumbItem>
|
||||
<BreadcrumbItem v-if="typeof navPath == 'string'">{{ navPath }}</BreadcrumbItem>
|
||||
<template v-else v-for="(item, index) in navPath">
|
||||
<BreadcrumbItem v-if="index != navPath.length - 1" :to="item.page">{{ item.name }}</BreadcrumbItem>
|
||||
<BreadcrumbItem v-else>{{ item.name }}</BreadcrumbItem>
|
||||
</template>
|
||||
</Breadcrumb>
|
||||
</div>
|
||||
|
||||
<transition name="fade_apps">
|
||||
<div class="app-panel" ref="appPanel" v-if="isPanel">
|
||||
<div class="tips-box"></div>
|
||||
<ul class="fix">
|
||||
<li class="fl" v-for="item in appList">
|
||||
<a :href="item.url" target="_bank" rel="noopener noreferrer">
|
||||
<div class="icon-box">
|
||||
<img :src="item.icon" alt="" />
|
||||
</div>
|
||||
<p class="text-ellipsis">{{ item.name }}</p>
|
||||
</a>
|
||||
</li>
|
||||
</ul>
|
||||
<div class="link-panel">
|
||||
<a :href="baseHost + '/BschHome/front/index.html#/apps'" target="_bank" rel="noopener noreferrer">
|
||||
全部应用
|
||||
<i>→</i>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</transition>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
inject: ["reload"],
|
||||
props: {
|
||||
layoutData: {
|
||||
appName: String,
|
||||
appList: Array,
|
||||
modList: Array,
|
||||
userInfo: Object,
|
||||
ssoHost: String,
|
||||
baseHost: String,
|
||||
isAlone: Boolean //是否只有一个选项卡
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
color: "#fff",
|
||||
isPanel: false,
|
||||
themeColor: [],
|
||||
currPath: "",
|
||||
navPath: null,
|
||||
modArr: [],
|
||||
menuArr: []
|
||||
};
|
||||
},
|
||||
created() {
|
||||
const _this = this;
|
||||
for (const key in _this.layoutData) _this[key] = _this.layoutData[key];
|
||||
this.menuArr = this.flaten(this.modList);
|
||||
_this.routeChange(_this.$route); //初次加载时手动触发route的change
|
||||
this.$watch("$route", _this.routeChange);
|
||||
this.modList.forEach(element => {
|
||||
element.childState = true; //此处修改结点状态,默认打开
|
||||
this.modArr.push(element);
|
||||
});
|
||||
|
||||
this.$bus.$on("setNavPath", arr => (_this.navPath = arr));
|
||||
this.$bus.$on("setMenuPath", modId => {
|
||||
let find = this.menuArr.find(x => x.modId == modId);
|
||||
!!find && (this.currPath = find.page);
|
||||
});
|
||||
},
|
||||
mounted() {},
|
||||
methods: {
|
||||
showPanel() {
|
||||
const _this = this;
|
||||
if (_this.appList.length == 0) {
|
||||
_this.$Message.info("暂无常用应用!");
|
||||
return;
|
||||
}
|
||||
_this.isPanel = false;
|
||||
setTimeout(() => {
|
||||
_this.isPanel = true;
|
||||
setTimeout(showPanel, 0);
|
||||
}, 0);
|
||||
var showPanel = () => {
|
||||
_this.$refs["appPanel"].onclick = e => e.stopPropagation();
|
||||
document.onclick = () => (_this.isPanel = false);
|
||||
};
|
||||
},
|
||||
routeChange(router) {
|
||||
const _this = this;
|
||||
let { modId, title, parentId: routerPId } = router.meta,
|
||||
navArr = [];
|
||||
window.document.title = title || "弘育云平台";
|
||||
var find = this.menuArr.find(x => x.modId == modId);
|
||||
if (!find) {
|
||||
let parentFind = this.menuArr.find(x => x.modId == routerPId);
|
||||
if (!parentFind) {
|
||||
// this.$router.push("/");
|
||||
// throw "路由错误!";
|
||||
let newmenuArr = this.menuArr.filter(x => x.pid>0);
|
||||
if(newmenuArr.length>0){
|
||||
if(newmenuArr.findIndex(x => x.page == this.$route.path)==-1){
|
||||
this.$router.push(newmenuArr[0].page);
|
||||
}
|
||||
}else{
|
||||
if(this.menuArr.findIndex(x => x.page == this.$route.path)==-1){
|
||||
this.$router.push(this.menuArr[0].page);
|
||||
}
|
||||
}
|
||||
parentFind=this.menuArr[0];
|
||||
}
|
||||
find = parentFind;
|
||||
setTimeout(() => {
|
||||
this.navPath.push({ name: title });
|
||||
}, 0);
|
||||
}
|
||||
let { name, page, pid } = find;
|
||||
this.currPath = page;
|
||||
let pfind = this.menuArr.find(x => x.id == pid);
|
||||
if (!!pfind) {
|
||||
navArr.push({ name: pfind.name });
|
||||
}
|
||||
navArr.push({ name, page });
|
||||
this.navPath = navArr;
|
||||
},
|
||||
linkMenu(page) {
|
||||
const path = this.$route.path;
|
||||
if (page === path) this.reload();
|
||||
else this.$router.push(page);
|
||||
},
|
||||
linkUserInfo() {
|
||||
top.location.href = this.baseHost + "/v/userinfo";
|
||||
},
|
||||
childChange(index) {
|
||||
this.modArr[index].childState = !this.modArr[index].childState;
|
||||
},
|
||||
|
||||
logout() {
|
||||
let url = window.location.href;
|
||||
url = "/logout?service=" + url;
|
||||
top.location.href = this.ssoHost + url;
|
||||
},
|
||||
flaten(tree, pid = 0) {
|
||||
var arr = [];
|
||||
tree.forEach(element => {
|
||||
let { id, name, page, modId } = element;
|
||||
arr.push({ id, name, page, modId, pid });
|
||||
if (element.children) {
|
||||
arr.push(...this.flaten(element.children, id));
|
||||
}
|
||||
});
|
||||
return arr;
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
@@ -0,0 +1,306 @@
|
||||
<template>
|
||||
<div class="layout_old">
|
||||
<!-- 头部 -->
|
||||
<header class="header">
|
||||
<div class="header-logo">
|
||||
<div class="header-logo-title">
|
||||
<img :src="logoUrl" />
|
||||
</div>
|
||||
</div>
|
||||
<div class="header-aside">
|
||||
<div class="aside-box clearfix">
|
||||
<p>
|
||||
你好,
|
||||
<a>{{ username }}</a>
|
||||
</p>
|
||||
<p class="aside-btn-list">
|
||||
<Tooltip content="个人信息" placement="bottom-start">
|
||||
<Button type="ghost" icon="android-happy" @click="linkUser()"></Button>
|
||||
</Tooltip>
|
||||
<Tooltip content="应用列表" placement="bottom">
|
||||
<Button type="ghost" icon="android-apps" @click="linkApp()"></Button>
|
||||
</Tooltip>
|
||||
<Tooltip content="退出登录" placement="bottom-end">
|
||||
<Button type="ghost" icon="power" @click="logout"></Button>
|
||||
</Tooltip>
|
||||
<!-- 如果是3.0.icon改成 -->
|
||||
<!--
|
||||
md-happy
|
||||
md-apps
|
||||
md-power
|
||||
-->
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</header>
|
||||
<!-- 标题 -->
|
||||
<div class="path-nav">
|
||||
<h1>{{ pathName }}</h1>
|
||||
</div>
|
||||
<!-- 侧边 -->
|
||||
<div class="leftmenu">
|
||||
<div class="" style="height: 100%">
|
||||
<div class="title-top">{{ appName }}</div>
|
||||
<ul class="title-box">
|
||||
<li
|
||||
v-for="(item, index) in modList"
|
||||
:key="index"
|
||||
:class="{
|
||||
active: item.page.toLowerCase() == currPath.toLowerCase(),
|
||||
}"
|
||||
>
|
||||
<!-- <router-link :to="item.page" >{{item.name}}</router-link> -->
|
||||
<a href="javascript:;" @click="flushCom(item.page)">{{ item.name }}</a>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
export default {
|
||||
inject: ["reload"],
|
||||
props: {
|
||||
layoutData: {
|
||||
appName: String,
|
||||
appList: Array,
|
||||
modList: Array,
|
||||
userInfo: Object,
|
||||
ssoHost: String,
|
||||
baseHost: String,
|
||||
isAlone: Boolean, //是否只有一个选项卡
|
||||
},
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
username: "",
|
||||
pathName: "",
|
||||
logoUrl: "",
|
||||
currPath: "",
|
||||
};
|
||||
},
|
||||
computed: {
|
||||
listNumber: function () {
|
||||
return this.pathList.sort(function (a, b) {
|
||||
return a.modId - b.modId;
|
||||
});
|
||||
},
|
||||
},
|
||||
mounted() {
|
||||
const _this = this;
|
||||
for (const key in _this.layoutData) _this[key] = _this.layoutData[key];
|
||||
this.username = this.userInfo.name;
|
||||
this.logoUrl = this.baseHost + "/img/logo.png";
|
||||
_this.routeChange(_this.$route); //初次加载时手动触发route的change
|
||||
this.$watch("$route", _this.routeChange);
|
||||
$(".base-wrap-main").css("padding-top", "145px");
|
||||
},
|
||||
methods: {
|
||||
logout() {
|
||||
//退出登陆
|
||||
let url = window.location.href;
|
||||
url = "/logout?service=" + url;
|
||||
top.location.href = this.ssoHost + url;
|
||||
},
|
||||
routeChange(router) {
|
||||
const _this = this;
|
||||
window.document.title = router.meta.title || "弘育云平台";
|
||||
let currentMod = router.meta.modId;
|
||||
//时间有限,仅支持一层.暂时写死,有需求再改
|
||||
_this.modList.forEach(element => {
|
||||
let childIndex = element.children.findIndex(x => x.modId == currentMod);
|
||||
if (currentMod == element.modId || childIndex > -1) {
|
||||
_this.currPath = element.page;
|
||||
_this.pathName = element.name;
|
||||
}
|
||||
});
|
||||
},
|
||||
|
||||
linkApp() {
|
||||
location.href = this.baseHost + "/v/home";
|
||||
},
|
||||
linkUser() {
|
||||
location.href = this.baseHost + "/v/userinfo";
|
||||
},
|
||||
flushCom(page) {
|
||||
//return;
|
||||
const path = this.$route.path;
|
||||
// console.log(page,path);
|
||||
if (page === path) {
|
||||
this.reload();
|
||||
//this.$root.$children[0].reload()
|
||||
} else {
|
||||
this.$router.push(page);
|
||||
}
|
||||
},
|
||||
},
|
||||
};
|
||||
</script>
|
||||
<style lang="scss" >
|
||||
.layout_old {
|
||||
.header {
|
||||
width: 100%;
|
||||
height: 70px;
|
||||
position: fixed;
|
||||
top: 0;
|
||||
left: 0;
|
||||
z-index: 22;
|
||||
background-color: #fff;
|
||||
background-image: linear-gradient(143deg, #6c91f0 45%, #7863b4 81%, #7a5aa9);
|
||||
.header-logo {
|
||||
width: 200px;
|
||||
height: 100%;
|
||||
float: left;
|
||||
position: relative;
|
||||
}
|
||||
.header-logo-title {
|
||||
margin-left: 32px;
|
||||
position: relative;
|
||||
top: 20px;
|
||||
.logo-box {
|
||||
background: url(/static/image/logo.png) no-repeat;
|
||||
width: 450px;
|
||||
height: 70px;
|
||||
}
|
||||
}
|
||||
.header-aside {
|
||||
float: right;
|
||||
margin: 0 30px 0 0;
|
||||
position: relative;
|
||||
color: #fff;
|
||||
font-size: 14px;
|
||||
.aside-box {
|
||||
margin: 26px 0 22px 0;
|
||||
.icon-box {
|
||||
width: 34px;
|
||||
font-size: 18px;
|
||||
color: #fff;
|
||||
text-align: center;
|
||||
}
|
||||
a {
|
||||
color: #fff;
|
||||
&:hover {
|
||||
color: #2d8cf0;
|
||||
}
|
||||
}
|
||||
}
|
||||
.aside-btn-list {
|
||||
.ivu-btn {
|
||||
padding: 0px;
|
||||
border: 0px;
|
||||
width: 35px;
|
||||
i {
|
||||
color: #fff;
|
||||
font-size: 18px;
|
||||
}
|
||||
}
|
||||
}
|
||||
p {
|
||||
float: left;
|
||||
color: #ffffff;
|
||||
padding-right: 10px;
|
||||
font-size: 14px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.path-nav {
|
||||
position: fixed;
|
||||
z-index: 21;
|
||||
top: 70px;
|
||||
height: 54px;
|
||||
left: 200px;
|
||||
box-shadow: 0 1px 1px 0 rgba(0, 0, 0, 0.1);
|
||||
background: #fff;
|
||||
width: 100%;
|
||||
padding: 0 15px;
|
||||
box-sizing: border-box;
|
||||
min-width: 767px;
|
||||
h1 {
|
||||
float: left;
|
||||
font-size: 16px;
|
||||
color: #464c5b;
|
||||
margin: auto;
|
||||
line-height: 56px;
|
||||
font-weight: 400;
|
||||
}
|
||||
}
|
||||
|
||||
.leftmenu {
|
||||
position: fixed;
|
||||
z-index: 20;
|
||||
-moz-overflow: auto;
|
||||
overflow: auto\9;
|
||||
overflow: overlay;
|
||||
overflow-x: hidden;
|
||||
background: #8791a5 !important;
|
||||
height: 100%;
|
||||
width: 200px;
|
||||
padding-top: 70px;
|
||||
box-sizing: border-box;
|
||||
& > div {
|
||||
overflow-y: auto;
|
||||
}
|
||||
.title-top {
|
||||
height: 54px;
|
||||
line-height: 54px;
|
||||
background: #3e485a;
|
||||
font-size: 16px;
|
||||
font-weight: 400;
|
||||
text-align: center;
|
||||
width: 200px;
|
||||
color: #ffffff;
|
||||
}
|
||||
.title-box {
|
||||
background: #eaedf2;
|
||||
width: 200px;
|
||||
overflow: overlay;
|
||||
border-right: 0px;
|
||||
display: block;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
outline: 0;
|
||||
list-style: none;
|
||||
color: #495060;
|
||||
font-size: 14px;
|
||||
position: relative;
|
||||
li {
|
||||
text-align: center;
|
||||
background: #8791a5;
|
||||
padding: 0px !important;
|
||||
border-bottom: 1px solid #a5adbf;
|
||||
transition: all 200ms;
|
||||
&:hover {
|
||||
border-left: 4px solid #6c8fed;
|
||||
background: #f3f3f3;
|
||||
}
|
||||
&.active {
|
||||
background: #f3f3f3;
|
||||
a {
|
||||
color: #333;
|
||||
}
|
||||
}
|
||||
a {
|
||||
color: #ffffff;
|
||||
display: block;
|
||||
padding: 16px 0px 14px 34px;
|
||||
text-align: left;
|
||||
color: #ffffff;
|
||||
}
|
||||
a:hover {
|
||||
color: rgb(51, 51, 51);
|
||||
}
|
||||
}
|
||||
a {
|
||||
color: #495060;
|
||||
}
|
||||
}
|
||||
}
|
||||
.wrap-main {
|
||||
padding: 124px 0 0 200px;
|
||||
}
|
||||
.nav-btn-wrap {
|
||||
top: 78px;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@@ -0,0 +1,62 @@
|
||||
import Vue from "vue";
|
||||
import App from "./App.vue";
|
||||
import router from "./router";
|
||||
|
||||
import api from "./api/index.js";
|
||||
// 将API方法绑定到全局
|
||||
Vue.prototype.$api = api;
|
||||
|
||||
import "@babel/polyfill";
|
||||
// import "babel-polyfill";
|
||||
|
||||
// 引用工具文件
|
||||
import utils from "./utils/index.js";
|
||||
// 将工具方法绑定到全局
|
||||
Vue.prototype.$utils = utils;
|
||||
|
||||
import APIConfig from "./config/apiConf.js";
|
||||
window.APIConfig = APIConfig;
|
||||
|
||||
import "view-design/dist/styles/iview.css";
|
||||
import ViewUI from "view-design";
|
||||
Vue.use(ViewUI);
|
||||
|
||||
import conf from "./config/hostConf.js";
|
||||
Vue.prototype.$conf = conf;
|
||||
window.conf = conf;
|
||||
|
||||
import "./assets/styles/main.scss";
|
||||
|
||||
// 是否是IE内核
|
||||
//代码高亮文件引入(IE暂不支持)
|
||||
import hljs from "highlight.js";
|
||||
//样式文件,这里我选的是sublime样式,文件里面还有其他样式可供选择
|
||||
// import "highlight.js/styles/monokai-sublime.css";
|
||||
// import "highlight.js/styles/vs2015.css";
|
||||
import "highlight.js/styles/atelier-dune-light.css";
|
||||
|
||||
Vue.directive("highlight", function(el) {
|
||||
let blocks = el.querySelectorAll("pre code");
|
||||
blocks.forEach(block => {
|
||||
hljs.highlightBlock(block);
|
||||
});
|
||||
});
|
||||
|
||||
|
||||
import codeModal from "./mixins/code_modal";
|
||||
Vue.mixin(codeModal);
|
||||
|
||||
var EventBus = new Vue(); //事件总线
|
||||
Object.defineProperties(Vue.prototype, {
|
||||
$bus: {
|
||||
get: function() {
|
||||
return EventBus;
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
Vue.config.productionTip = false;
|
||||
new Vue({
|
||||
router,
|
||||
render: h => h(App)
|
||||
}).$mount("#app");
|
||||
@@ -0,0 +1,8 @@
|
||||
import codeModal from "../components/codeModal/index.js";
|
||||
export default {
|
||||
methods: {
|
||||
showCode({ name, url, type = "vue" }) {
|
||||
codeModal({ name, url, type });
|
||||
}
|
||||
}
|
||||
};
|
||||
@@ -0,0 +1,36 @@
|
||||
export const self_viewport = {
|
||||
data() {
|
||||
return {
|
||||
tableHeight: null
|
||||
};
|
||||
},
|
||||
computed: {
|
||||
useTableHeight() {
|
||||
return (settings = {}) => {
|
||||
let { isSearch = true, isPage = true, isTabs = false, isOperat = true, otherH = 0 } = settings;
|
||||
let bodyH = this.tableHeight,
|
||||
headerH = 112,
|
||||
searchH = 52,
|
||||
operatH = 48,
|
||||
tabsH = 56,
|
||||
pageH = 72,
|
||||
paddingH = 8;
|
||||
let tableH = bodyH - headerH - paddingH;
|
||||
isOperat && (tableH -= operatH);
|
||||
isTabs && (tableH -= tabsH);
|
||||
isSearch && (tableH -= searchH);
|
||||
isPage && (tableH -= pageH);
|
||||
otherH > 0 && (tableH -= otherH);
|
||||
return tableH;
|
||||
};
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
this.tableHeight = document.body.clientHeight;
|
||||
window.onresize = () => {
|
||||
return (() => {
|
||||
this.tableHeight = document.body.clientHeight;
|
||||
})();
|
||||
};
|
||||
}
|
||||
};
|
||||
@@ -0,0 +1,32 @@
|
||||
// 去掉export function,写内部方法
|
||||
export default {
|
||||
methods: {
|
||||
treeRenderContent(h, params) {
|
||||
const { root, node, data } = params;
|
||||
const icon0 = 'data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABIAAAASCAYAAABWzo5XAAAAAXNSR0IArs4c6QAAAKJJREFUOE9jZKASYKSSOQzUN+j/QaH7DAwMCmgufMDw758jo+OHB4RcDnfR/4NC/3EovsDAyPgBh9wDRru3iSA5VIOkMxgYeHQIWQ6R/3CUgeHlcgZG+3dgMxAGnVT+zyAVz8DAIUecQT8eMTA8W8jAaH4XzaDrjri8htdgRs39owYRCPqhEUbYsgihNPWAUXO/IkqCJKSDkDz1cz8hGwnJAwCJjEAToczWhwAAAABJRU5ErkJggg==';
|
||||
const iconOther = 'data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABIAAAASCAYAAABWzo5XAAAAAXNSR0IArs4c6QAAAaVJREFUOE+t1D9v00AYx/HvpSFqqyDdgKqOqVBVIRBK3kGY6NIhqtQ1tXgBSV9B4ldAeAEoZmIB3kK8M4QljM0t7XxDhgjcXHXnP4odEoOER/vu4989z2ML/tMlypz22EhAhp5Qu9ZuhRKgh6FvIQRD4NM2cAPaAPIxFIIg9IRfTJdBJUBxn8Lgh+9EkD5wUHtsGhgmQKOsZoXnNmEr9IROIYlhBHT/CYqP6dk9uRolyWxRd4OCEPDWC++gydw0IhgLUHvg+6E74gBDO5cwBvxBG/UA74HmHrTenCRHm8yNjHA1aiYxgwS0UA/QKfDbMBQiSxxWoZNB6Vu/35nhcsVgGcV3BDjQQhH0BPQNyMMnqKc1/NdHha7ZTZefTXBxRvftKayAWw0pmL6oWkG/fIY6qNL8OoNgSkCFm2LXprb9x3W4eoXqvKBxv4jBaIV+LtFyH/lthvzyExa/HK+T9qt81z6aPsLVxIHdJpyfxnlcgh9rgOEDFUY2zUb7s+FccZ2Asl6LoSxBAchN9p+GsDBTmi1AKZQucCDo9AjbJr/0f/S3n8wj0GCqE4RTEr0AAAAASUVORK5CYII=';
|
||||
|
||||
return h('span', [
|
||||
h('img', {
|
||||
attrs: {
|
||||
src: node.nodeKey == 0 ? icon0 : iconOther
|
||||
},
|
||||
style: 'width: 16px; height: 16px;vertical-align: sub;'
|
||||
}),
|
||||
h('span', {
|
||||
style: {
|
||||
display: 'inline-block',
|
||||
cursor: "pointer",
|
||||
backgroundColor: node.node.selected ? "#e5e5e5" : ""
|
||||
},
|
||||
on: {
|
||||
click: (e) => {
|
||||
e.stopPropagation()
|
||||
this.$emit("on-tree-change", node.node);
|
||||
}
|
||||
}
|
||||
}, data.title)
|
||||
]);
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,141 @@
|
||||
import Vue from "vue";
|
||||
import VueRouter from "vue-router";
|
||||
|
||||
const studySystemChoice = () => import("../views/studySystemChoice.vue");
|
||||
const itemSet = () => import("../views/itemSet.vue");
|
||||
const areaOperateDaily = () => import("../views/areaOperateDaily.vue");
|
||||
const schoolSetting = () => import("../views/schoolSetting.vue");
|
||||
const subjectManForZy = () => import("../views/subjectManForZy.vue");
|
||||
const classManage = () => import("../views/classManage.vue");
|
||||
const electiveClassManage = () => import("../views/electiveClassManage.vue");
|
||||
const electiveClassManageDetail = () => import("../views/electiveClassManageDetail.vue");
|
||||
const ChristianityDetail = () => import("../views/classManage/ChristianityDetail.vue");
|
||||
const subjectSetzhi = () => import("../views/subjectSetzhi.vue");
|
||||
const teacherManage = () => import("../views/teacherManage.vue");
|
||||
const studentManage = () => import("../views/studentManage.vue");
|
||||
const historySearch = () => import("../views/historySearch.vue");
|
||||
const historySearchDetail = () => import("../views/historySearchDetail.vue");
|
||||
const studentYDManage = () => import("../views/studentYDManage.vue");
|
||||
const zhuanruinfo = () => import("../views/zhuanruinfo.vue");
|
||||
const zhuanruinfostu = () => import("../views/zhuanruinfostu.vue");
|
||||
const dailySearch = () => import("../views/dailySearch.vue");
|
||||
|
||||
Vue.use(VueRouter);
|
||||
|
||||
const routes = [
|
||||
{
|
||||
path: "/",
|
||||
name: "studySystemChoice",
|
||||
component: studySystemChoice,
|
||||
meta: { title: "学制选择", modId: 1, icon: "icon-shezhi" }
|
||||
},
|
||||
{
|
||||
path: '/itemSet',
|
||||
name: "itemSet",
|
||||
component: itemSet,
|
||||
meta:{title:"时段设置",modId:2,icon: "icon-shezhi"}
|
||||
},
|
||||
{
|
||||
path: '/areaOperateDaily',
|
||||
name: "areaOperateDaily",
|
||||
component: areaOperateDaily,
|
||||
meta:{title:"区域操作日志",modId:3,icon: "icon-chaxun"}
|
||||
},
|
||||
{
|
||||
path: '/schoolSetting',
|
||||
name: "schoolSetting",
|
||||
component: schoolSetting,
|
||||
meta:{title:"学校设置",modId:4,icon: "icon-cshxd"}
|
||||
},
|
||||
{
|
||||
path: '/subjectManForZy',
|
||||
name: "subjectManForZy",
|
||||
component: subjectManForZy,
|
||||
meta:{title:"课程设置",modId:5,icon: "icon-xuekeshezhi"}
|
||||
},
|
||||
{
|
||||
path: '/subjectSetzhi',
|
||||
name: "subjectSetzhi",
|
||||
component: subjectSetzhi,
|
||||
meta:{title:"学科管理",modId:6,icon: "icon-xuekeshezhi"}
|
||||
},
|
||||
{
|
||||
path: '/classManage',
|
||||
name: "classManage",
|
||||
component: classManage,
|
||||
meta:{title:"班级管理",modId:7,icon: "icon-banji"}
|
||||
},
|
||||
{
|
||||
path: "/ChristianityDetail",
|
||||
name: "ChristianityDetail",
|
||||
component: ChristianityDetail,
|
||||
meta: { title: "班级管理", modId: 7,parentPath:"/classManage" }
|
||||
},
|
||||
{
|
||||
path: '/electiveClassManage',
|
||||
name: "electiveClassManage",
|
||||
component: electiveClassManage,
|
||||
meta:{title:"选修班管理",modId:8,icon: "icon-banji"}
|
||||
},
|
||||
{
|
||||
path: "/electiveClassManageDetail",
|
||||
name: "electiveClassManageDetail",
|
||||
component: electiveClassManageDetail,
|
||||
meta: { title: "选修班管理", modId: 8,parentPath:"/electiveClassManage" }
|
||||
},
|
||||
{
|
||||
path: '/teacherManage',
|
||||
name: "teacherManage",
|
||||
component: teacherManage,
|
||||
meta:{title:"教师管理",modId:9,icon: "icon-jiaoshi"}
|
||||
},
|
||||
{
|
||||
path: '/studentManage',
|
||||
name: "studentManage",
|
||||
component: studentManage,
|
||||
meta:{title:"学生管理",modId:10,icon: "icon-xuesheng"}
|
||||
},
|
||||
{
|
||||
path: '/historySearch',
|
||||
name: "historySearch",
|
||||
component: historySearch,
|
||||
meta:{title:"历史查询",modId:11,icon: "icon-chaxun"}
|
||||
},
|
||||
{
|
||||
path: "/historySearchDetail",
|
||||
name: "historySearchDetail",
|
||||
component: historySearchDetail,
|
||||
meta: { title: "历史查询", modId: 11,parentPath:"/historySearch" }
|
||||
},
|
||||
{
|
||||
path: '/studentYDManage',
|
||||
name: "studentYDManage",
|
||||
component: studentYDManage,
|
||||
meta:{title:"学生异动管理",modId:12,icon: "icon-xuesheng"}
|
||||
},
|
||||
{
|
||||
path: '/zhuanruinfo',
|
||||
name: "zhuanruinfo",
|
||||
component: zhuanruinfo,
|
||||
meta:{title:"教师转入管理",modId:13,icon: "icon-jiaoshi"}
|
||||
},
|
||||
{
|
||||
path: '/zhuanruinfostu',
|
||||
name: "zhuanruinfostu",
|
||||
component: zhuanruinfostu,
|
||||
meta:{title:"学生转入管理",modId:14,icon: "icon-xuesheng"}
|
||||
},
|
||||
{
|
||||
path: '/dailySearch',
|
||||
name: "dailySearch",
|
||||
component: dailySearch,
|
||||
meta:{title:"日志管理",modId:15,icon: "icon-chaxun"}
|
||||
},
|
||||
];
|
||||
|
||||
const router = new VueRouter({
|
||||
base: process.env.BASE_URL,
|
||||
routes
|
||||
});
|
||||
|
||||
export default router;
|
||||
@@ -0,0 +1,245 @@
|
||||
export default {
|
||||
goodTime (str) {
|
||||
let now = new Date().getTime()
|
||||
let oldTime = new Date(str).getTime()
|
||||
let difference = now - oldTime
|
||||
let result = ''
|
||||
let minute = 1000 * 60
|
||||
let hour = minute * 60
|
||||
let day = hour * 24
|
||||
let month = day * 30
|
||||
let year = month * 12
|
||||
let _year = difference / year
|
||||
let _month = difference / month
|
||||
let _week = difference / (7 * day)
|
||||
let _day = difference / day
|
||||
let _hour = difference / hour
|
||||
let _min = difference / minute
|
||||
|
||||
if (_year >= 1) {
|
||||
result = '发表于 ' + ~~(_year) + ' 年前'
|
||||
} else if (_month >= 1) {
|
||||
result = '发表于 ' + ~~(_month) + ' 个月前'
|
||||
} else if (_week >= 1) {
|
||||
result = '发表于 ' + ~~(_week) + ' 周前'
|
||||
} else if (_day >= 1) {
|
||||
result = '发表于 ' + ~~(_day) + ' 天前'
|
||||
} else if (_hour >= 1) {
|
||||
result = '发表于 ' + ~~(_hour) + ' 个小时前'
|
||||
} else if (_min >= 1) {
|
||||
result = '发表于 ' + ~~(_min) + ' 分钟前'
|
||||
} else {
|
||||
result = '刚刚'
|
||||
}
|
||||
return result
|
||||
},
|
||||
/**
|
||||
* iView2 Tree 公用方法:选中指定ID节点,自动展开所有父节点
|
||||
* @param {Array} treeData 树形原始数据
|
||||
* @param {Number|String} targetId 要选中的节点id
|
||||
* @param {Object} vueThis 当前Vue组件this实例
|
||||
*/
|
||||
selectTreeNodeById(treeData, targetId, vueThis) {
|
||||
const loop = function (nodes, parentNode) {
|
||||
for (let node of nodes) {
|
||||
// 清空所有节点选中状态
|
||||
vueThis.$set(node, 'selected', false)
|
||||
|
||||
if (node.id === targetId) {
|
||||
// 目标节点设为选中
|
||||
vueThis.$set(node, 'selected', true)
|
||||
let p = parentNode
|
||||
// 逐层向上展开父节点
|
||||
while (p) {
|
||||
vueThis.$set(p, 'expand', true)
|
||||
p = p._parent
|
||||
}
|
||||
return true
|
||||
}
|
||||
|
||||
if (node.children && node.children.length) {
|
||||
// 绑定父节点引用
|
||||
node.children.forEach(child => child._parent = node)
|
||||
const res = loop(node.children, node)
|
||||
if (res) return true
|
||||
}
|
||||
}
|
||||
return false
|
||||
}
|
||||
|
||||
loop(treeData, null)
|
||||
},
|
||||
strToHexCharCode(_str) {
|
||||
if (_str === "") return "";
|
||||
var hexCharCode = [];
|
||||
for (var i = 0; i < _str.length; i++) {
|
||||
var str = _str.charCodeAt(i).toString(16);
|
||||
if (_str.length == 1) str += "0" + _str;
|
||||
hexCharCode.push(str);
|
||||
}
|
||||
return hexCharCode.join("");
|
||||
},
|
||||
dateFormat(_date,fmt){
|
||||
var date=new Date(_date);
|
||||
var o = {
|
||||
"M+": date.getMonth() + 1, //月份
|
||||
"d+": date.getDate(), //日
|
||||
"H+": date.getHours(), //小时
|
||||
"m+": date.getMinutes(), //分
|
||||
"s+": date.getSeconds(), //秒
|
||||
"q+": Math.floor((date.getMonth() + 3) / 3), //季度
|
||||
"S": date.getMilliseconds() //毫秒
|
||||
};
|
||||
if (/(y+)/.test(fmt)) fmt = fmt.replace(RegExp.$1, (date.getFullYear() + "").substr(4 - RegExp.$1.length));
|
||||
for (var k in o)
|
||||
if (new RegExp("(" + k + ")").test(fmt)) fmt = fmt.replace(RegExp.$1, (RegExp.$1.length == 1) ? (o[k]) : (("00" + o[k]).substr(("" + o[k]).length)));
|
||||
return fmt;
|
||||
},
|
||||
dataFilter(_key,arry) {
|
||||
for (var key in arry) {
|
||||
if (arry.hasOwnProperty(key)) {
|
||||
var element = arry[key];
|
||||
if(element.k==_key)
|
||||
return element.v;
|
||||
}
|
||||
}
|
||||
return '';
|
||||
},
|
||||
myUpload(url,fileObj,data,callback){
|
||||
var FileController ="/api"+ url; // 接收上传文件的后台地址
|
||||
if (!fileObj ||fileObj.length==0) {
|
||||
console.error('请选择上传文件'); return;
|
||||
}
|
||||
// FormData 对象
|
||||
var form = new FormData();
|
||||
//表单数据
|
||||
for (let key in data) {
|
||||
const element = data[key];
|
||||
form.append(key,element);
|
||||
}
|
||||
form.append("file", fileObj);// 文件对象
|
||||
// XMLHttpRequest 对象
|
||||
var xhr = new XMLHttpRequest();
|
||||
xhr.open("post", FileController, true);
|
||||
xhr.onload = function (resp) {
|
||||
var obj = JSON.parse(resp.currentTarget.response);
|
||||
if(callback)
|
||||
callback(obj);
|
||||
};
|
||||
xhr.send(form);
|
||||
},
|
||||
comSetting(){//公共插件基础配置,如有需要,覆盖即可
|
||||
const tree={
|
||||
view: {
|
||||
dblClickExpand: false,
|
||||
showIcon: false,
|
||||
},
|
||||
check: {
|
||||
enable: false,
|
||||
},
|
||||
callback:{}
|
||||
}
|
||||
return {
|
||||
tree:tree,
|
||||
}
|
||||
},
|
||||
comSetting1(){//公共插件基础配置,如有需要,覆盖即可
|
||||
const tree={
|
||||
view: {
|
||||
dblClickExpand: false,
|
||||
showIcon: false,
|
||||
},
|
||||
edit: {
|
||||
enable: true,
|
||||
showRemoveBtn: false,
|
||||
showRenameBtn: false,
|
||||
drag: { prev: true, next: true,inner: false}
|
||||
},
|
||||
check: {
|
||||
enable: false
|
||||
},
|
||||
data: {
|
||||
simpleData: {
|
||||
enable: true
|
||||
}
|
||||
},
|
||||
callback: {
|
||||
|
||||
}
|
||||
}
|
||||
return {
|
||||
tree:tree,
|
||||
}
|
||||
},
|
||||
|
||||
openFistNode(_zNodes){//展开一级节点
|
||||
if(_zNodes&&_zNodes.length>0){
|
||||
for (var key in _zNodes) {
|
||||
if (_zNodes.hasOwnProperty(key)) {
|
||||
var element = _zNodes[key];
|
||||
element.open=true;
|
||||
}
|
||||
}
|
||||
}
|
||||
else{
|
||||
_zNodes.open=true;
|
||||
}
|
||||
return _zNodes;
|
||||
},
|
||||
editorFormat(val){//富文本提取文字
|
||||
return val.replace(/<[^>]+>/g, "");
|
||||
},
|
||||
mathFormat(val,number=2){//小数点截取,默认取2位
|
||||
if(isNaN(val))return 0;
|
||||
var num=Math.pow(10,number);
|
||||
return Math.floor(val*num)/num;
|
||||
},
|
||||
fileSize(size){//返回文件大小
|
||||
if(!size) return '';
|
||||
if(size/1024<1024){
|
||||
size=Math.ceil(size/1024);
|
||||
return size+'KB';
|
||||
}else if(size/(1024*1024)<1024){
|
||||
size=Math.ceil(size/(1024*1024)*100)/100;
|
||||
return size+'MB';
|
||||
}else if(size/(1024*1024*1024)<1024){
|
||||
size=Math.ceil(size/(1024*1024*1024)*100)/100;
|
||||
return size+'GB';
|
||||
}
|
||||
},
|
||||
handleValidate(_this,name){//表单验证
|
||||
let isValid = false;
|
||||
_this.$refs[name].validate(function (valid) {
|
||||
if (valid) {
|
||||
isValid = true;
|
||||
} else {
|
||||
// _this.$Message.info('表单验证失败!');
|
||||
|
||||
_this.$Message.info('请填写红色星号内容!');
|
||||
}
|
||||
})
|
||||
return isValid;
|
||||
},
|
||||
handleReset(_this,resetName,name) {//表单重置
|
||||
if(name&&_this.isModal&&_this.isModal[name]) _this.isModal[name] = false;
|
||||
if (resetName) {
|
||||
_this.$refs[resetName].resetFields();
|
||||
}
|
||||
},
|
||||
downFile(id) {//下载文件
|
||||
location.href = APIConfig.Base.FileDown + '?id=' + id;
|
||||
},
|
||||
|
||||
localStorage:{
|
||||
get(key){
|
||||
return localStorage.getItem(key);
|
||||
},
|
||||
set(key,val){
|
||||
localStorage.setItem(key,val);
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
}
|
||||