From 8bc25357d5742f07710baa7a6f1d6ac4023da3ac Mon Sep 17 00:00:00 2001 From: wangting <wangting@vci-tech.com> Date: 星期三, 25 十二月 2024 12:00:55 +0800 Subject: [PATCH] Merge remote-tracking branch 'origin/master' --- Source/plt-web/plt-web-ui/src/views/modelingMenu/ui/formDefine/components/formDialog.vue | 1550 ++++++++++++++++++++++++++++++++++++++++++++++++++--------- 1 files changed, 1,301 insertions(+), 249 deletions(-) diff --git a/Source/plt-web/plt-web-ui/src/views/modelingMenu/ui/formDefine/components/formDialog.vue b/Source/plt-web/plt-web-ui/src/views/modelingMenu/ui/formDefine/components/formDialog.vue index 87c22e0..eeeb527 100644 --- a/Source/plt-web/plt-web-ui/src/views/modelingMenu/ui/formDefine/components/formDialog.vue +++ b/Source/plt-web/plt-web-ui/src/views/modelingMenu/ui/formDefine/components/formDialog.vue @@ -5,138 +5,210 @@ :visible.sync="visible" append-to-body="true" class="avue-dialog" - title="" + title="琛ㄥ崟" width="100%" @close="closeDialog" > <el-container> - <div style="height: 80vh;display: flex;width: 100%;"> - - <el-aside width="15%"> + <div style="height: 79vh;display: flex;width: 100%;"> + <el-aside width="17%"> <basic-container> <div style="height:650px;"> <avue-tree :data="treeData" - :option="treeOption"></avue-tree> + :loading="treeLoading" + :option="treeOption" + @node-drag-start="handleDragStart"> + </avue-tree> </div> </basic-container> </el-aside> <el-main> <basic-container> - <div style="height: 650px"> + <div style="height: 645px;overflow-y: auto;padding-right: 5px" @drop="drop" @dragover.prevent> <div style="display: flex;justify-content: center"> <span style="display: flex;align-items: center; margin-right: 5px;"> <p class="tableTopLabel">鍚嶇О锛�</p> - <el-input v-model="name" placeholder="璇疯緭鍏ュ唴瀹�" size="mini"></el-input> + <el-input v-model="topForm.viName" placeholder="璇疯緭鍏ュ悕绉�" size="mini"></el-input> </span> <span style="display: flex;align-items: center; margin-right: 5px;"> <p class="tableTopLabel">鏌ヨ妯℃澘鍚嶇О锛�</p> - <el-input v-model="name" placeholder="璇疯緭鍏ュ唴瀹�" size="mini"></el-input> + <el-select v-model="topForm.itemQtName" placeholder="璇烽�夋嫨鏌ヨ妯℃澘" size="mini"> + <el-option v-for="(item,index) in searchQtNameList" :key="index" :label="item.qtName" + :value="item.qtName"></el-option> + </el-select> </span> <span style="display: flex;align-items: center; margin-right: 5px;"> <p class="tableTopLabel">鏄剧ず鍒楁暟锛�</p> - <el-input v-model="name" placeholder="璇疯緭鍏ュ唴瀹�" size="mini"></el-input> - <el-button plain size="mini" style="margin-left: 3px" type="success">璁剧疆</el-button> + <el-input v-model="topForm.showColumn" placeholder="璇疯緭鍏ュ唴瀹�" size="mini"></el-input> + <el-button plain size="mini" style="margin-left: 3px" type="success" + @click="setColumnHandler">璁剧疆</el-button> </span> <span style="display: flex;align-items: center; margin-right: 5px;"> <p class="tableTopLabel">浣嶇疆锛�</p> - <el-input v-model="name" placeholder="璇疯緭鍏ュ唴瀹�" size="mini"></el-input> - <el-button plain size="mini" style="margin-left: 3px" type="success">璋冩暣浣嶇疆</el-button> + <el-input v-model="topForm.position" placeholder="璇疯緭鍏ュ唴瀹�" size="mini"></el-input> + <el-button plain size="mini" style="margin-left: 3px" type="success" @click="positionClickHandler">璋冩暣浣嶇疆</el-button> </span> </div> <h3>椤甸潰瀹氫箟</h3> <el-form ref="form" :model="form" :rules="rules" label-width="100px"> <el-row> - <el-col :span="columnNumber"> - <el-tooltip content="categoryoid.lastmodifytime" placement="top"> - <el-form-item class="hiddenLabel" label="categoryoid.lastmodifytime"> - <el-input v-model="user" placeholder="瀹℃壒浜�"></el-input> - </el-form-item> - </el-tooltip> + <el-col v-for="(item,index) in formList" :key="index" :span="topForm.columnNumber"> + <el-form-item :class="['hiddenLabel', { 'active-border': activeItem.text === item.text }]" + :label="item.text + '锛�'" + style="padding-left: 5px" @click.native="formItemClick(item,index)"> + <el-input + v-if="item.itemType === 'text' || + item.itemType === 'custom' || + item.itemType === 'customform'|| + item.itemType === 'hidden' || + item.itemType === 'specialCharacter'" + v-model="item.value" :placeholder="item.text" + size="mini"></el-input> + + <div v-if="item.itemType === 'textbtn'" style="display: flex;align-items: center"> + <el-input v-model="item.value" :placeholder="item.text" size="mini"></el-input> + <el-button icon="el-icon-edit" plain size="mini" style="height: 28px;" + type="primary"></el-button> + </div> + <el-input + v-if="item.itemType === 'textarea' || item.itemType === 'richtext' || item.itemType === 'webeditor'" + v-model="item.value" + :placeholder="item.text"> + </el-input> + <el-input-number v-if="item.itemType === 'number'" v-model="item.value" :max="99999" :min="1" + size="mini"></el-input-number> + <el-input v-if="item.itemType === 'password'" v-model="input" placeholder="璇疯緭鍏ュ瘑鐮�" + show-password></el-input> + <el-radio v-if="item.itemType === 'radio'" v-model="item.value"></el-radio> + <el-checkbox v-if="item.itemType === 'checkbox'" v-model="item.value"></el-checkbox> + <el-select v-if="item.itemType === 'select' || item.itemType === 'multiselect'" + v-model="item.value" :disabled="false" placeholder="璇烽�夋嫨" size="mini"> + </el-select> + <el-date-picker + v-if="item.itemType === 'date' || item.itemType === 'datetime'" + v-model="item.value" + :placeholder="item.itemType === 'date' ? '璇烽�夋嫨鏃ユ湡' : '璇烽�夋嫨鏃ユ湡鏃堕棿'" + class="formItemMargin" + type="date"> + </el-date-picker> + + <el-time-select + v-if="item.itemType === 'time'" + v-model="item.value" + :picker-options="{ + start: '08:30', + step: '00:15', + end: '18:30' + }" + class="formItemMargin" + placeholder="閫夋嫨鏃堕棿"> + </el-time-select> + <el-button v-if="item.itemType === 'file'" + v-model="item.value" plain size="mini" type="primary"> + 涓婁紶鏂囦欢 + </el-button> + <el-button v-if="item.itemType === 'multiFile'" + v-model="item.value" plain size="mini" type="primary"> + 澶氭枃浠朵笂浼� + </el-button> + + </el-form-item> </el-col> </el-row> </el-form> </div> <div style="display: flex;justify-content: center;margin-top: 15px"> - <el-button icon="el-icon-check" size="small" type="primary">淇濆瓨</el-button> - <el-button icon="el-icon-delete" plain size="small" type="danger">娓呯┖</el-button> - <el-button icon="el-icon-el-icon-close" plain size="small" type="primary">鍒犻櫎缁勪欢</el-button> - <el-button icon="el-icon-plus" plain size="small" type="primary">娣诲姞鑷畾涔夌粍浠�</el-button> - <el-button icon="el-icon-zoom-in" plain size="small" type="primary">棰勮</el-button> + <el-button icon="el-icon-check" size="small" type="primary" @click="saveClickHandler">淇濆瓨</el-button> + <el-button icon="el-icon-delete" plain size="small" type="danger" @click="emptyClickHandler">娓呯┖ + </el-button> + <el-button icon="el-icon-close" plain size="small" type="primary" @click="delModuleClickHandler">鍒犻櫎缁勪欢 + </el-button> + <el-button icon="el-icon-plus" plain size="small" type="primary" @click="addCustomClickHandler">娣诲姞鑷畾涔夌粍浠� + </el-button> + <el-button icon="el-icon-zoom-in" plain size="small" type="primary" @click="checkViewHandler">棰勮 + </el-button> </div> </basic-container> </el-main> <el-aside width="25%"> <basic-container> - <div style="height: 700px; overflow-y: auto;padding-right: 10px"> + <div style="height: 660px; overflow-y: auto;padding-right: 10px"> <h3>璁剧疆</h3> + <h4 style="color: red">灞炴�ц缃俊鎭悗闇�鍗曞嚮鍙充笅瑙掑簲鐢ㄦ寜閽繘琛屽簲鐢�</h4> <el-form ref="form" :model="form" :rules="rules" label-position="left" label-width="85px"> <el-row style="border-bottom: 1px solid #878585;padding-bottom: 10px"> <el-col :span="24"> <el-form-item label="浣跨敤瀛楁"> - <div style="display: flex"> - <el-input v-model="user" placeholder="璇疯緭鍏ュ唴瀹�" size="mini"></el-input> - <el-checkbox v-model="checked" style="margin-left: 5px; margin-right: 5px">鍙</el-checkbox> - <el-checkbox v-model="checked" style="margin-left: 5px;margin-right: 0px">蹇呭~</el-checkbox> + <div style="display: flex;align-items: center"> + <el-input v-model="form.text" :readonly="true" placeholder="璇疯緭鍏ヤ娇鐢ㄥ瓧娈�" size="mini"></el-input> + <el-checkbox v-model="form.itemIsEditable" false-label="0" + style="margin-left: 5px; margin-right: 5px" + true-label="1">鍙 + </el-checkbox> + <el-checkbox v-model="form.itemIsRequired" false-label="0" + style="margin-left: 5px;margin-right: 0px" + true-label="1">蹇呭~ + </el-checkbox> </div> </el-form-item> </el-col> <el-col :span="12"> <el-form-item label="鏄剧ず鍚嶇О"> - <el-input v-model="user" placeholder="璇疯緭鍏ュ唴瀹�" size="mini"></el-input> + <el-input v-model="form.itemName" placeholder="璇疯緭鍏ュ唴瀹�" size="mini"></el-input> </el-form-item> </el-col> <el-col :span="12"> <el-form-item class="rightLabel" label="鏄剧ず绫诲瀷"> - <el-select v-model="form.region" placeholder="璇烽�夋嫨娲诲姩鍖哄煙" size="mini"> - <el-option label="鍖哄煙涓�" value="shanghai"></el-option> - <el-option label="鍖哄煙浜�" value="beijing"></el-option> + <el-select v-model="form.itemType" placeholder="璇烽�夋嫨绫诲瀷" size="mini" @change="itemTypeChange"> + <el-option v-for="(item,index) in showSelectList" :key="index" :label="item.label" + :value="item.value"></el-option> </el-select> </el-form-item> </el-col> <el-col :span="24"> <el-tooltip content="榛樿鍊艰〃杈惧紡" placement="top"> - <el-form-item label="榛樿鍊艰〃杈惧紡" class="hiddenLabel"> - <el-input v-model="user" placeholder="璇疯緭鍏ュ唴瀹�" size="mini"></el-input> + <el-form-item class="hiddenLabel" label="榛樿鍊艰〃杈惧紡"> + <el-input v-model="form.itemValue" placeholder="璇疯緭鍏ュ唴瀹�" size="mini"></el-input> </el-form-item> </el-tooltip> </el-col> <el-col :span="24"> - <!-- <el-tooltip content="鏄剧ず琛ㄨ揪寮�" placement="top">--> + <!-- <el-tooltip content="鏄剧ず琛ㄨ揪寮�" placement="top">--> <el-form-item label="鏄剧ず琛ㄨ揪寮�"> - <el-input v-model="user" placeholder="璇疯緭鍏ュ唴瀹�" size="mini"></el-input> + <el-input v-model="form.itemShowExpression" placeholder="璇疯緭鍏ュ唴瀹�" size="mini"></el-input> </el-form-item> - <!-- </el-tooltip>--> + <!-- </el-tooltip>--> </el-col> <el-col :span="24"> <el-tooltip content="鏃ユ湡鏍煎紡鍖栧瓧绗︿覆" placement="top"> - <el-form-item label="鏃ユ湡鏍煎紡鍖栧瓧绗︿覆锛�" class="hiddenLabel"> - <el-input v-model="user" placeholder="璇疯緭鍏ュ唴瀹�" size="mini"></el-input> + <el-form-item class="hiddenLabel" label="鏃ユ湡鏍煎紡鍖栧瓧绗︿覆锛�"> + <el-input v-model="form.itemDateFormat" placeholder="璇疯緭鍏ュ唴瀹�" size="mini"></el-input> </el-form-item> </el-tooltip> </el-col> <el-col :span="24"> <el-form-item label="鍗犱綅鏂瑰紡"> - <el-radio v-model="treeRadio" label="0">鏄剧ず</el-radio> - <el-radio v-model="treeRadio" label="1">涓嶆樉绀�</el-radio> + <el-radio v-model="form.itemCols" label="1">鏄剧ず</el-radio> + <el-radio v-model="form.itemCols" label="2">涓嶆樉绀�</el-radio> </el-form-item> </el-col> <el-col :span="24" style="height: 90px"> <el-form-item label="瀛楁琛ㄨ揪寮�"> <el-input - v-model="textarea2" + v-model="form.itemAddFilter" :rows="3" placeholder="璇疯緭鍏ュ唴瀹�" resize="none" @@ -147,9 +219,9 @@ <el-col :span="24" style="height: 90px"> <el-tooltip content="鍙閫夋嫨鏉′欢" placement="top"> - <el-form-item label="鍙閫夋嫨鏉′欢" class="hiddenLabel"> + <el-form-item class="hiddenLabel" label="鍙閫夋嫨鏉′欢"> <el-input - v-model="textarea2" + v-model="form.itemEditableProgram" :rows="3" placeholder="璇疯緭鍏ュ唴瀹�" resize="none" @@ -161,31 +233,33 @@ <el-col :span="12"> <el-form-item label="鎺у埗鍒�"> - <el-input v-model="user" placeholder="璇疯緭鍏ュ唴瀹�" size="mini"></el-input> + <el-input v-model="form.itemCtrlDisplyCol" placeholder="璇疯緭鍏ュ唴瀹�" size="mini"></el-input> </el-form-item> </el-col> <el-col :span="12"> <el-form-item class="rightLabel" label="鏄剧ず鍒楁潯浠�" label-width="95px"> - <el-input v-model="user" placeholder="璇疯緭鍏ュ唴瀹�" size="mini"></el-input> + <el-input v-model="form.itemCtrlDisplyCondition" placeholder="璇疯緭鍏ュ唴瀹�" size="mini"></el-input> </el-form-item> </el-col> <el-col :span="24"> <el-form-item label="鏉冮檺鎺у埗"> <div style="display: flex;align-items: center"> - <el-input v-model="user" placeholder="璇疯緭鍏ュ唴瀹�" size="mini"></el-input> - <el-button plain size="mini" style="margin-left: 3px" type="success">閫夋嫨</el-button> + <el-input v-model="form.itemRight" placeholder="璇疯緭鍏ュ唴瀹�" size="mini"></el-input> + <el-button plain size="mini" style="margin-left: 3px" type="success" @click="authClickHandler"> + 閫夋嫨 + </el-button> </div> </el-form-item> </el-col> </el-row> - <el-row style="margin-top: 10px;border-bottom: 1px solid #878585;padding-bottom: 10px""> + <el-row style="margin-top: 10px;border-bottom: 1px solid #878585;padding-bottom: 10px"> <el-col :span="24" style="height: 90px"> <el-form-item label="鑴氭湰楠岃瘉"> <el-input - v-model="textarea2" + v-model="form.itemScript" :rows="3" placeholder="璇疯緭鍏ュ唴瀹�" resize="none" @@ -197,7 +271,7 @@ <el-col :span="24" style="height: 90px"> <el-form-item label="鎻愮ず鏂囧瓧"> <el-input - v-model="textarea2" + v-model="form.itemTips" :rows="3" placeholder="璇疯緭鍏ュ唴瀹�" resize="none" @@ -208,40 +282,113 @@ <el-col :span="24"> <el-form-item label="鏌ヨ鍏宠仈鍒�"> - <el-input v-model="user" placeholder="璇疯緭鍏ュ唴瀹�" size="mini"></el-input> + <el-input v-model="form.itemQueryRefFields" placeholder="璇疯緭鍏ュ唴瀹�" size="mini"></el-input> </el-form-item> </el-col> <el-col :span="24"> <el-form-item label="鑷畾涔夌被"> - <el-input v-model="user" placeholder="璇疯緭鍏ュ唴瀹�" size="mini"></el-input> + <el-input v-model="form.itemCustomClass" placeholder="璇疯緭鍏ュ唴瀹�" size="mini"></el-input> </el-form-item> </el-col> <el-col :span="24"> - <el-form-item label="瀛樺偍璺緞" > - <el-input v-model="user" placeholder="璇疯緭鍏ュ唴瀹�" size="mini"></el-input> + <el-form-item label="瀛樺偍璺緞"> + <el-input v-model="form.itemHttpVolumnPath" placeholder="璇疯緭鍏ュ唴瀹�" size="mini"></el-input> </el-form-item> </el-col> <el-col :span="24"> <el-tooltip content="瀛樺偍璺緞瀛楁" placement="top"> - <el-form-item label="瀛樺偍璺緞瀛楁" class="hiddenLabel"> - <div style="display: flex"> - <el-input v-model="user" placeholder="璇疯緭鍏ュ唴瀹�" size="mini"></el-input> - <el-checkbox v-model="checked" style="margin-left: 5px">http瀛樺偍</el-checkbox> - </div> - </el-form-item> + <el-form-item class="hiddenLabel" label="瀛樺偍璺緞瀛楁"> + <div style="display: flex"> + <el-input v-model="form.itemHttpPathField" placeholder="璇疯緭鍏ュ唴瀹�" size="mini"></el-input> + <el-checkbox v-model="form.itemIsHttpSave" style="margin-left: 5px">http瀛樺偍</el-checkbox> + </div> + </el-form-item> </el-tooltip> </el-col> </el-row> - <el-row style="margin-top: 10px"> + <el-row v-if="form.itemType ? optionTypeStatus : true" + style="margin-top: 10px;border-bottom: 1px solid #878585;padding-bottom: 10px"> + <h4>閫夐」鍒楄〃</h4> + <el-col :span="12"> + <el-form-item label="鍚嶇О"> + <el-input v-model="optionObj.optionName" placeholder="璇疯緭鍏ュ悕绉�" size="mini"></el-input> + </el-form-item> + </el-col> + + <el-col :span="12"> + <el-form-item class="rightLabel" label="鍊�" label-width="95px"> + <el-input v-model="optionObj.optionValue" placeholder="璇疯緭鍏ュ唴瀹�" size="mini"></el-input> + </el-form-item> + </el-col> + + <el-col :span="24" style="height: 190px"> + <el-form-item> + <div style="height: 150px; width: 100%; border: 1px solid #bdbbbb;overflow-y: auto"> + <el-table + :data="form.itemKeyValueList" + :highlight-current-row="true" + :show-header="false" + border + stripe + style="width: 100%" + @row-click="optionTableClick"> + <el-table-column + align="center" + label="鍚嶇О" + prop="key"> + <template slot-scope="scope"> + <el-tag size="medium">{{ scope.row.key }}</el-tag> + </template> + </el-table-column> + <el-table-column + align="center" + label="鍊�" + prop="value"> + <template slot-scope="scope"> + <el-tag size="medium">{{ scope.row.value }}</el-tag> + </template> + </el-table-column> + </el-table> + </div> + <div style="display: flex;align-items: center;justify-content: center;margin-top: 5px"> + <el-button plain size="mini" style="margin-right: 5px" type="success" + @click="optionAddClickHandler">娣诲姞 + </el-button> + <el-button plain size="mini" style="margin-left: 5px" type="danger" + @click="optionDeleteClickHandler">鍒犻櫎 + </el-button> + </div> + </el-form-item> + </el-col> + + <el-col :span="24"> + <el-form-item label="涓�绾у弬鐓�"> + <el-input v-model="form.itemListTable" placeholder="璇疯緭鍏ュ唴瀹�" size="mini"></el-input> + </el-form-item> + </el-col> + + <el-col :span="24"> + <el-form-item label="浜岀骇鍙傜収"> + <el-input v-model="form.itemListTxt" placeholder="璇疯緭鍏ュ唴瀹�" size="mini"></el-input> + </el-form-item> + </el-col> + + <el-col :span="24"> + <el-form-item label="鍙傜収鍊�"> + <el-input v-model="form.itemListVal" placeholder="璇疯緭鍏ュ唴瀹�" size="mini"></el-input> + </el-form-item> + </el-col> + </el-row> + <el-row v-if="form.itemType ? itemStyleTypeStatus : true" style="margin-top: 10px"> <el-col :span="24" style="height: 90px"> <el-form-item label="闄勫姞灞炴��"> <el-input - v-model="textarea2" + v-model="form.itemStyle" :rows="3" placeholder="璇疯緭鍏ュ唴瀹�" resize="none" @@ -250,230 +397,1130 @@ </el-form-item> </el-col> </el-row> + </el-form> + </div> + <div style="display: flex;justify-content: right"> + <el-button plain size="mini" style="margin-top: 10px" type="success" @click="asideFormHandler">搴旂敤 + </el-button> </div> </basic-container> </el-aside> - </div> - </el-container> + + <!-- 娣诲姞鑷畾涔夌粍浠� --> + + <el-dialog + v-dialogDrag + v-loading="customLoading" + :visible.sync="customVisible" + append-to-body="true" + class="avue-dialog" + title="琛ㄥ崟" + width="50%" + @close="closeCustomDialog"> + <el-form ref="form" :model="customForm" :rules="rules" label-position="left" label-width="85px"> + <el-row style="border-bottom: 1px solid #878585;padding-bottom: 10px"> + <el-col :span="24"> + <el-form-item label="浣跨敤瀛楁"> + <div style="display: flex;align-items: center"> + <div style="display: flex;align-items: center"> + <el-input v-model="customForm.text" placeholder="璇疯緭鍏ヤ娇鐢ㄥ瓧娈�" size="mini"></el-input> + <el-button plain size="mini" style="margin-left: 3px" type="success" @click="customTextHandler">閫夋嫨 + </el-button> + </div> + <el-checkbox v-model="customForm.itemIsEditable" style="margin-left: 5px; margin-right: 5px">鍙 + </el-checkbox> + <el-checkbox v-model="customForm.itemIsRequired" style="margin-left: 5px;margin-right: 0px">蹇呭~ + </el-checkbox> + </div> + </el-form-item> + </el-col> + + <el-col :span="12"> + <el-form-item label="鏄剧ず鍚嶇О"> + <el-input v-model="customForm.itemName" placeholder="璇疯緭鍏ュ唴瀹�" size="mini"></el-input> + </el-form-item> + </el-col> + + <el-col :span="12"> + <el-form-item class="rightLabel" label="鏄剧ず绫诲瀷"> + <el-select v-model="customForm.itemType" placeholder="璇烽�夋嫨绫诲瀷" size="mini" @change="customItemTypeChange"> + <el-option v-for="(item,index) in showSelectList" :key="index" :label="item.label" + :value="item.value"></el-option> + </el-select> + </el-form-item> + </el-col> + + <el-col :span="24"> + <el-tooltip content="榛樿鍊艰〃杈惧紡" placement="top"> + <el-form-item class="hiddenLabel" label="榛樿鍊艰〃杈惧紡"> + <el-input v-model="customForm.itemValue" placeholder="璇疯緭鍏ュ唴瀹�" size="mini"></el-input> + </el-form-item> + </el-tooltip> + </el-col> + + <el-col :span="24"> + <!-- <el-tooltip content="鏄剧ず琛ㄨ揪寮�" placement="top">--> + <el-form-item label="鏄剧ず琛ㄨ揪寮�"> + <el-input v-model="customForm.itemShowExpression" placeholder="璇疯緭鍏ュ唴瀹�" size="mini"></el-input> + </el-form-item> + <!-- </el-tooltip>--> + </el-col> + + <el-col :span="24"> + <el-tooltip content="鏃ユ湡鏍煎紡鍖栧瓧绗︿覆" placement="top"> + <el-form-item class="hiddenLabel" label="鏃ユ湡鏍煎紡鍖栧瓧绗︿覆锛�"> + <el-input v-model="customForm.itemDateFormat" placeholder="璇疯緭鍏ュ唴瀹�" size="mini"></el-input> + </el-form-item> + </el-tooltip> + </el-col> + + <el-col :span="24"> + <el-form-item label="鍗犱綅鏂瑰紡"> + <el-radio v-model="customForm.itemCols" label="1">鏄剧ず</el-radio> + <el-radio v-model="customForm.itemCols" label="2">涓嶆樉绀�</el-radio> + </el-form-item> + </el-col> + + <el-col :span="24" style="height: 90px"> + <el-form-item label="瀛楁琛ㄨ揪寮�"> + <el-input + v-model="customForm.itemAddFilter" + :rows="3" + placeholder="璇疯緭鍏ュ唴瀹�" + resize="none" + type="textarea"> + </el-input> + </el-form-item> + </el-col> + + <el-col :span="24" style="height: 90px"> + <el-tooltip content="鍙閫夋嫨鏉′欢" placement="top"> + <el-form-item class="hiddenLabel" label="鍙閫夋嫨鏉′欢"> + <el-input + v-model="customForm.itemEditableProgram" + :rows="3" + placeholder="璇疯緭鍏ュ唴瀹�" + resize="none" + type="textarea"> + </el-input> + </el-form-item> + </el-tooltip> + </el-col> + + <el-col :span="12"> + <el-form-item label="鎺у埗鍒�"> + <el-input v-model="customForm.itemCtrlDisplyCol" placeholder="璇疯緭鍏ュ唴瀹�" size="mini"></el-input> + </el-form-item> + </el-col> + + <el-col :span="12"> + <el-form-item class="rightLabel" label="鏄剧ず鍒楁潯浠�" label-width="95px"> + <el-input v-model="customForm.itemCtrlDisplyCondition" placeholder="璇疯緭鍏ュ唴瀹�" size="mini"></el-input> + </el-form-item> + </el-col> + + <el-col :span="24"> + <el-form-item label="灞炴�ф潈闄�"> + <div style="display: flex;align-items: center"> + <el-input v-model="customForm.itemRight" placeholder="璇疯緭鍏ュ唴瀹�" size="mini"></el-input> + <el-button plain size="mini" style="margin-left: 3px" type="success" @click="customAuthClickHandler"> + 閫夋嫨 + </el-button> + </div> + </el-form-item> + </el-col> + + </el-row> + <el-row style="margin-top: 10px;border-bottom: 1px solid #878585;padding-bottom: 10px"> + <el-col :span="24" style="height: 90px"> + <el-form-item label="鑴氭湰楠岃瘉"> + <el-input + v-model="customForm.itemScript" + :rows="3" + placeholder="璇疯緭鍏ュ唴瀹�" + resize="none" + type="textarea"> + </el-input> + </el-form-item> + </el-col> + + <el-col :span="24" style="height: 90px"> + <el-form-item label="鎻愮ず鏂囧瓧"> + <el-input + v-model="customForm.itemTips" + :rows="3" + placeholder="璇疯緭鍏ュ唴瀹�" + resize="none" + type="textarea"> + </el-input> + </el-form-item> + </el-col> + + <el-col :span="24"> + <el-form-item label="鏌ヨ鍏宠仈鍒�"> + <el-input v-model="customForm.itemQueryRefFields" placeholder="璇疯緭鍏ュ唴瀹�" size="mini"></el-input> + </el-form-item> + </el-col> + + <el-col :span="24"> + <el-form-item label="鑷畾涔夌被"> + <el-input v-model="customForm.itemCustomClass" placeholder="璇疯緭鍏ュ唴瀹�" size="mini"></el-input> + </el-form-item> + </el-col> + + <el-col :span="24"> + <el-form-item label="瀛樺偍璺緞"> + <el-input v-model="customForm.itemHttpVolumnPath" placeholder="璇疯緭鍏ュ唴瀹�" size="mini"></el-input> + </el-form-item> + </el-col> + + <el-col :span="24"> + <el-tooltip content="瀛樺偍璺緞瀛楁" placement="top"> + <el-form-item class="hiddenLabel" label="瀛樺偍璺緞瀛楁"> + <div style="display: flex"> + <el-input v-model="customForm.itemHttpPathField" placeholder="璇疯緭鍏ュ唴瀹�" size="mini"></el-input> + <el-checkbox v-model="customForm.itemIsHttpSave" style="margin-left: 5px">http瀛樺偍</el-checkbox> + </div> + </el-form-item> + </el-tooltip> + </el-col> + + </el-row> + + <el-row v-if="customForm.itemType ? customOptionTypeStatus : true" + style="margin-top: 10px;border-bottom: 1px solid #878585;padding-bottom: 10px"> + <h4>閫夐」鍒楄〃</h4> + <el-col :span="12"> + <el-form-item label="鍚嶇О"> + <el-input v-model="customOptionObj.optionName" placeholder="璇疯緭鍏ュ悕绉�" size="mini"></el-input> + </el-form-item> + </el-col> + + <el-col :span="12"> + <el-form-item class="rightLabel" label="鍊�" label-width="95px"> + <el-input v-model="customOptionObj.optionValue" placeholder="璇疯緭鍏ュ唴瀹�" size="mini"></el-input> + </el-form-item> + </el-col> + + <el-col :span="24" style="height: 190px"> + <el-form-item> + <div style="height: 150px; width: 100%; border: 1px solid #bdbbbb;overflow-y: auto"> + <el-table + :data="customForm.itemKeyValueList" + :highlight-current-row="true" + :show-header="false" + border + stripe + style="width: 100%" + @row-click="customOptionTableClick"> + <el-table-column + align="center" + label="鍚嶇О" + prop="key"> + <template slot-scope="scope"> + <el-tag size="medium">{{ scope.row.key }}</el-tag> + </template> + </el-table-column> + <el-table-column + align="center" + label="鍊�" + prop="value"> + <template slot-scope="scope"> + <el-tag size="medium">{{ scope.row.value }}</el-tag> + </template> + </el-table-column> + </el-table> + </div> + <div style="display: flex;align-items: center;justify-content: center;margin-top: 5px"> + <el-button plain size="mini" style="margin-right: 5px" type="success" + @click="optionAddClickHandler('dialog')">娣诲姞 + </el-button> + <el-button plain size="mini" style="margin-left: 5px" type="danger" + @click="optionDeleteClickHandler('dialog')">鍒犻櫎 + </el-button> + </div> + </el-form-item> + </el-col> + + <el-col :span="24"> + <el-form-item label="涓�绾у弬鐓�"> + <el-input v-model="customForm.itemListTable" placeholder="璇疯緭鍏ュ唴瀹�" size="mini"></el-input> + </el-form-item> + </el-col> + + <el-col :span="24"> + <el-form-item label="浜岀骇鍙傜収"> + <el-input v-model="customForm.itemListTxt" placeholder="璇疯緭鍏ュ唴瀹�" size="mini"></el-input> + </el-form-item> + </el-col> + + <el-col :span="24"> + <el-form-item label="鍙傜収鍊�"> + <el-input v-model="customForm.itemListVal" placeholder="璇疯緭鍏ュ唴瀹�" size="mini"></el-input> + </el-form-item> + </el-col> + </el-row> + <el-row v-if="customForm.itemType ? customItemStyleTypeStatus : true" style="margin-top: 10px"> + <el-col :span="24" style="height: 90px"> + <el-form-item label="闄勫姞灞炴��"> + <el-input + v-model="customForm.itemStyle" + :rows="3" + placeholder="璇疯緭鍏ュ唴瀹�" + resize="none" + type="textarea"> + </el-input> + </el-form-item> + </el-col> + </el-row> + + </el-form> + <span slot="footer" class="dialog-footer"> + <el-button @click="customVisible = false">鍙� 娑�</el-button> + <el-button type="primary" @click="customSaveHandler">纭� 瀹�</el-button> + </span> + </el-dialog> + <!-- 娣诲姞鑷畾涔夌粍浠堕�夋嫨灞炴�ф睜灞炴�у璇濇 --> + <el-dialog + v-dialogDrag + :visible.sync="customAttrVisible" + append-to-body="true" + class="avue-dialog" + title="閫夋嫨灞炴��" + width="50%"> + <avue-crud + ref="userCrud" + :data="customAttrData" + :option="customAttrOption" + :page.sync="page" + :table-loading="customAttrLoading" + @row-click="customAttrRowClickHandler" + > + </avue-crud> + <span slot="footer" class="dialog-footer"> + <el-button @click="customAttrVisible = false">鍙� 娑�</el-button> + <el-button type="primary" @click="customAttrSaveHandler">纭� 瀹�</el-button> + </span> + </el-dialog> + <!-- 棰勮 --> + <el-dialog + v-dialogDrag + :visible.sync="checkViewVisible" + append-to-body="true" + class="avue-dialog" + title="棰勮" + width="60%"> + <div style="height: 600px"> + <el-form ref="form" :model="form" :rules="rules" label-width="100px"> + <el-row> + <el-col v-for="(item,index) in formList" :key="index" :span="topForm.columnNumber"> + <el-form-item :label="item.itemName + '锛�'" style="padding-left: 5px"> + <el-input + v-if="item.itemType === 'text' || + item.itemType === 'custom' || + item.itemType === 'customform'|| + item.itemType === 'hidden' || + item.itemType === 'specialCharacter'" + v-model="item.value" :placeholder="item.text" + size="mini"></el-input> + + <div v-if="item.itemType === 'textbtn'" style="display: flex;align-items: center"> + <el-input v-model="item.value" :placeholder="item.text" size="mini"></el-input> + <el-button icon="el-icon-edit" plain size="mini" style="height: 28px;" + type="primary"></el-button> + </div> + + <el-input + v-if="item.itemType === 'textarea' || item.itemType === 'richtext' || item.itemType === 'webeditor'" + v-model="item.value" + :placeholder="item.text"> + </el-input> + + <el-input-number v-if="item.itemType === 'number'" v-model="item.value" :max="99999" :min="1" + size="mini"></el-input-number> + <el-input v-if="item.itemType === 'password'" v-model="input" placeholder="璇疯緭鍏ュ瘑鐮�" + show-password></el-input> + <el-radio v-if="item.itemType === 'radio'" v-model="item.value"></el-radio> + <el-checkbox v-if="item.itemType === 'checkbox'" v-model="item.value"></el-checkbox> + <el-select v-if="item.itemType === 'select' || item.itemType === 'multiselect'" + v-model="item.value" placeholder="璇烽�夋嫨" size="mini"> + <el-option v-for="(i,k) in item.itemKeyValueList" :key="l" :label="i.value" + :value="i.key"></el-option> + </el-select> + <el-date-picker + v-if="item.itemType === 'date' || item.itemType === 'datetime'" + v-model="item.value" + :placeholder="item.itemType === 'date' ? '璇烽�夋嫨鏃ユ湡' : '璇烽�夋嫨鏃ユ湡鏃堕棿'" + type="date"> + </el-date-picker> + + <el-time-select + v-if="item.itemType === 'time'" + v-model="item.value" + :picker-options="{ + start: '08:30', + step: '00:15', + end: '18:30' + }" + placeholder="閫夋嫨鏃堕棿"> + </el-time-select> + <el-button v-if="item.itemType === 'file'" + v-model="item.value" plain size="mini" type="primary"> + 涓婁紶鏂囦欢 + </el-button> + <el-button v-if="item.itemType === 'multiFile'" + v-model="item.value" plain size="mini" type="primary"> + 澶氭枃浠朵笂浼� + </el-button> + + </el-form-item> + </el-col> + </el-row> + </el-form> + </div> + </el-dialog> + + <el-dialog + v-dialogDrag + :visible.sync="authVisible" + append-to-body="true" + class="avue-dialog" + title="鏉冮檺鎺у埗-浜哄憳鍒楄〃" + width="60%" + @close="authDialogClose"> + <div style="height: 650px"> + <div style="height: 600px;"> + <avue-tree :key="refresh" ref="authTree" v-model="treeAuthForm" :data="treeAuthData" :option="treeAuthOption" + @check-change="treeAuthCheckChange"> + <span slot-scope="{ node, data }" class="el-tree-node__label"> + <span> + <i class="el-icon-s-promotion"></i> + {{ (node || {}).label }} + </span> + </span> + </avue-tree> + </div> + </div> + <span slot="footer" class="dialog-footer"> + <el-button @click="authDialogClose">鍙� 娑�</el-button> + <el-button type="primary" @click="authDialogSaveHandler">纭� 瀹�</el-button> + </span> + </el-dialog> </el-dialog> </template> <script> +import {getObjTypeQTs, getTreeAttributes, savePortalVI, refPersonOrgTree} from "@/api/UI/formDefine/api"; +import {gridAttribute} from "@/api/modeling/attributePool/api"; +import func from "@/util/func"; +import basicOption from "@/util/basic-option"; + export default { name: "formDialog", + props: { + TreeNodeRow: { + type: Object, + default: () => { + } + }, + treeRadio: { + type: String, + default: "" + }, + editRow: { + type: Object, + default: () => { + } + } + }, data() { return { + authType: 'default', + refresh: Math.random(), + treeAuthOption: { + multiple: true, + height: 'auto', + menu: false, + addBtn: false, + defaultExpandAll: true, + lazy: true, + props: { + label: 'text', + value: 'oid', + children: 'childNodes', + }, + treeLoad: (node, resolve) => { + const params = { + 'conditionMap[dataType]': node.data.data, + 'conditionMap[parentId]': node.data.data, + 'conditionMap[orgType]': 'all' + } + refPersonOrgTree(node.level === 0 ? {} : params).then(res => { + resolve(res.data.treeData.map(item => { + return { + ...item, + id: item.id, + name: item.name, + leaf: item.leaf + } + })) + }) + } + }, + treeAuthData: [], + treeAuthForm: {}, + authVisible: false, + searchQtNameList: [], + customAttrRow: {}, + customAttrOption: { + ...basicOption, + calcHeight: -60, + addBtn: false, + editBtn: false, + delBtn: false, + menu: false, + refreshBtn: false, + highlightCurrentRow: true, + selection: false, + column: [ + { + label: '灞炴�у悕', + prop: 'id', + sortable: true, + }, + { + label: '鏍囩', + prop: 'name', + sortable: true, + }, + { + label: '绫诲瀷', + prop: 'attributeDataTypeText', + sortable: true, + width: 100 + }, + { + label: '榛樿鍊�', + prop: 'defaultValue', + sortable: true, + width: 120 + }, + { + label: '鎻忚堪', + prop: 'description', + overHidden: true, + }, + ] + }, + customAttrData: [], + customAttrLoading: false, + customAttrVisible: false, + checkViewVisible: false, + optionObj: { + optionName: '', + optionValue: '' + }, + customOptionObj: { + optionName: '', + optionValue: '' + }, + customForm: { + itemKeyValueList: [], + itemCols: '1' + }, + customLoading: false, + customVisible: false, + treeLoading: false, + showSelectList: [ + { + label: '鍗曡鏂囨湰妗�', + value: 'text' + }, + { + label: '鏂囨湰鎸夐挳妗�', + value: 'textbtn' + }, + { + label: '澶氳鏂囨湰妗�', + value: 'textarea' + }, + { + label: '瀵屾枃鏈', + value: 'richtext' + }, + { + label: '鏁板瓧杈撳叆妗�', + value: 'number' + }, + { + label: '瀵嗙爜妗�', + value: 'password' + }, + { + label: '鍗曢�夋寜閽�', + value: 'radio' + }, + { + label: '澶氶�夋寜閽�', + value: 'checkbox' + }, + { + label: '涓嬫媺鑿滃崟', + value: 'select' + }, + { + label: '澶氶�変笅鎷夎彍鍗�', + value: 'multiselect' + }, + { + label: '鏃ユ湡杈撳叆妗�', + value: 'date' + }, + { + label: '鏃堕棿杈撳叆妗�', + value: 'time' + }, + { + label: '鏃ユ湡鏃堕棿杈撳叆妗�', + value: 'datetime' + }, + { + label: '鏂囦欢涓婁紶', + value: 'file' + }, + { + label: '澶氭枃浠朵笂浼�', + value: 'multiFile' + }, + { + label: '鑷畾涔�', + value: 'custom' + }, + { + label: '鑷畾涔夎〃鍗�', + value: 'customform' + }, + { + label: '闅愯棌鎴栨櫘閫氭枃瀛�', + value: 'hidden' + }, + { + label: 'Web缂栬緫鍣�', + value: 'webeditor' + }, + { + label: '鐗规畩瀛楃', + value: 'specialCharacter' + }, + ], + activeItem: {}, // 鐢ㄤ簬瀛樺偍褰撳墠鐐瑰嚮鐨� item 鐨勮妭鐐逛俊鎭� + activeItemIndex: null, // 鐢ㄤ簬瀛樺偍褰撳墠鐐瑰嚮鑺傜偣鐨� index 涓嬫爣 + formList: [], + optionRightData: [ + { + name: 'test', + value: 'test' + } + ], form: {}, + topForm: { + itemQtName: '', + columnNumber: 8, + showColumn: '3', + viName: '', + position: '' + }, rules: {}, - columnNumber: 12, loading: false, visible: false, treeOption: { + height: 'auto', menu: false, addBtn: false, - // props: { - // label: 'name', - // value: 'id', - // children: 'children', - // }, + draggable: true, + defaultExpandedKeys: ['root'], + allowDrop: () => { + return false; + }, + allowDrag: () => { + return true; + }, + props: { + label: 'text', + value: 'oid', + children: 'children', + }, }, - treeData: [ - { - value: 0, - label: '涓�绾ч儴闂�', - children: [ - { - value: 1, - label: '涓�绾ч儴闂�1', - }, { - value: 2, - label: '涓�绾ч儴闂�2', - } - ] - }, { - value: 3, - label: '浜岀骇閮ㄩ棬', - children: [ - { - value: 4, - label: '浜岀骇閮ㄩ棬1', - }, { - value: 5, - label: '浜岀骇閮ㄩ棬2', - } - ] - }, - { - value: 0, - label: '涓�绾ч儴闂�', - children: [ - { - value: 1, - label: '涓�绾ч儴闂�1', - }, { - value: 2, - label: '涓�绾ч儴闂�2', - } - ] - }, { - value: 3, - label: '浜岀骇閮ㄩ棬', - children: [ - { - value: 4, - label: '浜岀骇閮ㄩ棬1', - }, { - value: 5, - label: '浜岀骇閮ㄩ棬2', - } - ] - }, - { - value: 0, - label: '涓�绾ч儴闂�', - children: [ - { - value: 1, - label: '涓�绾ч儴闂�1', - }, { - value: 2, - label: '涓�绾ч儴闂�2', - } - ] - }, { - value: 3, - label: '浜岀骇閮ㄩ棬', - children: [ - { - value: 4, - label: '浜岀骇閮ㄩ棬1', - }, { - value: 5, - label: '浜岀骇閮ㄩ棬2', - } - ] - }, - { - value: 0, - label: '涓�绾ч儴闂�', - children: [ - { - value: 1, - label: '涓�绾ч儴闂�1', - }, { - value: 2, - label: '涓�绾ч儴闂�2', - } - ] - }, { - value: 3, - label: '浜岀骇閮ㄩ棬', - children: [ - { - value: 4, - label: '浜岀骇閮ㄩ棬1', - }, { - value: 5, - label: '浜岀骇閮ㄩ棬2', - } - ] - }, - { - value: 0, - label: '涓�绾ч儴闂�', - children: [ - { - value: 1, - label: '涓�绾ч儴闂�1', - }, { - value: 2, - label: '涓�绾ч儴闂�2', - } - ] - }, { - value: 3, - label: '浜岀骇閮ㄩ棬', - children: [ - { - value: 4, - label: '浜岀骇閮ㄩ棬1', - }, { - value: 5, - label: '浜岀骇閮ㄩ棬2', - } - ] - }, - { - value: 0, - label: '涓�绾ч儴闂�', - children: [ - { - value: 1, - label: '涓�绾ч儴闂�1', - }, { - value: 2, - label: '涓�绾ч儴闂�2', - } - ] - }, { - value: 3, - label: '浜岀骇閮ㄩ棬', - children: [ - { - value: 4, - label: '浜岀骇閮ㄩ棬1', - }, { - value: 5, - label: '浜岀骇閮ㄩ棬2', - } - ] - }, - { - value: 0, - label: '涓�绾ч儴闂�', - children: [ - { - value: 1, - label: '涓�绾ч儴闂�1', - }, { - value: 2, - label: '涓�绾ч儴闂�2', - } - ] - }, { - value: 3, - label: '浜岀骇閮ㄩ棬', - children: [ - { - value: 4, - label: '浜岀骇閮ㄩ棬1', - }, { - value: 5, - label: '浜岀骇閮ㄩ棬2', - } - ] - } - ] + treeData: [], + optionRow: {}, + customOptionRow: {}, + optionCurrentIndex: 0, + customOptionCurrentIndex: 0 } + }, + computed: { + optionTypeStatus() { + const types = ['radio', 'checkbox', 'select']; + return types.includes(this.form.itemType); // 灞曠ず + }, + itemStyleTypeStatus() { + const types = ['hidden', 'webeditor', 'radio', 'checkbox']; + return !types.includes(this.form.itemType); // 涓嶅睍绀� + }, + customOptionTypeStatus() { + const types = ['radio', 'checkbox', 'select']; + return types.includes(this.customForm.itemType); // 灞曠ず + }, + customItemStyleTypeStatus() { + const types = ['hidden', 'webeditor', 'radio', 'checkbox']; + return !types.includes(this.customForm.itemType); // 涓嶅睍绀� + }, + }, + created() { + // this.getTreeList(); }, methods: { // 鍏抽棴瀵硅瘽妗� closeDialog() { + this.formList = []; + this.form = {}; + this.activeItem = {}; + this.topForm.viName = ""; + }, + + getTreeList() { + this.treeLoading = true; + const params = { + 'conditionMap[typeName]': this.treeRadio === '0' ? this.TreeNodeRow.id : this.TreeNodeRow.name, + 'conditionMap[isDefault]': true, + 'conditionMap[typeFlag]': this.treeRadio === '0' ? 'BtmType' : this.treeRadio === '1' ? 'LinkType' : '', + } + getTreeAttributes(params).then(res => { + if (res.data.code === 200) { + const data = res.data.data; + this.treeData = data; + this.treeLoading = false; + } + }) + this.getSearchSelectList(); + }, + + // 寮�濮嬫嫋鎷芥爲鑺傜偣浜嬩欢 + handleDragStart(node, ev) { + // 浣跨敤 setData 鏂规硶璁剧疆鏁版嵁 + ev.dataTransfer.setData('item', JSON.stringify(node.data)); + }, + + // 鎷栨嫿鍒拌〃鍗曟椂 + drop(event) { + // 浣跨敤 getData 鏂规硶鑾峰彇鏁版嵁 + const data = JSON.parse(event.dataTransfer.getData('item')); + const params = { + text: data.text, + oid: data.oid, + itemType: 'text', + itemName: data.data.name, + itemCols: "1", + itemIsEditable: "0", + itemIsRequired: "0", + } + const isDuplicate = this.formList.some(item => item.text === data.text); + + if (isDuplicate) { + this.$message.error('璇锋鏌ユ槸鍚︽坊鍔犵浉鍚岄」锛�') + } else { + this.formList.push(params); + } + }, + + // 椤甸潰瀹氫箟閫夐」鐐瑰嚮 + formItemClick(item, index) { + this.activeItem = item; + this.activeItemIndex = index; + this.form = {...item}; + this.topForm.position = index += 1; + // this.$forceUpdate(); + }, + + // 璁剧疆鏄剧ず琛屾暟 + setColumnHandler() { + const number = /^[0-9]*\.?[0-9]+$/.test(this.topForm.showColumn); + + if (!number) { + this.$message.error('鍊煎繀椤绘槸鏁板瓧瀛楃'); + return; + } + this.topForm.columnNumber = this.getValueBasedOnInput(this.topForm.showColumn); + }, + + // 鏍规嵁浼犲叆姣忚鍒楁暟 鏉ュ垽鏂璭l-col :span鏄灏� + getValueBasedOnInput(val) { + const n = JSON.parse(val ? val : '3'); + switch (n) { + case 1: + return 24; + case 2: + return 12; + case 3: + return 8; + case 4: + return 6; + case 5: + return 4; + case 6: + return 4; + case 7: + case 8: + return 3; + case 9: + return 2; + default: + return n > 10 ? 1 : 8; // 榛樿缁�8 + } + }, + + // 娓呯┖椤甸潰瀹氫箟 + emptyClickHandler() { + this.$confirm('鎮ㄧ‘瀹氳娓呯┖鎵�鏈夋暟鎹悧锛�', '鎻愮ず', { + confirmButtonText: '纭畾', + cancelButtonText: '鍙栨秷', + type: 'warning' + }).then(() => { + this.formList = []; + this.activeItem = {}; + this.form = {}; + this.$message({ + type: 'success', + message: '鍒犻櫎鎴愬姛!' + }); + }).catch(() => { + this.$message({ + type: 'info', + message: '宸插彇娑堝垹闄�' + }); + }); + }, + + // 鍒犻櫎缁勪欢 + delModuleClickHandler() { + if (func.isEmptyObject(this.activeItem)) { + this.$message.error('璇烽�夋嫨涓�鏉℃暟鎹繘琛屽垹闄�'); + return; + } + this.formList = this.formList.filter(item => item.text !== this.activeItem.text); + this.activeItem = {}; + this.form = {}; + }, + + // 璋冩暣浣嶇疆 + positionClickHandler() { + if (!this.topForm.position) { + this.$message.error('璇疯緭鍏ヨ皟鏁翠綅缃�'); + return; + } + + if (func.isEmptyObject(this.activeItem)) { + this.$message.error('璇烽�夋嫨涓�鏉℃暟鎹繘琛岃皟鏁翠綅缃�'); + return; + } + + const number = /^[0-9]*\.?[0-9]+$/.test(this.topForm.position); + + if (!number) { + this.$message.error('鍊煎繀椤绘槸鏁板瓧瀛楃'); + return; + } + + // 鍏堝皢瑕佹洿鎹綅缃殑椤归�氳繃 activeItemIndex 杩涜绉婚櫎 + this.formList.splice(this.activeItemIndex, 1); + // 灏嗗綋鍓嶇偣鍑诲璞� activeItem 鎻掑叆鍒版暟缁勪腑瀵瑰簲浣嶇疆 + this.formList.splice(JSON.parse(this.topForm.position) - 1, 0, this.activeItem); + this.activeItem = {}; + this.activeItemIndex = null; + }, + + // 閫夐」琛ㄦ牸琛岀偣鍑� + optionTableClick(row) { + this.optionRow = row; + }, + + customOptionTableClick(row) { + this.customOptionRow = row; + }, + + // 閫夐」娣诲姞 + optionAddClickHandler(val) { + let optionObj, itemKeyValueList; + + if (val === 'dialog') { + optionObj = this.customOptionObj; + itemKeyValueList = this.customForm.itemKeyValueList; + } else { + if (func.isEmptyObject(this.activeItem)) { + this.$message.error('璇烽�夋嫨涓�鏉℃暟鎹繘琛屾坊鍔犻�夐」'); + return; + } + optionObj = this.optionObj; + itemKeyValueList = this.form.itemKeyValueList; + } + + if (!optionObj.optionName) { + this.$message.error('璇疯緭鍏ラ�夐」鍚嶇О'); + return; + } + + if (!optionObj.optionValue) { + this.$message.error('璇疯緭鍏ラ�夐」鍊�'); + return; + } + + const params = { + key: optionObj.optionName, + value: optionObj.optionValue, + index: val === 'dialog' ? this.customOptionCurrentIndex++ : this.optionCurrentIndex++ + }; + + itemKeyValueList.push(params); + }, + + // 閫夐」鍒犻櫎 + optionDeleteClickHandler(val) { + if (val === 'dialog') { + this.customForm.itemKeyValueList.splice(this.customOptionRow.index, 1); + } else { + this.form.itemKeyValueList.splice(this.optionRow.index, 1); + } + }, + + // 娣诲姞鑷畾涔夌粍浠� + addCustomClickHandler() { + this.customVisible = true; + }, + + // 淇濆瓨鎸夐挳 + saveClickHandler() { + if (!this.topForm.viName) { + this.$message.error('琛ㄥ崟鍚嶇О涓嶈兘涓虹┖'); + return; + } + if (this.formList.length <= 0) { + this.$message.error('椤甸潰瀹氫箟涓嶈兘涓虹┖'); + return; + } + this.formList = this.formList.map(item => { + return { + ...item, + itemField: item.text // 灏唅temField閲嶆柊璧嬪�间负text锛屽洜涓哄繕璁板綋鏃跺湪鐖剁粍浠剁紪杈戝洖濉柟娉曢噷涓轰粈涔堟妸itemField璧嬪�间负text浜� + }; + }); + const params = { + id: this.editRow.id,// 淇敼鏃跺�欏繀浼� + typeFlag: this.treeRadio, // 涓氬姟绫诲瀷0 or 閾炬帴绫诲瀷1 + typeFlagText: this.treeRadio === '0' ? '涓氬姟绫诲瀷鐨勮〃鍗�' : '閾炬帴绫诲瀷鐨勮〃鍗�',// 涓氬姟绫诲瀷鏄剧ず鍊� + typeName: this.treeRadio === '0' ? this.TreeNodeRow.id : this.TreeNodeRow.name, // 涓氬姟绫诲瀷鍚� or 閾炬帴绫诲瀷鍚� + viName: this.topForm.viName, // 瑙嗗浘鍚嶇О + viType: 1, // 瑙嗗浘绫诲瀷 + viTypeText: "琛ㄥ崟", // 瑙嗗浘涓枃鍚嶇О + prm: { + formQtName: this.topForm.itemQtName, // 鏌ヨ妯℃澘鍚嶇О + showCols: this.topForm.showColumn, + prmItemList: this.formList + }, + } + savePortalVI(params).then(res => { + if (res.data.code === 200) { + this.$message.success(res.data.obj); + this.visible = false; + this.closeDialog(); + this.$emit('updataTable'); + } + }) + // this.visible = false; + // this.$message.success('淇濆瓨鎴愬姛'); + }, + + // 淇敼鏄剧ず绫诲瀷 + itemTypeChange(val) { + if (val) { + this.clearFormBottom(); + } + if (!this.form.text) { + this.$message.error('璇峰湪鍙充晶閫夋嫨鏁版嵁鍚庤繘琛屾搷浣滐紒'); + } + }, + + // 鑷畾涔夌粍浠朵慨鏀规樉绀虹被鍨� + customItemTypeChange(val) { + if (val) { + this.customClearFormBottom(); + } + }, + + // 鑷畾涔夌粍浠朵繚瀛� + customSaveHandler() { + if (!this.customForm.text) { + this.$message.error('璇烽�夋嫨浣跨敤瀛楁'); + return; + } + if (!this.customForm.itemType) { + this.$message.error('璇烽�夋嫨鏄剧ず绫诲瀷'); + return; + } + const status = this.formList.some(item => item.text === this.customForm.text); + if (status) { + this.$message.error('璇锋鏌ユ槸鍚︽坊鍔犵浉鍚岄」'); + return; + } + this.formList.push(this.customForm); + this.customVisible = false; + }, + + // 鑷畾涔夊璇濇鍏抽棴 + closeCustomDialog() { + this.customForm = { + itemKeyValueList: [], + itemType: 'text', + itemCols: '1' + }; + }, + + // 娓呯┖涓嶅悓绫诲瀷琛ㄥ崟涓嬫柟缁戝畾鍊� + clearFormBottom() { + this.optionObj = {}; + this.form.itemKeyValueList = []; + this.form.itemListTable = this.form.itemListTxt = this.form.itemListVal = this.form.itemStyle = ""; + }, + + // 鑷畾涔夌粍浠舵竻绌轰笉鍚岀被鍨嬭〃鍗曚笅鏂圭粦瀹氬�� + customClearFormBottom() { + this.customOptionObj = {}; + this.customForm.itemKeyValueList = []; + this.customForm.itemListTable = this.customForm.itemListTxt = this.customForm.itemListVal = this.customForm.itemStyle = ""; + }, + + // 鑷畾涔夎〃鍗曚娇鐢ㄥ瓧娈佃〃鏍艰鐐瑰嚮 + customAttrRowClickHandler(row) { + this.customAttrRow = row; + }, + + // 鑷畾涔夎〃鍗曚娇鐢ㄥ瓧娈甸�夋嫨 + customTextHandler() { + this.customAttrVisible = true; + this.customAttrLoading = true + gridAttribute().then(res => { + const data = res.data.data; + this.customAttrData = data; + this.customAttrLoading = false; + }).catch(err => { + this.$message.error(err) + }); + }, + + // 鑷畾涔夎〃鍗曚娇鐢ㄥ瓧娈典繚瀛� + customAttrSaveHandler() { + if (func.isEmptyObject(this.customAttrRow)) { + this.$message.error('璇烽�夋嫨涓�鏉℃暟鎹繘琛屼繚瀛�'); + return; + } + this.customForm.text = this.customAttrRow.id; + this.customAttrVisible = false; + }, + + // 鍙充晶琛ㄥ崟搴旂敤鎸夐挳 + asideFormHandler() { + if (!this.form.text) { + this.$message.error('璇锋坊鍔犱竴鏉℃暟鎹繘琛屼繚瀛橈紒'); + return; + } + + this.formList = this.formList.map(item => + item.text === this.form.text ? this.form : item + ); + + this.$message.success('搴旂敤鎴愬姛'); + }, + + // 棰勮鎸夐挳 + checkViewHandler() { + this.checkViewVisible = true; + }, + + // 鏌ヨ妯℃澘涓嬫媺鎺ュ彛鏌ヨ + getSearchSelectList() { + getObjTypeQTs({btName: this.treeRadio === '0' ? this.TreeNodeRow.id : this.TreeNodeRow.name}).then(res => { + this.searchQtNameList = res.data.data; + }) + }, + + // 鏉冮檺閫夋嫨鎸夐挳 + authClickHandler() { + this.authVisible = true; + }, + + // 鑷畾涔夎〃鍗曢�夋嫨鏉冮檺 + customAuthClickHandler() { + this.authVisible = true; + this.authType = 'attr'; + }, + + // 鏉冮檺鏍戝璇濇鍏抽棴 + authDialogClose() { + this.authVisible = false; + this.refresh = Math.random(); // 鍒锋柊宸︿晶鏍� + }, + + // 鏉冮檺鎺у埗淇濆瓨 + authDialogSaveHandler() { + const filterList = ['root', 'user', 'role', 'department'] + const data = this.$refs.authTree.getCheckedNodes().filter(item => !filterList.includes(item.oid)); + if (!data || data.length <= 0) { + this.$message.error('璇锋鏌ユ槸鍚﹀嬀閫夊瓙鑺傜偣'); + return; + } + + const resultMap = {}; + + data.forEach(item => { + const key = item.parentBtmName; + if (!resultMap[key]) { + resultMap[key] = []; // 鍒濆鍖栨暟缁� + } + resultMap[key].push(item.parentBtmName === 'user' ? item.data.userName : item.data.name); + }); + + // 缁勮瀛楃涓� + const resultString = Object.entries(resultMap).map(([key, oids]) => { + return `${key}=${oids.join(',')}`; // 鐢� , 杩炴帴鍚屼竴绫诲瀷鐨� oid + }).join('&&'); // 鏈�鍚庣敤 && 杩炴帴涓嶅悓绫诲瀷 + + if (this.authType === 'attr') { + this.customForm.itemRight = resultString; + } else { + this.form.itemRight = resultString; + } + this.authDialogClose(); } + } } </script> <style lang="scss" scoped> ::v-deep { - .hiddenLabel{ + .hiddenLabel { .el-form-item__label { white-space: nowrap; // 闃叉鎹㈣ overflow: hidden; //闅愯棌瓒呭嚭閮ㄥ垎 text-overflow: ellipsis; //鏄剧ず鐪佺暐鍙� + } + } + + .active-border { + .el-form-item__label { + color: #f56c6c; /* 璁剧疆杈规鐨勬牱寮� */ } } @@ -495,4 +1542,9 @@ font-size: 14px } +//.formItemMargin { +// margin: 10px 0 10px 0; +//} + </style> + -- Gitblit v1.9.3