mirror of
https://github.com/jeecgboot/JeecgBoot.git
synced 2026-01-04 04:45:28 +08:00
Jeecg Boot 2.2.1 版本发布,低代码平台
This commit is contained in:
@ -7,7 +7,7 @@
|
||||
<a-icon type="info-circle-o" />
|
||||
</a-tooltip>
|
||||
<div>
|
||||
<mini-area :datasource="chartData.sll" />
|
||||
<mini-area :data-source="chartData.sll" />
|
||||
</div>
|
||||
<template slot="footer">今日受理量:<span>{{ todaySll }}</span></template>
|
||||
</chart-card>
|
||||
@ -18,7 +18,7 @@
|
||||
<a-icon type="info-circle-o" />
|
||||
</a-tooltip>
|
||||
<div>
|
||||
<mini-area :datasource="chartData.bjl"/>
|
||||
<mini-area :data-source="chartData.bjl"/>
|
||||
</div>
|
||||
<template slot="footer">今日办结量:<span>{{ todayBjl }}</span></template>
|
||||
</chart-card>
|
||||
|
||||
@ -209,7 +209,6 @@
|
||||
})
|
||||
getVisitInfo().then(res=>{
|
||||
if(res.success){
|
||||
console.log("aaaaaa",res.result)
|
||||
this.visitInfo = res.result;
|
||||
}
|
||||
})
|
||||
|
||||
@ -7,7 +7,7 @@ const types = {
|
||||
404: {
|
||||
img: 'https://gw.alipayobjects.com/zos/rmsportal/KpnpchXsobRgLElEozzI.svg',
|
||||
title: '404',
|
||||
desc: '抱歉,你访问的页面不存在或仍在开发中'
|
||||
desc: '抱歉,你访问的页面不存在或无权访问'
|
||||
},
|
||||
500: {
|
||||
img: 'https://gw.alipayobjects.com/zos/rmsportal/RVRUAYdCGeYNBWoKiIwB.svg',
|
||||
|
||||
613
ant-design-vue-jeecg/src/views/jeecg/ImagCropper.vue
Normal file
613
ant-design-vue-jeecg/src/views/jeecg/ImagCropper.vue
Normal file
@ -0,0 +1,613 @@
|
||||
<template>
|
||||
<div class="wrapper">
|
||||
<div class="model" v-show="model">
|
||||
<div class="model-show" @click="model = false">
|
||||
<img :src="modelSrc" alt="" @click="model = false">
|
||||
</div>
|
||||
</div>
|
||||
<div class="content">
|
||||
<div class="show-info">
|
||||
<div class="test test1">
|
||||
<vueCropper
|
||||
ref="cropper"
|
||||
:img="option.img"
|
||||
:outputSize="option.size"
|
||||
:outputType="option.outputType"
|
||||
:info="true"
|
||||
:full="option.full"
|
||||
:canMove="option.canMove"
|
||||
:canMoveBox="option.canMoveBox"
|
||||
:fixedBox="option.fixedBox"
|
||||
:original="option.original"
|
||||
:autoCrop="option.autoCrop"
|
||||
:autoCropWidth="option.autoCropWidth"
|
||||
:autoCropHeight="option.autoCropHeight"
|
||||
:centerBox="option.centerBox"
|
||||
:high="option.high"
|
||||
:infoTrue="option.infoTrue"
|
||||
:maxImgSize="option.maxImgSize"
|
||||
@realTime="realTime"
|
||||
@imgLoad="imgLoad"
|
||||
@cropMoving="cropMoving"
|
||||
:enlarge="option.enlarge"
|
||||
:mode="option.mode"
|
||||
:limitMinSize="option.limitMinSize"
|
||||
></vueCropper>
|
||||
</div>
|
||||
<div class="test-button">
|
||||
<button @click="changeImg" class="btn">changeImg</button>
|
||||
<label class="btn" for="uploads">upload</label>
|
||||
<input type="file" id="uploads" style="position:absolute; clip:rect(0 0 0 0);" accept="image/png, image/jpeg, image/gif, image/jpg" @change="uploadImg($event, 1)" ref="uploadImg">
|
||||
<button @click="startCrop" v-if="!crap" class="btn">start</button>
|
||||
<button @click="stopCrop" v-else class="btn">stop</button>
|
||||
<button @click="clearCrop" class="btn">clear</button>
|
||||
<button @click="refreshCrop" class="btn">refresh</button>
|
||||
<button @click="changeScale(1)" class="btn">+</button>
|
||||
<button @click="changeScale(-1)" class="btn">-</button>
|
||||
<button @click="rotateLeft" class="btn">rotateLeft</button>
|
||||
<button @click="rotateRight" class="btn">rotateRight</button>
|
||||
<button @click="finish('base64')" class="btn">preview(base64)</button>
|
||||
<button @click="finish('blob')" class="btn">preview(blob)</button>
|
||||
<button @click="() => option.img = ''" class="btn">清除图片</button>
|
||||
<a @click="down('base64')" class="btn">download(base64)</a>
|
||||
<a @click="down('blob')" class="btn">download(blob)</a>
|
||||
<a :href="downImg" download="demo.png" ref="downloadDom"></a>
|
||||
</div>
|
||||
|
||||
<div class="pre">
|
||||
<section class="pre-item">
|
||||
<p>截图框大小</p>
|
||||
<div class="show-preview" :style="{'width': previews.w + 'px', 'height': previews.h + 'px', 'overflow': 'hidden',
|
||||
'margin': '5px'}">
|
||||
<div :style="previews.div">
|
||||
<img :src="previews.url" :style="previews.img">
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section class="pre-item">
|
||||
<p>中等大小</p>
|
||||
<div :style="previewStyle1">
|
||||
<div :style="previews.div">
|
||||
<img :src="previews.url" :style="previews.img">
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section class="pre-item">
|
||||
<p>迷你大小</p>
|
||||
<div :style="previewStyle2">
|
||||
<div :style="previews.div">
|
||||
<img :src="previews.url" :style="previews.img">
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section class="pre-item" title="zoom: (100 / previews.w)">
|
||||
<p>固定为100宽度</p>
|
||||
<div :style="previewStyle3">
|
||||
<div :style="previews.div">
|
||||
<img :src="previews.url" :style="previews.img">
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section class="pre-item" title="zoom: (100 / previews.h)">
|
||||
<p>固定为100高度</p>
|
||||
<div :style="previewStyle4">
|
||||
<div :style="previews.div">
|
||||
<img :src="previews.url" :style="previews.img">
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
</div>
|
||||
|
||||
<div style="display:block; width: 100%;">
|
||||
<label class="c-item">
|
||||
<span>图片默认渲染方式</span>
|
||||
<select v-model="option.mode">
|
||||
<option value="contain">contain</option>
|
||||
<option value="cover">cover</option>
|
||||
<option value="400px auto">400px auto</option>
|
||||
<option value="auto 400px">auto 400px</option>
|
||||
<option value="50%">50%</option>
|
||||
<option value="auto 50%">auto 50%</option>
|
||||
</select>
|
||||
<section>
|
||||
类似css background属性设置 设置不符合规范不生效, 参照文档说明
|
||||
</section>
|
||||
</label>
|
||||
<label class="c-item">
|
||||
<span>上传时图片最大大小(默认会压缩尺寸到这个大小)</span>
|
||||
<input type="nubmer" v-model="option.maxImgSize">
|
||||
</label>
|
||||
<label class="c-item">
|
||||
<span>上传图片是否显示原始宽高 (针对大图 可以铺满)</span>
|
||||
<input type="checkbox" v-model="option.original">
|
||||
<span>original: {{ option.original}}</span>
|
||||
</label>
|
||||
<label class="c-item">
|
||||
<span>是否根据dpr生成适合屏幕的高清图片</span>
|
||||
<input type="checkbox" v-model="option.high">
|
||||
<span>high: {{ option.high}}</span>
|
||||
</label>
|
||||
<label class="c-item">
|
||||
<span>是否输出原图比例的截图</span>
|
||||
<input type="checkbox" v-model="option.full">
|
||||
<span>full: {{ option.full}}</span>
|
||||
</label>
|
||||
<label class="c-item">
|
||||
<span>截图信息展示是否是真实的输出宽高</span>
|
||||
<input type="checkbox" v-model="option.infoTrue">
|
||||
<span>infoTrue: {{ option.infoTrue}}</span>
|
||||
</label>
|
||||
<label class="c-item">
|
||||
<span>能否拖动图片</span>
|
||||
<input type="checkbox" v-model="option.canMove">
|
||||
<span>canMove: {{ option.canMove}}</span>
|
||||
</label>
|
||||
<label class="c-item">
|
||||
<span>能否拖动截图框</span>
|
||||
<input type="checkbox" v-model="option.canMoveBox">
|
||||
<span>canMoveBox: {{ option.canMoveBox}}</span>
|
||||
</label>
|
||||
<label class="c-item">
|
||||
<span>截图框固定大小</span>
|
||||
<input type="checkbox" v-model="option.fixedBox">
|
||||
<span>fixedBox: {{ option.fixedBox}}</span>
|
||||
</label>
|
||||
<label class="c-item">
|
||||
<span>是否自动生成截图框</span>
|
||||
<input type="checkbox" v-model="option.autoCrop">
|
||||
<span>autoCrop: {{ option.autoCrop}}</span>
|
||||
</label>
|
||||
<label class="c-item">
|
||||
<span>自动生成截图框的宽高</span>
|
||||
<span>宽度: </span><input type="number" v-model="option.autoCropWidth">
|
||||
<span>高度: </span><input type="number" v-model="option.autoCropHeight">
|
||||
</label>
|
||||
<label class="c-item">
|
||||
<span>截图框是否限制在图片里(只有在自动生成截图框时才能生效)</span>
|
||||
<input type="checkbox" v-model="option.centerBox">
|
||||
<span>centerBox: {{ option.centerBox}}</span>
|
||||
</label>
|
||||
<label class="c-item">
|
||||
<span>是否按照截图框比例输出 默认为1 </span>
|
||||
<input type="number" v-model="option.enlarge">
|
||||
</label>
|
||||
<p>输出图片格式</p>
|
||||
<label class="c-item">
|
||||
<label>jpg <input type="radio" name="type" value="jpeg" v-model="option.outputType"></label>
|
||||
<label>png <input type="radio" name="type" value="png" v-model="option.outputType"></label>
|
||||
<label>webp <input type="radio" name="type" value="webp" v-model="option.outputType"></label>
|
||||
</label>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { VueCropper } from 'vue-cropper'
|
||||
|
||||
export default {
|
||||
name: 'ImagCropper',
|
||||
components: {
|
||||
VueCropper
|
||||
},
|
||||
data () {
|
||||
return {
|
||||
model: false,
|
||||
modelSrc: "",
|
||||
crap: false,
|
||||
previews: {},
|
||||
lists: [
|
||||
{img: "https://avatars2.githubusercontent.com/u/15681693?s=460&v=4"},
|
||||
{img: "http://cdn.xyxiao.cn/Landscape_1.jpg"},
|
||||
{img: "http://cdn.xyxiao.cn/Landscape_2.jpg"},
|
||||
{img: "http://cdn.xyxiao.cn/Landscape_3.jpg"},
|
||||
{img: "http://cdn.xyxiao.cn/Landscape_4.jpg"},
|
||||
{img: "http://cdn.xyxiao.cn/Portrait_1.jpg"},
|
||||
{img: "http://cdn.xyxiao.cn/Portrait_2.jpg"}
|
||||
],
|
||||
option: {
|
||||
img: "",
|
||||
size: 1,
|
||||
full: false,
|
||||
outputType: "png",
|
||||
canMove: true,
|
||||
fixedBox: false,
|
||||
original: false,
|
||||
canMoveBox: true,
|
||||
autoCrop: true,
|
||||
// 只有自动截图开启 宽度高度才生效
|
||||
autoCropWidth: 200,
|
||||
autoCropHeight: 150,
|
||||
centerBox: false,
|
||||
high: false,
|
||||
cropData: {},
|
||||
enlarge: 1,
|
||||
mode: 'contain',
|
||||
maxImgSize: 3000,
|
||||
limitMinSize: [100, 120]
|
||||
},
|
||||
example2: {
|
||||
img: "http://cdn.xyxiao.cn/Landscape_2.jpg",
|
||||
info: true,
|
||||
size: 1,
|
||||
outputType: "jpeg",
|
||||
canScale: true,
|
||||
autoCrop: true,
|
||||
// 只有自动截图开启 宽度高度才生效
|
||||
autoCropWidth: 300,
|
||||
autoCropHeight: 250,
|
||||
fixed: true,
|
||||
// 真实的输出宽高
|
||||
infoTrue: true,
|
||||
fixedNumber: [4, 3]
|
||||
},
|
||||
example3: {
|
||||
img: "http://cdn.xyxiao.cn/Landscape_1.jpg",
|
||||
autoCrop: true,
|
||||
autoCropWidth: 200,
|
||||
autoCropHeight: 200,
|
||||
fixedBox: true
|
||||
},
|
||||
downImg: "#",
|
||||
previewStyle1: {},
|
||||
previewStyle2: {},
|
||||
previewStyle3: {},
|
||||
previewStyle4: {},
|
||||
code0: '',
|
||||
code1: '',
|
||||
code2: '',
|
||||
code3: '',
|
||||
preview3: '',
|
||||
};
|
||||
},
|
||||
methods: {
|
||||
changeImg() {
|
||||
this.option.img = this.lists[~~(Math.random() * this.lists.length)].img;
|
||||
},
|
||||
startCrop() {
|
||||
// start
|
||||
this.crap = true;
|
||||
this.$refs.cropper.startCrop();
|
||||
},
|
||||
stopCrop() {
|
||||
// stop
|
||||
this.crap = false;
|
||||
this.$refs.cropper.stopCrop();
|
||||
},
|
||||
clearCrop() {
|
||||
// clear
|
||||
this.$refs.cropper.clearCrop();
|
||||
},
|
||||
refreshCrop() {
|
||||
// clear
|
||||
this.$refs.cropper.refresh();
|
||||
},
|
||||
changeScale(num) {
|
||||
num = num || 1;
|
||||
this.$refs.cropper.changeScale(num);
|
||||
},
|
||||
rotateLeft() {
|
||||
this.$refs.cropper.rotateLeft();
|
||||
},
|
||||
rotateRight() {
|
||||
this.$refs.cropper.rotateRight();
|
||||
},
|
||||
finish(type) {
|
||||
if (type === "blob") {
|
||||
this.$refs.cropper.getCropBlob(data => {
|
||||
var img = window.URL.createObjectURL(data);
|
||||
this.model = true;
|
||||
this.modelSrc = img;
|
||||
});
|
||||
} else {
|
||||
this.$refs.cropper.getCropData(data => {
|
||||
this.model = true;
|
||||
this.modelSrc = data;
|
||||
});
|
||||
}
|
||||
},
|
||||
// 实时预览函数
|
||||
realTime(data) {
|
||||
var previews = data;
|
||||
var h = 0.5;
|
||||
var w = 0.2;
|
||||
|
||||
this.previewStyle1 = {
|
||||
width: previews.w + "px",
|
||||
height: previews.h + "px",
|
||||
overflow: "hidden",
|
||||
margin: "0",
|
||||
zoom: h
|
||||
};
|
||||
|
||||
this.previewStyle2 = {
|
||||
width: previews.w + "px",
|
||||
height: previews.h + "px",
|
||||
overflow: "hidden",
|
||||
margin: "0",
|
||||
zoom: w
|
||||
};
|
||||
|
||||
this.previewStyle3 = {
|
||||
width: previews.w + "px",
|
||||
height: previews.h + "px",
|
||||
overflow: "hidden",
|
||||
margin: "0",
|
||||
zoom: (100 / previews.w)
|
||||
};
|
||||
|
||||
this.previewStyle4 = {
|
||||
width: previews.w + "px",
|
||||
height: previews.h + "px",
|
||||
overflow: "hidden",
|
||||
margin: "0",
|
||||
zoom: (100 / previews.h)
|
||||
};
|
||||
|
||||
this.previews = data;
|
||||
},
|
||||
|
||||
finish2(type) {
|
||||
this.$refs.cropper2.getCropData(data => {
|
||||
this.model = true;
|
||||
this.modelSrc = data;
|
||||
});
|
||||
},
|
||||
finish3(type) {
|
||||
this.$refs.cropper3.getCropData(data => {
|
||||
this.model = true;
|
||||
this.modelSrc = data;
|
||||
});
|
||||
},
|
||||
down(type) {
|
||||
// 输出
|
||||
if (type === "blob") {
|
||||
this.$refs.cropper.getCropBlob(data => {
|
||||
this.downImg = window.URL.createObjectURL(data);
|
||||
if (window.navigator.msSaveBlob) {
|
||||
var blobObject = new Blob([data]);
|
||||
window.navigator.msSaveBlob(blobObject, "demo.png");
|
||||
} else {
|
||||
this.$nextTick(() => {
|
||||
this.$refs.downloadDom.click();
|
||||
});
|
||||
}
|
||||
});
|
||||
} else {
|
||||
this.$refs.cropper.getCropData(data => {
|
||||
this.downImg = data;
|
||||
if (window.navigator.msSaveBlob) {
|
||||
var blobObject = new Blob([data]);
|
||||
window.navigator.msSaveBlob(blobObject, "demo.png");
|
||||
} else {
|
||||
this.$nextTick(() => {
|
||||
this.$refs.downloadDom.click();
|
||||
});
|
||||
}
|
||||
});
|
||||
}
|
||||
},
|
||||
|
||||
uploadImg(e, num) {
|
||||
//上传图片
|
||||
// this.option.img
|
||||
var file = e.target.files[0];
|
||||
if (!/\.(gif|jpg|jpeg|png|bmp|GIF|JPG|PNG)$/.test(e.target.value)) {
|
||||
alert("图片类型必须是.gif,jpeg,jpg,png,bmp中的一种");
|
||||
return false;
|
||||
}
|
||||
var reader = new FileReader();
|
||||
reader.onload = e => {
|
||||
let data;
|
||||
if (typeof e.target.result === "object") {
|
||||
// 把Array Buffer转化为blob 如果是base64不需要
|
||||
data = window.URL.createObjectURL(new Blob([e.target.result]));
|
||||
} else {
|
||||
data = e.target.result;
|
||||
}
|
||||
if (num === 1) {
|
||||
this.option.img = data;
|
||||
} else if (num === 2) {
|
||||
this.example2.img = data;
|
||||
}
|
||||
this.$refs.uploadImg.value = ''
|
||||
};
|
||||
// 转化为blob
|
||||
reader.readAsArrayBuffer(file);
|
||||
},
|
||||
imgLoad(msg) {
|
||||
console.log(msg);
|
||||
},
|
||||
|
||||
cropMoving(data) {
|
||||
this.option.cropData = data;
|
||||
}
|
||||
},
|
||||
components: {
|
||||
VueCropper
|
||||
},
|
||||
mounted() {
|
||||
this.changeImg();
|
||||
var list = [].slice.call(document.querySelectorAll("pre code"));
|
||||
list.forEach((val, index) => {
|
||||
hljs.highlightBlock(val);
|
||||
});
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
* {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
.content {
|
||||
margin: auto;
|
||||
max-width: 1200px;
|
||||
margin-bottom: 100px;
|
||||
}
|
||||
|
||||
.test-button {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
}
|
||||
|
||||
.btn {
|
||||
display: inline-block;
|
||||
line-height: 1;
|
||||
white-space: nowrap;
|
||||
cursor: pointer;
|
||||
background: #fff;
|
||||
border: 1px solid #c0ccda;
|
||||
color: #1f2d3d;
|
||||
text-align: center;
|
||||
box-sizing: border-box;
|
||||
outline: none;
|
||||
margin: 20px 10px 0px 0px;
|
||||
padding: 9px 15px;
|
||||
font-size: 14px;
|
||||
border-radius: 4px;
|
||||
color: #fff;
|
||||
background-color: #50bfff;
|
||||
border-color: #50bfff;
|
||||
transition: all 0.2s ease;
|
||||
text-decoration: none;
|
||||
user-select: none;
|
||||
}
|
||||
|
||||
.des {
|
||||
line-height: 30px;
|
||||
}
|
||||
|
||||
code.language-html {
|
||||
padding: 10px 20px;
|
||||
margin: 10px 0px;
|
||||
display: block;
|
||||
background-color: #333;
|
||||
color: #fff;
|
||||
overflow-x: auto;
|
||||
font-family: Consolas, Monaco, Droid, Sans, Mono, Source, Code, Pro, Menlo,
|
||||
Lucida, Sans, Type, Writer, Ubuntu, Mono;
|
||||
border-radius: 5px;
|
||||
white-space: pre;
|
||||
}
|
||||
|
||||
.show-info {
|
||||
margin-bottom: 50px;
|
||||
}
|
||||
|
||||
.show-info h2 {
|
||||
line-height: 50px;
|
||||
}
|
||||
|
||||
.title {
|
||||
display: block;
|
||||
text-decoration: none;
|
||||
text-align: center;
|
||||
line-height: 1.5;
|
||||
margin: 20px 0px;
|
||||
background-image: -webkit-linear-gradient(
|
||||
left,
|
||||
#3498db,
|
||||
#f47920 10%,
|
||||
#d71345 20%,
|
||||
#f7acbc 30%,
|
||||
#ffd400 40%,
|
||||
#3498db 50%,
|
||||
#f47920 60%,
|
||||
#d71345 70%,
|
||||
#f7acbc 80%,
|
||||
#ffd400 90%,
|
||||
#3498db
|
||||
);
|
||||
color: transparent;
|
||||
-webkit-background-clip: text;
|
||||
background-size: 200% 100%;
|
||||
animation: slide 5s infinite linear;
|
||||
font-size: 40px;
|
||||
}
|
||||
|
||||
.test {
|
||||
height: 500px;
|
||||
}
|
||||
|
||||
.model {
|
||||
position: fixed;
|
||||
z-index: 10;
|
||||
width: 100vw;
|
||||
height: 100vh;
|
||||
overflow: auto;
|
||||
top: 0;
|
||||
left: 0;
|
||||
background: rgba(0, 0, 0, 0.8);
|
||||
}
|
||||
|
||||
.model-show {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
width: 100vw;
|
||||
height: 100vh;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.model img {
|
||||
display: block;
|
||||
margin: auto;
|
||||
max-width: 80%;
|
||||
width: auto;
|
||||
user-select: none;
|
||||
background-position: 0px 0px, 10px 10px;
|
||||
background-size: 20px 20px;
|
||||
background-image: linear-gradient(
|
||||
45deg,
|
||||
#eee 25%,
|
||||
transparent 25%,
|
||||
transparent 75%,
|
||||
#eee 75%,
|
||||
#eee 100%
|
||||
),
|
||||
linear-gradient(45deg, #eee 25%, white 25%, white 75%, #eee 75%, #eee 100%);
|
||||
}
|
||||
|
||||
.c-item {
|
||||
display: block;
|
||||
padding: 10px 0;
|
||||
user-select: none;
|
||||
}
|
||||
|
||||
.pre {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
}
|
||||
|
||||
.pre-item {
|
||||
padding-right: 20px;
|
||||
}
|
||||
|
||||
@keyframes slide {
|
||||
0% {
|
||||
background-position: 0 0;
|
||||
}
|
||||
100% {
|
||||
background-position: -100% 0;
|
||||
}
|
||||
}
|
||||
|
||||
@media screen and (max-width: 1000px) {
|
||||
.content {
|
||||
max-width: 90%;
|
||||
margin: auto;
|
||||
}
|
||||
|
||||
.test {
|
||||
height: 400px;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@ -374,7 +374,7 @@
|
||||
</a-col>
|
||||
<a-col :span="12">输入的值(v-model):{{ formData.jInput }}</a-col>
|
||||
</a-row>
|
||||
<!-- <a-row :gutter="24">
|
||||
<a-row :gutter="24">
|
||||
<a-col :span="15">
|
||||
<a-form-item label="MarkdownEditor" style="min-height: 300px">
|
||||
<j-markdown-editor v-model="content"></j-markdown-editor>
|
||||
@ -383,7 +383,7 @@
|
||||
<a-col :span="9">
|
||||
输入的值(v-model):{{ content }}
|
||||
</a-col>
|
||||
</a-row>-->
|
||||
</a-row>
|
||||
|
||||
<!-- 省市县级联 -->
|
||||
<a-row :gutter="24">
|
||||
@ -456,12 +456,14 @@
|
||||
import JMultiSelectTag from '@comp/dict/JMultiSelectTag'
|
||||
import JInput from '@comp/jeecg/JInput'
|
||||
import JAreaLinkage from '@comp/jeecg/JAreaLinkage'
|
||||
import JMarkdownEditor from '@/components/jeecg/JMarkdownEditor/index'
|
||||
import JSearchSelectTag from '@/components/dict/JSearchSelectTag'
|
||||
|
||||
export default {
|
||||
name: 'SelectDemo',
|
||||
inject:['closeCurrent'],
|
||||
components: {
|
||||
JMarkdownEditor,
|
||||
JAreaLinkage,
|
||||
JInput,
|
||||
JCategorySelect,
|
||||
|
||||
@ -268,6 +268,9 @@
|
||||
},
|
||||
delRowCustom (index) {
|
||||
console.log(index)
|
||||
let all = this.form.getFieldsValue()
|
||||
all['jeecgOrderCustomerList'].splice(index,1);
|
||||
this.form.setFieldsValue(all)
|
||||
this.orderMainModel.jeecgOrderCustomerList.splice(index,1);
|
||||
this.$forceUpdate();
|
||||
},
|
||||
@ -278,6 +281,9 @@
|
||||
},
|
||||
delRowTicket (index) {
|
||||
console.log(index)
|
||||
let all = this.form.getFieldsValue()
|
||||
all['jeecgOrderTicketList'].splice(index,1);
|
||||
this.form.setFieldsValue(all)
|
||||
this.orderMainModel.jeecgOrderTicketList.splice(index,1);
|
||||
this.$forceUpdate();
|
||||
},
|
||||
|
||||
@ -7,7 +7,7 @@
|
||||
:closable="true"
|
||||
@close="close"
|
||||
:visible="visible"
|
||||
style="height: calc(100% - 55px);overflow: auto;padding-bottom: 53px;">
|
||||
style="overflow: auto;padding-bottom: 53px;">
|
||||
|
||||
<a-spin :spinning="confirmLoading">
|
||||
<a-form :form="form">
|
||||
|
||||
@ -83,6 +83,7 @@
|
||||
<a-dropdown>
|
||||
<a class="ant-dropdown-link">更多 <a-icon type="down" /></a>
|
||||
<a-menu slot="overlay">
|
||||
<a-menu-item><a @click="executeImmediately(record)">立即执行</a></a-menu-item>
|
||||
<a-menu-item><a @click="handleEdit(record)">编辑</a></a-menu-item>
|
||||
<a-menu-item>
|
||||
<a-popconfirm title="确定删除吗?" @confirm="() => handleDelete(record.id)">
|
||||
@ -192,6 +193,7 @@
|
||||
resume: "/sys/quartzJob/resume",
|
||||
exportXlsUrl: "sys/quartzJob/exportXls",
|
||||
importExcelUrl: "sys/quartzJob/importExcel",
|
||||
execute: "sys/quartzJob/execute"
|
||||
},
|
||||
}
|
||||
},
|
||||
@ -255,6 +257,25 @@
|
||||
}
|
||||
});
|
||||
},
|
||||
executeImmediately(record){
|
||||
var that = this;
|
||||
//立即执行定时任务
|
||||
this.$confirm({
|
||||
title:"确认提示",
|
||||
content:"是否立即执行任务?",
|
||||
onOk: function(){
|
||||
getAction(that.url.execute,{id:record.id}).then((res)=>{
|
||||
if(res.success){
|
||||
that.$message.success(res.message);
|
||||
that.loadData();
|
||||
that.onClearSelected();
|
||||
}else{
|
||||
that.$message.warning(res.message);
|
||||
}
|
||||
});
|
||||
}
|
||||
});
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
@ -63,7 +63,6 @@
|
||||
<a @click="handleOpen(record)">用户</a>
|
||||
<a-divider type="vertical"/>
|
||||
|
||||
|
||||
<a-dropdown>
|
||||
<a class="ant-dropdown-link">
|
||||
更多 <a-icon type="down"/>
|
||||
|
||||
@ -4,10 +4,10 @@
|
||||
<!-- 操作按钮区域 -->
|
||||
<div class="table-operator">
|
||||
<a-button @click="handleAdd" type="primary" icon="plus">新增</a-button>
|
||||
<!--<a-button type="primary" icon="download" @click="handleExportXls('分类字典')">导出</a-button>
|
||||
<a-upload name="file" :showUploadList="false" :multiple="false" :action="importExcelUrl" @change="handleImportExcel">
|
||||
<a-button type="primary" icon="download" @click="handleExportXls('分类字典')">导出</a-button>
|
||||
<a-upload name="file" :showUploadList="false" :multiple="false" :headers="tokenHeader" :action="importExcelUrl" @change="handleImportExcel">
|
||||
<a-button type="primary" icon="import">导入</a-button>
|
||||
</a-upload>-->
|
||||
</a-upload>
|
||||
<a-dropdown v-if="selectedRowKeys.length > 0">
|
||||
<a-menu slot="overlay">
|
||||
<a-menu-item key="1" @click="batchDel"><a-icon type="delete"/>删除</a-menu-item>
|
||||
|
||||
101
ant-design-vue-jeecg/src/views/system/SysGatewayRouteList.vue
Normal file
101
ant-design-vue-jeecg/src/views/system/SysGatewayRouteList.vue
Normal file
@ -0,0 +1,101 @@
|
||||
<template>
|
||||
<a-card :bordered="false" style="height: 100%">
|
||||
<div style="padding-bottom: 2px">
|
||||
<a-alert type="warning" show-icon>
|
||||
<div slot="message" style="width: 100%">
|
||||
<span>路由配置请慎重</span>
|
||||
<span style="display:inline-block;float:right;padding-right: 5px">
|
||||
<a @click="clearRedis"><a-icon type="reload" />清除缓存</a>
|
||||
</span>
|
||||
</div>
|
||||
</a-alert>
|
||||
</div>
|
||||
<div :id="eleId" :style="{ height: editorHeight + 'px', width: '100%' }"></div>
|
||||
<div style="text-align: center;padding-top:10px">
|
||||
<a-button type="primary" @click="submitForm" style="width:160px">保存</a-button>
|
||||
</div>
|
||||
</a-card>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import JsonEditor from 'jsoneditor'
|
||||
import 'jsoneditor/dist/jsoneditor.min.css'
|
||||
import { getAction, postAction } from '@/api/manage'
|
||||
|
||||
export default {
|
||||
name: "SysGatewayRouteList",
|
||||
data () {
|
||||
return {
|
||||
eleId:'jsoneditor',
|
||||
description: 'gateway路由管理管理页面',
|
||||
editor: null,
|
||||
editorWidth:400,
|
||||
editorHeight:500,
|
||||
url:{
|
||||
list: '/sys/gatewayRoute/list',
|
||||
update: '/sys/gatewayRoute/updateAll',
|
||||
clear: '/sys/gatewayRoute/clearRedis'
|
||||
},
|
||||
|
||||
}
|
||||
},
|
||||
created() {
|
||||
let winWidth = window.innerWidth;
|
||||
console.log("页面宽度",winWidth)
|
||||
this.editorWidth = winWidth
|
||||
|
||||
},
|
||||
mounted(){
|
||||
this.initJsonEditor();
|
||||
},
|
||||
methods: {
|
||||
initJsonEditor() {
|
||||
let container = document.getElementById(this.eleId);
|
||||
let options = {
|
||||
modes: ['text', 'code', 'tree', 'form', 'view'],
|
||||
mode: 'tree',
|
||||
ace: ace,
|
||||
sortObjectKeys: 'code',
|
||||
mainMenuBar:['format']
|
||||
};
|
||||
this.editor = new JsonEditor(container, options);
|
||||
this.initRouteData();
|
||||
},
|
||||
initRouteData(){
|
||||
getAction(this.url.list).then(res=>{
|
||||
if(res.success){
|
||||
let array = res.result
|
||||
console.log('当前路由配置信息为', array)
|
||||
this.editor.set(array)
|
||||
}
|
||||
})
|
||||
},
|
||||
// 获取json
|
||||
submitForm() {
|
||||
let text = this.editor.getText()
|
||||
console.log("保存的json数据",text)
|
||||
if(!text || text.length<=0 || text=='{}' || text=='[]'){
|
||||
this.$message.warning('未录入任何信息')
|
||||
return ;
|
||||
}
|
||||
postAction(this.url.update,{
|
||||
routes:text
|
||||
}).then(res=>{
|
||||
if(res.success){
|
||||
this.$message.success(res.message)
|
||||
}else{
|
||||
this.$message.error(res.message)
|
||||
}
|
||||
})
|
||||
},
|
||||
clearRedis(){
|
||||
getAction(this.url.clear).then(res=>{
|
||||
if(res.success){
|
||||
this.$message.success(res.message)
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
</script>
|
||||
165
ant-design-vue-jeecg/src/views/system/TenantList.vue
Normal file
165
ant-design-vue-jeecg/src/views/system/TenantList.vue
Normal file
@ -0,0 +1,165 @@
|
||||
<template>
|
||||
<a-card :bordered="false">
|
||||
<!-- 查询区域 -->
|
||||
<div class="table-page-search-wrapper">
|
||||
<a-form layout="inline" @keyup.enter.native="searchQuery">
|
||||
<a-row :gutter="24">
|
||||
</a-row>
|
||||
</a-form>
|
||||
</div>
|
||||
<!-- 查询区域-END -->
|
||||
|
||||
<!-- 操作按钮区域 -->
|
||||
<div class="table-operator">
|
||||
<a-button @click="handleAdd" type="primary" icon="plus">新增</a-button>
|
||||
<a-dropdown v-if="selectedRowKeys.length > 0">
|
||||
<a-menu slot="overlay">
|
||||
<a-menu-item key="1" @click="batchDel"><a-icon type="delete"/>删除</a-menu-item>
|
||||
</a-menu>
|
||||
<a-button style="margin-left: 8px"> 批量操作 <a-icon type="down" /></a-button>
|
||||
</a-dropdown>
|
||||
</div>
|
||||
|
||||
<!-- table区域-begin -->
|
||||
<div>
|
||||
<div class="ant-alert ant-alert-info" style="margin-bottom: 16px;">
|
||||
<i class="anticon anticon-info-circle ant-alert-icon"></i> 已选择 <a style="font-weight: 600">{{ selectedRowKeys.length }}</a>项
|
||||
<a style="margin-left: 24px" @click="onClearSelected">清空</a>
|
||||
</div>
|
||||
|
||||
<a-table
|
||||
ref="table"
|
||||
size="middle"
|
||||
:scroll="{x:true}"
|
||||
bordered
|
||||
rowKey="id"
|
||||
:columns="columns"
|
||||
:dataSource="dataSource"
|
||||
:pagination="ipagination"
|
||||
:loading="loading"
|
||||
:rowSelection="{selectedRowKeys: selectedRowKeys, onChange: onSelectChange}"
|
||||
class="j-table-force-nowrap"
|
||||
@change="handleTableChange">
|
||||
|
||||
<template slot="htmlSlot" slot-scope="text">
|
||||
<div v-html="text"></div>
|
||||
</template>
|
||||
<template slot="imgSlot" slot-scope="text">
|
||||
<span v-if="!text" style="font-size: 12px;font-style: italic;">无图片</span>
|
||||
<img v-else :src="getImgView(text)" height="25px" alt="" style="max-width:80px;font-size: 12px;font-style: italic;"/>
|
||||
</template>
|
||||
<template slot="fileSlot" slot-scope="text">
|
||||
<span v-if="!text" style="font-size: 12px;font-style: italic;">无文件</span>
|
||||
<a-button
|
||||
v-else
|
||||
:ghost="true"
|
||||
type="primary"
|
||||
icon="download"
|
||||
size="small"
|
||||
@click="uploadFile(text)">
|
||||
下载
|
||||
</a-button>
|
||||
</template>
|
||||
|
||||
<span slot="action" slot-scope="text, record">
|
||||
<a @click="handleEdit(record)">编辑</a>
|
||||
|
||||
<a-divider type="vertical" />
|
||||
<a-dropdown>
|
||||
<a class="ant-dropdown-link">更多 <a-icon type="down" /></a>
|
||||
<a-menu slot="overlay">
|
||||
<a-menu-item>
|
||||
<a @click="handleDetail(record)">详情</a>
|
||||
</a-menu-item>
|
||||
<a-menu-item>
|
||||
<a-popconfirm title="确定删除吗?" @confirm="() => handleDelete(record.id)">
|
||||
<a>删除</a>
|
||||
</a-popconfirm>
|
||||
</a-menu-item>
|
||||
</a-menu>
|
||||
</a-dropdown>
|
||||
</span>
|
||||
|
||||
</a-table>
|
||||
</div>
|
||||
|
||||
<tenant-modal ref="modalForm" @ok="modalFormOk"></tenant-modal>
|
||||
</a-card>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
|
||||
import '@/assets/less/TableExpand.less'
|
||||
import { mixinDevice } from '@/utils/mixin'
|
||||
import { JeecgListMixin } from '@/mixins/JeecgListMixin'
|
||||
import TenantModal from './modules/TenantModal'
|
||||
|
||||
|
||||
export default {
|
||||
name: "TenantList",
|
||||
mixins:[JeecgListMixin, mixinDevice],
|
||||
components: {
|
||||
TenantModal
|
||||
},
|
||||
data () {
|
||||
return {
|
||||
description: 'adad管理页面',
|
||||
// 表头
|
||||
columns: [
|
||||
{
|
||||
title:'租户名称',
|
||||
align:"center",
|
||||
dataIndex: 'name'
|
||||
},{
|
||||
title:'租户编号',
|
||||
align:"center",
|
||||
dataIndex: 'id'
|
||||
},
|
||||
{
|
||||
title:'开始时间',
|
||||
align:"center",
|
||||
dataIndex: 'beginDate'
|
||||
},
|
||||
{
|
||||
title:'结束时间',
|
||||
align:"center",
|
||||
dataIndex: 'endDate'
|
||||
},
|
||||
{
|
||||
title:'状态',
|
||||
align:"center",
|
||||
dataIndex: 'status_dictText'
|
||||
},
|
||||
{
|
||||
title: '操作',
|
||||
dataIndex: 'action',
|
||||
align:"center",
|
||||
fixed:"right",
|
||||
width:147,
|
||||
scopedSlots: { customRender: 'action' }
|
||||
}
|
||||
],
|
||||
url: {
|
||||
list: "/sys/tenant/list",
|
||||
delete: "/sys/tenant/delete",
|
||||
deleteBatch: "/sys/tenant/deleteBatch"
|
||||
},
|
||||
dictOptions:{},
|
||||
}
|
||||
},
|
||||
created() {
|
||||
},
|
||||
computed: {
|
||||
importExcelUrl: function(){
|
||||
return `${window._CONFIG['domianURL']}/${this.url.importExcelUrl}`;
|
||||
},
|
||||
},
|
||||
methods: {
|
||||
initDictConfig(){
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
<style scoped>
|
||||
@import '~@assets/less/common.less';
|
||||
</style>
|
||||
@ -119,10 +119,9 @@
|
||||
</template>
|
||||
|
||||
<span slot="action" slot-scope="text, record">
|
||||
<!-- <a @click="handleEdit(record)" v-has="'user:edit'">编辑</a>-->
|
||||
<a @click="handleEdit(record)">编辑</a>
|
||||
<a @click="handleEdit(record)" >编辑</a>
|
||||
|
||||
<a-divider type="vertical"/>
|
||||
<a-divider type="vertical" />
|
||||
|
||||
<a-dropdown>
|
||||
<a class="ant-dropdown-link">
|
||||
@ -260,13 +259,7 @@
|
||||
title: '部门',
|
||||
align: "center",
|
||||
width: 180,
|
||||
dataIndex: 'orgCode'
|
||||
},
|
||||
{
|
||||
title: '负责部门',
|
||||
align: "center",
|
||||
width: 180,
|
||||
dataIndex: 'departIds_dictText'
|
||||
dataIndex: 'orgCodeTxt'
|
||||
},
|
||||
{
|
||||
title: '状态',
|
||||
|
||||
@ -1,26 +1,28 @@
|
||||
<template>
|
||||
<a-card :bordered="false">
|
||||
<template v-if="this.departId">
|
||||
<a-form>
|
||||
<a-form-item label='所拥有的权限'>
|
||||
<a-tree
|
||||
checkable
|
||||
@check="onCheck"
|
||||
:checkedKeys="checkedKeys"
|
||||
:treeData="treeData"
|
||||
@expand="onExpand"
|
||||
@select="onTreeNodeSelect"
|
||||
:selectedKeys="selectedKeys"
|
||||
:expandedKeys="expandedKeysss"
|
||||
:checkStrictly="checkStrictly"
|
||||
style="height:500px;overflow: auto;">
|
||||
<span slot="hasDatarule" slot-scope="{slotTitle,ruleFlag}">
|
||||
{{ slotTitle }}
|
||||
<a-icon v-if="ruleFlag" type="align-left" style="margin-left:5px;color: red;"></a-icon>
|
||||
</span>
|
||||
</a-tree>
|
||||
</a-form-item>
|
||||
</a-form>
|
||||
<a-spin :spinning="loading">
|
||||
<a-form>
|
||||
<a-form-item label='所拥有的权限'>
|
||||
<a-tree
|
||||
checkable
|
||||
@check="onCheck"
|
||||
:checkedKeys="checkedKeys"
|
||||
:treeData="treeData"
|
||||
@expand="onExpand"
|
||||
@select="onTreeNodeSelect"
|
||||
:selectedKeys="selectedKeys"
|
||||
:expandedKeys="expandedKeysss"
|
||||
:checkStrictly="checkStrictly"
|
||||
style="height:500px;overflow: auto;">
|
||||
<span slot="hasDatarule" slot-scope="{slotTitle,ruleFlag}">
|
||||
{{ slotTitle }}
|
||||
<a-icon v-if="ruleFlag" type="align-left" style="margin-left:5px;color: red;"></a-icon>
|
||||
</span>
|
||||
</a-tree>
|
||||
</a-form-item>
|
||||
</a-form>
|
||||
</a-spin>
|
||||
<div class="anty-form-btn">
|
||||
<a-dropdown style="float: left" :trigger="['click']" placement="topCenter">
|
||||
<a-menu slot="overlay">
|
||||
@ -156,6 +158,7 @@
|
||||
this.form.resetFields()
|
||||
},
|
||||
loadData(){
|
||||
this.loading = true;
|
||||
queryTreeListForRole().then((res) => {
|
||||
this.treeData = res.result.treeList
|
||||
this.allTreeKeys = res.result.ids
|
||||
@ -176,6 +179,7 @@
|
||||
this.halfCheckedKeys = [...halfCheckedKeys]
|
||||
this.defaultCheckedKeys = [...halfCheckedKeys, ...checkedKeys];
|
||||
this.expandedKeysss = this.allTreeKeys;
|
||||
this.loading = false;
|
||||
})
|
||||
})
|
||||
}
|
||||
|
||||
@ -7,7 +7,7 @@
|
||||
:closable="true"
|
||||
@close="close"
|
||||
:visible="visible"
|
||||
style="height: calc(100% - 55px);overflow: auto;padding-bottom: 53px;">
|
||||
style="overflow: auto;padding-bottom: 53px;">
|
||||
|
||||
<a-form>
|
||||
<a-form-item label='所拥有的部门权限'>
|
||||
|
||||
@ -7,7 +7,7 @@
|
||||
:closable="true"
|
||||
@close="close"
|
||||
:visible="visible"
|
||||
style="height: calc(100% - 55px);overflow: auto;padding-bottom: 53px;">
|
||||
style="overflow: auto;padding-bottom: 53px;">
|
||||
|
||||
<a-spin :spinning="confirmLoading">
|
||||
|
||||
@ -102,7 +102,7 @@
|
||||
this.form.resetFields();
|
||||
this.model = Object.assign({}, record);
|
||||
this.visible = true;
|
||||
getAction(this.url.getDeptRoleByUserId,{userId:this.userId}).then((res) => {
|
||||
getAction(this.url.getDeptRoleByUserId,{userId:this.userId,departId:this.currentDeptId}).then((res) => {
|
||||
if (res.success) {
|
||||
var designName = [];
|
||||
for (let value of res.result) {
|
||||
|
||||
@ -183,7 +183,7 @@
|
||||
that.selectionRows=[];
|
||||
selectUser.forEach(function(record,index){
|
||||
console.log(record)
|
||||
that.selectionRows.push({id: that.selectedRowKeys[index],realname:record})
|
||||
that.selectionRows.push({id: that.selectedRowKeys[index],realname:record.label})
|
||||
})
|
||||
// this.selectionRows = selectUser;
|
||||
}
|
||||
|
||||
@ -108,8 +108,10 @@
|
||||
<a-select
|
||||
mode="multiple"
|
||||
placeholder="请选择用户"
|
||||
:labelInValue=true
|
||||
v-model="selectedUser"
|
||||
@dropdownVisibleChange="selectUserIds"
|
||||
@change="handleChange"
|
||||
>
|
||||
</a-select>
|
||||
</a-form-item>
|
||||
@ -166,7 +168,6 @@
|
||||
xs: { span: 24 },
|
||||
sm: { span: 21 },
|
||||
},
|
||||
|
||||
confirmLoading: false,
|
||||
form: this.$form.createForm(this),
|
||||
validatorRules:{
|
||||
@ -187,6 +188,7 @@
|
||||
selectedUser:[],
|
||||
disabled:false,
|
||||
msgContent:"",
|
||||
userList:[]
|
||||
}
|
||||
},
|
||||
created () {
|
||||
@ -210,15 +212,22 @@
|
||||
this.userIds = record.userIds;
|
||||
getAction(this.url.queryByIds,{userIds:this.userIds}).then((res)=>{
|
||||
if(res.success){
|
||||
//update--begin--autor:wangshuai-----date:20200601------for:系统公告选人后,不能删除------
|
||||
var userList=[];
|
||||
for(var i=0;i<res.result.length;i++){
|
||||
this.selectedUser.push(res.result[i].realname);
|
||||
var user={};
|
||||
user.label =res.result[i].realname;
|
||||
user.key=res.result[i].id;
|
||||
userList.push(user);
|
||||
}
|
||||
this.selectedUser=userList;
|
||||
//update--begin--autor:wangshuai-----date:20200601------for:系统公告选人后,不能删除------
|
||||
this.$refs.UserListModal.edit(res.result,this.userIds);
|
||||
}
|
||||
});
|
||||
}
|
||||
this.$nextTick(() => {
|
||||
this.form.setFieldsValue(pick(this.model,'endTime','startTime','titile','msgContent','sender','priority','msgCategory','msgType','sendStatus','delFlag','msgAbstract'))
|
||||
this.form.setFieldsValue(pick(this.model,'endTime','startTime','titile','msgContent','priority','msgCategory','msgType','sendStatus','msgAbstract'))
|
||||
});
|
||||
},
|
||||
close () {
|
||||
@ -298,7 +307,12 @@
|
||||
this.selectedUser = [];
|
||||
this.userIds = [];
|
||||
for(var i=0;i<userList.length;i++){
|
||||
this.selectedUser.push(userList[i].realname);
|
||||
//update--begin--autor:wangshuai-----date:20200601------for:系统公告选人后,不能删除------
|
||||
var user={};
|
||||
user.label =userList[i].realname;
|
||||
user.key=userList[i].id;
|
||||
this.selectedUser.push(user);
|
||||
//update--end--autor:wangshuai-----date:20200601------for:系统公告选人后,不能删除------
|
||||
this.userIds += userList[i].id+","
|
||||
}
|
||||
},
|
||||
@ -321,8 +335,21 @@
|
||||
}else{
|
||||
callback("结束时间需大于开始时间")
|
||||
}
|
||||
},
|
||||
handleChange(userList) {
|
||||
if (userList) {
|
||||
this.userIds = [];
|
||||
var users=[];
|
||||
for (var i = 0; i < userList.length; i++) {
|
||||
var user={};
|
||||
user.id=userList[i].key;
|
||||
user.realname=userList[i].label;
|
||||
this.userIds += userList[i].key + ',';
|
||||
users.push(user);
|
||||
}
|
||||
}
|
||||
this.$refs.UserListModal.edit(users,this.userIds);
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
@ -29,7 +29,7 @@
|
||||
import { validateCheckRule } from '@/utils/util'
|
||||
|
||||
export default {
|
||||
name: 'SysCheckRuleModal',
|
||||
name: 'SysCheckRuleTestModal',
|
||||
data() {
|
||||
return {
|
||||
title: '操作',
|
||||
|
||||
184
ant-design-vue-jeecg/src/views/system/modules/TenantForm.vue
Normal file
184
ant-design-vue-jeecg/src/views/system/modules/TenantForm.vue
Normal file
@ -0,0 +1,184 @@
|
||||
<template>
|
||||
<a-spin :spinning="confirmLoading">
|
||||
<j-form-container :disabled="formDisabled">
|
||||
<a-form :form="form" slot="detail">
|
||||
<a-row>
|
||||
<a-col :span="24">
|
||||
<a-form-item label="租户名称" :labelCol="labelCol" :wrapperCol="wrapperCol">
|
||||
<a-input v-decorator="['name']" placeholder="请输入租户名称"></a-input>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
|
||||
<a-col :span="24">
|
||||
<a-form-item label="租户编号" :labelCol="labelCol" :wrapperCol="wrapperCol">
|
||||
<a-input-number style="width: 100%" :min="1" v-decorator="['id',{rules: [{ required: true, message: '请输入租户编号'}]}]" placeholder="请输入租户编号"></a-input-number>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
|
||||
<a-col :span="24">
|
||||
<a-form-item label="开始时间" :labelCol="labelCol" :wrapperCol="wrapperCol">
|
||||
<j-date placeholder="请选择开始时间" v-decorator="['beginDate']" :trigger-change="true" :show-time="true" date-format="YYYY-MM-DD HH:mm:ss" style="width: 100%"/>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col :span="24">
|
||||
<a-form-item label="结束时间" :labelCol="labelCol" :wrapperCol="wrapperCol">
|
||||
<j-date placeholder="请选择结束时间" v-decorator="['endDate']" :trigger-change="true" :show-time="true" date-format="YYYY-MM-DD HH:mm:ss" style="width: 100%"/>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col :span="24">
|
||||
<a-form-item label="状态" :labelCol="labelCol" :wrapperCol="wrapperCol">
|
||||
<a-radio-group name="tenantStatus" v-decorator="[ 'status', {initialValue:1}]">
|
||||
<a-radio :value="1">正常</a-radio>
|
||||
<a-radio :value="0">冻结</a-radio>
|
||||
</a-radio-group>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col v-if="showFlowSubmitButton" :span="24" style="text-align: center">
|
||||
<a-button @click="submitForm">提 交</a-button>
|
||||
</a-col>
|
||||
</a-row>
|
||||
</a-form>
|
||||
</j-form-container>
|
||||
</a-spin>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
|
||||
import { httpAction, getAction } from '@/api/manage'
|
||||
import pick from 'lodash.pick'
|
||||
import { validateDuplicateValue } from '@/utils/util'
|
||||
import JFormContainer from '@/components/jeecg/JFormContainer'
|
||||
import JDate from '@/components/jeecg/JDate'
|
||||
import JDictSelectTag from "@/components/dict/JDictSelectTag"
|
||||
|
||||
export default {
|
||||
name: "TenantForm",
|
||||
components: {
|
||||
JFormContainer,
|
||||
JDate,
|
||||
JDictSelectTag,
|
||||
},
|
||||
props: {
|
||||
formData: {
|
||||
type: Object,
|
||||
default: ()=>{},
|
||||
required: false
|
||||
},
|
||||
normal: {
|
||||
type: Boolean,
|
||||
default: false,
|
||||
required: false
|
||||
},
|
||||
disabled: {
|
||||
type: Boolean,
|
||||
default: false,
|
||||
required: false
|
||||
}
|
||||
},
|
||||
data () {
|
||||
return {
|
||||
form: this.$form.createForm(this),
|
||||
model: {},
|
||||
labelCol: {
|
||||
xs: { span: 24 },
|
||||
sm: { span: 5 },
|
||||
},
|
||||
wrapperCol: {
|
||||
xs: { span: 24 },
|
||||
sm: { span: 16 },
|
||||
},
|
||||
confirmLoading: false,
|
||||
validatorRules: {
|
||||
},
|
||||
url: {
|
||||
add: "/sys/tenant/add",
|
||||
edit: "/sys/tenant/edit",
|
||||
queryById: "/sys/tenant/queryById"
|
||||
}
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
formDisabled(){
|
||||
if(this.normal===false){
|
||||
if(this.formData.disabled===false){
|
||||
return false
|
||||
}else{
|
||||
return true
|
||||
}
|
||||
}
|
||||
return this.disabled
|
||||
},
|
||||
showFlowSubmitButton(){
|
||||
if(this.normal===false){
|
||||
if(this.formData.disabled===false){
|
||||
return true
|
||||
}else{
|
||||
return false
|
||||
}
|
||||
}else{
|
||||
return false
|
||||
}
|
||||
}
|
||||
},
|
||||
created () {
|
||||
this.showFlowData();
|
||||
},
|
||||
methods: {
|
||||
add () {
|
||||
this.edit({});
|
||||
},
|
||||
edit (record) {
|
||||
this.form.resetFields();
|
||||
this.model = Object.assign({}, record);
|
||||
this.visible = true;
|
||||
this.$nextTick(() => {
|
||||
this.form.setFieldsValue(pick(this.model,'id','name','beginDate','endDate','status'))
|
||||
})
|
||||
},
|
||||
showFlowData(){
|
||||
if(this.normal === false){
|
||||
let params = {id:this.formData.dataId};
|
||||
getAction(this.url.queryById,params).then((res)=>{
|
||||
if(res.success){
|
||||
this.edit (res.result);
|
||||
}
|
||||
});
|
||||
}
|
||||
},
|
||||
submitForm () {
|
||||
const that = this;
|
||||
// 触发表单验证
|
||||
this.form.validateFields((err, values) => {
|
||||
if (!err) {
|
||||
that.confirmLoading = true;
|
||||
let httpurl = '';
|
||||
let method = '';
|
||||
if(!this.model.id){
|
||||
httpurl+=this.url.add;
|
||||
method = 'post';
|
||||
}else{
|
||||
httpurl+=this.url.edit;
|
||||
method = 'put';
|
||||
}
|
||||
let formData = Object.assign(this.model, values);
|
||||
console.log("表单提交数据",formData)
|
||||
httpAction(httpurl,formData,method).then((res)=>{
|
||||
if(res.success){
|
||||
that.$message.success(res.message);
|
||||
that.$emit('ok');
|
||||
}else{
|
||||
that.$message.warning(res.message);
|
||||
}
|
||||
}).finally(() => {
|
||||
that.confirmLoading = false;
|
||||
})
|
||||
}
|
||||
|
||||
})
|
||||
},
|
||||
popupCallback(row){
|
||||
this.form.setFieldsValue(pick(row, 'id', 'name','beginDate','endDate','status'))
|
||||
},
|
||||
}
|
||||
}
|
||||
</script>
|
||||
@ -0,0 +1,60 @@
|
||||
<template>
|
||||
<j-modal
|
||||
:title="title"
|
||||
:width="width"
|
||||
:visible="visible"
|
||||
switchFullscreen
|
||||
@ok="handleOk"
|
||||
:okButtonProps="{ class:{'jee-hidden': disableSubmit} }"
|
||||
@cancel="handleCancel"
|
||||
cancelText="关闭">
|
||||
<tenant-form ref="realForm" @ok="submitCallback" :disabled="disableSubmit" normal></tenant-form>
|
||||
</j-modal>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
|
||||
import TenantForm from './TenantForm'
|
||||
export default {
|
||||
name: "TenantModal",
|
||||
components: {
|
||||
TenantForm
|
||||
},
|
||||
data () {
|
||||
return {
|
||||
title:'',
|
||||
width:800,
|
||||
visible: false,
|
||||
disableSubmit: false
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
add () {
|
||||
this.visible=true
|
||||
this.$nextTick(()=>{
|
||||
this.$refs.realForm.add();
|
||||
})
|
||||
},
|
||||
edit (record) {
|
||||
this.visible=true
|
||||
this.$nextTick(()=>{
|
||||
this.$refs.realForm.edit(record);
|
||||
})
|
||||
},
|
||||
close () {
|
||||
this.$emit('close');
|
||||
this.visible = false;
|
||||
},
|
||||
handleOk () {
|
||||
this.$refs.realForm.submitForm();
|
||||
},
|
||||
submitCallback(){
|
||||
this.$emit('ok');
|
||||
this.visible = false;
|
||||
},
|
||||
handleCancel () {
|
||||
this.close()
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
@ -7,7 +7,7 @@
|
||||
:closable="true"
|
||||
@close="handleCancel"
|
||||
:visible="visible"
|
||||
style="height: calc(100% - 55px);overflow: auto;padding-bottom: 53px;">
|
||||
style="height: 100%;overflow: auto;padding-bottom: 53px;">
|
||||
|
||||
<template slot="title">
|
||||
<div style="width: 100%;">
|
||||
@ -28,7 +28,7 @@
|
||||
|
||||
<template v-if="!model.id">
|
||||
<a-form-item label="登陆密码" :labelCol="labelCol" :wrapperCol="wrapperCol" >
|
||||
<a-input type="password" placeholder="请输入登陆密码" v-decorator="[ 'password', validatorRules.password]" />
|
||||
<a-input type="password" placeholder="请输入登陆密码" v-decorator="[ 'password']" />
|
||||
</a-form-item>
|
||||
|
||||
<a-form-item label="确认密码" :labelCol="labelCol" :wrapperCol="wrapperCol" >
|
||||
@ -72,6 +72,22 @@
|
||||
<a-button slot="enterButton" icon="search">选择</a-button>
|
||||
</a-input-search>
|
||||
</a-form-item>
|
||||
|
||||
<!--租户分配-->
|
||||
<a-form-item label="租户分配" :labelCol="labelCol" :wrapperCol="wrapperCol" v-show="!departDisabled">
|
||||
|
||||
<a-select
|
||||
mode="multiple"
|
||||
style="width: 100%"
|
||||
placeholder="请选择租户分配"
|
||||
:disabled="disableSubmit"
|
||||
v-model="currentTenant">
|
||||
<a-select-option v-for="(item, index) in tenantList" :key="index" :value="item.id">
|
||||
{{ item.name }}
|
||||
</a-select-option>
|
||||
</a-select>
|
||||
</a-form-item>
|
||||
|
||||
<!-- update--begin--autor:wangshuai-----date:20200108------for:新增身份和负责部门------ -->
|
||||
<a-form-item label="身份" :labelCol="labelCol" :wrapperCol="wrapperCol">
|
||||
<a-radio-group
|
||||
@ -253,14 +269,18 @@
|
||||
userWithDepart: "/sys/user/userDepartList", // 引入为指定用户查看部门信息需要的url
|
||||
userId:"/sys/user/generateUserId", // 引入生成添加用户情况下的url
|
||||
syncUserByUserName:"/process/extActProcess/doSyncUserByUserName",//同步用户到工作流
|
||||
queryTenantList: '/sys/tenant/queryList'
|
||||
},
|
||||
identity:"1",
|
||||
fileList:[],
|
||||
tenantList: [],
|
||||
currentTenant:[]
|
||||
}
|
||||
},
|
||||
created () {
|
||||
const token = Vue.ls.get(ACCESS_TOKEN);
|
||||
this.headers = {"X-Access-Token":token}
|
||||
this.initTenantList()
|
||||
|
||||
},
|
||||
computed:{
|
||||
@ -272,6 +292,13 @@
|
||||
isDisabledAuth(code){
|
||||
return disabledAuthFilter(code);
|
||||
},
|
||||
initTenantList(){
|
||||
getAction(this.url.queryTenantList).then(res=>{
|
||||
if(res.success){
|
||||
this.tenantList = res.result
|
||||
}
|
||||
})
|
||||
},
|
||||
//窗口最大化切换
|
||||
toggleScreen(){
|
||||
if(this.modaltoggleFlag){
|
||||
@ -308,6 +335,7 @@
|
||||
this.resultDepartOptions=[];
|
||||
this.departId=[];
|
||||
this.departIdShow=false;
|
||||
this.currentTenant = []
|
||||
},
|
||||
add () {
|
||||
this.picUrl = "";
|
||||
@ -343,6 +371,14 @@
|
||||
// 调用查询用户对应的部门信息的方法
|
||||
that.checkedDepartKeys = [];
|
||||
that.loadCheckedDeparts();
|
||||
|
||||
//update-begin-author:taoyan date:2020710 for:多租户配置
|
||||
if(!record.relTenantIds || record.relTenantIds.length==0){
|
||||
this.currentTenant = []
|
||||
}else{
|
||||
this.currentTenant = record.relTenantIds.split(',').map(Number);
|
||||
}
|
||||
//update-end-author:taoyan date:2020710 for:多租户配置
|
||||
},
|
||||
//
|
||||
loadCheckedDeparts(){
|
||||
@ -412,6 +448,9 @@
|
||||
}else{
|
||||
formData.avatar = null;
|
||||
}
|
||||
//update-begin-author:taoyan date:2020710 for:多租户配置
|
||||
formData.relTenantIds = this.currentTenant.length>0?this.currentTenant.join(','):''
|
||||
//update-end-author:taoyan date:2020710 for:多租户配置
|
||||
formData.selectedroles = this.selectedRole.length>0?this.selectedRole.join(","):'';
|
||||
formData.selecteddeparts = this.userDepartModel.departIdList.length>0?this.userDepartModel.departIdList.join(","):'';
|
||||
formData.userIdentity=this.identity;
|
||||
|
||||
@ -7,7 +7,7 @@
|
||||
:closable="true"
|
||||
@close="close"
|
||||
:visible="visible"
|
||||
style="height: calc(100% - 55px);overflow: auto;padding-bottom: 53px;">
|
||||
style="overflow: auto;padding-bottom: 53px;">
|
||||
|
||||
<a-form>
|
||||
<a-form-item label='所拥有的权限'>
|
||||
|
||||
@ -1,16 +1,14 @@
|
||||
<template>
|
||||
<a-card :bordered="false" style="width: 130%;text-align: center;margin-left:-10%">
|
||||
<a-steps class="steps" :current="currentTab">
|
||||
<a-step title="用户账户"/>
|
||||
<a-step title="手机验证"/>
|
||||
<a-step title="密码"/>
|
||||
<a-step title="完成"/>
|
||||
</a-steps>
|
||||
<div class="content">
|
||||
<step1 v-if="currentTab === 0" @nextStep="nextStep"/>
|
||||
<step2 v-if="currentTab === 1" @nextStep="nextStep" @prevStep="prevStep" :userList="userList"/>
|
||||
<step3 v-if="currentTab === 2" @nextStep="nextStep" @prevStep="prevStep" :userList="userList"/>
|
||||
<step4 v-if="currentTab === 3" @prevStep="prevStep" @finish="finish" :userList="userList"/>
|
||||
<step2 v-if="currentTab === 0" @nextStep="nextStep"/>
|
||||
<step3 v-if="currentTab === 1" @nextStep="nextStep" @prevStep="prevStep" :userList="userList"/>
|
||||
<step4 v-if="currentTab === 2" @prevStep="prevStep" @finish="finish" :userList="userList"/>
|
||||
</div>
|
||||
</a-card>
|
||||
</template>
|
||||
|
||||
@ -9,16 +9,16 @@
|
||||
<a-form-item>
|
||||
<a-input
|
||||
size="large"
|
||||
v-decorator="['username',{initialValue:'admin', rules: validatorRules.username.rules}]"
|
||||
v-decorator="['username',validatorRules.username,{ validator: this.handleUsernameOrEmail }]"
|
||||
type="text"
|
||||
placeholder="请输入帐户名 / admin">
|
||||
placeholder="请输入帐户名 / jeecg">
|
||||
<a-icon slot="prefix" type="user" :style="{ color: 'rgba(0,0,0,.25)' }"/>
|
||||
</a-input>
|
||||
</a-form-item>
|
||||
|
||||
<a-form-item>
|
||||
<a-input
|
||||
v-decorator="['password',{initialValue:'123456', rules: validatorRules.password.rules}]"
|
||||
v-decorator="['password',validatorRules.password]"
|
||||
size="large"
|
||||
type="password"
|
||||
autocomplete="false"
|
||||
@ -118,46 +118,7 @@
|
||||
:visible="stepCaptchaVisible"
|
||||
@success="stepCaptchaSuccess"
|
||||
@cancel="stepCaptchaCancel"></two-step-captcha>
|
||||
|
||||
<a-modal
|
||||
title="登录部门选择"
|
||||
:width="450"
|
||||
:visible="departVisible"
|
||||
:closable="false"
|
||||
:maskClosable="false">
|
||||
|
||||
<template slot="footer">
|
||||
<a-button type="primary" @click="departOk">确认</a-button>
|
||||
</template>
|
||||
|
||||
<a-form>
|
||||
<a-form-item
|
||||
:labelCol="{span:4}"
|
||||
:wrapperCol="{span:20}"
|
||||
style="margin-bottom:10px"
|
||||
:validate-status="validate_status">
|
||||
<a-tooltip placement="topLeft" >
|
||||
<template slot="title">
|
||||
<span>您隶属于多部门,请选择登录部门</span>
|
||||
</template>
|
||||
<a-avatar style="backgroundColor:#87d068" icon="gold" />
|
||||
</a-tooltip>
|
||||
<a-select @change="departChange" :class="{'valid-error':validate_status=='error'}" placeholder="请选择登录部门" style="margin-left:10px;width: 80%">
|
||||
<a-icon slot="suffixIcon" type="gold" />
|
||||
<a-select-option
|
||||
v-for="d in departList"
|
||||
:key="d.id"
|
||||
:value="d.orgCode">
|
||||
{{ d.departName }}
|
||||
</a-select-option>
|
||||
</a-select>
|
||||
</a-form-item>
|
||||
</a-form>
|
||||
|
||||
|
||||
|
||||
</a-modal>
|
||||
|
||||
<login-select-modal ref="loginSelect" @success="loginSelectOk"></login-select-modal>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
@ -173,10 +134,12 @@
|
||||
import { encryption , getEncryptedString } from '@/utils/encryption/aesEncrypt'
|
||||
import store from '@/store/'
|
||||
import { USER_INFO } from "@/store/mutation-types"
|
||||
import LoginSelectModal from './LoginSelectModal.vue'
|
||||
|
||||
export default {
|
||||
components: {
|
||||
TwoStepCaptcha
|
||||
TwoStepCaptcha,
|
||||
LoginSelectModal
|
||||
},
|
||||
data () {
|
||||
return {
|
||||
@ -205,12 +168,7 @@
|
||||
verifiedCode:"",
|
||||
inputCodeContent:"",
|
||||
inputCodeNull:true,
|
||||
|
||||
departList:[],
|
||||
departVisible:false,
|
||||
departSelected:"",
|
||||
currentUsername:"",
|
||||
validate_status:"",
|
||||
currdatetime:'',
|
||||
randCodeImage:'',
|
||||
requestCodeSuccess:false
|
||||
@ -281,7 +239,7 @@
|
||||
loginParams.checkKey = that.currdatetime
|
||||
console.log("登录参数",loginParams)
|
||||
that.Login(loginParams).then((res) => {
|
||||
this.departConfirm(res)
|
||||
this.$refs.loginSelect.show(res.result)
|
||||
}).catch((err) => {
|
||||
that.requestFailed(err);
|
||||
});
|
||||
@ -300,7 +258,7 @@
|
||||
loginParams.remember_me = values.rememberMe
|
||||
that.PhoneLogin(loginParams).then((res) => {
|
||||
console.log(res.result);
|
||||
this.departConfirm(res)
|
||||
this.$refs.loginSelect.show(res.result)
|
||||
}).catch((err) => {
|
||||
that.requestFailed(err);
|
||||
})
|
||||
@ -376,7 +334,9 @@
|
||||
// update-begin- author:sunjianlei --- date:20190812 --- for: 登录成功后不解除禁用按钮,防止多次点击
|
||||
// this.loginBtn = false
|
||||
// update-end- author:sunjianlei --- date:20190812 --- for: 登录成功后不解除禁用按钮,防止多次点击
|
||||
this.$router.push({ path: "/dashboard/analysis" })
|
||||
this.$router.push({ path: "/dashboard/analysis" }).catch(()=>{
|
||||
console.log('登录跳转首页出错,这个错误从哪里来的')
|
||||
})
|
||||
this.$notification.success({
|
||||
message: '欢迎',
|
||||
description: `${timeFix()},欢迎回来`,
|
||||
@ -418,64 +378,8 @@
|
||||
inputCodeChange(e){
|
||||
this.inputCodeContent = e.target.value
|
||||
},
|
||||
departConfirm(res){
|
||||
if(res.success){
|
||||
let multi_depart = res.result.multi_depart
|
||||
//0:无部门 1:一个部门 2:多个部门
|
||||
if(multi_depart==0){
|
||||
this.loginSuccess()
|
||||
this.$notification.warn({
|
||||
message: '提示',
|
||||
description: `您尚未归属部门,请确认账号信息`,
|
||||
duration:3
|
||||
});
|
||||
}else if(multi_depart==2){
|
||||
this.departVisible=true
|
||||
this.currentUsername=this.form.getFieldValue("username")
|
||||
this.departList = res.result.departs
|
||||
}else {
|
||||
this.loginSuccess()
|
||||
}
|
||||
}else{
|
||||
this.requestFailed(res)
|
||||
this.Logout();
|
||||
}
|
||||
},
|
||||
departOk(){
|
||||
if(!this.departSelected){
|
||||
this.validate_status='error'
|
||||
return false
|
||||
}
|
||||
let obj = {
|
||||
orgCode:this.departSelected,
|
||||
username:this.form.getFieldValue("username")
|
||||
}
|
||||
putAction("/sys/selectDepart",obj).then(res=>{
|
||||
if(res.success){
|
||||
const userInfo = res.result.userInfo;
|
||||
Vue.ls.set(USER_INFO, userInfo, 7 * 24 * 60 * 60 * 1000);
|
||||
store.commit('SET_INFO', userInfo);
|
||||
//console.log("---切换组织机构---userInfo-------",store.getters.userInfo.orgCode);
|
||||
this.departClear()
|
||||
this.loginSuccess()
|
||||
}else{
|
||||
this.requestFailed(res)
|
||||
this.Logout().then(()=>{
|
||||
this.departClear()
|
||||
});
|
||||
}
|
||||
})
|
||||
},
|
||||
departClear(){
|
||||
this.departList=[]
|
||||
this.departSelected=""
|
||||
this.currentUsername=""
|
||||
this.departVisible=false
|
||||
this.validate_status=''
|
||||
},
|
||||
departChange(value){
|
||||
this.validate_status='success'
|
||||
this.departSelected = value
|
||||
loginSelectOk(){
|
||||
this.loginSuccess()
|
||||
},
|
||||
getRouterData(){
|
||||
this.$nextTick(() => {
|
||||
|
||||
210
ant-design-vue-jeecg/src/views/user/LoginSelectModal.vue
Normal file
210
ant-design-vue-jeecg/src/views/user/LoginSelectModal.vue
Normal file
@ -0,0 +1,210 @@
|
||||
<template>
|
||||
<a-modal
|
||||
:title="title"
|
||||
:width="450"
|
||||
:visible="visible"
|
||||
:closable="false"
|
||||
:maskClosable="false">
|
||||
|
||||
<template slot="footer">
|
||||
<a-button type="primary" @click="selectOk">确认</a-button>
|
||||
</template>
|
||||
|
||||
<a-form>
|
||||
<a-form-item v-if="isMultiTenant" :labelCol="{span:4}" :wrapperCol="{span:20}" style="margin-bottom:10px" :validate-status="validate_status1">
|
||||
<a-tooltip placement="topLeft" >
|
||||
<template slot="title">
|
||||
<span>您有多个租户,请选择登录租户</span>
|
||||
</template>
|
||||
<a-avatar style="backgroundColor:#87d068" icon="gold" />
|
||||
</a-tooltip>
|
||||
|
||||
<a-select @change="handleTenantChange" :class="{'valid-error':validate_status1=='error'}" placeholder="请选择登录租户" style="margin-left:10px;width: 80%">
|
||||
<a-icon slot="suffixIcon" type="gold" />
|
||||
<a-select-option v-for="d in tenantList" :key="d.id" :value="d.id">
|
||||
{{ d.name }}
|
||||
</a-select-option>
|
||||
</a-select>
|
||||
</a-form-item>
|
||||
|
||||
|
||||
<a-form-item v-if="isMultiDepart" :labelCol="{span:4}" :wrapperCol="{span:20}" style="margin-bottom:10px" :validate-status="validate_status2">
|
||||
<a-tooltip placement="topLeft" >
|
||||
<template slot="title">
|
||||
<span>您有多个部门,请选择登录部门</span>
|
||||
</template>
|
||||
<a-avatar style="backgroundColor:rgb(104, 208, 203);" icon="gold" />
|
||||
</a-tooltip>
|
||||
|
||||
<a-select @change="handleDepartChange" :class="{'valid-error':validate_status2=='error'}" placeholder="请选择登录部门" style="margin-left:10px;width: 80%">
|
||||
<a-icon slot="suffixIcon" type="gold" />
|
||||
<a-select-option v-for="d in departList" :key="d.id" :value="d.orgCode">
|
||||
{{ d.departName }}
|
||||
</a-select-option>
|
||||
</a-select>
|
||||
</a-form-item>
|
||||
|
||||
</a-form>
|
||||
</a-modal>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
|
||||
import Vue from 'vue'
|
||||
import { getAction,putAction } from '@/api/manage'
|
||||
import { USER_INFO } from "@/store/mutation-types"
|
||||
import store from './Login'
|
||||
|
||||
export default {
|
||||
name: 'LoginSelectModal',
|
||||
data(){
|
||||
return {
|
||||
visible: false,
|
||||
isMultiDepart:false,
|
||||
departList:[],
|
||||
|
||||
isMultiTenant:false,
|
||||
tenantList:[],
|
||||
|
||||
username:'',
|
||||
orgCode:'',
|
||||
tenant_id:'',
|
||||
|
||||
validate_status1: "",
|
||||
validate_status2: "",
|
||||
}
|
||||
},
|
||||
computed:{
|
||||
title(){
|
||||
if(this.isMultiDepart && this.isMultiTenant){
|
||||
return '请选择租户和部门'
|
||||
}else if(this.isMultiDepart && !this.isMultiTenant){
|
||||
return '请选择部门'
|
||||
}else if(!this.isMultiDepart && this.isMultiTenant){
|
||||
return '请选择租户'
|
||||
}
|
||||
}
|
||||
},
|
||||
methods:{
|
||||
clear(){
|
||||
this.departList = []
|
||||
this.tenantList = []
|
||||
this.visible=false
|
||||
this.validate_status1=''
|
||||
this.validate_status2=''
|
||||
},
|
||||
bizDepart(loginResult){
|
||||
let multi_depart = loginResult.multi_depart
|
||||
//0:无部门 1:一个部门 2:多个部门
|
||||
if(multi_depart==0){
|
||||
this.$notification.warn({
|
||||
message: '提示',
|
||||
description: `您尚未归属部门,请确认账号信息`,
|
||||
duration:3
|
||||
});
|
||||
this.isMultiDepart = false
|
||||
}else if(multi_depart==2){
|
||||
this.visible=true
|
||||
this.isMultiDepart = true
|
||||
this.departList = loginResult.departs
|
||||
}else {
|
||||
this.isMultiDepart = false
|
||||
}
|
||||
},
|
||||
bizTenant(ids){
|
||||
if(!ids || ids.length==0){
|
||||
this.isMultiTenant = false
|
||||
} else if(ids.indexOf(',')<0){
|
||||
this.tenant_id = ids;
|
||||
this.isMultiTenant = false
|
||||
}else{
|
||||
this.visible = true
|
||||
this.isMultiTenant = true
|
||||
getAction('/sys/tenant/queryList', {ids: ids}).then(res=>{
|
||||
this.tenantList = res.result
|
||||
})
|
||||
}
|
||||
},
|
||||
show(loginResult){
|
||||
this.clear();
|
||||
this.bizDepart(loginResult);
|
||||
|
||||
let user = Vue.ls.get(USER_INFO)
|
||||
this.username = user.username
|
||||
let ids = user.relTenantIds
|
||||
this.bizTenant(ids);
|
||||
|
||||
if(this.visible===false){
|
||||
this.$store.dispatch('saveTenant', this.tenant_id);
|
||||
this.$emit('success')
|
||||
}
|
||||
|
||||
},
|
||||
requestFailed (err) {
|
||||
this.$notification[ 'error' ]({
|
||||
message: '登录失败',
|
||||
description: ((err.response || {}).data || {}).message || err.message || "请求出现错误,请稍后再试",
|
||||
duration: 4,
|
||||
});
|
||||
this.loginBtn = false;
|
||||
},
|
||||
departResolve(){
|
||||
return new Promise((resolve, reject)=>{
|
||||
if(this.isMultiDepart===false){
|
||||
resolve();
|
||||
}else{
|
||||
let obj = {
|
||||
orgCode:this.orgCode,
|
||||
username:this.username
|
||||
}
|
||||
putAction("/sys/selectDepart",obj).then(res=>{
|
||||
if(res.success){
|
||||
const userInfo = res.result.userInfo;
|
||||
Vue.ls.set(USER_INFO, userInfo, 7 * 24 * 60 * 60 * 1000);
|
||||
this.$store.commit('SET_INFO', userInfo);
|
||||
//console.log("---切换组织机构---userInfo-------",store.getters.userInfo.orgCode);
|
||||
resolve();
|
||||
}else{
|
||||
this.requestFailed(res)
|
||||
this.$store.dispatch('Logout');
|
||||
reject();
|
||||
}
|
||||
})
|
||||
}
|
||||
})
|
||||
},
|
||||
selectOk(){
|
||||
if(this.isMultiTenant && !this.tenant_id){
|
||||
this.validate_status1='error'
|
||||
return false
|
||||
}
|
||||
if(this.isMultiDepart && !this.orgCode){
|
||||
this.validate_status2='error'
|
||||
return false
|
||||
}
|
||||
this.departResolve().then(()=>{
|
||||
if(this.isMultiTenant){
|
||||
this.$store.dispatch('saveTenant', this.tenant_id);
|
||||
this.$emit('success')
|
||||
}else{
|
||||
this.$emit('success')
|
||||
}
|
||||
}).catch(()=>{
|
||||
console.log('登录选择出问题')
|
||||
})
|
||||
},
|
||||
handleTenantChange(e){
|
||||
this.validate_status1 = ''
|
||||
this.tenant_id = e
|
||||
},
|
||||
handleDepartChange(e){
|
||||
this.validate_status2 = ''
|
||||
this.orgCode = e
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
|
||||
</style>
|
||||
@ -1,19 +1,6 @@
|
||||
<template>
|
||||
<div>
|
||||
<a-form :form="form" style="max-width: 500px; margin: 40px auto 0;" @keyup.enter.native="nextStep">
|
||||
<a-form-item
|
||||
label="账号名"
|
||||
:labelCol="{span: 5}"
|
||||
:wrapperCol="{span: 19}"
|
||||
>
|
||||
<a-input
|
||||
type="text"
|
||||
autocomplete="false"
|
||||
:style="{width:'310px'}"
|
||||
:value="accountName"
|
||||
disabled>
|
||||
</a-input>
|
||||
</a-form-item>
|
||||
<a-form-item
|
||||
label="手机"
|
||||
:labelCol="{span: 5}"
|
||||
@ -22,8 +9,8 @@
|
||||
<a-input
|
||||
type="text"
|
||||
autocomplete="false"
|
||||
:style="{width:'310px'}"
|
||||
v-decorator="['phone',{initialValue: defaultPhone, rules: validatorRules.phone.rule}]"
|
||||
style="width:310px;margin-left:-10px"
|
||||
v-decorator="['phone',{ rules: validatorRules.phone.rule}]"
|
||||
placeholder="请输入手机号">
|
||||
<a-icon slot="prefix" type="phone" :style="{ color: 'rgba(0,0,0,.25)'}"/>
|
||||
</a-input>
|
||||
@ -52,10 +39,9 @@
|
||||
</a-row>
|
||||
</a-form-item>
|
||||
<a-form-item :wrapperCol="{span: 19, offset: 5}">
|
||||
<a-button style="margin-left: 8px" @click="prevStep">上一步</a-button>
|
||||
<router-link style="float: left;line-height: 40px;" :to="{ name: 'login' }">使用已有账户登录</router-link>
|
||||
<a-button type="primary" @click="nextStep" style="margin-left: 20px">下一步</a-button>
|
||||
</a-form-item>
|
||||
|
||||
</a-form>
|
||||
</div>
|
||||
</template>
|
||||
@ -70,7 +56,7 @@
|
||||
return {
|
||||
form: this.$form.createForm(this),
|
||||
loading: false,
|
||||
accountName: this.userList.username,
|
||||
// accountName: this.userList.username,
|
||||
dropList: "0",
|
||||
captcha: "",
|
||||
show: true,
|
||||
@ -84,17 +70,11 @@
|
||||
},
|
||||
validatorRules: {
|
||||
captcha: {rule: [{required: true, message: '请输入短信验证码!'}, {validator: this.validateCaptcha}]},
|
||||
phone: {rule: [{required: true, message: '请输入手机号码!'}]},
|
||||
phone: {rule: [{required: true, message: '请输入手机号码!'}, {validator: this.validatePhone}]},
|
||||
},
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
defaultPhone: function(){
|
||||
if(this.userList.isPhone){
|
||||
return this.userList.phone
|
||||
}
|
||||
return null;
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
nextStep() {
|
||||
@ -108,15 +88,15 @@
|
||||
this.cmsFailed("请输入短信验证码!");
|
||||
} else {
|
||||
var params = {}
|
||||
params.phone = this.userList.phone;
|
||||
params.phone = values.phone;
|
||||
params.smscode = values.captcha;
|
||||
postAction("/sys/user/phoneVerification", params).then((res) => {
|
||||
if (res.success) {
|
||||
console.log(res);
|
||||
var userList = {
|
||||
username: this.userList.username,
|
||||
phone: this.userList.phone,
|
||||
smscode: res.result
|
||||
username: res.result.username,
|
||||
phone: values.phone,
|
||||
smscode: res.result.smscode
|
||||
};
|
||||
setTimeout(function () {
|
||||
that.$emit('nextStep', userList)
|
||||
@ -133,12 +113,14 @@
|
||||
}
|
||||
})
|
||||
},
|
||||
prevStep() {
|
||||
this.$emit('prevStep', this.userList);
|
||||
},
|
||||
getCaptcha(e) {
|
||||
e.preventDefault();
|
||||
let that = this;
|
||||
let phone=that.form.getFieldValue("phone")
|
||||
if(!phone){
|
||||
this.cmsFailed("手机号不能为空!");
|
||||
return;
|
||||
}
|
||||
this.state.smsSendBtn = true;
|
||||
let interval = window.setInterval(() => {
|
||||
if (that.state.time-- <= 0) {
|
||||
@ -150,7 +132,7 @@
|
||||
|
||||
const hide = this.$message.loading('验证码发送中..', 0);
|
||||
let smsParams = {
|
||||
mobile: this.userList.phone,
|
||||
mobile: phone,
|
||||
smsmode: "2"
|
||||
};
|
||||
postAction("/sys/sms", smsParams).then(res => {
|
||||
@ -179,6 +161,18 @@
|
||||
that.show = false;
|
||||
}
|
||||
},
|
||||
validatePhone(rule,value,callback){
|
||||
if(value){
|
||||
var myreg=/^[1][3,4,5,7,8][0-9]{9}$/;
|
||||
if(!myreg.test(value)){
|
||||
callback("请输入正确的手机号")
|
||||
}else{
|
||||
callback();
|
||||
}
|
||||
}else{
|
||||
callback()
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user