| | |
| | | .el-card__body { |
| | | padding: 15px; |
| | | } |
| | | |
| | | .el-dialog{ |
| | | margin: 50px auto; |
| | | } |
| | | .avue-dialog .el-dialog{ |
| | | top:50%; |
| | | max-height: calc(100% - 100px); |
| | | -webkit-transform: translate(-50%, 0); |
| | | transform: translate(-50%, -50%); |
| | | } |
| | | .avue-dialog .el-dialog__body{ |
| | | padding: 20px; |
| | | } |
| | | .avue--detail .el-col{ |
| | | margin-bottom: 0; |
| | | } |
| | |
| | | import Vue from "vue"; |
| | | import AddEditDialog from "@/components/actions/AddEditDialog" |
| | | |
| | | export const doAction = (options) => { |
| | | export const doAction = (options,callback) => { |
| | | options.paramVOS = paramLow(options.paramVOS) |
| | | const paramVOS = Object.assign({ |
| | | url: '/api/uiDataController/addSave', |
| | |
| | | |
| | | callPreEvent(options, doBefore, function (options) { |
| | | doAdd(options, function () { |
| | | callPostEvent(options, doAfter, options.callback); |
| | | callPostEvent(options, doAfter, callback); |
| | | }); |
| | | }); |
| | | }; |
| | |
| | | instance = null; |
| | | }; |
| | | if (callback) { |
| | | instance.saveCallback = callback(options); |
| | | instance.saveCallback = callback; |
| | | } |
| | | let vm = instance.$mount(); |
| | | document.body.appendChild(vm.$el); |
| | |
| | | /** |
| | | * action通用入口 |
| | | */ |
| | | export const doAction = (button,options) => { |
| | | export const doAction = (button,options,callback) => { |
| | | options.paramVOS['title']=replaceFreeMarker(options.paramVOS.title,options.dataStore,options.sourceData); |
| | | |
| | | if(button.url && button.url!='null'){ |
| | | //有配置action路径,使用路径对应的js |
| | | import("../"+button.url+".js").then(module => { |
| | | module.doAction(options); |
| | | module.doAction(options,callback); |
| | | }) |
| | | }else { |
| | | //通用action |
| | |
| | | view: () => {}, |
| | | //创建 |
| | | add: () => {import("@/actions/base/AddAction").then(module => { |
| | | module.doAction(options); |
| | | module.doAction(options,callback); |
| | | })}, |
| | | //修改 |
| | | edit: () => {import("@/actions/base/EditAction").then(module => { |
| | | module.doAction(options); |
| | | module.doAction(options,callback); |
| | | })}, |
| | | //删除 |
| | | delete: () => {import("@/actions/base/DeleteAction").then(module => { |
| | | module.doAction(options); |
| | | module.doAction(options,callback); |
| | | })}, |
| | | }; |
| | | if(validatenull(options.paramVOS.context)) { |
| | |
| | | fnTarget(buttonParse,callback); |
| | | }else{ |
| | | try { |
| | | import("../"+buttonParse.jsPath).then(module => { |
| | | import("../"+buttonParse.jsPath+".js").then(module => { |
| | | module[buttonParse.methodName](options,callback); |
| | | }) |
| | | } catch (error) { |
| | |
| | | fnTarget(buttonParse,callback); |
| | | }else{ |
| | | try { |
| | | import("../"+buttonParse.jsPath).then(module => { |
| | | import("../"+buttonParse.jsPath+".js").then(module => { |
| | | module[buttonParse.methodName](options,callback); |
| | | }) |
| | | } catch (error) { |
| | |
| | | <avue-form ref="formRef" :option="option" v-model="form"> |
| | | <template v-for="item in allColumn" :slot="item.prop+ ''"> |
| | | <vciWebRefer |
| | | v-if="item.propType === 'refer' || item.type === 'refer'" |
| | | v-if="item.type === 'refer'" |
| | | :key="item.prop" |
| | | referType="master" |
| | | :data-key="item.prop" |
| | |
| | | @setReferValue="setReferValue" |
| | | ></vciWebRefer> |
| | | <!-- 富文本控件 --> |
| | | <rich-text v-if="item.type === 'richText'" :value="form[subitemName]" @input="form[subitemName] = $event"></rich-text> |
| | | <rich-text v-else-if="item.type === 'richText'" |
| | | :key="item.prop" |
| | | :data-key="item.prop" |
| | | :disabled="item.disabled || false" |
| | | :display="item.display || true" |
| | | :value="form[subitemName]" @input="form[subitemName] = $event"></rich-text> |
| | | <!-- 表单上传文件组件 --> |
| | | <form-upload v-if="item.type === 'upload'"></form-upload> |
| | | <form-upload v-else-if="item.type === 'upload'" |
| | | :key="item.prop" |
| | | :data-key="item.prop" |
| | | :disabled="item.disabled || false" |
| | | :display="item.display || true"></form-upload> |
| | | </template> |
| | | </avue-form> |
| | | </template> |
| | |
| | | type:Boolean, |
| | | default:false |
| | | }, |
| | | isEdit:{ |
| | | //表单是否可编辑 |
| | | type:Boolean, |
| | | default:true |
| | | } |
| | | }, |
| | | data() { |
| | | return { |
| | |
| | | handler(val) { |
| | | for (let code of this.option.column) { |
| | | if ( |
| | | (code.propType == "refer" || code.type == 'refer' )&& |
| | | code.type == 'refer' && |
| | | code.referConfig && |
| | | code.referConfig.useFormKey |
| | | ) { |
| | |
| | | for (let code of this.option.group) { |
| | | for (let col of code.column) { |
| | | if ( |
| | | (col.propType == "refer" || col.type == 'refer')&& |
| | | col.type == 'refer'&& |
| | | col.referConfig && |
| | | col.referConfig.useFormKey |
| | | ) { |
| | |
| | | this.option.group = group; |
| | | }, |
| | | initItem(item){ |
| | | const type=this.columnType[item.type] || item.type |
| | | const type=this.columnType[item.type] || item.type; |
| | | const col= { |
| | | ...item, |
| | | label: item.text, |
| | |
| | | suffixIcon: item.prefix, |
| | | tip: item.tooltips, |
| | | dictCode: item.comboxKey, |
| | | rules: [{ |
| | | rules: this.isEdit?[{ |
| | | required: item.required, |
| | | message: `请输入${item.text}!`, |
| | | trigger: "blur" |
| | | }] |
| | | }]:[] |
| | | }; |
| | | if(!this.isEdit){ |
| | | col.placeholder=col.label; |
| | | } |
| | | if(col.type === 'richText'){ |
| | | this.subitemName = col.field; |
| | |
| | | }); |
| | | } |
| | | } |
| | | if (col.propType === "refer"|| col.type==='refer') { |
| | | if (col.type==='refer') { |
| | | if (col.referConfig && col.referConfig.useFormKey) { |
| | | if (validatenull(col.referConfig.formValuesKey)) { |
| | | col.referConfig.formValuesKey = "form"; |
| | |
| | | <!-- |
| | | directory 开启目录 |
| | | --> |
| | | <el-upload |
| | | <el-upload v-if="display" |
| | | ref="uploadRef" |
| | | :before-upload="handleBeforeUpload" |
| | | :directory="true" |
| | | :disabled="disabled" |
| | | :headers="uploadHeaders" |
| | | :on-change="handleFileChange" |
| | | :on-error="onError" |
| | |
| | | // fileAccpet:String, |
| | | // defalut:'.img,.xls,.png,.xlsx' |
| | | // }, |
| | | props: { |
| | | disabled:{ |
| | | type:Boolean, |
| | | default:false |
| | | }, |
| | | display:{ |
| | | type:Boolean, |
| | | default:true |
| | | } |
| | | }, |
| | | data() { |
| | | return { |
| | | pageLoading: null, |
| | |
| | | <template> |
| | | <div id='quillEditorQiniu'> |
| | | <div id='quillEditorQiniu' v-if="display"> |
| | | <!-- 基于elementUi的上传组件 el-upload begin--> |
| | | <el-upload |
| | | :accept="'image'" |
| | |
| | | class="avatar-uploader"> |
| | | </el-upload> |
| | | <!-- 基于elementUi的上传组件 el-upload end--> |
| | | <quill-editor ref="customQuillEditor" v-model="value" :options="editorOption" class="editor"> |
| | | <quill-editor ref="customQuillEditor" v-model="value" :disabled="disabled" :options="editorOption" class="editor"> |
| | | </quill-editor> |
| | | </div> |
| | | <!-- <template #footer>--> |
| | |
| | | }, |
| | | value: { |
| | | type: String |
| | | }, |
| | | disabled:{ |
| | | type:Boolean, |
| | | default:false |
| | | }, |
| | | display:{ |
| | | type:Boolean, |
| | | default:true |
| | | } |
| | | }, |
| | | data() { |
| | |
| | | <template> |
| | | <el-dialog v-dialogDrag |
| | | :title="paramVOS.title" |
| | | :title="title" |
| | | :visible.sync="visible" |
| | | :width="width" |
| | | :fullscreen="paramVOS.content || paramVOS.context" |
| | | :fullscreen="fullscreen" |
| | | :append-to-body="true" |
| | | class="avue-dialog avue-dialog--top" |
| | | top="0" |
| | | class="avue-dialog" |
| | | :destroy-on-close="true" |
| | | @close="dialogClose"> |
| | | <basic-form ref="formRef" v-if="paramVOS.form" |
| | | :key="'dialog-'+paramVOS.form" |
| | | :span="span" |
| | | :formItems="formItems" |
| | | :formData="form"> |
| | | </basic-form> |
| | | <ui-view ref="uiViewRef" v-else-if="paramVOS.content || paramVOS.context" |
| | | <ui-view ref="uiViewRef" v-else-if="paramVOS.context" |
| | | :key="'AddEditDialog-'+type" |
| | | :btmType="paramVOS.type" |
| | | :context="paramVOS.context" |
| | | :inDialog="true" |
| | | :key="'AddEditDialog-'+type" |
| | | :sourceData="sourceData" |
| | | :dataStore="dataStore" |
| | | :paramVOS="paramVOS" |
| | | ></ui-view> |
| | | <div slot="footer" class="dialog-footer avue-dialog__footer"> |
| | | <div class="dialog-footer avue-dialog__footer"> |
| | | <el-button type="primary" plain size="small" @click="saveHandler">保 存</el-button> |
| | | <el-button size="small" @click="dialogClose">取 消</el-button> |
| | | <el-button size="small" @click="resetValue">重 置</el-button> |
| | | <el-button size="small" @click="resetValue" v-if="paramVOS.form">重 置</el-button> |
| | | </div> |
| | | </el-dialog> |
| | | </template> |
| | |
| | | paramVOS: { |
| | | type: Object, |
| | | default: {} |
| | | }, |
| | | width: { |
| | | type: String, |
| | | default:'60%' |
| | | } |
| | | }, |
| | | data(){ |
| | |
| | | computed:{ |
| | | title(){ |
| | | return this.paramVOS.title || (this.type=='add'?'添加':'修改') |
| | | }, |
| | | width(){ |
| | | return this.paramVOS.width || "60%" |
| | | }, |
| | | height(){ |
| | | return this.paramVOS.height || "500px" |
| | | }, |
| | | fullscreen(){ |
| | | if(this.paramVOS.width || this.paramVOS.height){ |
| | | return false; |
| | | }else if(this.paramVOS.form){ |
| | | return false; |
| | | } |
| | | return false; |
| | | } |
| | | }, |
| | | created() { |
| | |
| | | } |
| | | }, |
| | | saveHandler() { |
| | | this.$refs.formRef.validate((valid, done) => { |
| | | if (valid) { |
| | | if(this.type=="add"){ |
| | | addSave(this.form,this.paramVOS.url,this.paramVOS.method).then(() => { |
| | | this.$message({ |
| | | type: "success", |
| | | message: "保存成功!" |
| | | }); |
| | | if(this.saveCallback){ |
| | | this.saveCallback(); |
| | | } |
| | | this.dialogClose(); |
| | | }).error((e) => { |
| | | this.$message.error(e||"保存失败") |
| | | }); |
| | | }else{ |
| | | editSave(this.form,this.paramVOS.url,this.paramVOS.method).then(() => { |
| | | this.$message({ |
| | | type: "success", |
| | | message: "修改成功!" |
| | | }); |
| | | if(this.saveCallback){ |
| | | this.saveCallback(); |
| | | } |
| | | this.dialogClose(); |
| | | }).error((e) => { |
| | | this.$message.error(e||"修改失败") |
| | | }); |
| | | } |
| | | } else { |
| | | if(this.paramVOS.form){ |
| | | this.$refs.formRef.validate((valid, done) => { |
| | | if (valid) { |
| | | this.saveValue(this.form) |
| | | } else { |
| | | |
| | | } |
| | | }); |
| | | }else{ |
| | | //this.$refs.uiViewRef. |
| | | if(this.saveCallback){ |
| | | this.saveCallback({}); |
| | | } |
| | | }); |
| | | } |
| | | |
| | | }, |
| | | saveValue(savedata){ |
| | | if(this.type=="add"){ |
| | | addSave(savedata,this.paramVOS.url,this.paramVOS.method).then(() => { |
| | | this.$message({ |
| | | type: "success", |
| | | message: "保存成功!" |
| | | }); |
| | | if(this.saveCallback){ |
| | | this.saveCallback(savedata); |
| | | } |
| | | this.dialogClose(); |
| | | }).error((e) => { |
| | | this.$message.error(e||"保存失败") |
| | | }); |
| | | }else{ |
| | | editSave(savedata,this.paramVOS.url,this.paramVOS.method).then(() => { |
| | | this.$message({ |
| | | type: "success", |
| | | message: "修改成功!" |
| | | }); |
| | | if(this.saveCallback){ |
| | | this.saveCallback(savedata); |
| | | } |
| | | this.dialogClose(); |
| | | }).error((e) => { |
| | | this.$message.error(e||"修改失败") |
| | | }); |
| | | } |
| | | }, |
| | | resetValue() { |
| | | this.$refs.formRef.resetFields(); |
| | | if (this.paramVOS.form) { |
| | | this.$refs.formRef.resetFields(); |
| | | } |
| | | } |
| | | } |
| | | } |
| | | </script> |
| | | |
| | | <style scoped> |
| | | .avue-dialog__footer{ |
| | | margin-bottom: 20px; |
| | | } |
| | | |
| | | </style> |
| | |
| | | } |
| | | |
| | | const that=this; |
| | | if(isShow){ |
| | | if(isShow) { |
| | | doAction(buttonitem, { |
| | | paramVOS: paramVOS, |
| | | dataStore: this.dataStore || [], |
| | | sourceData: this.sourceData || {}, |
| | | callback: function () { |
| | | if (that.$parent.handleRefresh) { |
| | | that.$parent.handleRefresh() |
| | | } |
| | | sourceData: this.sourceData || {} |
| | | },function (){ |
| | | if (that.$parent.handleRefresh) { |
| | | that.$parent.handleRefresh() |
| | | } |
| | | }); |
| | | } |
| | |
| | | <template> |
| | | <div :id="'UI-dynamic-'+areasName+componentVO.oid" class="UI-dynamic"> |
| | | <dynamic-button v-if="componentVO && componentVO.buttons" :componentVO="componentVO" :butttonList="componentVO.buttons" :dataStore="[form]" :sourceData="sourceData" type="form"></dynamic-button> |
| | | <basic-form :span="this.componentVO.formDefineVO.columnOneRow?(24/this.componentVO.formDefineVO.columnOneRow) : 12" |
| | | <dynamic-button v-if="componentVO && componentVO.buttons" :key="areasName+'buttons-'+componentVO.oid" |
| | | :componentVO="componentVO" :butttonList="componentVO.buttons" :dataStore="[form]" :sourceData="sourceData" type="form"></dynamic-button> |
| | | <basic-form :key="areasName+'basicForm-'+componentVO.oid" |
| | | :span="this.componentVO.formDefineVO.columnOneRow?(24/this.componentVO.formDefineVO.columnOneRow) : 12" |
| | | :formItems="this.componentVO.formDefineVO && this.componentVO.formDefineVO.items" |
| | | :disabled="!inDialog" |
| | | :isEdit="inDialog" |
| | | :formData="form"> |
| | | </basic-form> |
| | | </div> |
| | |
| | | @selection-change="selectChange"> |
| | | <!--top区域按钮--> |
| | | <template slot="menuLeft" slot-scope="scope"> |
| | | <dynamic-button :componentVO="componentVO" :butttonList="componentVO.buttons" :dataStore="selectList" LocationType="top" :sourceData="sourceData" |
| | | <dynamic-button :componentVO="componentVO" |
| | | :key="areasName+'buttons-'+componentVO.oid" |
| | | :butttonList="componentVO.buttons" :dataStore="selectList" LocationType="top" :sourceData="sourceData" |
| | | type="table"></dynamic-button> |
| | | </template> |
| | | |
| | |
| | | <template> |
| | | <div class="UI-dynamic" :id="'UI-dynamic-'+areasName+componentVO.oid"> |
| | | <dynamic-button v-if="componentVO.buttons && componentVO.buttons.length>0" :componentVO="componentVO" |
| | | :key="areasName+'buttons-'+componentVO.oid" |
| | | :butttonList="componentVO.buttons" :dataStore="checkDatas" |
| | | :sourceData="sourceData" type="tree" style="margin-bottom: 5px;"></dynamic-button> |
| | | <el-input |
| | |
| | | description="该区域没有配置显示的内容"> |
| | | </el-alert> |
| | | <el-alert |
| | | v-else-if="Object.keys(newSourceData).length> 0" |
| | | v-else-if="Object.keys(newSourceData).length== 0" |
| | | class="alert" |
| | | :closable="false" |
| | | title="" |
| | | type="error" |
| | | show-icon |
| | | type="info" |
| | | description="没有可显示的内容,请选择来源数据。"> |
| | | </el-alert> |
| | | <el-alert |
| | | v-else-if="newAreasData.length== 0" |
| | | class="alert" |
| | | :closable="false" |
| | | title="" |
| | | type="info" |
| | | description="不满足显示表达式条件,没有可显示的内容。"> |
| | | </el-alert> |
| | | </div> |