diff --git a/src/views/haomo/components/forms/HmComplexForm.vue b/src/views/haomo/components/forms/HmComplexForm.vue index 8590615354f350a8ad50d7c312e311ef77237b91..3e19fbd26078c0935959f7ad51c109a13e4c9097 100644 --- a/src/views/haomo/components/forms/HmComplexForm.vue +++ b/src/views/haomo/components/forms/HmComplexForm.vue @@ -120,15 +120,16 @@ <!-- 8æ ‘å½¢å›¾ --> <!--:default-expanded-keys="[2, 3]"--> <!--:default-checked-keys="[5]"--> - <div class="hm-form_form_div" @mouseenter="currentTree = column.codeCamel;treeComponent = column.ref" v-else-if="column.widgetType === 9" :style="formStyle && formStyle.elTree && formStyle.elTree.style || {width: '70%'}"> + <div class="hm-form_form_div" v-else-if="column.widgetType === 9" :style="formStyle && formStyle.elTree && formStyle.elTree.style || {width: '70%'}"> <el-tree :data="column.options" :ref="column.ref || 'tree'" :show-checkbox="column.checkBox || false" node-key="id" :accordion="column.accordion || false" :draggable="column.draggable || false" + :check-strictly="column.checkStrictly || false" @node-click="handleNodeChange" - @check-change="handleCheckChange" + @check-change="(data, checked, indeterminate)=>{ return handleCheckChange(data, checked, indeterminate, column.codeCamel, column.checkStrictly)}" :default-checked-keys="formModel[column.codeCamel]" :props="column.props || treeProps"> </el-tree> @@ -203,6 +204,7 @@ import request from '@/utils/request' import { paramEncode } from '@/utils' // import commonApi from '@/api/commonApi' + /** * 毫末科技的表å•组件. * @@ -239,11 +241,15 @@ * param属性å¯é€‰ï¼Œå½“表å•类型为文件类型时,å¯ä¼ å…¥paramå—æ®µï¼Œå€¼ä¸ºåŽå°è§„å®šå¿…ä¼ å‚æ•°ï¼Œé»˜è®¤å€¼ä¸ºpicture * accept属性å¯é€‰,当表å•类型为文件类型时,å¯ä¼ å…¥acceptå—æ®µï¼Œé™åˆ¶é™åˆ¶ä¸Šä¼ 文件类型,å–值规范å‚考w3c * fileData属性å¯é€‰ï¼Œå½“表å•类型为文件类型时,å–值为all(表示返回路径+文件å),å–值为filePath(表示åªè¿”回路径),å–值fileName(表示åªè¿”回文件å),如果ä¸ä¼ ,默认åªè¿”回路径 - * widgetType属性å¯é€‰ï¼Œè¡¨ç¤ºè¯¥å—æ®µè¦æ˜¾ç¤ºçš„表å•类型(æ™®é€šè¾“å…¥æ¡†ã€æ–‡æœ¬åŸŸã€å¯Œæ–‡æœ¬ã€ä¸‹æ‹‰æ¡†...),ä¸ä¼ 默认为普通input + * accordion属性å¯é€‰ï¼Œå½“表å•ç±»åž‹ä¸ºæ ‘å½¢æŽ§ä»¶æ—¶ï¼Œå¯ä¼ å…¥accordion,值为boolean, 表示是å¦é‡‡ç”¨æ‰‹é£Žç´æ ·å¼å±•å¼€æ ‘å½¢ç»“æž„ï¼Œé»˜è®¤ä¸ºfalse + * checkBox属性å¯é€‰ï¼Œå½“表å•ç±»åž‹ä¸ºæ ‘å½¢æŽ§ä»¶æ—¶ï¼Œå¯ä¼ å…¥checkBox,值为boolean, è¡¨ç¤ºæ˜¯å¦æ˜¾ç¤ºå‹¾é€‰æ¡†ï¼Œé»˜è®¤false + * checkStrictly属性å¯é€‰ï¼Œå½“表å•ç±»åž‹ä¸ºæ ‘å½¢æŽ§ä»¶æ—¶ï¼Œå¯ä¼ å…¥checkStrictly,值为boolean, 表示在显示å¤é€‰æ¡†çš„æƒ…况下,是å¦ä¸¥æ ¼çš„éµå¾ªçˆ¶åä¸äº’相关è”çš„åšæ³•,默认为 false + * refå±žæ€§ï¼Œæ ‘å½¢æŽ§ä»¶å¿…ä¼ ï¼Œä¸”å€¼å¿…é¡»ä¸ŽcodeCamelç›¸åŒ + * widgetType属性å¯é€‰ï¼Œè¡¨ç¤ºè¯¥å—æ®µè¦æ˜¾ç¤ºçš„表å•类型(æ™®é€šè¾“å…¥æ¡†ã€æ–‡æœ¬åŸŸã€å¯Œæ–‡æœ¬ã€ä¸‹æ‹‰æ¡†...),ä¸ä¼ 默认为1,普通input * å–值1-11(1表示普通输入框,2表示普通下拉框,3表示å¤é€‰æ¡†,4表示文本域,5表示富文本,6表示日期,7表示å•选框,8è¡¨ç¤ºæ–‡ä»¶ä¸Šä¼ , * 9è¡¨ç¤ºæ ‘çŠ¶æŽ§ä»¶ï¼Œ10表示级è”下拉框,11bè¡¨ç¤ºå¯†ç æ¡†), * 若表å•类型为下拉框/å¤é€‰æ¡†/å•é€‰æ¡†ï¼Œè¿˜éœ€ä¼ å…¥optionså—æ®µï¼Œå€¼ä¸ºæ•°ç»„(æ•°ç»„å…ƒç´ æ˜¯ä¸‹æ‹‰æ¡†/å¤é€‰æ¡†/å•选框的选项), - * 对于å¤é€‰æ¡†ï¼Œå¦‚æžœåªæœ‰ä¸€ä¸ªå¤‡é€‰é¡¹åˆ™ä¸å¿…ä¼ options, + * 若表å•类型为å¤é€‰æ¡†ï¼Œå¦‚æžœåªæœ‰ä¸€ä¸ªå¤‡é€‰é¡¹åˆ™ä¸å¿…ä¼ options, * 若表å•类型为下拉框,还å¯ä¼ å…¥multipleå—æ®µï¼Œå–值boolean类型,true/false,表示是å¦å¤šé€‰ï¼Œé»˜è®¤false * 若表å•类型为时间日期,å¯ä¼ å…¥dateTypeå—æ®µï¼Œå€¼ä¸º'date'ï¼ˆåªæ˜¾ç¤ºæ—¥æœŸï¼‰æˆ–'datetime'(显示日期和时间),如果ä¸ä¼ , * é»˜è®¤åªæ˜¾ç¤ºæ—¥æœŸ; å¯ä¼ å…¥dateFormateå—æ®µï¼Œä¸ºæ—¥æœŸæ ¼å¼ï¼Œå–值éµå¾ªelementUI DatePicker组件ä¸çš„æ—¥æœŸæ ¼å¼ï¼Œ @@ -517,6 +523,7 @@ // } // } return { + i: 0, currentFile: '', // ä¸Šä¼ æ–‡ä»¶æ—¶å½“å‰é€‰ä¸çš„codeCamel值 currentTree: '', // 当å‰é€‰ä¸çš„æ ‘å½¢èœå•çš„codeCamel值 treeComponent: '', // 当å‰çš„æ ‘å½¢èœå•组件 @@ -782,34 +789,49 @@ // console.log('自己的') }, // æ ‘å½¢é€‰æ‹©å™¨ - handleCheckChange(data, checked, indeterminate, aaa) { + handleCheckChange(data, checked, indeterminate, code, checkStrictly) { const self = this console.log('handleCheckChange函数') // console.log(data) // console.log(checked) // console.log(indeterminate) - console.log(aaa) // console.log(this.$refs.tree[0].getCheckedNodes(true)) // console.log('当å‰é€‰æ‹©çš„codecamel:', self.currentTree) // console.log('当å‰é€‰æ‹©çš„tree组件', self.treeComponent) - // console.log(self.$refs[self.treeComponent][0].getCheckedKeys(true)) - for (var i = 0, len = self.showUserColumns.length; i < len; i++) { - // && !self.showUserColumns[i].edited - if (self.showUserColumns[i].widgetType === 9) { - // self.$set(self.showUserColumns[i], 'edited', true) - for (var key in self.formModel) { - if (key === self.currentTree && self.showUserColumns[i].codeCamel === self.currentTree) { - // self.formModel[key] = response.message || response.visitName - // å¼ å®¶å£ - // self.formModel[key] = response.visitName + response.fileName - // org - self.formModel[key] = self.$refs[self.treeComponent][0].getCheckedKeys(true) - break - } + self.formModel[code] = self.$refs[code][0].getCheckedKeys(true) + + // for (var i = 0, len = self.showUserColumns.length; i < len; i++) { + // // && !self.showUserColumns[i].edited + // if (self.showUserColumns[i].widgetType === 9) { + // // self.$set(self.showUserColumns[i], 'edited', true) + // for (var key in self.formModel) { + // if (key === self.currentTree && self.showUserColumns[i].codeCamel === self.currentTree) { + // // self.formModel[key] = response.message || response.visitName + // // å¼ å®¶å£ + // // self.formModel[key] = response.visitName + response.fileName + // // org + // self.formModel[key] = self.$refs[self.treeComponent][0].getCheckedKeys(true) + // break + // } + // } + // // break + // } + // } + // 处ç†å•选 + if (checkStrictly) { + self.i++ + if (self.i % 2 === 0) { + if (checked) { + self.$refs[code][0].setCheckedNodes([]) + self.$refs[code][0].setCheckedNodes([data]) + // 交å‰ç‚¹å‡»èŠ‚ç‚¹ + } else { + self.$refs[code][0].setCheckedNodes([]) + // 点击已ç»é€‰ä¸çš„节点,置空 } - // break } } + console.log(self.$refs[code][0].getCheckedKeys(true), self.formModel) }, // æ ‘å½¢é€‰æ‹©å™¨ handleNodeChange(data, node, com) { @@ -1045,12 +1067,16 @@ } }) } - // æ ‘å½¢æŽ§ä»¶ã€æ–‡ä»¶ä¸Šä¼ ,将请求回æ¥çš„å—ç¬¦ä¸²æ”¾æ•°ç»„ä¸ + // æ–‡ä»¶ä¸Šä¼ ã€çº§è”èœå•将请求回æ¥çš„å—ç¬¦ä¸²æ”¾æ•°ç»„ä¸ if (item.widgetType === 8 || item.widgetType === 10) { _.forEach(self.formModel, function(value, key) { if (item.codeCamel === key) { // console.log(11111, self.formModel[key]) - self.formModel[key] = self.formModel[key].split(',') + if (value === null || value === '') { + self.formModel[key] = [] + } else { + self.formModel[key] = self.formModel[key].split(',') + } } }) } @@ -1058,13 +1084,13 @@ if (item.widgetType === 9) { _.forEach(self.formModel, function(value, key) { if (item.codeCamel === key) { - // let str1 = '' - // let str2 = '' - // str1 = self.formModel[key].split(',')[0] - // str2 = self.formModel[key].split(',')[1] // console.log(11111, self.formModel[key]) - self.formModel[key] = self.formModel[key].split(',') - self.$refs[key][0].setCheckedKeys(self.formModel[key]) + if (value === null || value === '') { + self.formModel[key] = [] + } else { + self.formModel[key] = self.formModel[key].split(',') + self.$refs[key][0].setCheckedKeys(self.formModel[key]) + } } }) } @@ -1103,9 +1129,11 @@ // console.log('self.showUserColumns', self.showUserColumns) // æå–v-model绑定的å˜é‡ _.each(self.showUserColumns, function(item) { + // 设置值为数组 if (item.widgetType === 8 || item.widgetType === 10 || item.widgetType === 9 || (item.widgetType === 3 && item.options && item.options.length > 0)) { self.$set(self.formModel, item.codeCamel, []) } else { + // 设置默认值 item.default ? self.$set(self.formModel, item.codeCamel, item.default) : self.$set(self.formModel, item.codeCamel, '') } })