pengjunjie/JeecgBoot
1
0
Fork 1
mirror of https://github.com/jeecgboot/JeecgBoot.git synced 2025-12-08 17:12:28 +08:00
Code Issues Packages Projects Releases Wiki Activity

JeecgBoot 2.1.1 代码生成器AI版本发布

Browse Source
This commit is contained in:
zhangdaihao
2019-10-18 18:37:41 +08:00
parent 9e8b97a0d9
commit 04c0ea55f2
267 changed files with 16761 additions and 26860 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
ant-design-vue-jeecg/src/components/chart/BarMultid.vue
View File

@ -56,7 +56,9 @@
// bar 使用不了 - 和 / 所以替换下
return dv.rows.map(row => {
row.x = row.x.replace(/[-/]/g, '_')
if (typeof row.x === 'string') {
row.x = row.x.replace(/[-/]/g, '_')
}
return row
})

2
ant-design-vue-jeecg/src/components/dict/JDictSelectUtil.js
View File

@ -44,7 +44,7 @@ export function filterDictText(dictOptions, text) {
* @return String
*/
export function filterMultiDictText(dictOptions, text) {
if(!text){
if(!text || !dictOptions || dictOptions.length==0){
return ""
}
let re = "";

3
ant-design-vue-jeecg/src/components/dict/JMultiSelectTag.vue
View File

@ -9,7 +9,8 @@
@change="onChange"
:disabled="disabled"
mode="multiple"
:placeholder="placeholder">
:placeholder="placeholder"
allowClear>
<a-select-option
v-for="(item,index) in dictOptions"
:key="index"

2
ant-design-vue-jeecg/src/components/dict/JSearchSelectTag.vue
View File

@ -10,6 +10,7 @@
style="width: 100%"
:filterOption="false"
@change="handleAsyncChange"
allowClear
:notFoundContent="loading ? undefined : null"
>
<a-spin v-if="loading" slot="notFoundContent" size="small"/>
@ -25,6 +26,7 @@
@change="handleChange"
:filterOption="filterOption"
v-model="selectedValue"
allowClear
:notFoundContent="loading ? undefined : null">
<a-spin v-if="loading" slot="notFoundContent" size="small"/>
<a-select-option v-for="d in options" :key="d.value" :value="d.value">{{ d.text }}</a-select-option>

240
ant-design-vue-jeecg/src/components/jeecg/JCategorySelect.vue Normal file
View File

@ -0,0 +1,240 @@
<template>
<a-tree-select
allowClear
labelInValue
style="width: 100%"
:disabled="disabled"
:dropdownStyle="{ maxHeight: '400px', overflow: 'auto' }"
:placeholder="placeholder"
:loadData="asyncLoadTreeData"
:value="treeValue"
:treeData="treeData"
:multiple="multiple"
@change="onChange">
</a-tree-select>
</template>
<script>
import { getAction } from '@/api/manage'
export default {
name: 'JCategorySelect',
props: {
value:{
type: String,
required: false
},
placeholder:{
type: String,
default: '请选择',
required: false
},
disabled:{
type:Boolean,
default:false,
required:false
},
condition:{
type:String,
default:'',
required:false
},
// 是否支持多选
multiple: {
type: Boolean,
default: false,
},
loadTriggleChange:{
type: Boolean,
default: false,
required:false
},
pid:{
type:String,
default:'',
required:false
},
pcode:{
type:String,
default:'',
required:false
},
back:{
type:String,
default:'',
required:false
}
},
data () {
return {
treeValue:"",
treeData:[],
url:"/sys/category/loadTreeData",
view:'/sys/category/loadDictItem/',
tableName:"",
text:"",
code:"",
}
},
watch: {
value () {
this.loadItemByCode()
},
pcode(){
this.loadRoot();
}
},
created(){
this.validateProp().then(()=>{
this.loadRoot()
this.loadItemByCode()
})
},
methods: {
/**加载一级节点 */
loadRoot(){
let param = {
pid:this.pid,
pcode:this.pcode,
condition:this.condition
}
getAction(this.url,param).then(res=>{
if(res.success && res.result){
for(let i of res.result){
i.value = i.key
if(i.leaf==false){
i.isLeaf=false
}else if(i.leaf==true){
i.isLeaf=true
}
}
this.treeData = [...res.result]
}else{
console.log("树一级节点查询结果-else",res)
}
})
},
/** 数据回显*/
loadItemByCode(){
if(!this.value || this.value=="0"){
this.treeValue = ""
}else{
getAction(this.view,{ids:this.value}).then(res=>{
console.log(124345)
console.log(124345,res)
if(res.success){
let values = this.value.split(',')
this.treeValue = res.result.map((item, index) => ({
key: values[index],
value: values[index],
label: item
}))
this.onLoadTriggleChange(res.result[0]);
}
})
}
},
onLoadTriggleChange(text){
//只有单选才会触发
if(!this.multiple && this.loadTriggleChange){
this.backValue(this.value,text)
}
},
backValue(value,label){
let obj = {}
if(this.back){
obj[this.back] = label
}
this.$emit('change', value, obj)
},
asyncLoadTreeData (treeNode) {
return new Promise((resolve) => {
if (treeNode.$vnode.children) {
resolve()
return
}
let pid = treeNode.$vnode.key
let param = {
pid:pid,
condition:this.condition
}
getAction(this.url,param).then(res=>{
if(res.success){
for(let i of res.result){
i.value = i.key
if(i.leaf==false){
i.isLeaf=false
}else if(i.leaf==true){
i.isLeaf=true
}
}
this.addChildren(pid,res.result,this.treeData)
this.treeData = [...this.treeData]
}
resolve()
})
})
},
addChildren(pid,children,treeArray){
if(treeArray && treeArray.length>0){
for(let item of treeArray){
if(item.key == pid){
if(!children || children.length==0){
item.isLeaf=true
}else{
item.children = children
}
break
}else{
this.addChildren(pid,children,item.children)
}
}
}
},
onChange(value){
if(!value){
this.$emit('change', '');
this.treeValue = ''
} else if (value instanceof Array) {
//this.$emit('change', value.map(item => item.value).join(','))
//this.treeValue = value
} else {
this.backValue(value.value,value.label)
this.treeValue = value
}
},
getCurrTreeData(){
return this.treeData
},
validateProp(){
let mycondition = this.condition
return new Promise((resolve,reject)=>{
if(!mycondition){
resolve();
}else{
try {
let test=JSON.parse(mycondition);
if(typeof test == 'object' && test){
resolve()
}else{
this.$message.error("组件JTreeSelect-condition传值有误，需要一个json字符串!")
reject()
}
} catch(e) {
this.$message.error("组件JTreeSelect-condition传值有误，需要一个json字符串!")
reject()
}
}
})
}
},
//2.2新增 在组件内定义 指定父组件调用时候的传值属性和事件类型 这个牛逼
model: {
prop: 'value',
event: 'change'
}
}
</script>

2
ant-design-vue-jeecg/src/components/jeecg/JCheckbox.vue
View File

@ -1,5 +1,5 @@
<template>
<a-checkbox-group :options="options" :value="checkboxArray" @change="onChange" />
<a-checkbox-group :options="options" :value="checkboxArray" v-bind="$attrs" @change="onChange" />
</template>
<script>

15
ant-design-vue-jeecg/src/components/jeecg/JCodeEditor.vue
View File

@ -228,10 +228,11 @@
// 初始化编辑器实例，传入需要被实例化的文本域对象和默认配置
this.coder = CodeMirror.fromTextArea(this.$refs.textarea, this.coderOptions)
// 编辑器赋值
this.coder.setValue(this.value || this.code)
if(this.value||this.code){
this.hasCode=true
this.coder.setValue(this.value || this.code)
}else{
this.coder.setValue('')
this.hasCode=false
}
// 支持双向绑定
@ -266,7 +267,13 @@
return this.code
},
setCodeContent(val){
this.coder.setValue(val)
setTimeout(()=>{
if(!val){
this.coder.setValue('')
}else{
this.coder.setValue(val)
}
},300)
},
// 获取当前语法类型
_getLanguage (language) {
@ -405,5 +412,7 @@
}
.CodeMirror-cursor{
height:18.4px !important;
}
</style>

3
ant-design-vue-jeecg/src/components/jeecg/JCron.vue
View File

@ -18,9 +18,6 @@
value: {
required: false,
type: String,
default:()=>{
return '* * * * * ? *'
}
}
},
data(){

627
ant-design-vue-jeecg/src/components/jeecg/JEditableTable.vue
View File

@ -1,25 +1,36 @@
<!-- JEditableTable -->
<!-- @version 1.4.4 -->
<!-- @version 1.5.0 -->
<!-- @author sjlei -->
<template>
<a-spin :spinning="loading">
<!-- 操作按钮 -->
<div v-if="actionButton" class="action-button">
<a-button type="primary" icon="plus" @click="handleClickAdd">新增</a-button>
<span class="gap"></span>
<template v-if="selectedRowIds.length>0">
<a-popconfirm
:title="`确定要删除这 ${selectedRowIds.length} 项吗?`"
@confirm="handleConfirmDelete">
<a-button type="primary" icon="minus">删除</a-button>
</a-popconfirm>
<template v-if="showClearSelectButton">
<a-row type="flex">
<a-col>
<slot name="buttonBefore" :target="getVM()"/>
</a-col>
<a-col>
<!-- 操作按钮 -->
<div v-if="actionButton" class="action-button">
<a-button type="primary" icon="plus" @click="handleClickAdd">新增</a-button>
<span class="gap"></span>
<a-button icon="delete" @click="handleClickClearSelect">清空选择</a-button>
</template>
</template>
</div>
<template v-if="selectedRowIds.length>0">
<a-popconfirm
:title="`确定要删除这 ${selectedRowIds.length} 项吗?`"
@confirm="handleConfirmDelete">
<a-button type="primary" icon="minus">删除</a-button>
<span class="gap"></span>
</a-popconfirm>
<template v-if="showClearSelectButton">
<a-button icon="delete" @click="handleClickClearSelection">清空选择</a-button>
<span class="gap"></span>
</template>
</template>
</div>
</a-col>
<a-col>
<slot name="buttonAfter" :target="getVM()"/>
</a-col>
</a-row>
<div :id="`${caseId}inputTable`" class="input-table">
<!-- 渲染表头 -->
@ -65,7 +76,8 @@
<div v-if="rows.length===0" class="tr-nodata">
<span>暂无数据</span>
</div>
<draggable v-model="rows" handle=".td-ds-icons" @end="handleDragMoveEnd">
<!-- v-model="rows"-->
<draggable :value="rows" handle=".td-ds-icons" @end="handleDragMoveEnd">
<!-- 动态生成tr -->
<template v-for="(row,rowIndex) in rows">
@ -128,6 +140,7 @@
v-bind="buildProps(row,col)"
:data-input-number="col.type === formTypes.inputNumber"
:placeholder="replaceProps(col, col.placeholder)"
@blur="(e)=>{handleBlurCommono(e.target,rowIndex,row,col)}"
@input="(e)=>{handleInputCommono(e.target,rowIndex,row,col)}"
@mouseover="()=>{handleMouseoverCommono(row,col)}"
@mouseout="()=>{handleMouseoutCommono(row,col)}"/>
@ -262,6 +275,230 @@
</div>
<!-- update-begin-author:taoyan date:0827 for：popup -->
<template v-else-if="col.type === formTypes.popup">
<a-tooltip
:key="i"
:id="id"
placement="top"
:title="(tooltips[id] || {}).title"
:visible="(tooltips[id] || {}).visible || false"
:autoAdjustOverflow="true">
<span
@mouseover="()=>{handleMouseoverCommono(row,col)}"
@mouseout="()=>{handleMouseoutCommono(row,col)}">
<j-popup
:id="id"
:key="i"
v-bind="buildProps(row,col)"
:placeholder="replaceProps(col, col.placeholder)"
style="width: 100%;"
:value="getPopupValue(id)"
:field="col.key"
:org-fields="col.orgFieldse"
:dest-fields="col.destFields"
:code="col.popupCode"
@input="(value,others)=>popupCallback(value,others,id,row,col,rowIndex)"/>
</span>
</a-tooltip>
</template>
<!-- update-end-author:taoyan date:0827 for：popup -->
<!-- update-beign-author:taoyan date:0827 for：文件/图片逻辑新增 -->
<div v-else-if="col.type === formTypes.file" :key="i">
<template v-if="uploadValues[id] != null" v-for="(file,fileKey) of [(uploadValues[id]||{})]">
<a-input
:key="fileKey"
:readOnly="true"
:value="file.name"
>
<template slot="addonBefore" style="width: 30px">
<a-tooltip v-if="file.status==='uploading'" :title="`上传中(${Math.floor(file.percent)}%)`">
<a-icon type="loading"/>
</a-tooltip>
<a-tooltip v-else-if="file.status==='done'" title="上传完成">
<a-icon type="check-circle" style="color:#00DB00;"/>
</a-tooltip>
<a-tooltip v-else title="上传失败">
<a-icon type="exclamation-circle" style="color:red;"/>
</a-tooltip>
</template>
<template slot="addonAfter" style="width: 30px">
<a-tooltip title="删除并重新上传">
<a-icon
v-if="file.status!=='uploading'"
type="close-circle"
style="cursor: pointer;"
@click="()=>handleClickDelFile(id)"/>
</a-tooltip>
</template>
</a-input>
</template>
<div :hidden="uploadValues[id] != null">
<a-upload
name="file"
:data="{'isup':1}"
:multiple="false"
:action="getUploadAction(col.action)"
:headers="uploadGetHeaders(row,col)"
:showUploadList="false"
v-bind="buildProps(row,col)"
@change="(v)=>handleChangeUpload(v,id,row,col)"
>
<a-button icon="upload">{{ col.placeholder }}</a-button>
</a-upload>
</div>
</div>
<div v-else-if="col.type === formTypes.image" :key="i">
<template v-if="uploadValues[id] != null" v-for="(file,fileKey) of [(uploadValues[id]||{})]">
<div :key="fileKey" style="position: relative;">
<img :src="getCellImageView(id)" style="height:32px;max-width:100px !important;" alt="无图片"/>
<template slot="addonBefore" style="width: 30px">
<a-tooltip v-if="file.status==='uploading'" :title="`上传中(${Math.floor(file.percent)}%)`">
<a-icon type="loading"/>
</a-tooltip>
<a-tooltip v-else-if="file.status==='done'" title="上传完成">
<a-icon type="check-circle" style="color:#00DB00;"/>
</a-tooltip>
<a-tooltip v-else title="上传失败">
<a-icon type="exclamation-circle" style="color:red;"/>
</a-tooltip>
</template>
<template style="width: 30px">
<a-tooltip title="删除并重新上传" style="margin-left:5px">
<a-icon
v-if="file.status!=='uploading'"
type="close-circle"
style="cursor: pointer;"
@click="()=>handleClickDelFile(id)"/>
</a-tooltip>
</template>
</div>
</template>
<div :hidden="uploadValues[id] != null">
<a-upload
name="file"
:data="{'isup':1}"
:multiple="false"
:action="getUploadAction(col.action)"
:headers="uploadGetHeaders(row,col)"
:showUploadList="false"
v-bind="buildProps(row,col)"
@change="(v)=>handleChangeUpload(v,id,row,col)"
>
<a-button icon="upload">请上传图片</a-button>
</a-upload>
</div>
</div>
<!-- update-end-author:taoyan date:0827 for：图片逻辑新增 -->
<!-- radio-begin -->
<template v-else-if="col.type === formTypes.radio">
<a-tooltip
:key="i"
:id="id"
placement="top"
:title="(tooltips[id] || {}).title"
:visible="(tooltips[id] || {}).visible || false"
:autoAdjustOverflow="true">
<span
@mouseover="()=>{handleMouseoverCommono(row,col)}"
@mouseout="()=>{handleMouseoutCommono(row,col)}">
<a-radio-group
:id="id"
:key="i"
v-bind="buildProps(row,col)"
:value="radioValues[id]"
@change="(e)=>handleRadioChange(e.target.value,id,row,col)">
<a-radio v-for="(item, key) in col.options" :key="key" :value="item.value">{{ item.text }}</a-radio>
</a-radio-group>
</span>
</a-tooltip>
</template>
<!-- radio-end -->
<!-- select多选 -begin -->
<template v-else-if="col.type === formTypes.list_multi">
<a-tooltip
:key="i"
:id="id"
placement="top"
:title="(tooltips[id] || {}).title"
:visible="(tooltips[id] || {}).visible || false"
:autoAdjustOverflow="true">
<span
@mouseover="()=>{handleMouseoverCommono(row,col)}"
@mouseout="()=>{handleMouseoutCommono(row,col)}">
<a-select
:id="id"
:key="i"
mode="multiple"
:maxTagCount="1"
v-bind="buildProps(row,col)"
style="width: 100%;"
:value="multiSelectValues[id]"
:options="col.options"
:getPopupContainer="getParentContainer"
:placeholder="replaceProps(col, col.placeholder)"
@change="(v)=>handleMultiSelectChange(v,id,row,col)"
allowClear>
</a-select>
</span>
</a-tooltip>
</template>
<!-- select多选 -end -->
<!-- select搜索 -begin -->
<template v-else-if="col.type === formTypes.sel_search">
<a-tooltip
:key="i"
:id="id"
placement="top"
:title="(tooltips[id] || {}).title"
:visible="(tooltips[id] || {}).visible || false"
:autoAdjustOverflow="true">
<span
@mouseover="()=>{handleMouseoverCommono(row,col)}"
@mouseout="()=>{handleMouseoutCommono(row,col)}">
<a-select
:id="id"
:key="i"
showSearch
optionFilterProp="children"
:filterOption="filterOption"
v-bind="buildProps(row,col)"
style="width: 100%;"
:value="searchSelectValues[id]"
:options="col.options"
:getPopupContainer="getParentContainer"
:placeholder="replaceProps(col, col.placeholder)"
@change="(v)=>handleSearchSelectChange(v,id,row,col)"
allowClear>
</a-select>
</span>
</a-tooltip>
</template>
<!-- select搜索 -end -->
<div v-else-if="col.type === formTypes.slot" :key="i">
<slot
:name="(col.slot || col.slotName) || col.key"
@ -270,12 +507,14 @@
:column="col"
:rowId="removeCaseId(row.id)"
:getValue="()=>_getValueForSlot(row.id)"
:caseId="caseId"
:allValues="_getAllValuesForSlot()"
:target="getVM()"
/>
</div>
<!-- else (normal) -->
<span v-else :key="i">{{ inputValues[rowIndex][col.key] }}</span>
<span v-else :key="i" v-bind="buildProps(row,col)" >{{ inputValues[rowIndex][col.key] }}</span>
</template>
</div>
</div>
@ -299,6 +538,7 @@
import JDate from '@/components/jeecg/JDate'
import { initDictOptions } from '@/components/dict/JDictSelectUtil'
// 行高，需要在实例加载完成前用到
let rowHeight = 61
@ -397,6 +637,13 @@
jdateValues: {},
// file 信息
uploadValues: {},
//popup信息
popupValues:{},
radioValues:{},
metaCheckboxValues:{},
multiSelectValues:{},
searchSelectValues:{},
// 绑定左侧选择框已选择的id
selectedRowIds: [],
// 存储被删除行的id
@ -480,6 +727,20 @@
},
// 侦听器
watch: {
rows:{
immediate:true,
handler(val,old) {
// val.forEach(item => {
// for (let inputValue of this.inputValues) {
// if (inputValue.id === item.id) {
// item['dbFieldName'] = inputValue['dbFieldName']
// break
// }
// }
// })
// console.log('watch.rows:', cloneObject({ val, old }))
}
},
dataSource: {
immediate: true,
handler: function (newValue) {
@ -489,6 +750,12 @@
let checkboxValues = {}
let selectValues = {}
let jdateValues = {}
let uploadValues = {}
let popupValues={}
let radioValues = {}
let multiSelectValues = {}
let searchSelectValues = {}
// 禁用行的id
let disabledRowIds = (this.disabledRowIds || [])
newValue.forEach((data, newValueIndex) => {
@ -531,6 +798,27 @@
value[column.key] = sourceValue
}
} else if (column.type === FormTypes.popup) {
popupValues[inputId] = sourceValue
} else if (column.type === FormTypes.radio) {
radioValues[inputId] = sourceValue
} else if (column.type === FormTypes.sel_search) {
searchSelectValues[inputId] = sourceValue
} else if (column.type === FormTypes.list_multi) {
if(sourceValue.length>0){
multiSelectValues[inputId] = sourceValue.split(",")
}else{
multiSelectValues[inputId] = []
}
} else if (column.type === FormTypes.file || column.type === FormTypes.image) {
if(sourceValue){
let fileName = sourceValue.substring(sourceValue.lastIndexOf("/")+1)
uploadValues[inputId] = {
name: fileName,
status: 'done',
path:sourceValue
}
}
} else {
value[column.key] = sourceValue
}
@ -559,6 +847,11 @@
this.selectValues = selectValues
this.jdateValues = jdateValues
this.rows = rows
this.uploadValues = uploadValues
this.popupValues = popupValues
this.radioValues = radioValues
this.multiSelectValues = multiSelectValues
this.searchSelectValues = searchSelectValues
// 更新form表单的值
this.$nextTick(() => {
@ -571,7 +864,7 @@
immediate: true,
handler(columns) {
columns.forEach(column => {
if (column.type === FormTypes.select) {
if (column.type === FormTypes.select || column.type === FormTypes.list_multi || column.type === FormTypes.sel_search) {
// 兼容 旧版本 options
if (column.options instanceof Array) {
column.options = column.options.map(item => {
@ -594,7 +887,7 @@
},
// 当selectRowIds改变时触发事件
selectedRowIds(newValue) {
this.$emit('selectRowChange', cloneObject(newValue))
this.$emit('selectRowChange', cloneObject(newValue).map(i => this.removeCaseId(i)))
}
},
mounted() {
@ -642,6 +935,11 @@
this.selectedRowIds = []
this.tooltips = {}
this.notPassedIds = []
this.uploadValues=[]
this.popupValues=[]
this.radioValues=[]
this.multiSelectValues = []
this.searchSelectValues = []
this.scrollTop = 0
this.$nextTick(() => {
this.el.tbody.scrollTop = 0
@ -921,12 +1219,34 @@
} else if (column.type === FormTypes.upload) {
value[column.key] = cloneObject(this.uploadValues[inputId] || null)
} else if (column.type === FormTypes.image || column.type === FormTypes.file) {
let currUploadObj = cloneObject(this.uploadValues[inputId] || null)
if(currUploadObj){
value[column.key] = currUploadObj['path'] || null
}
} else if (column.type === FormTypes.popup) {
if(!value[column.key]){
value[column.key] = this.popupValues[inputId] || null
}
} else if (column.type === FormTypes.radio) {
value[column.key] = this.radioValues[inputId]
}else if (column.type === FormTypes.sel_search) {
value[column.key] = this.searchSelectValues[inputId]
}else if (column.type === FormTypes.list_multi) {
if(!this.multiSelectValues[inputId] || this.multiSelectValues[inputId].length==0){
value[column.key] = ''
}else{
value[column.key] = this.multiSelectValues[inputId].join(",")
}
}
// 检查表单验证
if (validate === true) {
let results = this.validateOneInput(value[column.key], value, column, notPassedIds, false)
let results = this.validateOneInput(value[column.key], value, column, notPassedIds, false, 'getValues')
tooltips[inputId] = results[0]
if (tooltips[inputId].visible) {
if (tooltips[inputId].passed === false) {
error++
// if (error++ === 0) {
// let element = document.getElementById(inputId)
@ -946,8 +1266,10 @@
}
this.tooltips = tooltips
this.notPassedIds = notPassedIds
if (validate === true) {
this.tooltips = tooltips
this.notPassedIds = notPassedIds
}
return { error, values }
},
@ -994,6 +1316,19 @@
_getValueForSlot(rowId) {
return this.getValuesSync({ rowIds: [rowId] }).values[0]
},
_getAllValuesForSlot() {
return cloneObject({
inputValues: this.inputValues,
selectValues: this.selectValues,
checkboxValues: this.checkboxValues,
jdateValues: this.jdateValues,
uploadValues: this.uploadValues,
popupValues: this.popupValues,
radioValues: this.radioValues,
multiSelectValues: this.multiSelectValues,
searchSelectValues: this.searchSelectValues,
})
},
/** 设置某行某列的值 */
setValues(values) {
@ -1052,42 +1387,78 @@
// },
/** 验证单个表单 */
validateOneInput(value, row, column, notPassedIds, update = false) {
validateOneInput(value, row, column, notPassedIds, update = false, validType = 'input') {
let tooltips = Object.assign({}, this.tooltips)
// let notPassedIds = cloneObject(this.notPassedIds)
let inputId = column.key + row.id
let [passed, message] = this.validateValue(column.validateRules, value)
tooltips[inputId] = tooltips[inputId] ? tooltips[inputId] : {}
tooltips[inputId].visible = !passed
let index = notPassedIds.indexOf(inputId)
let borderColor = null, boxShadow = null
if (!passed) {
tooltips[inputId].title = this.replaceProps(column, message)
borderColor = 'red'
boxShadow = `0 0 0 2px rgba(255, 0, 0, 0.2)`
if (index === -1) notPassedIds.push(inputId)
} else {
if (index !== -1) notPassedIds.splice(index, 1)
let [passed, message] = this.validateValue(column.validateRules, value)
const nextThen = res => {
let [passed, message] = res
if (passed == null) {
// debugger
}
if (passed == null && tooltips[inputId].visible != null) {
return
}
passed = passed == null ? true : passed
tooltips[inputId].visible = !passed
tooltips[inputId].passed = passed
let index = notPassedIds.indexOf(inputId)
let borderColor = null, boxShadow = null
if (!passed) {
tooltips[inputId].title = this.replaceProps(column, message)
borderColor = 'red'
boxShadow = `0 0 0 2px rgba(255, 0, 0, 0.2)`
if (index === -1) notPassedIds.push(inputId)
} else {
if (index !== -1) notPassedIds.splice(index, 1)
}
let element = document.getElementById(inputId)
if (element != null) {
// select 在 .ant-select-selection 上设置 border-color
if (column.type === FormTypes.select) {
element = element.getElementsByClassName('ant-select-selection')[0]
}
// jdate 在 input 上设置 border-color
if (column.type === FormTypes.date || column.type === FormTypes.datetime) {
element = element.getElementsByTagName('input')[0]
}
element.style.borderColor = borderColor
element.style.boxShadow = boxShadow
}
// 是否更新到data
if (update) {
this.tooltips = tooltips
this.notPassedIds = notPassedIds
}
}
let element = document.getElementById(inputId)
if (element != null) {
// select 在 .ant-select-selection 上设置 border-color
if (column.type === FormTypes.select) {
element = element.getElementsByClassName('ant-select-selection')[0]
}
// jdate 在 input 上设置 border-color
if (column.type === FormTypes.date || column.type === FormTypes.datetime) {
element = element.getElementsByTagName('input')[0]
}
element.style.borderColor = borderColor
element.style.boxShadow = boxShadow
}
// 是否更新到data
if (update) {
this.tooltips = tooltips
this.notPassedIds = notPassedIds
if (typeof passed === 'function') {
let executed = false
passed(validType, value, row, column, (flag, msg) => {
if (executed) return
executed = true
if (typeof msg === 'string') {
message = msg
}
if (flag == null) {
nextThen([null, message])
}else if (typeof flag === 'boolean' && flag) {
nextThen([true, message])
} else {
nextThen([false, message])
}
}, this)
} else {
nextThen([passed, message])
}
return [tooltips[inputId], notPassedIds]
},
/** 通过规则验证值是否正确 */
@ -1130,6 +1501,8 @@
}
}
if (!flag) passed = new RegExp(rule.pattern).test(value)
} else if (typeof rule.handler === 'function') {
return [rule.handler, rule.message]
}
// 如果没有通过验证，则跳出循环。如果通过了验证，则继续验证下一条规则
if (!passed) {
@ -1221,7 +1594,10 @@
handleConfirmDelete() {
this.removeSelectedRows()
},
handleClickClearSelect() {
handleClickClearSelection() {
this.clearSelection()
},
clearSelection() {
this.selectedRowIds = []
},
/** select 搜索时的事件，用于动态添加options */
@ -1267,20 +1643,14 @@
/** 拖动结束，交换inputValue中的值 */
handleDragMoveEnd(event) {
let { oldIndex, newIndex } = event
let { oldIndex, newIndex, item: { dataset: { idx: dataIdx } } } = event
let values = this.inputValues
// 存储旧数据，并删除旧项目
let temp = values[oldIndex]
values.splice(oldIndex, 1)
// 向新项目里添加旧数据
values.splice(newIndex, 0, temp)
// 由于动态显示隐藏行导致index有误差，需要算出真实的index
let diff = Number.parseInt(dataIdx) - oldIndex
oldIndex += diff
newIndex += diff
values.forEach((item, index) => {
item[this.dragSortKey] = (index + 1)
})
this.forceUpdateFormValues()
this.rowResort(oldIndex, newIndex)
// 触发已拖动事件
this.$emit('dragged', {
@ -1290,13 +1660,32 @@
})
},
/** 行重新排序 */
rowResort(oldIndex, newIndex) {
const sort = (array) => {
// 存储旧数据，并删除旧项目
let temp = array[oldIndex]
array.splice(oldIndex, 1)
// 向新项目里添加旧数据
array.splice(newIndex, 0, temp)
}
sort(this.rows)
sort(this.inputValues)
// 重置排序字段
this.inputValues.forEach((val, idx) => val[this.dragSortKey] = (idx + 1))
this.forceUpdateFormValues()
},
/* --- common function begin --- */
/** 鼠标移入 */
handleMouseoverCommono(row, column) {
let inputId = column.key + row.id
if (this.notPassedIds.indexOf(inputId) !== -1) {
this.showOrHideTooltip(inputId, true)
this.showOrHideTooltip(inputId, true, true)
}
},
/** 鼠标移出 */
@ -1325,13 +1714,18 @@
// 存储输入的值
this.inputValues[index][column.key] = value
// 做单个表单验证
this.validateOneInput(value, row, column, this.notPassedIds, true)
this.validateOneInput(value, row, column, this.notPassedIds, true, 'input')
// 触发valueChange 事件
if (change) {
this.elemValueChange(type, row, column, value)
}
},
handleBlurCommono(target, index, row, column) {
let { value } = target
// 做单个表单验证
this.validateOneInput(value, row, column, this.notPassedIds, true, 'blur')
},
handleChangeCheckboxCommon(event, row, column) {
let { id, checked } = event.target
this.checkboxValues = this.bindValuesChange(checked, id, 'checkboxValues')
@ -1342,14 +1736,14 @@
handleChangeSelectCommon(value, id, row, column) {
this.selectValues = this.bindValuesChange(value, id, 'selectValues')
// 做单个表单验证
this.validateOneInput(value, row, column, this.notPassedIds, true)
this.validateOneInput(value, row, column, this.notPassedIds, true, 'change')
// 触发valueChange 事件
this.elemValueChange(FormTypes.select, row, column, value)
},
handleChangeJDateCommon(value, id, row, column, showTime) {
this.jdateValues = this.bindValuesChange(value, id, 'jdateValues')
this.validateOneInput(value, row, column, this.notPassedIds, true)
this.validateOneInput(value, row, column, this.notPassedIds, true, 'change')
// 触发valueChange 事件
if (showTime) {
@ -1370,6 +1764,9 @@
if (column.responseName && file.response) {
value['responseName'] = file.response[column.responseName]
}
if(file.status =='done'){
value['path'] = file.response[column.responseName]
}
this.uploadValues = this.bindValuesChange(value, id, 'uploadValues')
},
/** 记录用到数据绑定的组件的值 */
@ -1380,11 +1777,16 @@
},
/** 显示或隐藏tooltip */
showOrHideTooltip(inputId, show) {
let tooltips = Object.assign({}, this.tooltips)
tooltips[inputId] = tooltips[inputId] ? tooltips[inputId] : {}
tooltips[inputId].visible = show
this.tooltips = tooltips
showOrHideTooltip(inputId, show, force = false) {
if (!this.tooltips[inputId] && !force) {
return
}
let tooltip = this.tooltips[inputId] || {}
if (tooltip.visible !== show) {
tooltip.visible = show
this.$set(this.tooltips, inputId, tooltip)
}
},
/** value 触发valueChange事件 */
@ -1502,12 +1904,14 @@
},
/** view辅助方法：构建 td style */
buildTdStyle(col) {
const isEmptyWidth = (column) => (column.type === FormTypes.hidden || column.width === '0px' || column.width === '0' || column.width === 0)
let style = {}
// 计算宽度
if (col.width) {
style['width'] = col.width
} else if (this.columns) {
style['width'] = `${(100 - 4 * 2) / this.columns.length}%`
style['width'] = `${(100 - 4 * 2) / (this.columns.filter(column => !isEmptyWidth(column))).length}%`
} else {
style['width'] = '120px'
}
@ -1519,6 +1923,10 @@
style['padding-left'] = '0'
style['padding-right'] = '0'
}
if (isEmptyWidth(col)) {
style['padding-left'] = '0'
style['padding-right'] = '0'
}
return style
},
/** view辅助方法：构造props */
@ -1538,7 +1946,7 @@
}
// 判断是否是禁用的列
props['disabled'] = !!col['disabled']
props['disabled'] = (typeof col['disabled'] === 'boolean' ? col['disabled'] : props['disabled'])
// 判断是否为禁用的行
if (props['disabled'] !== true) {
@ -1559,7 +1967,70 @@
headers['X-Access-Token'] = this.accessToken
}
return headers
}
},
/** 上传请求地址 */
getUploadAction(value){
if(!value){
return window._CONFIG['domianURL']+"/sys/common/upload"
}else{
return value
}
},
/** 预览图片地址 */
getCellImageView(id){
let currUploadObj = this.uploadValues[id] || null
if(currUploadObj && currUploadObj['path']){
return window._CONFIG['domianURL']+"/sys/common/view/"+currUploadObj['path']
}else{
return ''
}
},
/** popup回调 */
popupCallback(value,others,id,row,column,index){
// 存储输入的值
this.popupValues[id]=value
if(others){
Object.keys(others).map((key)=>{
this.inputValues[index][key] = others[key]
})
}
// 做单个表单验证
this.validateOneInput(value, row, column, this.notPassedIds, true, 'change')
// 触发valueChange 事件
this.elemValueChange("input", row, column, value)
// 更新form表单的值
this.$nextTick(() => {
this.forceUpdateFormValues()
})
},
/** popup输入框回显 */
getPopupValue(id){
return this.popupValues[id]
},
handleRadioChange(value, id, row, column) {
this.radioValues = this.bindValuesChange(value, id, 'radioValues')
// 做单个表单验证
this.validateOneInput(value, row, column, this.notPassedIds, true, 'change')
// 触发valueChange 事件
this.elemValueChange(FormTypes.radio, row, column, value)
},
handleMultiSelectChange(value, id, row, column) {
this.multiSelectValues = this.bindValuesChange(value, id, 'multiSelectValues')
// 做单个表单验证
this.validateOneInput(value, row, column, this.notPassedIds, true, 'change')
// 触发valueChange 事件
this.elemValueChange(FormTypes.list_multi, row, column, value)
},
handleSearchSelectChange(value, id, row, column) {
console.log(value)
this.searchSelectValues = this.bindValuesChange(value, id, 'searchSelectValues')
this.validateOneInput(value, row, column, this.notPassedIds, true, 'change')
this.elemValueChange(FormTypes.sel_search, row, column, value)
},
filterOption(input, option) {
return option.componentOptions.children[0].text.toLowerCase().indexOf(input.toLowerCase()) >= 0
},
}
}

3
ant-design-vue-jeecg/src/components/jeecg/JEditor.vue
View File

@ -87,12 +87,9 @@
this.myValue = (newValue == null ? '' : newValue)
},
myValue(newValue) {
console.log(newValue)
if(this.triggerChange){
console.log(1)
this.$emit('change', newValue)
}else{
console.log(2)
this.$emit('input', newValue)
}
}

9
ant-design-vue-jeecg/src/components/jeecg/JFormContainer.vue
View File

@ -1,12 +1,13 @@
<template>
<div v-if="disabled" class="jeecg-form-container-disabled">
<div :class="disabled?'jeecg-form-container-disabled':''">
<fieldset disabled>
<slot name="detail"></slot>
</fieldset>
<slot name="edit"></slot>
<fieldset disabled>
<slot></slot>
</fieldset>
</div>
<div v-else>
<slot></slot>
</div>
</template>
<script>

70
ant-design-vue-jeecg/src/components/jeecg/JGraphicCode.vue
View File

@ -5,6 +5,8 @@
</template>
<script>
import { getAction } from '@/api/manage'
export default {
name: 'JGraphicCode',
props: {
@ -59,6 +61,11 @@
contentHeight: {
type: Number,
default: 38
},
remote:{
type:Boolean,
default:false,
required:false
}
},
methods: {
@ -74,20 +81,21 @@
return 'rgb(' + r + ',' + g + ',' + b + ')'
},
drawPic () {
this.randomCode()
let canvas = document.getElementById('gc-canvas')
let ctx = canvas.getContext('2d')
ctx.textBaseline = 'bottom'
// 绘制背景
ctx.fillStyle = this.randomColor(this.backgroundColorMin, this.backgroundColorMax)
ctx.fillRect(0, 0, this.contentWidth, this.contentHeight)
// 绘制文字
for (let i = 0; i < this.code.length; i++) {
this.drawText(ctx, this.code[i], i)
}
this.drawLine(ctx)
this.drawDot(ctx)
this.$emit("success",this.code)
this.randomCode().then(()=>{
let canvas = document.getElementById('gc-canvas')
let ctx = canvas.getContext('2d')
ctx.textBaseline = 'bottom'
// 绘制背景
ctx.fillStyle = this.randomColor(this.backgroundColorMin, this.backgroundColorMax)
ctx.fillRect(0, 0, this.contentWidth, this.contentHeight)
// 绘制文字
for (let i = 0; i < this.code.length; i++) {
this.drawText(ctx, this.code[i], i)
}
this.drawLine(ctx)
this.drawDot(ctx)
this.$emit("success",this.code)
})
},
drawText (ctx, txt, i) {
ctx.fillStyle = this.randomColor(this.colorMin, this.colorMax)
@ -136,6 +144,31 @@
this.drawPic()
},
randomCode(){
return new Promise((resolve)=>{
if(this.remote==true){
getAction("/sys/getCheckCode").then(res=>{
console.log("aaaaa",res)
if(res.success){
this.checkKey = res.result.key
this.code = res.result.code
resolve();
}else{
this.$message.error("生成验证码错误,请联系系统管理员")
this.code = 'BUG'
resolve();
}
}).catch(()=>{
console.log("生成验证码连接服务器异常")
this.code = 'BUG'
resolve();
})
}else{
this.randomLocalCode();
resolve();
}
})
},
randomLocalCode(){
let random = ''
//去掉了I l i o O
let str = "QWERTYUPLKJHGFDSAZXCVBNMqwertyupkjhgfdsazxcvbnm1234567890"
@ -144,6 +177,12 @@
random += str[index];
}
this.code = random
},
getLoginParam(){
return {
checkCode:this.code,
checkKey:this.checkKey
}
}
},
mounted () {
@ -151,7 +190,8 @@
},
data(){
return {
code:""
code:"",
checkKey:""
}
}

95
ant-design-vue-jeecg/src/components/jeecg/JInput.vue Normal file
View File

@ -0,0 +1,95 @@
<template>
<a-input :placeholder="placeholder" :value="inputVal" @input="backValue"></a-input>
</template>
<script>
const JINPUT_QUERY_LIKE = 'like';
const JINPUT_QUERY_NE = 'ne';
const JINPUT_QUERY_GE = 'ge'; //大于等于
const JINPUT_QUERY_LE = 'le'; //小于等于
export default {
name: 'JInput',
props:{
value:{
type:String,
required:false
},
type:{
type:String,
required:false,
default:JINPUT_QUERY_LIKE
},
placeholder:{
type:String,
required:false,
default:''
}
},
watch:{
value:{
immediate:true,
handler:function(){
this.initVal();
}
}
},
model: {
prop: 'value',
event: 'change'
},
data(){
return {
inputVal:''
}
},
methods:{
initVal(){
if(!this.value){
this.inputVal = ''
}else{
let text = this.value
switch (this.type) {
case JINPUT_QUERY_LIKE:
text = text.substring(1,text.length-1);
break;
case JINPUT_QUERY_NE:
text = text.substring(1);
break;
case JINPUT_QUERY_GE:
text = text.substring(2);
break;
case JINPUT_QUERY_LE:
text = text.substring(2);
break;
default:
}
this.inputVal = text
}
},
backValue(e){
let text = e.target.value
switch (this.type) {
case JINPUT_QUERY_LIKE:
text = "*"+text+"*";
break;
case JINPUT_QUERY_NE:
text = "!"+text;
break;
case JINPUT_QUERY_GE:
text = ">="+text;
break;
case JINPUT_QUERY_LE:
text = "<="+text;
break;
default:
}
this.$emit("change",text)
}
}
}
</script>
<style scoped>
</style>

9
ant-design-vue-jeecg/src/components/jeecg/JSlider.vue
View File

@ -59,8 +59,13 @@
this.mouseMoveStata = false;
var width = e.clientX - this.beginClientX;
if(width<this.maxwidth){
document.getElementsByClassName('handler')[0].style.left = 0 + 'px';
document.getElementsByClassName('drag_bg')[0].style.width = 0 + 'px';
// ---- update-begin- author:sunjianlei --- date:20191009 --- for: 修复获取不到 handler 的时候报错 ----
let handler = document.getElementsByClassName('handler')[0]
if (handler) {
handler.style.left = 0 + 'px'
document.getElementsByClassName('drag_bg')[0].style.width = 0 + 'px'
}
// ---- update-end- author:sunjianlei --- date:20191009 --- for: 修复获取不到 handler 的时候报错 ----
}
} //mouseup事件
},

370
ant-design-vue-jeecg/src/components/jeecg/JSuperQuery.vue
View File

@ -1,152 +1,342 @@
<template>
<a-modal
title="高级查询构造器"
:width="800"
:width="1000"
:visible="visible"
:confirmLoading="confirmLoading"
@cancel="handleCancel"
:mask="false"
wrapClassName="ant-modal-cust-warp"
class="j-super-query-modal"
style="top:5%;max-height: 95%;">
<template slot="footer">
<a-button @click="handleCancel">关 闭</a-button>
<a-button @click="handleReset" style="float: left">重 置</a-button>
<a-button type="primary" @click="handleOk">查 询</a-button>
<div style="float: left">
<a-button :loading="loading" @click="handleReset">重置</a-button>
<a-button :loading="loading" @click="handleSave">保存查询条件</a-button>
</div>
<a-button :loading="loading" @click="handleCancel">关闭</a-button>
<a-button :loading="loading" type="primary" @click="handleOk">查询</a-button>
</template>
<a-spin :spinning="confirmLoading">
<a-form>
<div>
<a-row type="flex" style="margin-bottom:10px" :gutter="16" v-for="(item, index) in queryParamsModel" :key="index">
<a-spin :spinning="loading">
<a-row>
<a-col :sm="24" :md="24-5">
<a-col :span="6">
<a-select placeholder="选择查询字段" v-model="item.field" @select="(val,option)=>handleSelected(option,item)">
<a-select-option v-for="(f,fIndex) in fieldList" :key=" 'field'+fIndex" :value="f.value" :data-type="f.type">{{ f.text }}</a-select-option>
<a-empty v-if="queryParamsModel.length === 0">
<div slot="description">
<span>没有任何查询条件</span>
<a-divider type="vertical"/>
<a @click="handleAdd">点击新增</a>
</div>
</a-empty>
<a-form v-else layout="inline">
<a-form-item label="过滤条件匹配" style="margin-bottom: 12px;">
<a-select v-model="selectValue">
<a-select-option value="and">AND（所有条件都要求匹配）</a-select-option>
<a-select-option value="or">OR（条件中的任意一个匹配）</a-select-option>
</a-select>
</a-col>
</a-form-item>
<a-col :span="6">
<a-select placeholder="选择匹配规则" v-model="item.rule">
<a-select-option value="eq">等于</a-select-option>
<a-select-option value="ne">不等于</a-select-option>
<a-select-option value="gt">大于</a-select-option>
<a-select-option value="ge">大于等于</a-select-option>
<a-select-option value="lt">小于</a-select-option>
<a-select-option value="le">小于等于</a-select-option>
<a-select-option value="right_like">以..开始</a-select-option>
<a-select-option value="left_like">以..结尾</a-select-option>
<a-select-option value="like">包含</a-select-option>
<a-select-option value="in">在...中</a-select-option>
</a-select>
</a-col>
<a-row type="flex" style="margin-bottom:10px" :gutter="16" v-for="(item, index) in queryParamsModel" :key="index">
<a-col :span="6">
<j-date v-if=" item.type=='date' " v-model="item.val" placeholder="请选择日期"></j-date>
<j-date v-else-if=" item.type=='datetime' " v-model="item.val" placeholder="请选择时间" :show-time="true" date-format="YYYY-MM-DD HH:mm:ss"></j-date>
<a-input-number v-else-if=" item.type=='int'||item.type=='number' " style="width: 100%" placeholder="请输入数值" v-model="item.val"/>
<a-input v-else v-model="item.val" placeholder="请输入值" />
</a-col>
<a-col :span="8">
<a-select placeholder="选择查询字段" v-model="item.field" @select="(val,option)=>handleSelected(option,item)">
<a-select-option v-for="(f,fIndex) in fieldList" :key=" 'field'+fIndex" :value="f.value" :data-type="f.type">{{ f.text }}</a-select-option>
</a-select>
</a-col>
<a-col :span="4">
<a-select placeholder="匹配规则" v-model="item.rule">
<a-select-option value="eq">等于</a-select-option>
<a-select-option value="ne">不等于</a-select-option>
<a-select-option value="gt">大于</a-select-option>
<a-select-option value="ge">大于等于</a-select-option>
<a-select-option value="lt">小于</a-select-option>
<a-select-option value="le">小于等于</a-select-option>
<a-select-option value="right_like">以..开始</a-select-option>
<a-select-option value="left_like">以..结尾</a-select-option>
<a-select-option value="like">包含</a-select-option>
<a-select-option value="in">在...中</a-select-option>
</a-select>
</a-col>
<a-col :span="8">
<j-date v-if=" item.type=='date' " v-model="item.val" placeholder="请选择日期"></j-date>
<j-date v-else-if=" item.type=='datetime' " v-model="item.val" placeholder="请选择时间" :show-time="true" date-format="YYYY-MM-DD HH:mm:ss"></j-date>
<a-input-number v-else-if=" item.type=='int'||item.type=='number' " style="width: 100%" placeholder="请输入数值" v-model="item.val"/>
<a-input v-else v-model="item.val" placeholder="请输入值"/>
</a-col>
<a-col :span="4">
<a-button @click="handleAdd" icon="plus"></a-button>&nbsp;
<a-button @click="handleDel( index )" icon="minus"></a-button>
</a-col>
</a-row>
</a-form>
</a-col>
<a-col :sm="24" :md="5">
<!-- 查询记录 -->
<a-card class="j-super-query-history-card" :bordered="true">
<div slot="title">
保存的查询
</div>
<a-tree
class="j-super-query-history-tree"
showIcon
:treeData="treeData"
@select="handleTreeSelect"
@rightClick="handleTreeRightClick"
>
</a-tree>
</a-card>
</a-col>
</a-row>
<a-col :span="6">
<a-button @click="handleAdd" icon="plus"></a-button>&nbsp;
<a-button @click="handleDel( index )" icon="minus"></a-button>
</a-col>
</a-row>
</div>
</a-form>
</a-spin>
<a-modal title="请输入保存的名称" :visible="prompt.visible" @cancel="prompt.visible=false" @ok="handlePromptOk">
<a-input v-model="prompt.value"></a-input>
</a-modal>
</a-modal>
</template>
<script>
import ACol from 'ant-design-vue/es/grid/Col'
import JDate from '@/components/jeecg/JDate.vue';
import * as utils from '@/utils/util'
import JDate from '@/components/jeecg/JDate.vue'
export default {
name: 'JSuperQuery',
components: {
ACol,
JDate
},
data(){
return {
visible:false,
confirmLoading:false,
queryParamsModel:[{}]
}
},
props:{
components: { JDate },
props: {
/* fieldList:[{value:'',text:'',type:''}]
* type:date datetime int number string
* */
fieldList:{
type:Array,
required:true
fieldList: {
type: Array,
required: true
},
/*
* 这个回调函数接收一个数组参数 即查询条件
* */
callback:{
type:String,
required:false,
default:'handleSuperQuery'
callback: {
type: String,
required: false,
default: 'handleSuperQuery'
},
// 当前是否在加载中
loading: {
type: Boolean,
default: false
},
// 保存查询条件的唯一 code，通过该 code 区分
saveCode: {
type: String,
default: 'testSaveCode'
}
},
data() {
return {
prompt: {
visible: false,
value: ''
},
visible: false,
queryParamsModel: [{}],
treeIcon: <a-icon type="file-text"/>,
treeData: [],
// 保存查询条件的前缀名
saveCodeBefore: 'JSuperQuerySaved_',
selectValue: 'and',
}
},
methods:{
show(){
if(!this.queryParamsModel ||this.queryParamsModel.length==0){
watch: {
// 当 saveCode 变化时，重新查询已保存的条件
saveCode: {
immediate: true,
handler(val) {
let list = this.$ls.get(this.saveCodeBefore + val)
if (list instanceof Array) {
this.treeData = list.map(item => {
item.icon = this.treeIcon
return item
})
}
console.log({ list })
}
}
},
methods: {
show() {
if (!this.queryParamsModel || this.queryParamsModel.length == 0) {
this.queryParamsModel = [{}]
}
this.visible = true;
this.visible = true
},
handleOk(){
console.log("---高级查询参数--->",this.queryParamsModel)
if(!this.isNullArray()){
this.$emit(this.callback, this.queryParamsModel)
}else{
handleOk() {
console.log('---高级查询参数--->', this.queryParamsModel)
if (!this.isNullArray(this.queryParamsModel)) {
let event = {
matchType: this.selectValue,
params: this.removeEmptyObject(utils.cloneObject(this.queryParamsModel))
}
this.$emit(this.callback, event.params, event.matchType)
} else {
this.$emit(this.callback)
}
},
handleCancel(){
handleCancel() {
this.close()
},
close () {
this.$emit('close');
this.visible = false;
close() {
this.$emit('close')
this.visible = false
},
handleAdd () {
this.queryParamsModel.push({});
handleAdd() {
this.queryParamsModel.push({})
},
handleDel (index) {
this.queryParamsModel.splice(index,1);
this.$message.warning("请关闭后重新打开")
handleDel(index) {
this.queryParamsModel.splice(index, 1)
},
handleSelected(option,item){
handleSelected(option, item) {
item['type'] = option.data.attrs['data-type']
},
handleReset(){
this.queryParamsModel=[{}]
handleReset() {
this.queryParamsModel = [{}]
this.$emit(this.callback)
},
isNullArray(){
handleSave() {
let queryParams = this.removeEmptyObject(utils.cloneObject(this.queryParamsModel))
if (this.isNullArray(queryParams)) {
this.$message.warning('空条件不能保存')
} else {
this.prompt.value = ''
this.prompt.visible = true
}
},
handlePromptOk() {
let { value } = this.prompt
// 判断有没有重名
let filterList = this.treeData.filter(i => i.title === value)
if (filterList.length > 0) {
this.$confirm({
content: `${value} 已存在，是否覆盖？`,
onOk: () => {
this.prompt.visible = false
filterList[0].records = this.removeEmptyObject(utils.cloneObject(this.queryParamsModel))
this.saveToLocalStore()
this.$message.success('保存成功')
}
})
} else {
this.prompt.visible = false
this.treeData.push({
title: value,
icon: this.treeIcon,
records: this.removeEmptyObject(utils.cloneObject(this.queryParamsModel))
})
this.saveToLocalStore()
this.$message.success('保存成功')
}
},
handleTreeSelect(idx, event) {
if (event.selectedNodes[0]) {
this.queryParamsModel = utils.cloneObject(event.selectedNodes[0].data.props.records)
}
},
handleTreeRightClick(args) {
this.$confirm({
content: '是否删除当前查询？',
onOk: () => {
let { node: { eventKey } } = args
this.treeData.splice(Number.parseInt(eventKey.substring(2)), 1)
this.saveToLocalStore()
this.$message.success('删除成功')
},
})
},
// 将查询保存到 LocalStore 里
saveToLocalStore() {
this.$ls.set(this.saveCodeBefore + this.saveCode, this.treeData.map(item => {
return { title: item.title, records: item.records }
}))
},
isNullArray(array) {
//判断是不是空数组对象
if(!this.queryParamsModel || this.queryParamsModel.length==0){
if (!array || array.length === 0) {
return true
}
if(this.queryParamsModel.length==1){
let obj = this.queryParamsModel[0]
if(!obj.field || !obj.val || !obj.rule){
if (array.length === 1) {
let obj = array[0]
if (!obj.field || !obj.val || !obj.rule) {
return true
}
}
return false;
return false
},
// 去掉数组中的空对象
removeEmptyObject(array) {
for (let i = 0; i < array.length; i++) {
let item = array[i]
if (item == null || Object.keys(item).length <= 0) {
array.splice(i--, 1)
}
}
return array
}
}
}
</script>
<style >
<style lang="scss" scoped>
.j-super-query-modal {
/deep/ {
}
.j-super-query-history-card /deep/ {
.ant-card-body,
.ant-card-head-title {
padding: 0;
}
.ant-card-head {
padding: 4px 8px;
min-height: initial;
}
}
.j-super-query-history-tree /deep/ {
.ant-tree-switcher {
display: none;
}
.ant-tree-node-content-wrapper {
width: 100%;
}
}
}
</style>

79
ant-design-vue-jeecg/src/components/jeecg/JTreeSelect.vue
View File

@ -9,6 +9,7 @@
:loadData="asyncLoadTreeData"
:value="treeValue"
:treeData="treeData"
:multiple="multiple"
@change="onChange"
@search="onSearch">
</a-tree-select>
@ -45,7 +46,7 @@
},
pidValue:{
type: String,
default: '0',
default: '',
required: false
},
disabled:{
@ -57,6 +58,21 @@
type: String,
default: '',
required: false
},
condition:{
type:String,
default:'',
required:false
},
// 是否支持多选
multiple: {
type: Boolean,
default: false,
},
loadTriggleChange:{
type: Boolean,
default: false,
required:false
}
},
data () {
@ -81,9 +97,11 @@
}
},
created(){
this.initDictInfo()
this.loadRoot()
this.loadItemByCode()
this.validateProp().then(()=>{
this.initDictInfo()
this.loadRoot()
this.loadItemByCode()
})
},
methods: {
loadItemByCode(){
@ -92,15 +110,23 @@
}else{
getAction(`${this.view}${this.dict}`,{key:this.value}).then(res=>{
if(res.success){
this.treeValue = {
key:this.value,
value:this.value,
label:res.result
}
let values = this.value.split(',')
this.treeValue = res.result.map((item, index) => ({
key: values[index],
value: values[index],
label: item
}))
this.onLoadTriggleChange(res.result[0]);
}
})
}
},
onLoadTriggleChange(text){
//只有单选才会触发
if(!this.multiple && this.loadTriggleChange){
this.$emit('change', this.value,text)
}
},
initDictInfo(){
let arr = this.dict.split(",")
this.tableName = arr[0]
@ -120,7 +146,8 @@
text:this.text,
code:this.code,
pidField:this.pidField,
hasChildField:this.hasChildField
hasChildField:this.hasChildField,
condition:this.condition
}
getAction(this.url,param).then(res=>{
if(res.success){
@ -162,7 +189,8 @@
text:this.text,
code:this.code,
pidField:this.pidField,
hasChildField:this.hasChildField
hasChildField:this.hasChildField,
condition:this.condition
}
getAction(this.url,param).then(res=>{
if(res.success && res.result){
@ -184,8 +212,11 @@
if(!value){
this.$emit('change', '');
this.treeValue = ''
}else{
this.$emit('change', value.value);
} else if (value instanceof Array) {
this.$emit('change', value.map(item => item.value).join(','))
this.treeValue = value
} else {
this.$emit('change', value.value,value.label)
this.treeValue = value
}
@ -195,6 +226,28 @@
},
getCurrTreeData(){
return this.treeData
},
validateProp(){
let mycondition = this.condition
return new Promise((resolve,reject)=>{
if(!mycondition){
resolve();
}else{
try {
let test=JSON.parse(mycondition);
console.log("aaaaasdsdd",typeof test)
if(typeof test == 'object' && test){
resolve()
}else{
this.$message.error("组件JTreeSelect-condition传值有误，需要一个json字符串!")
reject()
}
} catch(e) {
this.$message.error("组件JTreeSelect-condition传值有误，需要一个json字符串!")
reject()
}
}
})
}
},
//2.2新增 在组件内定义 指定父组件调用时候的传值属性和事件类型 这个牛逼

62
ant-design-vue-jeecg/src/components/jeecg/JTreeTable.vue
View File

@ -3,8 +3,11 @@
:rowKey="rowKey"
:columns="columns"
:dataSource="dataSource"
v-bind="tableProps"
@expand="handleExpand">
:expandedRowKeys="expandedRowKeys"
v-bind="tableAttrs"
v-on="$listeners"
@expand="handleExpand"
@expandedRowsChange="expandedRowKeys=$event">
<template v-for="(slotItem) of slots" :slot="slotItem" slot-scope="text, record, index">
<slot :name="slotItem" v-bind="{text,record,index}"></slot>
@ -30,8 +33,7 @@
},
queryParams: {
type: Object,
default: () => {
}
default: () => ({})
},
// 查询顶级时的值，如果顶级为0，则传0
topValue: {
@ -52,13 +54,23 @@
},
tableProps: {
type: Object,
default: () => {
}
default: () => ({})
},
/** 是否在创建组件的时候就查询数据 */
immediateRequest: {
type: Boolean,
default: true
},
condition:{
type:String,
default:'',
required:false
}
},
data() {
return {
dataSource: []
dataSource: [],
expandedRowKeys: []
}
},
computed: {
@ -77,6 +89,9 @@
}
}
return slots
},
tableAttrs() {
return Object.assign(this.$attrs, this.tableProps)
}
},
watch: {
@ -88,20 +103,44 @@
}
},
created() {
this.loadData()
if (this.immediateRequest) this.loadData()
},
methods: {
/** 加载数据*/
loadData(id = this.topValue, first = true, url = this.url) {
this.$emit('requestBefore', { first })
if (first) {
this.expandedRowKeys = []
}
let params = Object.assign({}, this.queryParams || {})
params[this.queryKey] = id
if(this.condition && this.condition.length>0){
params['condition'] = this.condition
}
return getAction(url, params).then(res => {
let dataSource = res.result.map(item => {
let list = []
if (res.result instanceof Array) {
list = res.result
} else if (res.result.records instanceof Array) {
list = res.result.records
} else {
throw '返回数据类型不识别'
}
let dataSource = list.map(item => {
// 判断是否标记了带有子级
if (item.hasChildren === true) {
// 查找第一个带有dataIndex的值的列
let firstColumn
for (let column of this.columns) {
firstColumn = column.dataIndex
if (firstColumn) break
}
// 定义默认展开时显示的loading子级，实际子级数据只在展开时加载
let loadChild = { id: `${item.id}_loadChild`, name: 'loading...', isLoading: true }
let loadChild = { id: `${item.id}_loadChild`, [firstColumn]: 'loading...', isLoading: true }
item.children = [loadChild]
}
return item
@ -109,8 +148,9 @@
if (first) {
this.dataSource = dataSource
}
this.$emit('requestSuccess', { first, dataSource, res })
return Promise.resolve(dataSource)
})
}).finally(() => this.$emit('requestFinally', { first }))
},
/** 点击展开图标时触发 */

10
ant-design-vue-jeecg/src/components/jeecg/JUpload.vue
View File

@ -7,7 +7,8 @@
:data="{'isup':1,'bizPath':bizPath}"
:fileList="fileList"
:beforeUpload="beforeUpload"
@change="handleChange">
@change="handleChange"
:disabled="disabled">
<a-button>
<a-icon type="upload" />{{ text }}
</a-button>
@ -63,6 +64,13 @@
type:String,
required:false
},
// update-begin- --- author:wangshuai ------ date:20190929 ---- for:Jupload组件增加是否能够点击
disabled:{
type:Boolean,
required:false,
default: false
},
// update-end- --- author:wangshuai ------ date:20190929 ---- for:Jupload组件增加是否能够点击
//此属性被废弃了
triggerChange:{
type: Boolean,

1
ant-design-vue-jeecg/src/components/jeecg/README.md
View File

@ -477,6 +477,7 @@ online用 实际开发请使用components/dict/JMultiSelectTag
| dict |string | ✔| 表名,显示字段名,存储字段名拼接的字符串 |
| pidField |string | ✔| 父ID的字段名 |
| pidValue |string | | 根节点父ID的值 默认'0' 不可以设置为空,如果想使用此组件，而数据库根节点父ID为空，请修改之 |
| multiple |boolean | |是否支持多选 |
使用示例
----

64
ant-design-vue-jeecg/src/components/jeecg/README_JEditableTable.md
View File

@ -73,6 +73,7 @@
- `required` 是否必填，可选值为`true`or`false`
- `pattern` 正则表达式验证，只有成功匹配该正则的值才能成功通过验证
- `handler` 自定义函数校验，使用方法请见[示例五](#示例五)
- `message` 当验证未通过时显示的提示文本，可以使用`${...}`变量替换文本（详见`${...} 变量使用方式`）
- 配置示例请看[示例二](#示例二)
@ -252,6 +253,19 @@ setValues([
}
])
```
### clearSelection
主动清空选择的行
- `参数:` 无
- `返回值:` 无
## 内置插槽
| 插槽名 | 说明 |
|--------------|------------------------------------------------------|
| buttonBefore | 在操作按钮的**前面**插入插槽，不受`actionButton`属性的影响 |
| buttonAfter | 在操作按钮的**后面**插入插槽，不受`actionButton`属性的影响 |
## ${...} 变量使用方式
@ -510,4 +524,54 @@ this.$refs.editableTable.getValues((error, values) => {
}
}
</script>
```
## 示例五
```js
// 该示例是自定义函数校验
columns: [
{
title: '字段名称',
key: 'dbFieldName',
type: FormTypes.input,
defaultValue: '',
validateRules: [
{
// 自定义函数校验 handler
handler(type, value, row, column, callback, target) {
// type 触发校验的类型（input、change、blur）
// value 当前校验的值
// callback(flag, message) 方法必须执行且只能执行一次
// flag = 是否通过了校验，不填写或者填写 null 代表不进行任何操作
// message = 提示的类型，默认使用配置的 message
// target 行编辑的实例对象
if (type === 'blur') {
if (value === 'abc') {
callback(false, '${title}不能是abc') // false = 未通过，可以跟自定义提示
return
}
let { values } = target.getValuesSync({ validate: false })
let count = 0
for (let val of values) {
if (val['dbFieldName'] === value) {
if (++count >= 2) {
callback(false, '${title}不能重复')
return
}
}
}
callback(true) // true = 通过验证
} else {
callback() // 不填写或者填写 null 代表不进行任何操作
}
},
message: '${title}默认提示'
}
]
},
]
```

4
ant-design-vue-jeecg/src/components/jeecg/modal/JCronModal.vue
View File

@ -17,7 +17,7 @@
</a-row>
<a-row>
<a-radio value="2">每隔
<a-input-number size="small" v-model="result.second.incrementIncrement" :min="1" :max="60"></a-input-number>
<a-input-number size="small" v-model="result.second.incrementIncrement" :min="1" :max="59"></a-input-number>
秒执行 从
<a-input-number size="small" v-model="result.second.incrementStart" :min="0" :max="59"></a-input-number>
秒开始
@ -31,7 +31,7 @@
</a-row>
<a-row>
<a-radio value="4">周期从
<a-input-number size="small" v-model="result.second.rangeStart" :min="1" :max="60"></a-input-number>
<a-input-number size="small" v-model="result.second.rangeStart" :min="1" :max="59"></a-input-number>
到
<a-input-number size="small" v-model="result.second.rangeEnd" :min="0" :max="59"></a-input-number>
秒

206
ant-design-vue-jeecg/src/components/jeecgbiz/JSelectBizComponent/JSelectBizComponentModal.vue Normal file
View File

@ -0,0 +1,206 @@
<template>
<a-modal
centered
:title="name + '选择'"
:width="900"
:visible="visible"
@ok="handleOk"
@cancel="close"
cancelText="关闭">
<a-row :gutter="18">
<a-col :span="16">
<!-- 查询区域 -->
<div class="table-page-search-wrapper">
<a-form layout="inline">
<a-row :gutter="24">
<a-col :span="14">
<a-form-item :label="(queryParamText||name)">
<a-input :placeholder="'请输入' + (queryParamText||name)" v-model="queryParam[valueKey]"></a-input>
</a-form-item>
</a-col>
<a-col :span="8">
<span style="float: left;overflow: hidden;" class="table-page-search-submitButtons">
<a-button type="primary" @click="searchQuery" icon="search">查询</a-button>
<a-button type="primary" @click="searchReset" icon="reload" style="margin-left: 8px">重置</a-button>
</span>
</a-col>
</a-row>
</a-form>
</div>
<a-table
size="small"
bordered
rowKey="id"
:columns="columns"
:dataSource="dataSource"
:pagination="ipagination"
:loading="loading"
:scroll="{ y: 240 }"
:rowSelection="{selectedRowKeys, onChange: onSelectChange, type: multiple ? 'checkbox':'radio'}"
:customRow="customRowFn"
@change="handleTableChange">
</a-table>
</a-col>
<a-col :span="8">
<a-card :title="'已选' + name" :bordered="false" :head-style="{padding:0}" :body-style="{padding:0}">
<a-table rowKey="id" size="small" bordered v-bind="selectedTable">
<span slot="action" slot-scope="text, record, index">
<a @click="handleDeleteSelected(record, index)">删除</a>
</span>
</a-table>
</a-card>
</a-col>
</a-row>
</a-modal>
</template>
<script>
import { JeecgListMixin } from '@/mixins/JeecgListMixin'
export default {
name: 'JSelectBizComponentModal',
mixins: [JeecgListMixin],
props: {
value: {
type: Array,
default: () => []
},
visible: {
type: Boolean,
default: false
},
valueKey: {
type: String,
required: true
},
multiple: {
type: Boolean,
default: true
},
name: {
type: String,
default: ''
},
listUrl: {
type: String,
required: true,
default: ''
},
displayKey: {
type: String,
default: null
},
propColumns: {
type: Array,
default: () => []
},
// 查询条件文字
queryParamText: {
type: String,
default: null
},
},
data() {
return {
// 表头
columns: this.propColumns,
// 已选择列表
selectedTable: {
pagination: false,
scroll: { y: 240 },
columns: [
this.propColumns[0],
{ title: '操作', dataIndex: 'action', align: 'center', width: 60, scopedSlots: { customRender: 'action' }, }
],
dataSource: [],
},
url: { list: this.listUrl }
}
},
watch: {
value: {
immediate: true,
handler(val) {
this.valueWatchHandler(val)
}
},
dataSource: {
deep: true,
handler(val) {
let options = val.map(data => ({ label: data[this.displayKey || this.valueKey], value: data[this.valueKey] }))
this.$emit('ok', options)
this.valueWatchHandler(this.value)
}
},
selectionRows: {
immediate: true,
deep: true,
handler(val) {
this.selectedTable.dataSource = val
},
},
},
methods: {
/** 关闭弹窗 */
close() {
this.$emit('update:visible', false)
},
valueWatchHandler(val) {
let dataSource = []
let selectedRowKeys = []
val.forEach(item => {
this.dataSource.forEach(data => {
if (data[this.valueKey] === item) {
dataSource.push(data)
selectedRowKeys.push(data.id)
}
})
})
this.selectedTable.dataSource = dataSource
this.selectedRowKeys = selectedRowKeys
},
/** 完成选择 */
handleOk() {
let value = this.selectedTable.dataSource.map(data => data[this.valueKey])
this.$emit('input', value)
this.close()
},
/** 删除已选择的 */
handleDeleteSelected(record, index) {
this.selectedRowKeys.splice(this.selectedRowKeys.indexOf(record.id), 1)
this.selectedTable.dataSource.splice(index, 1)
},
customRowFn(record) {
if (!this.multiple) {
return {
on: {
click: () => {
this.selectedRowKeys = [record.id]
this.selectedTable.dataSource = [record]
}
}
}
}
return {}
},
}
}
</script>
<style lang="less" scoped>
</style>

26
ant-design-vue-jeecg/src/components/jeecgbiz/JSelectBizComponent/README.md Normal file
View File

@ -0,0 +1,26 @@
# JSelectBizComponent
Jeecg 选择组件的公共可复用组件
## 引用方式
```js
import JSelectBizComponent from '@/src/components/jeecgbiz/JSelectBizComponent'
export default {
components: { JSelectBizComponent }
}
```
## 参数
### 配置参数
- `name`:`String` 显示名字，例如选择部门就填写'部门'
- `listUrl`:`String` 数据请求地址，必须是封装了分页的地址
- `displayKey`:`String` 显示在标签上的字段 key
- `returnKeys`:`Array` v-model 绑定的 keys，是个数组，默认使用第二项，当配置了 `returnId=true` 就返回第一项
- `returnId`:`Boolean` 返回ID，设为true后将返回配置的 `returnKeys` 中的第一项
- `selectButtonText`:`String` 选择按钮的文字
- `queryParamText`:`String` 查询条件显示文字
- `columns`:`Array` 列配置项，与a-table的列配置项相同，会将第一项配置成已选择的列表

157
ant-design-vue-jeecg/src/components/jeecgbiz/JSelectBizComponent/index.vue Normal file
View File

@ -0,0 +1,157 @@
<template>
<a-row class="j-select-biz-component-box" type="flex" :gutter="8">
<a-col class="left">
<a-select
mode="multiple"
:placeholder="placeholder"
v-model="selectValue"
:options="selectOptions"
allowClear
:disabled="disabled"
:open="false"
style="width: 100%;"
/>
</a-col>
<a-col class="right">
<a-button type="primary" icon="search" :disabled="disabled" @click="visible=true">{{selectButtonText}}</a-button>
</a-col>
<j-select-biz-component-modal
v-model="selectValue"
:name="name" :listUrl="listUrl" :returnKeys="returnKeys" :displayKey="displayKey"
:propColumns="columns" :queryParamText="queryParamText" :multiple="multiple"
:visible.sync="visible"
:valueKey="valueKey"
@ok="selectOptions=$event"
/>
</a-row>
</template>
<script>
import JSelectBizComponentModal from './JSelectBizComponentModal'
export default {
name: 'JSelectBizComponent',
components: { JSelectBizComponentModal },
props: {
value: {
type: String,
default: ''
},
/** 是否返回 id，默认 false，返回 code */
returnId: {
type: Boolean,
default: false
},
placeholder: {
type: String,
default: '请选择'
},
disabled: {
type: Boolean,
default: false
},
// 是否支持多选，默认 true
multiple: {
type: Boolean,
default: true
},
/* 可复用属性 */
// 被选择的名字，例如选择部门就填写'部门'
name: {
type: String,
default: ''
},
// list 接口地址
listUrl: {
type: String,
required: true,
default: ''
},
// 显示的 Key
displayKey: {
type: String,
default: null
},
// 返回的 key
returnKeys: {
type: Array,
default: () => ['id', 'id']
},
// 选择按钮文字
selectButtonText: {
type: String,
default: '选择'
},
// 查询条件文字
queryParamText: {
type: String,
default: null
},
// columns
columns: {
type: Array,
default: () => []
}
},
data() {
return {
selectValue: [],
selectOptions: [],
visible: false
}
},
computed: {
valueKey() {
return this.returnId ? this.returnKeys[0] : this.returnKeys[1]
}
},
watch: {
value: {
immediate: true,
handler(val) {
if (val) {
this.selectValue = val.split(',')
} else {
this.selectValue = []
}
}
},
selectValue: {
deep: true,
handler(val) {
const data = val.join(',')
this.$emit('input', data)
this.$emit('change', data)
}
}
},
methods: {}
}
</script>
<style lang="scss">
.j-select-biz-component-box {
.ant-select-search__field {
display: none !important;
}
}
</style>
<style lang="scss" scoped>
.j-select-biz-component-box {
$width: 82px;
.left {
width: calc(100% - #{$width} - 8px);
}
.right {
width: #{$width};
}
}
</style>

81
ant-design-vue-jeecg/src/components/jeecgbiz/JSelectMultiUser.vue
View File

@ -1,65 +1,40 @@
<template>
<div style="width: 100%;">
<a-select
mode="multiple"
placeholder="Please select"
:value="nameList"
style="width: calc(100% - 178px);">
</a-select>
<span style="display: inline-block;width:170px;float: right;overflow: hidden;">
<a-button type="primary" @click="handleSelect" icon="search" style="width: 81px">选择</a-button>
<a-button type="primary" @click="selectReset" icon="reload" style="margin-left: 8px;width: 81px">清空</a-button>
</span>
<j-select-biz-component
:value="value"
<!-- 选择多个用户支持排序 -->
<j-select-multi-user-modal ref="selectModal" @selectFinished="selectOK"/>
</div>
name="用户"
displayKey="realname"
:returnKeys="returnKeys"
:listUrl="url.list"
:columns="columns"
queryParamText="账号"
v-on="$listeners"
v-bind="$attrs"
/>
</template>
<script>
import JSelectMultiUserModal from './modal/JSelectMultiUserModal'
import JSelectBizComponent from './JSelectBizComponent'
export default {
name: 'JSelectMultiUser',
components:{ JSelectMultiUserModal },
props:{
value:{
type:String,
required:false
}
},
data(){
components: { JSelectBizComponent },
props: ['value'],
data() {
return {
selectList: [],
}
},
computed: {
nameList: function () {
var names = [];
for (var a = 0; a < this.selectList.length; a++) {
names.push(this.selectList[a].name);
}
let nameStr = ''
if(names.length>0){
nameStr = names.join(",")
}
this.$emit("change",nameStr)
return names;
}
},
model: {
prop: 'value',
event: 'change'
},
methods:{
handleSelect: function () {
this.$refs.selectModal.add();
},
selectReset() {
this.selectList = [];
},
selectOK: function (data) {
this.selectList = data;
returnKeys: ['id', 'username'],
url: { list: '/sys/user/list' },
columns: [
{ title: '姓名', align: 'center', width: 100, dataIndex: 'realname' },
{ title: '账号', align: 'center', width: 100, dataIndex: 'username' },
{ title: '电话', align: 'center', width: 100, dataIndex: 'phone' },
{ title: '出生日期', align: 'center', width: 100, dataIndex: 'birthday' }
]
}
}
}
</script>
<style lang="scss" scoped></style>

36
ant-design-vue-jeecg/src/components/jeecgbiz/JSelectPosition.vue Normal file
View File

@ -0,0 +1,36 @@
<template>
<j-select-biz-component v-bind="configs" v-on="$listeners"/>
</template>
<script>
import JSelectBizComponent from './JSelectBizComponent'
export default {
name: 'JSelectPosition',
components: { JSelectBizComponent },
props: ['value'],
data() {
return {
settings: {
name: '职务',
displayKey: 'name',
returnKeys: ['id', 'code'],
listUrl: '/sys/position/list',
queryParamText: '职务编码',
columns: [
{ title: '职务名称', dataIndex: 'name', align: 'center', width: 100 },
{ title: '职务编码', dataIndex: 'code', align: 'center', width: 100 },
{ title: '职级', dataIndex: 'rank_dictText', align: 'center', width: 100 }
]
}
}
},
computed: {
configs() {
return Object.assign({ value: this.value }, this.settings, this.$attrs)
}
}
}
</script>
<style lang="scss" scoped></style>

38
ant-design-vue-jeecg/src/components/jeecgbiz/JSelectRole.vue Normal file
View File

@ -0,0 +1,38 @@
<template>
<j-select-biz-component
:value="value"
name="角色"
displayKey="roleName"
:returnKeys="returnKeys"
:listUrl="url.list"
:columns="columns"
queryParamText="角色编码"
v-on="$listeners"
v-bind="$attrs"
/>
</template>
<script>
import JSelectBizComponent from './JSelectBizComponent'
export default {
name: 'JSelectMultiUser',
components: { JSelectBizComponent },
props: ['value'],
data() {
return {
returnKeys: ['id', 'roleCode'],
url: { list: '/sys/role/list' },
columns: [
{ title: '角色名称', dataIndex: 'roleName', align: 'center', width: 120 },
{ title: '角色编码', dataIndex: 'roleCode', align: 'center', width: 120 }
]
}
}
}
</script>
<style lang="scss" scoped></style>

71
ant-design-vue-jeecg/src/components/jeecgbiz/JSelectUserByDep.vue
View File

@ -1,51 +1,55 @@
<template>
<div>
<a-input-search
v-model="selectedDepUsers"
v-model="userNames"
placeholder="请先选择用户"
disabled
@search="onSearchDepUser">
<a-button slot="enterButton" :disabled="disabled">选择用户</a-button>
</a-input-search>
<j-select-user-by-dep-modal
ref="selectModal"
:modal-width="modalWidth"
@ok="onSearchDepUserCallBack" />
<j-select-user-by-dep-modal ref="selectModal" :modal-width="modalWidth" :multi="multi" @ok="selectOK" :user-ids="value" @initComp="initComp"/>
</div>
</template>
<script>
import JSelectUserByDepModal from './modal/JSelectUserByDepModal'
export default {
name: 'JSelectUserByDep',
components: { JSelectUserByDepModal },
props:{
modalWidth:{
type:Number,
default:1250,
required:false
components: {JSelectUserByDepModal},
props: {
modalWidth: {
type: Number,
default: 1250,
required: false
},
value:{
type:String,
required:false
value: {
type: String,
required: false
},
disabled:{
disabled: {
type: Boolean,
required: false,
default: false
}
},
multi: {
type: Boolean,
default: true,
required: false
},
},
data() {
return {
selectedDepUsers:"",
userIds: "",
userNames: ""
}
},
mounted(){
this.selectedDepUsers = this.value
mounted() {
this.userIds = this.value
},
watch:{
value(val){
this.selectedDepUsers = val
watch: {
value(val) {
this.userIds = val
}
},
model: {
@ -53,14 +57,27 @@
event: 'change'
},
methods: {
//通过组织机构筛选选择用户
initComp(userNames) {
this.userNames = userNames
},
onSearchDepUser() {
this.$refs.selectModal.showModal()
this.onSearchDepUserCallBack('')
},
onSearchDepUserCallBack(selectedDepUsers) {
this.selectedDepUsers = selectedDepUsers
this.$emit("change",selectedDepUsers)
selectOK(rows, idstr) {
console.log("当前选中用户", rows)
console.log("当前选中用户ID", idstr)
if (!rows) {
this.userNames = ''
this.userIds = ''
} else {
let temp = ''
for (let item of rows) {
temp += ',' + item.realname
}
this.userNames = temp.substring(1)
this.userIds = idstr
}
this.$emit("change", this.userIds)
}
}
}

274
ant-design-vue-jeecg/src/components/jeecgbiz/modal/JSelectMultiUserModal.vue
View File

@ -1,274 +0,0 @@
<template>
<a-modal
centered
:title="title"
:width="1000"
:visible="visible"
@ok="handleOk"
@cancel="handleCancel"
cancelText="关闭">
<a-row :gutter="18">
<a-col :span="16">
<a-card title="选择人员" :bordered="true">
<!-- 查询区域 -->
<div class="table-page-search-wrapper">
<a-form layout="inline">
<a-row :gutter="24">
<a-col :span="10">
<a-form-item label="姓名">
<a-input placeholder="请输入姓名" v-model="queryParam.name"></a-input>
</a-form-item>
</a-col>
<a-col :span="8" >
<span style="float: left;overflow: hidden;" class="table-page-search-submitButtons">
<a-button type="primary" @click="searchQuery" icon="search">查询</a-button>
<a-button type="primary" @click="searchReset" icon="reload" style="margin-left: 8px">重置</a-button>
</span>
</a-col>
</a-row>
</a-form>
</div>
<!-- table区域-begin -->
<div>
<a-table
size="small"
bordered
rowKey="id"
:columns="columns1"
:dataSource="dataSource1"
:pagination="ipagination"
:loading="loading"
:scroll="{ y: 240 }"
:rowSelection="{selectedRowKeys: selectedRowKeys,onSelectAll:onSelectAll,onSelect:onSelect,onChange: onSelectChange}"
@change="handleTableChange">
</a-table>
</div>
<!-- table区域-end -->
</a-card>
</a-col>
<a-col :span="8">
<a-card title="用户选择" :bordered="true">
<!-- table区域-begin -->
<div>
<a-table
size="small"
bordered
rowKey="id"
:columns="columns2"
:dataSource="dataSource2"
:loading="loading"
:scroll="{ y: 240 }"
>
<span slot="action" slot-scope="text, record">
<a-button type="primary" size="small" @click="handleDelete(record)" icon="delete">删除</a-button>
</span>
</a-table>
</div>
<!-- table区域-end -->
</a-card>
</a-col>
</a-row>
</a-modal>
</template>
<script>
import { filterObj } from '@/utils/util'
import { getAction } from '@/api/manage'
export default {
name: 'JSelectMultiUserModal',
data () {
return {
title: "用户列表",
names: [],
visible: false,
placement: 'right',
description: '人员管理页面',
// 查询条件
queryParam: {},
// 表头
columns1: [
{
title: '#',
dataIndex: '',
key:'rowIndex',
width:50,
align:"center",
customRender:function (t,r,index) {
return parseInt(index)+1;
}
},
{
title: '姓名',
align:"center",
width:113,
dataIndex: 'name'
},
{
title: '年龄',
align:"center",
width:100,
dataIndex: 'age'
},
{
title: '出生日期',
align:"center",
width:100,
dataIndex: 'birthday'
}
],
columns2: [
{
title: '用户账号',
align:"center",
width:100,
dataIndex: 'name'
},
{
title: '操作',
dataIndex: 'action',
align:"center",
width:100,
scopedSlots: { customRender: 'action' },
}
],
//数据集
dataSource1:[],
dataSource2:[],
// 分页参数
ipagination:{
current: 1,
pageSize: 10,
pageSizeOptions: ['10', '20', '30'],
showTotal: (total, range) => {
return range[0] + "-" + range[1] + " 共" + total + "条"
},
showQuickJumper: true,
showSizeChanger: true,
total: 0
},
isorter:{
column: 'createTime',
order: 'desc',
},
loading:false,
selectedRowKeys: [],
selectedRows: [],
url: {
list: "/test/jeecgDemo/list",
},
}
},
created() {
this.loadData();
},
methods: {
searchQuery(){
this.loadData(1);
},
searchReset(){
this.queryParam={};
this.loadData(1);
},
handleCancel() {
this.visible = false;
},
handleOk() {
this.$emit("selectFinished",this.dataSource2);
this.visible = false;
},
add() {
this.visible = true;
},
loadData (arg){
//加载数据 若传入参数1则加载第一页的内容
if(arg===1){
this.ipagination.current = 1;
}
var params = this.getQueryParams();//查询条件
getAction(this.url.list,params).then((res)=>{
if(res.success){
this.dataSource1 = res.result.records;
this.ipagination.total = res.result.total;
}
})
},
getQueryParams(){
var param = Object.assign({}, this.queryParam,this.isorter);
param.field = this.getQueryField();
param.pageNo = this.ipagination.current;
param.pageSize = this.ipagination.pageSize;
return filterObj(param);
},
getQueryField(){
//TODO 字段权限控制
},
onSelectAll (selected, selectedRows, changeRows) {
if(selected===true){
for(var a = 0;a<changeRows.length;a++){
this.dataSource2.push(changeRows[a]);
}
}else{
for(var b = 0;b<changeRows.length;b++){
this.dataSource2.splice(this.dataSource2.indexOf(changeRows[b]),1);
}
}
// console.log(selected, selectedRows, changeRows);
},
onSelect (record,selected) {
if(selected===true){
this.dataSource2.push(record);
}else{
var index = this.dataSource2.indexOf(record);
//console.log();
if(index >=0 ){
this.dataSource2.splice(this.dataSource2.indexOf(record),1);
}
}
},
onSelectChange (selectedRowKeys,selectedRows) {
this.selectedRowKeys = selectedRowKeys;
this.selectionRows = selectedRows;
},
onClearSelected(){
this.selectedRowKeys = [];
this.selectionRows = [];
},
handleDelete: function(record){
this.dataSource2.splice(this.dataSource2.indexOf(record),1);
},
handleTableChange(pagination, filters, sorter){
//分页、排序、筛选变化时触发
console.log(sorter);
//TODO 筛选
if (Object.keys(sorter).length>0){
this.isorter.column = sorter.field;
this.isorter.order = "ascend"==sorter.order?"asc":"desc"
}
this.ipagination = pagination;
this.loadData();
}
}
}
</script>
<style lang="less" scoped>
.ant-card-body .table-operator{
margin-bottom: 18px;
}
.ant-table-tbody .ant-table-row td{
padding-top:15px;
padding-bottom:15px;
}
.anty-row-operator button{margin: 0 5px}
.ant-btn-danger{background-color: #ffffff}
.ant-modal-cust-warp{height: 100%}
.ant-modal-cust-warp .ant-modal-body{height:calc(100% - 110px) !important;overflow-y: auto}
.ant-modal-cust-warp .ant-modal-content{height:90% !important;overflow-y: hidden}
</style>

138
ant-design-vue-jeecg/src/components/jeecgbiz/modal/JSelectUserByDepModal.vue
View File

@ -15,9 +15,9 @@
<!--组织机构-->
<a-directory-tree
selectable
:selectedKeys="selectedKeys"
:selectedKeys="selectedDepIds"
:checkStrictly="true"
@select="this.onSelect"
@select="onDepSelect"
:dropdownStyle="{maxHeight:'200px',overflow:'auto'}"
:treeData="departTree"
/>
@ -42,7 +42,7 @@
:columns="columns"
:dataSource="dataSource"
:pagination="ipagination"
:rowSelection="{selectedRowKeys: selectedRowKeys, onChange: onSelectChange}"
:rowSelection="{selectedRowKeys: selectedRowKeys, onChange: onSelectChange,type: getType}"
@change="handleTableChange">
</a-table>
</a-card>
@ -52,16 +52,17 @@
</template>
<script>
import { filterObj } from '@/utils/util'
import { queryDepartTreeList, getUserList, queryUserByDepId, queryUserRoleMap } from '@/api/api'
import {filterObj} from '@/utils/util'
import {queryDepartTreeList, getUserList, queryUserByDepId} from '@/api/api'
export default {
name: 'JSelectUserByDepModal',
components: {},
props:['modalWidth'],
props: ['modalWidth', 'multi', 'userIds'],
data() {
return {
queryParam: {
username:"",
username: "",
},
columns: [
{
@ -83,7 +84,7 @@
title: '性别',
align: 'center',
dataIndex: 'sex',
customRender: function(text) {
customRender: function (text) {
if (text === 1) {
return '男'
} else if (text === 2) {
@ -106,10 +107,9 @@
],
scrollTrigger: {},
dataSource: [],
selectedKeys: [],
userNameArr: [],
departName: '',
userRolesMap: {},
selectedRowKeys: [],
selectUserRows: [],
selectUserIds: [],
title: '根据部门选择用户',
ipagination: {
current: 1,
@ -126,53 +126,73 @@
column: 'createTime',
order: 'desc'
},
selectedRowKeys: [],
selectedRows: [],
selectedDepIds: [],
departTree: [],
visible: false,
form: this.$form.createForm(this)
}
},
computed: {
// 计算属性的 getter
getType: function () {
console.log("multi: ", this.multi);
return this.multi == true ? 'checkbox' : 'radio';
}
},
watch: {
userIds() {
this.initUserNames()
}
},
created() {
// 该方法触发屏幕自适应
this.resetScreenSize();
this.queryUserRoleMap();
this.loadData().then((res) => {
this.initUserNames();
})
},
methods: {
loadData(arg) {
initUserNames() {
let names = ''
console.log("props userIds: ", this.userIds)
if (this.userIds) {
let currUserIds = this.userIds
for (let item of this.dataSource) {
if (currUserIds.indexOf(item.username) >= 0) {
names += "," + item.realname
}
}
if (names) {
names = names.substring(1)
}
this.$emit("initComp", names)
}
},
async loadData(arg) {
if (arg === 1) {
this.ipagination.current = 1;
}
let params = this.getQueryParams();//查询条件
getUserList(params).then((res) => {
await getUserList(params).then((res) => {
if (res.success) {
this.dataSource = res.result.records;
this.assignRoleName(this.dataSource);
this.ipagination.total = res.result.total;
}
})
},
queryUserRoleMap(){
queryUserRoleMap().then((res) => {
if (res.success) {
this.userRolesMap = res.result;
this.loadData();
}
})
},
// 触发屏幕自适应
resetScreenSize() {
let screenWidth = document.body.clientWidth;
if (screenWidth < 500) {
this.scrollTrigger = { x: 800 };
this.scrollTrigger = {x: 800};
} else {
this.scrollTrigger = {};
}
},
showModal() {
this.visible = true;
this.assignRoleName(this.dataSource);
this.queryDepartTree();
this.loadData();
this.form.resetFields();
},
getQueryParams() {
@ -191,13 +211,13 @@
},
searchReset(num) {
let that = this;
if(num !== 0){
if (num !== 0) {
that.queryParam = {};
that.loadData(1);
}
that.selectedRowKeys = [];
that.userNameArr = [];
that.selectedKeys = [];
that.selectUserIds = [];
that.selectedDepIds = [];
},
close() {
this.searchReset(0);
@ -214,27 +234,31 @@
},
handleSubmit() {
let that = this;
for (let i = 0, len = this.selectedRowKeys.length; i < len; i++) {
this.getUserNames(this.selectedRowKeys[i]);
}
that.$emit('ok', that.userNameArr.join(','));
this.getSelectUserRows();
console.log(that.selectUserRows)
that.$emit('ok', that.selectUserRows, that.selectUserIds);
that.searchReset(0)
that.close();
},
// 遍历匹配,获取用户真实姓名
getUserNames(rowId) {
//获取选择用户信息
getSelectUserRows(rowId) {
let dataSource = this.dataSource;
let userIds = "";
this.selectUserRows = [];
for (let i = 0, len = dataSource.length; i < len; i++) {
if (rowId === dataSource[i].id) {
this.userNameArr.push(dataSource[i].realname);
if (this.selectedRowKeys.includes(dataSource[i].id)) {
this.selectUserRows.push(dataSource[i]);
userIds = userIds + "," + dataSource[i].username
}
}
this.selectUserIds = userIds.substring(1);
},
// 点击树节点,筛选出对应的用户
onSelect(selectedKeys) {
if (selectedKeys[0] != null) {
this.queryUserByDepId(selectedKeys); // 调用方法根据选选择的id查询用户信息
if (this.selectedKeys[0] !== selectedKeys[0]) {
this.selectedKeys = [selectedKeys[0]];
onDepSelect(selectedDepIds) {
if (selectedDepIds[0] != null) {
this.initQueryUserByDepId(selectedDepIds); // 调用方法根据选选择的id查询用户信息
if (this.selectedDepIds[0] !== selectedDepIds[0]) {
this.selectedDepIds = [selectedDepIds[0]];
}
}
},
@ -246,26 +270,14 @@
this.loadData(1);
},
// 根据选择的id来查询用户信息
queryUserByDepId(selectedKeys) {
queryUserByDepId({ id: selectedKeys.toString() }).then((res) => {
initQueryUserByDepId(selectedDepIds) {
queryUserByDepId({id: selectedDepIds.toString()}).then((res) => {
if (res.success) {
this.dataSource = res.result;
this.ipagination.total = res.result.length;
this.assignRoleName(this.dataSource);
}
})
},
// 传入用户id,找到匹配的角色名称
queryUserRole(userId) {
let map = this.userRolesMap;
let roleName = [];
for (var key in map) {
if (userId === key) {
roleName.push(map[key]);
}
}
return roleName.join(',');
},
queryDepartTree() {
queryDepartTreeList().then((res) => {
if (res.success) {
@ -273,16 +285,6 @@
}
})
},
// 为角色名称赋值
assignRoleName(data) {
let userId = '';
let role = '';
for (let i = 0, length = data.length; i < length; i++) {
userId = this.dataSource[i].id;
role = this.queryUserRole(userId);
this.dataSource[i].roleName = role;
}
},
modalFormOk() {
this.loadData();
}

9
ant-design-vue-jeecg/src/components/layouts/IframePageView.vue
View File

@ -10,6 +10,7 @@
export default {
name: "IframePageContent",
inject:['closeCurrent'],
data () {
return {
url: "",
@ -36,7 +37,13 @@
console.log("------url------"+url)
if (url !== null && url !== undefined) {
this.url = url;
//window.open(this.url);
/*update_begin author:wuxianquan date:20190908 for:判断打开方式，新窗口打开时this.$route.meta.internalOrExternal==true */
if(this.$route.meta.internalOrExternal != undefined && this.$route.meta.internalOrExternal==true){
this.closeCurrent();
window.open(this.url);
}
/*update_end author:wuxianquan date:20190908 for:判断打开方式，新窗口打开时this.$route.meta.internalOrExternal==true */
}
}
}

64
ant-design-vue-jeecg/src/components/layouts/TabLayout.vue
View File

@ -1,6 +1,8 @@
<template>
<global-layout @dynamicRouterShow="dynamicRouterShow">
<contextmenu :itemList="menuItemList" :visible.sync="menuVisible" @select="onMenuSelect"/>
<!-- update-begin- author:sunjianlei --- date:20191009 --- for: 提升右键菜单的层级 -->
<contextmenu :itemList="menuItemList" :visible.sync="menuVisible" style="z-index: 9999;" @select="onMenuSelect"/>
<!-- update-end- author:sunjianlei --- date:20191009 --- for: 提升右键菜单的层级 -->
<a-tabs
@contextmenu.native="e => onContextmenu(e)"
v-if="multipage"
@ -10,6 +12,7 @@
:hide-add="true"
type="editable-card"
@change="changePage"
@tabClick="tabCallBack"
@edit="editPage">
<a-tab-pane :id="page.fullPath" :key="page.fullPath" v-for="page in pageList">
<span slot="tab" :pagekey="page.fullPath">{{ page.meta.title }}</span>
@ -18,9 +21,11 @@
<div style="margin: 12px 12px 0;">
<transition name="page-toggle">
<keep-alive v-if="multipage">
<router-view/>
<router-view v-if="reloadFlag"/>
</keep-alive>
<router-view v-else/>
<template v-else>
<router-view v-if="reloadFlag"/>
</template>
</transition>
</div>
</global-layout>
@ -30,6 +35,7 @@
import GlobalLayout from '@/components/page/GlobalLayout'
import Contextmenu from '@/components/menu/Contextmenu'
import { mixin, mixinDevice } from '@/utils/mixin.js'
import { triggerWindowResizeEvent } from '@/utils/util'
const indexKey = '/dashboard/analysis'
@ -47,12 +53,21 @@
activePage: '',
menuVisible: false,
menuItemList: [
{ key: '4', icon: 'reload', text: '刷 新' },
{ key: '1', icon: 'arrow-left', text: '关闭左侧' },
{ key: '2', icon: 'arrow-right', text: '关闭右侧' },
{ key: '3', icon: 'close', text: '关闭其它' }
]
],
reloadFlag:true
}
},
/* update_begin author:wuxianquan date:20190828 for: 关闭当前tab页，供子页面调用 ->望菜单能配置外链，直接弹出新页面而不是嵌入iframe #428 */
provide(){
return{
closeCurrent:this.closeCurrent
}
},
/* update_end author:wuxianquan date:20190828 for: 关闭当前tab页，供子页面调用->望菜单能配置外链，直接弹出新页面而不是嵌入iframe #428 */
computed: {
multipage() {
//判断如果是手机模式，自动切换为单页面模式
@ -101,9 +116,11 @@
this.$router.push(Object.assign({},waitRouter));
},
'multipage': function(newVal) {
if (!newVal) {
this.linkList = [this.$route.fullPath]
this.pageList = [this.$route]
if(this.reloadFlag){
if (!newVal) {
this.linkList = [this.$route.fullPath]
this.pageList = [this.$route]
}
}
}
},
@ -111,6 +128,11 @@
changePage(key) {
this.activePage = key
},
tabCallBack() {
this.$nextTick(() => {
triggerWindowResizeEvent()
})
},
editPage(key, action) {
this[action](key)
},
@ -157,13 +179,21 @@
case '3':
this.closeOthers(pageKey)
break
case '4':
this.routeReload()
break
default:
break
}
},
/* update_begin author:wuxianquan date:20190828 for: 关闭当前tab页，供子页面调用->望菜单能配置外链，直接弹出新页面而不是嵌入iframe #428 */
closeCurrent(){
this.remove(this.activePage);
},
/* update_end author:wuxianquan date:20190828 for: 关闭当前tab页，供子页面调用->望菜单能配置外链，直接弹出新页面而不是嵌入iframe #428 */
closeOthers(pageKey) {
let index = this.linkList.indexOf(pageKey)
if (pageKey == indexKey) {
if (pageKey == indexKey || pageKey.indexOf('?ticke=')>=0) {
this.linkList = this.linkList.slice(index, index + 1)
this.pageList = this.pageList.slice(index, index + 1)
this.activePage = this.linkList[0]
@ -171,7 +201,7 @@
let indexContent = this.pageList.slice(0, 1)[0]
this.linkList = this.linkList.slice(index, index + 1)
this.pageList = this.pageList.slice(index, index + 1)
this.linkList.unshift(indexKey)
this.linkList.unshift(indexContent.fullPath)
this.pageList.unshift(indexContent)
this.activePage = this.linkList[1]
}
@ -185,7 +215,7 @@
let index = this.linkList.indexOf(pageKey)
this.linkList = this.linkList.slice(index)
this.pageList = this.pageList.slice(index)
this.linkList.unshift(indexKey)
this.linkList.unshift(indexContent.fullPath)
this.pageList.unshift(indexContent)
if (this.linkList.indexOf(this.activePage) < 0) {
this.activePage = this.linkList[0]
@ -207,8 +237,20 @@
let meta = Object.assign({},currRouter.meta,{title:title})
this.pageList.splice(keyIndex, 1, Object.assign({},currRouter,{meta:meta}))
}
}
},
//update-end-author:taoyan date:20190430 for:动态路由title显示配置的菜单title而不是其对应路由的title
//update-begin-author:taoyan date:20191008 for:路由刷新
routeReload(){
this.reloadFlag = false
let ToggleMultipage = "ToggleMultipage"
this.$store.dispatch(ToggleMultipage,false)
this.$nextTick(()=>{
this.$store.dispatch(ToggleMultipage,true)
this.reloadFlag = true
})
}
//update-end-author:taoyan date:20191008 for:路由刷新
}
}
</script>

16
ant-design-vue-jeecg/src/components/page/GlobalLayout.vue
View File

@ -74,7 +74,9 @@
</a-layout-footer>
</a-layout>
<setting-drawer></setting-drawer>
<!-- update-start---- author:os_chengtgen -- date:20190830 -- for:issues/463 -编译主题颜色已生效，但还一直转圈，显示主题 正在编译 ---- -->
<!--<setting-drawer></setting-drawer>-->
<!-- update-end---- author:os_chengtgen -- date:20190830 -- for:issues/463 -编译主题颜色已生效，但还一直转圈，显示主题 正在编译 ---- -->
</a-layout>
</template>
@ -82,7 +84,11 @@
import SideMenu from '@/components/menu/SideMenu'
import GlobalHeader from '@/components/page/GlobalHeader'
import GlobalFooter from '@/components/page/GlobalFooter'
import SettingDrawer from '@/components/setting/SettingDrawer'
// update-start---- author:os_chengtgen -- date:20190830 -- for:issues/463 -编译主题颜色已生效，但还一直转圈，显示主题 正在编译 ------
// import SettingDrawer from '@/components/setting/SettingDrawer'
// 注释这个因为在个人设置模块已经加载了SettingDrawer页面
// update-end ---- author:os_chengtgen -- date:20190830 -- for:issues/463 -编译主题颜色已生效，但还一直转圈，显示主题 正在编译 ------
import { triggerWindowResizeEvent } from '@/utils/util'
import { mapState, mapActions } from 'vuex'
import { mixin, mixinDevice } from '@/utils/mixin.js'
@ -93,7 +99,11 @@
SideMenu,
GlobalHeader,
GlobalFooter,
SettingDrawer
// update-start---- author:os_chengtgen -- date:20190830 -- for:issues/463 -编译主题颜色已生效，但还一直转圈，显示主题 正在编译 ------
// // SettingDrawer
// 注释这个因为在个人设置模块已经加载了SettingDrawer页面
// update-end ---- author:os_chengtgen -- date:20190830 -- for:issues/463 -编译主题颜色已生效，但还一直转圈，显示主题 正在编译 ------
},
mixins: [mixin, mixinDevice],
data() {

78
ant-design-vue-jeecg/src/components/tools/HeaderNotice.vue
View File

@ -80,6 +80,7 @@
import ShowAnnouncement from './ShowAnnouncement'
import store from '@/store/'
export default {
name: "HeaderNotice",
components: {
@ -96,11 +97,14 @@
hovered: false,
announcement1:[],
announcement2:[],
msg1Count:"3",
msg1Count:"0",
msg2Count:"0",
msg1Title:"通知(3)",
msg1Title:"通知(0)",
msg2Title:"",
stopTimer:false,
websock: null,
lockReconnect:false,
heartCheck:null,
}
},
computed:{
@ -112,6 +116,7 @@
this.loadData();
//this.timerFun();
this.initWebSocket();
this.heartCheckFun();
},
destroyed: function () { // 离开页面生命周期函数
this.websocketclose();
@ -195,26 +200,38 @@
},
websocketonopen: function () {
console.log("WebSocket连接成功");
//心跳检测重置
this.heartCheck.reset().start();
},
websocketonerror: function (e) {
console.log("WebSocket连接发生错误");
this.reconnect();
},
websocketonmessage: function (e) {
console.log("-----接收消息-------",e.data);
//console.log("-----接收消息-------",e.data);
var data = eval("(" + e.data + ")"); //解析对象
this.loadData();
//if(data.cmd == "topic"){
//系统通知
this.openNotification(data);
//}else if(data.cmd == "user"){
//用户消息
// this.openNotification(data);
//}
if(data.cmd == "topic"){
//系统通知
this.loadData();
}else if(data.cmd == "user"){
//用户消息
this.loadData();
}
//心跳检测重置
this.heartCheck.reset().start();
},
websocketsend(text) { // 数据发送
try {
this.websock.send(text);
} catch (err) {
console.log("send failed (" + err.code + ")");
}
},
websocketclose: function (e) {
console.log("connection closed (" + e.code + ")");
this.reconnect();
},
openNotification (data) {
@ -239,6 +256,45 @@
});
},
reconnect() {
var that = this;
if(that.lockReconnect) return;
that.lockReconnect = true;
//没连接上会一直重连，设置延迟避免请求过多
setTimeout(function () {
console.info("尝试重连...");
that.initWebSocket();
that.lockReconnect = false;
}, 5000);
},
heartCheckFun(){
var that = this;
//心跳检测,每20s心跳一次
that.heartCheck = {
timeout: 20000,
timeoutObj: null,
serverTimeoutObj: null,
reset: function(){
clearTimeout(this.timeoutObj);
//clearTimeout(this.serverTimeoutObj);
return this;
},
start: function(){
var self = this;
this.timeoutObj = setTimeout(function(){
//这里发送一个心跳，后端收到后，返回一个心跳消息，
//onmessage拿到返回的心跳就说明连接正常
that.websocketsend("HeartBeat");
console.info("客户端发送心跳");
//self.serverTimeoutObj = setTimeout(function(){//如果超过一定时间还没重置，说明后端主动断开了
// that.websock.close();//如果onclose会执行reconnect，我们执行ws.close()就行了.如果直接执行reconnect 会触发onclose导致重连两次
//}, self.timeout)
}, this.timeout)
}
}
},
showDetail(key,data){
this.$notification.close(key);
var id = data.msgId;

28
ant-design-vue-jeecg/src/components/tools/setting.js
View File

@ -40,23 +40,23 @@ const updateTheme = primaryColor => {
return;
}
const hideMessage = message.loading('正在编译主题！', 0);
console.info(`正在编译主题!`)
function buildIt() {
if (!window.less) {
// 正确的判定less是否已经加载less.modifyVars可用
if (!window.less || !window.less.modifyVars) {
return;
}
setTimeout(() => {
window.less
.modifyVars({
'@primary-color': primaryColor,
})
.then(() => {
hideMessage();
})
.catch(() => {
message.error('Failed to update theme');
hideMessage();
});
}, 200);
// less.modifyVars可用
window.less.modifyVars({
'@primary-color': primaryColor,
})
.then(() => {
hideMessage();
})
.catch(() => {
message.error('Failed to update theme');
hideMessage();
});
}
if (!lessNodesAppended) {
// insert less.js and color.less