| | |
| | | import {validatenull} from "@/util/validate"; |
| | | import Vue from "vue"; |
| | | |
| | | |
| | | export const doAction = (options) => { |
| | | options.paramVOS = paramLow(options.paramVOS) |
| | | const paramVOS = Object.assign({ |
| | |
| | | data: formData |
| | | }) |
| | | } |
| | | |
| | | //UIä¸ä¸æè¡¨åæ¥è¯¢ |
| | | export const dataForm = (params) => { |
| | | let formData = new FormData() |
| | | for(let key in params){ |
| | | formData.append(key.replaceAll('"',''),params[key]) |
| | | } |
| | | return request({ |
| | | url: '/api/uiDataController/dataFormQuery', |
| | | method: 'post', |
| | | headers:{"Content-Type": "application/text"}, |
| | | data: formData |
| | | }) |
| | | } |
¶Ô±ÈÐÂÎļþ |
| | |
| | | <template> |
| | | <!--å¨ææ¨¡æ¿--> |
| | | <avue-form ref="formRef" :option="option" v-model="form"> |
| | | <template v-for="item in allColumn" :slot="`${item.prop}`" v-if="item.propType === 'refer' || item.type === 'refer'"> |
| | | <vciWebRefer |
| | | :key="item.prop" |
| | | referType="master" |
| | | :data-key="item.prop" |
| | | :disabled="item.disabled || false" |
| | | :display="item.display || true" |
| | | :referConfig="item.referConfigTemp || {}" |
| | | :reloadFormKey="(item.referConfig.useFormKey && item.referConfig.formValues && item.referConfig.formValues[item.referConfig.useFormKey]) || ''" |
| | | :text="form[item.referConfig.showProp]" |
| | | :value="form[item.prop]" |
| | | @setReferValue="setReferValue" |
| | | ></vciWebRefer> |
| | | </template> |
| | | </avue-form> |
| | | </template> |
| | | <script> |
| | | // è¡¨åæ¨¡æ¿ |
| | | import vciWebRefer from "@/components/refer/vciWebRefer.vue"; |
| | | import { formatMilliseconds } from "@/util/formatTime"; |
| | | import { validatenull } from "@/util/validate"; |
| | | |
| | | export default { |
| | | name: "basicForm", |
| | | components: { vciWebRefer }, |
| | | props: { |
| | | formItems:{ |
| | | type: Array, |
| | | default: () => [], |
| | | }, |
| | | formData:{ |
| | | type: Object, |
| | | default: () => {}, |
| | | }, |
| | | labelWidth:{ |
| | | type:Number, |
| | | default:120 |
| | | }, |
| | | span:{ |
| | | type:Number, |
| | | default:12 |
| | | }, |
| | | detail:{ |
| | | type:Boolean, |
| | | default:false |
| | | }, |
| | | disabled:{ |
| | | type:Boolean, |
| | | default:false |
| | | }, |
| | | }, |
| | | data() { |
| | | return { |
| | | form: this.formData, |
| | | option: { |
| | | menuBtn:false, |
| | | submitBtn: false, |
| | | emptyBtn: false, |
| | | detail: this.$props.detail, |
| | | labelWidth: this.$props.labelWidth, |
| | | column: [], |
| | | group: [], |
| | | }, |
| | | allColumn:[], |
| | | columnType: { |
| | | text: "input", |
| | | combox: "select", |
| | | truefalse: "switch", |
| | | number: "number", |
| | | textarea: "textarea", |
| | | datetime: "datetime", |
| | | date: "date", |
| | | refer: "refer", |
| | | } |
| | | }; |
| | | }, |
| | | watch: { |
| | | formItems: { |
| | | handler(val) { |
| | | if(val[0] &&val[0].column && val[0].column.isArray()){ |
| | | this.getInitGroup(val); |
| | | }else{ |
| | | this.getInit(val); |
| | | } |
| | | }, |
| | | immediate: true, |
| | | }, |
| | | formData: { |
| | | handler(val) { |
| | | this.form=this.$props.formData; |
| | | }, |
| | | immediate: true, |
| | | }, |
| | | form: { |
| | | handler(val) { |
| | | for (let code of this.option.column) { |
| | | if ( |
| | | (code.propType == "refer" || code.type == 'refer' )&& |
| | | code.referConfig && |
| | | code.referConfig.useFormKey |
| | | ) { |
| | | code.referConfig.formValues = val; |
| | | code.referConfigTemp.options = code.referConfig; |
| | | } |
| | | } |
| | | for (let code of this.option.group) { |
| | | for (let col of code.column) { |
| | | if ( |
| | | (col.propType == "refer" || col.type == 'refer')&& |
| | | col.referConfig && |
| | | col.referConfig.useFormKey |
| | | ) { |
| | | col.referConfig.formValues = val; |
| | | col.referConfigTemp.options = col.referConfig; |
| | | } |
| | | } |
| | | } |
| | | this.$emit("input", val); |
| | | }, |
| | | deep: true, |
| | | immediate: true |
| | | }, |
| | | }, |
| | | methods: { |
| | | getInit(val) { |
| | | const column=[]; |
| | | for (let code of val) { |
| | | code = this.initItem(code); |
| | | column.push(code); |
| | | this.allColumn.push(code); |
| | | } |
| | | this.option.column = column; |
| | | }, |
| | | getInitGroup(val) { |
| | | const group=[]; |
| | | for (let code of val) { |
| | | const column=[]; |
| | | for (let col of code.column) { |
| | | col = this.initItem(col) |
| | | column.push(col); |
| | | this.allColumn.push(col); |
| | | } |
| | | group.push(column) |
| | | } |
| | | this.option.group = group; |
| | | }, |
| | | initItem(item){ |
| | | const type=this.columnType[this.type] || this.type |
| | | const col= { |
| | | ...item, |
| | | label: item.text, |
| | | prop: item.field, |
| | | type: type, |
| | | labelWidth: this.labelWidth || (item.text.length >= 6 ? 115 : 90), |
| | | disabled: item.disabled || this.disabled, |
| | | span: item.span |
| | | ? item.span |
| | | : item.type === "textarea" |
| | | ? 24 |
| | | : this.span, |
| | | value: item.defaultValue, |
| | | dicData: type === 'select' ? item.dicData : item.dicUrl, |
| | | display: !item.hidden, |
| | | labelSuffix: item.suffix, |
| | | suffixIcon: item.prefix, |
| | | tip: item.tooltips, |
| | | dictCode: item.comboxKey, |
| | | rules: [{ |
| | | required: item.required, |
| | | message: `请è¾å
¥${item.text}!`, |
| | | trigger: "blur" |
| | | }] |
| | | } |
| | | if (col.propType === "dict") { |
| | | if(!validatenull(col.dictCode)) { |
| | | /*this.getDicts(col.dictCode).then((res) => { |
| | | if (res.success) { |
| | | const dic = res.obj.data; |
| | | col.dicData = dic.map((d) => { |
| | | return { |
| | | label: d.name, |
| | | key: d.code, |
| | | value: d.code, |
| | | }; |
| | | }); |
| | | } |
| | | });*/ |
| | | } |
| | | } |
| | | if (col.propType === "refer"|| col.type==='refer') { |
| | | if (col.referConfig && col.referConfig.useFormKey) { |
| | | if (validatenull(col.referConfig.formValuesKey)) { |
| | | col.referConfig.formValuesKey = "form"; |
| | | } |
| | | col.referConfig.formValues = this[col.referConfig.formValuesKey]; |
| | | } |
| | | col.referConfigTemp = { |
| | | title: col.label, |
| | | showProp: col.showProp || col.referConfig.showProp || col.prop + "Name", |
| | | prop: col.prop, |
| | | propMap: col.propMap || {}, |
| | | placeholder: col.placeholder |
| | | ? col.placeholder |
| | | : ` è¯·éæ©` + col.label, |
| | | options: col.referConfig, |
| | | }; |
| | | } |
| | | return col; |
| | | }, |
| | | setReferValue(data) { |
| | | if (data.prop) { |
| | | this.form[data.prop] = data.value || ""; |
| | | this.form[data.showProp] = data.text || ""; |
| | | if (data.propMap) { |
| | | //说æéè¦æ å° |
| | | for (let key in data.propMap) { |
| | | let mapFields = data.propMap[key].split(","); |
| | | let value = []; |
| | | data.rawData.forEach((_item) => { |
| | | var temp; |
| | | if (!_item.extendData) { |
| | | _item.extendData = {}; |
| | | } |
| | | if (mapFields.length == 1) { |
| | | var mapField = mapFields[0]; |
| | | temp = _item[mapField] || _item["extendData"][mapField]; |
| | | } else { |
| | | //æå¤ä¸ª |
| | | var mutiTemp = []; |
| | | mapFields.forEach((_itemField) => { |
| | | mutiTemp.push( |
| | | _item[_itemField] || _item["extendData"][_itemField] |
| | | ); |
| | | }); |
| | | temp = mutiTemp.join(" "); |
| | | } |
| | | if (temp != null && temp != "") { |
| | | value.push(temp); |
| | | } |
| | | }); |
| | | this.form[key] = value.join(","); |
| | | } |
| | | } |
| | | } |
| | | } |
| | | }, |
| | | }; |
| | | </script> |
¶Ô±ÈÐÂÎļþ |
| | |
| | | <template> |
| | | <dialog> |
| | | |
| | | </dialog> |
| | | </template> |
| | | |
| | | <script> |
| | | |
| | | export default { |
| | | name: "formDialog" |
| | | } |
| | | </script> |
| | | |
| | | <style scoped> |
| | | |
| | | </style> |
| | |
| | | item=item.replace(/:/g,'='); |
| | | } |
| | | } |
| | | /*if (paramVOS['initvalue']) { |
| | | var values = paramVOS['initvalue'].split(';'); |
| | | var initValues = [] |
| | | layui.each(values, function (i, item) { |
| | | item=item.replace(':','='); |
| | | paramVOS['initvalue']=paramVOS['initvalue'] || paramVOS['initValue']; |
| | | let isShow = true; |
| | | if (paramVOS['initvalue']) { |
| | | let values = paramVOS['initvalue'].split(';'); |
| | | let initValues = {} |
| | | values.forEach((i, item) => { |
| | | item = item.replace(':', '='); |
| | | if (item.indexOf('${') > -1) { |
| | | if (item.split('=')[1].indexOf('.') > -1) { |
| | | if (sourceData.length<1 || !sourceData[0].oid) { |
| | | if (this.sourceData.length < 1 || !this.sourceData.oid) { |
| | | isShow = false; |
| | | $webUtil.showErrorMsg("请å
鿩䏿¡æ¥æºæ°æ®"); |
| | | this.$message.error("请å
鿩䏿¡æ¥æºæ°æ®"); |
| | | return false; |
| | | } |
| | | var name = item.split('=')[1].split('.')[1].replace('${', '').replace('}', ''); |
| | | if (name == 'oid') { |
| | | item = item.split('=')[0] + '=' + sourceData[0]['oid'] |
| | | } else { |
| | | item = item.split('=')[0] + '=' + sourceData[0][name] |
| | | } |
| | | let name = item.split('=')[1].split('.')[1].replace('${', '').replace('}', ''); |
| | | initValues[item.split('=')[0]] = this.sourceData[name] |
| | | } else { |
| | | if (dataStore.length < 1) { |
| | | if (this.dataStore.length < 1) { |
| | | isShow = false; |
| | | $webUtil.showErrorMsg("请å
鿩䏿¡æ°æ®"); |
| | | this.$message.error("请å
鿩䏿¡æ°æ®"); |
| | | return false; |
| | | } |
| | | var name = item.split('=')[1].replace('${', '').replace('}', ''); |
| | | item = item.split('=')[0] + '=' + dataStore[0][name]; |
| | | let name = item.split('=')[1].replace('${', '').replace('}', ''); |
| | | initValues[item.split('=')[0]] = this.dataStore[0][name]; |
| | | |
| | | } |
| | | } |
| | | initValues.push(item) |
| | | }) |
| | | paramVOS['initvalue'] = initValues.join(';') |
| | | }*/ |
| | | paramVOS['initvalue'] = initValues |
| | | } |
| | | if(paramVOS['BSContent'] || paramVOS['BSContext']){ |
| | | paramVOS['context']=paramVOS['BSContext'] || paramVOS['BSContent'] |
| | | paramVOS['content']=paramVOS['BSContext'] || paramVOS['BSContent']; |
| | | } |
| | | |
| | | const that=this; |
| | | doAction(item, { |
| | | paramVOS: paramVOS, |
| | | dataStore: this.dataStore || [], |
| | | sourceData: this.sourceData || {}, |
| | | callback: function () { |
| | | if (that.$parent.handleRefresh) { |
| | | that.$parent.handleRefresh() |
| | | if(isShow){ |
| | | doAction(item, { |
| | | paramVOS: paramVOS, |
| | | dataStore: this.dataStore || [], |
| | | sourceData: this.sourceData || {}, |
| | | callback: function () { |
| | | if (that.$parent.handleRefresh) { |
| | | that.$parent.handleRefresh() |
| | | } |
| | | } |
| | | } |
| | | }); |
| | | }); |
| | | } |
| | | } |
| | | }, |
| | | } |
| | |
| | | <template> |
| | | <div :id="'UI-dynamic-'+areasName+componentVO.oid" class="UI-dynamic"> |
| | | <avue-form v-model="form" :option="option"> |
| | | <template v-for="item in slotData" :slot="item.prop + 'Label'"> |
| | | <span> |
| | | <span>{{ item.label }} </span> |
| | | <el-tooltip |
| | | v-if="item.keyAttr" |
| | | class="item" |
| | | content="è¯¥å±æ§ä¸ºå
³é®å±æ§" |
| | | effect="dark" |
| | | placement="top-start" |
| | | > |
| | | <i class="el-icon-star-on" style="font-size: 17px !important; color: red;vertical-align: baseline;"></i> |
| | | </el-tooltip> |
| | | </span> |
| | | </template> |
| | | <template slot="menuForm"> |
| | | <dynamic-button :componentVO="componentVO" :butttonList="componentVO.buttons" :dataStore="[form]" :sourceData="sourceData" type="form" @buttonClick="buttonClick"></dynamic-button> |
| | | </template> |
| | | |
| | | <template v-for="item in slotData" :slot="item.prop + ''"> |
| | | <vciWebRefer v-if="item.type == 'refer'" |
| | | :key="item.prop" |
| | | :ref="'referFormRef'+item.prop" |
| | | :data-key="item.prop" |
| | | :disabled="item.disabled || false" |
| | | :display="item.display || true" |
| | | :referConfig="item.referConfig || {}" |
| | | :reloadFormKey="(item.referConfig.useFormKey && item.referConfig.formValues && item.referConfig.formValues[item.referConfig.useFormKey]) || ''" |
| | | :text="item.referConfig.showProp" |
| | | :value="item.prop || item.value" |
| | | referType="master" |
| | | @setReferValue="setReferValue"> |
| | | |
| | | </vciWebRefer> |
| | | </template> |
| | | </avue-form> |
| | | <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" |
| | | :formItems="this.componentVO.formDefineVO && this.componentVO.formDefineVO.items" |
| | | :formData="form"> |
| | | </basic-form> |
| | | </div> |
| | | </template> |
| | | |
| | | <script> |
| | | |
| | | import VciWebRefer from "@/components/refer/vciWebRefer"; |
| | | import {verifyNull, verifySlash} from "@/util/validate"; |
| | | |
| | | export default { |
| | | name: "dynamic-form", |
| | | components: {VciWebRefer}, |
| | | props: { |
| | | //uiä¸ä¸æçä¸å¡ç±»åï¼æé¾æ¥ç±»åï¼ |
| | | uiBtmType: { |
| | |
| | | }, |
| | | mounted() { |
| | | }, |
| | | computed: { |
| | | option() { |
| | | return { |
| | | submitBtn: false, |
| | | emptyBtn: false, |
| | | height: 300, |
| | | column: this.getColumnData() |
| | | } |
| | | }, |
| | | slotData() { |
| | | return this.getColumnData() |
| | | } |
| | | }, |
| | | watch: { |
| | | slotData: { |
| | | handler(newV) { |
| | | this.getDictList(newV) |
| | | }, |
| | | immediate: true, |
| | | }, |
| | | form: { |
| | | handler(val) { |
| | | if (val) { |
| | | if (Array.isArray(val)) { // æ£æ¥ val æ¯å¦ä¸ºæ°ç» |
| | | for (let code of val) { |
| | | if ( |
| | | code.type == "refer" && |
| | | code.referConfig && |
| | | code.referConfig.useFormKey |
| | | ) { |
| | | code.referConfig.formValues = val; |
| | | // code.referConfigTemp.options = code.referConfig; |
| | | } |
| | | } |
| | | } else if (typeof val === 'object') { // æ£æ¥ val æ¯å¦ä¸ºå¯¹è±¡ |
| | | // è¿ä»£å¯¹è±¡çé»è¾ |
| | | } |
| | | this.$emit("input", val); |
| | | form:{ |
| | | handler(newval) { |
| | | if(newval) { |
| | | this.$emit("setDataStore", { |
| | | area: this.areasName, |
| | | type:this.componentVO.uiComponentType, |
| | | btmType:this.componentVO.treeDefineVO.btmType, |
| | | dataStore:[newval] |
| | | }); |
| | | } |
| | | }, |
| | | deep: true, |
| | | immediate: true, |
| | | } |
| | | }, |
| | | sourceData: { |
| | | handler(newval) { |
| | | //æºæ°æ®æååæ¶åæ´å½ååºåæ°æ® |
| | | console.log(this.areasName); |
| | | console.log(newval); |
| | | this.handleRefresh(); |
| | | } |
| | | } |
| | | }, |
| | | methods: { |
| | | //è½¬åæ°æ® |
| | | formColumn(formList) { |
| | | return formList.map(item => { |
| | | const typeValue = item.type === 'text' ? 'input' : item.type === 'combox' ? 'select' : item.type; |
| | | handleRefresh(){ |
| | | |
| | | const focusFunc = item.type === 'refer' ? (i) => { |
| | | |
| | | } : undefined; |
| | | |
| | | |
| | | return { |
| | | label: item.text, |
| | | prop: item.field, |
| | | type: typeValue, |
| | | labelWidth: item.text.length >= 6 ? 115 : 90, |
| | | value: item.defaultValue, |
| | | dicData: item.type === 'combox' ? item.dicData : item.dicUrl, |
| | | readonly: item.readOnly, |
| | | disabled: item.disabled, |
| | | display: !item.hidden, |
| | | labelSuffix: item.suffix, |
| | | suffixIcon: item.prefix, |
| | | placeholder: item.placeholder, |
| | | clearable: item.clearable, |
| | | tip: item.tooltips, |
| | | keyAttr: item.keyAttr, |
| | | focus: focusFunc, |
| | | referConfig: item.referConfig, |
| | | rules: [{ |
| | | required: item.required, |
| | | message: `请è¾å
¥${item.text}!`, |
| | | trigger: "blur" |
| | | }] |
| | | }; |
| | | }); |
| | | }, |
| | | |
| | | //æ°æ®å¤ç©º |
| | | getColumnData() { |
| | | if (this.componentVO && this.componentVO.formDefineVO && this.componentVO.formDefineVO.items && this.componentVO.formDefineVO.items.length > 0) { |
| | | return this.formColumn(this.componentVO.formDefineVO.items) |
| | | } else { |
| | | return null; |
| | | } |
| | | }, |
| | | |
| | | buttonClick(item) { |
| | | console.log(item.id) |
| | | }, |
| | | async getDictList(val) { |
| | | for (let code of val) { |
| | | if (!verifyNull(code.dictData) && code.type == "select") { |
| | | if ( |
| | | verifySlash(code.dictCode) && |
| | | Object.prototype.hasOwnProperty.call(code, "dictCode") |
| | | ) { |
| | | const res = await getlistByCode(code.dictCode); |
| | | if (res.success) { |
| | | const dic = res.data; |
| | | code.dictData = dic.map((d) => { |
| | | return { |
| | | label: d.name, |
| | | key: d.code, |
| | | value: d.id, |
| | | }; |
| | | }); |
| | | } |
| | | } else { |
| | | this.getDicts(code.dictCode) |
| | | .then((res) => { |
| | | if (res.success) { |
| | | const dic = res.obj.datas; |
| | | code.dictData = dic.map((d) => { |
| | | return { |
| | | label: d.name, |
| | | key: d.code, |
| | | value: d.code, |
| | | }; |
| | | }); |
| | | } |
| | | }) |
| | | .catch(() => { |
| | | this.$message.error(` æ°æ®åå
¸${code.dictCode}é误`); |
| | | }); |
| | | } |
| | | } |
| | | if (code.type == "refer") { |
| | | if (code.referConfig && code.referConfig.useFormKey) { |
| | | if (verifyNull(code.referConfig.formValuesKey)) { |
| | | code.referConfig.formValuesKey = "form"; |
| | | } |
| | | code.referConfig.formValues = this[code.referConfig.formValuesKey]; |
| | | } |
| | | code.referConfigTemp = { |
| | | title: code.label, |
| | | showProp: |
| | | code.showProp || code.referConfig.showProp || code.prop + "Name", |
| | | prop: code.prop, |
| | | propMap: code.propMap || {}, |
| | | placeholder: code.placeholder |
| | | ? code.placeholder |
| | | : ` è¯·éæ©` + code.label, |
| | | options: code.referConfig, |
| | | }; |
| | | } |
| | | } |
| | | this.formTemplateData = val; |
| | | }, |
| | | setReferValue(data) { |
| | | if (data && data.prop) { |
| | | this.form[data.prop] = data.value || ""; |
| | | this.form[data.showProp] = data.text || ""; |
| | | if (data.propMap) { |
| | | //说æéè¦æ å° |
| | | for (let key in data.propMap) { |
| | | let mapFields = data.propMap[key].split(","); |
| | | let value = []; |
| | | data.rawData.forEach((_item) => { |
| | | var temp; |
| | | if (!_item.extendData) { |
| | | _item.extendData = {}; |
| | | } |
| | | if (mapFields.length == 1) { |
| | | var mapField = mapFields[0]; |
| | | temp = _item[mapField] || _item["extendData"][mapField]; |
| | | } else { |
| | | //æå¤ä¸ª |
| | | var mutiTemp = []; |
| | | mapFields.forEach((_itemField) => { |
| | | mutiTemp.push( |
| | | _item[_itemField] || _item["extendData"][_itemField] |
| | | ); |
| | | }); |
| | | temp = mutiTemp.join(" "); |
| | | } |
| | | if (temp != null && temp != "") { |
| | | value.push(temp); |
| | | } |
| | | }); |
| | | this.form[key] = value.join(","); |
| | | } |
| | | } |
| | | } |
| | | }, |
| | | } |
| | | } |
| | | } |
| | | </script> |
| | |
| | | import website from '@/config/website'; |
| | | import crudCommon from '@/mixins/crud'; |
| | | import Divider from '@/components/Divider/index' |
| | | //表åç»ä»¶ |
| | | import basicForm from "@/components/PLT-basic-component/basicForm"; |
| | | // ä¸å¡ç»ä»¶ |
| | | import tenantPackage from './views/system/tenantpackage'; |
| | | // åºç¡ç»å®è¡¨åæé® |
| | | import dynamicButton from '@/components/dynamic-components/dynamic-button' |
| | | // åºç¡å¨æå¼¹çªè¡¨åç»ä»¶ |
| | | import dynamicTableForm from '@/components/dynamic-components/dynamic-table-form' |
| | | // åºå®è¡¨åç»ä»¶ |
| | | // uiå®ä¹è¡¨åç»ä»¶ |
| | | import dynamicForm from '@/components/dynamic-components/dynamic-form' |
| | | // 坿æ¬ç»ä»¶ |
| | | import richText from '@/components/PLT-basic-component/richText' |
| | |
| | | // 注åå
¨å±å®¹å¨ |
| | | Vue.component('basicContainer', basicContainer); |
| | | Vue.component('basicBlock', basicBlock); |
| | | Vue.component('basicForm', basicForm); |
| | | Vue.component('thirdRegister', thirdRegister); |
| | | Vue.component('avueUeditor', avueUeditor); |
| | | Vue.component('flowDesign', flowDesign); |