diff --git a/sample-form-client-ui/admin/src/components/formDes/configPanel.vue b/sample-form-client-ui/admin/src/components/formDes/configPanel.vue deleted file mode 100644 index fd659efe8414b2c37b969e83ca3626b07af03ada..0000000000000000000000000000000000000000 --- a/sample-form-client-ui/admin/src/components/formDes/configPanel.vue +++ /dev/null @@ -1,76 +0,0 @@ -<template> - <div class="right-board"> - <el-tabs v-model="currentTab" class="center-tabs"> - <el-tab-pane label="灞炴€ч厤缃�" name="field" /> - </el-tabs> - <div class="field-box"> - <el-scrollbar class="right-scrollbar"> - <el-form size="small" label-width="100px" > - <div v-for="(item,index) in cmps" :key="index"> - <component v-if="item.name === activeItem.compType" :getFormId="getFormId" :props="activeItem" :is="item.content"></component> - </div> - </el-form> - </el-scrollbar> - </div> - </div> -</template> - -<script> -import reg from "./custom/register"; - -export default { - name:'configPanel', - data() { - return { - currentTab: 'field', - cmps:reg, - formIdArray:[] - } - }, - props:{ - activeItem: { - type: Object, - default:function(){ - return {} - } - }, - itemList: { - type: Array, - default:function(){ - return [] - } - } - }, - created() { - this.cmps.forEach(c => { - c.content = require(`./custom/configs/${c.name}`).default; - }); - }, - methods:{ - getFormId(itemId){ - this.formIdArray = []; - Array.from(this.itemList,(item)=>{ - if(item.compType === 'row'){ - Array.from(item.columns,(column)=>{ - Array.from(column.list,(col)=>{ - if(col._id !== itemId){ - this.formIdArray.push(col.id); - } - }) - }) - }else{ - if(item._id !== itemId){ - this.formIdArray.push(item.id); - } - } - }) - return this.formIdArray; - } - } -} -</script> -<style scoped> -.field-box >>> .el-scrollbar__wrap{ - overflow-x: hidden; -} -</style> \ No newline at end of file diff --git a/sample-form-client-ui/admin/src/components/formDes/custom/configs/Switch.vue b/sample-form-client-ui/admin/src/components/formDes/custom/configs/Switch.vue deleted file mode 100644 index 270bc088ee2516c5bbd2bf451e1b92c74650b129..0000000000000000000000000000000000000000 --- a/sample-form-client-ui/admin/src/components/formDes/custom/configs/Switch.vue +++ /dev/null @@ -1,88 +0,0 @@ -<template> - <div v-show="props.compType === 'Switch'"> - <el-form-item label="ID"> - <el-tooltip - class="item" - effect="dark" - content="璇锋敞鎰�,ID鐨勪慨鏀瑰彲鑳戒細瀵艰嚧璇ョ粍浠剁浉鍏充簨浠跺け鏁堬紒" - placement="left" - > - <el-input - class="input" - v-model="props.id" - @change="handlerChangeId" - ></el-input> - </el-tooltip> - </el-form-item> - <el-form-item label="鏍囬"> - <el-input class="input" v-model="props.label"></el-input> - </el-form-item> - <!-- <el-form-item label="琛ㄥ崟鏍呮牸"> - <el-slider class="input" v-model="props.span" :max="24" :min="1" :marks="{12:''}"></el-slider> - </el-form-item> --> - <el-form-item label="鏍呮牸闂撮殧"> - <el-input-number v-model="props.gutter" :min="0"></el-input-number> - </el-form-item> - <el-form-item label="鏍囩瀹藉害"> - <el-input-number - v-model="props.labelWidth" - :min="1" - :max="200" - ></el-input-number> - </el-form-item> - <el-form-item label="鏄剧ず鏍囩"> - <el-switch - v-model="props.showLabel" - @change="handlerChangeLabel" - ></el-switch> - </el-form-item> - <el-form-item label="蹇呭~"> - <el-switch v-model="props.required"></el-switch> - </el-form-item> - <el-form-item label="寮€鍚椂棰滆壊"> - <el-color-picker v-model="props['active-color']"></el-color-picker> - </el-form-item> - <el-form-item label="鍏抽棴鏃堕鑹�"> - <el-color-picker v-model="props['inactive-color']"></el-color-picker> - </el-form-item> - <el-form-item label="寮€鍚椂鍊�"> - <el-input class="input" v-model="props['active-value']"></el-input> - </el-form-item> - <el-form-item label="鍏抽棴鏃跺€�"> - <el-input class="input" v-model="props['inactive-value']"></el-input> - </el-form-item> - <el-form-item label="榛樿鍊�"> - <el-switch v-model="props.value"></el-switch> - </el-form-item> - </div> -</template> -<script> -import { changeId } from "../mixin"; - -export default { - name: "inputConfig", - props: ["props", "getFormId"], - components: {}, - mixins: [changeId], - data() { - return {}; - }, - methods: { - handlerChangeLabel(val) { - this.props.labelWidth = val ? "80" : "1"; - }, - handlerChangeDisStatus(val) { - this.props.readOnly = !val; - }, - handlerChangeReadStatus(val) { - this.props.disabled = !val; - }, - }, - mounted() {}, -}; -</script> -<style scoped> -.input { - width: 75%; -} -</style> \ No newline at end of file diff --git a/sample-form-client-ui/admin/src/components/formDes/custom/configs/alert.vue b/sample-form-client-ui/admin/src/components/formDes/custom/configs/alert.vue deleted file mode 100644 index c193d7fd802ed606d1c089630e503b87e7f2d50a..0000000000000000000000000000000000000000 --- a/sample-form-client-ui/admin/src/components/formDes/custom/configs/alert.vue +++ /dev/null @@ -1,72 +0,0 @@ -<template> - <div v-show="props.compType === 'alert'"> - <!-- <el-form-item label="瀛楁鍚�"> - <el-input class="input" v-model="props"></el-input> - </el-form-item> --> - <el-form-item label="ID"> - <el-tooltip class="item" effect="dark" content="璇锋敞鎰�,ID鐨勪慨鏀瑰彲鑳戒細瀵艰嚧璇ョ粍浠剁浉鍏充簨浠跺け鏁堬紒" placement="left"> - <el-input class="input" v-model="props.id" ></el-input> - </el-tooltip> - </el-form-item> - <el-form-item label="鏍囬"> - <el-input class="input" v-model="props.title"></el-input> - </el-form-item> - <el-form-item label="绫诲瀷" > - <el-select v-model="props.type" placeholder="璇烽€夋嫨"> - <el-option label="success" value="success"/> - <el-option label="warning" value="warning"/> - <el-option label="error" value="error"/> - <el-option label="info" value="info"/> - </el-select> - </el-form-item> - <el-form-item label="杈呭姪鏂囧瓧"> - <el-input class="input" v-model="props.description"></el-input> - </el-form-item> - <el-form-item label="鍏抽棴"> - <el-switch v-model="props.closable"></el-switch> - </el-form-item> - <el-form-item label="灞呬腑"> - <el-switch v-model="props.center"></el-switch> - </el-form-item> - <el-form-item label="鍏抽棴鎸夐挳鑷畾涔夋枃鏈�"> - <el-input class="input" v-model="props['close-text']"/> - </el-form-item> - <el-form-item label="鏄剧ず鍥炬爣"> - <el-switch v-model="props['show-icon']"></el-switch> - </el-form-item> - <el-form-item label="涓婚"> - <el-radio-group v-model="props.effect"> - <el-radio-button label="light">light</el-radio-button> - <el-radio-button label="dark">dark</el-radio-button> - </el-radio-group> - </el-form-item> - </div> -</template> -<script> -/** - * input鐨勯厤缃」 - */ -export default { - name:"buttonConfig", - props:{ - props:{} - }, - components:{ - }, - data(){ - return { - } - }, - methods:{ - handlerShowLabel(val){ - if(val){ - this.props.labelWidth = 80; - }else{ - this.props.labelWidth = 0; - } - } - }, - mounted(){ - } -} -</script> diff --git a/sample-form-client-ui/admin/src/components/formDes/custom/configs/barCode.vue b/sample-form-client-ui/admin/src/components/formDes/custom/configs/barCode.vue deleted file mode 100644 index d03b3e06abc181870a94fdac8b5bf8df42c44cce..0000000000000000000000000000000000000000 --- a/sample-form-client-ui/admin/src/components/formDes/custom/configs/barCode.vue +++ /dev/null @@ -1,81 +0,0 @@ -<template> - <div v-show="props.compType === 'barCode'"> - <!-- <el-form-item label="瀛楁鍚�"> - <el-input class="input" v-model="props"></el-input> - </el-form-item> --> - <el-form-item label="ID"> - <el-tooltip class="item" effect="dark" content="璇锋敞鎰�,ID鐨勪慨鏀瑰彲鑳戒細瀵艰嚧璇ョ粍浠剁浉鍏充簨浠跺け鏁堬紒" placement="left"> - <el-input class="input" v-model="props.id" ></el-input> - </el-tooltip> - </el-form-item> - <el-form-item label="鏄剧ず鏍囩"> - <el-switch v-model="props.showLabel" @change="handlerShowLabel"></el-switch> - </el-form-item> - <el-form-item label="鏍囩鏂囧瓧" v-show="props.showLabel"> - <el-input class="input" v-model="props.label"></el-input> - </el-form-item> - <el-form-item label="鏍囩闀垮害" v-show="props.showLabel"> - <el-input-number v-model="props.labelWidth" :min="1" :max="200"></el-input-number> - </el-form-item> - <el-form-item label="鍗犵敤鍒楁暟" v-show="props.span"> - <el-input-number v-model="props.span" :min="1" :max="24"></el-input-number> - </el-form-item> - <el-form-item label="鏉$爜鍊�"> - <el-input v-model="props.value"></el-input> - </el-form-item> - <el-form-item label="鏉$爜棰滆壊" v-show="props.lineColor"> - <el-color-picker v-model="props.lineColor" @change="handlerChangeBarCode"/> - </el-form-item> - <el-form-item label="鑳屾櫙棰滆壊" v-show="props.background"> - <el-color-picker v-model="props.background" @change="handlerChangeBackground"/> - </el-form-item> - <!--鏆備笉鍚敤--> - <!-- <el-form-item label="鏉$爜瀹藉害"> - <el-input-number v-model="props.width" :min="1" :max="10" :step="1"></el-input-number> - </el-form-item> --> - <el-form-item label="鏉$爜楂樺害"> - <el-input-number v-model="props.height" :min="10" :max="100" :step="1"></el-input-number> - </el-form-item> - <el-form-item label="鏄剧ず鍊�"> - <el-switch v-model="props.displayValue"></el-switch> - </el-form-item> - </div> -</template> -<script> -/** - * input鐨勯厤缃」 - */ -export default { - name:"buttonConfig", - props:{ - props:{} - }, - components:{ - }, - data(){ - return { - } - }, - methods:{ - handlerShowLabel(val){ - if(val){ - this.props.labelWidth = 80; - }else{ - this.props.labelWidth = 0; - } - }, - handlerChangeBarCode(val){ - if(val == null){ - this.props.lineColor = '#000'; - } - }, - handlerChangeBackground(val){ - if(val == null){ - this.props.background = '#fff'; - } - } - }, - mounted(){ - } -} -</script> diff --git a/sample-form-client-ui/admin/src/components/formDes/custom/configs/button.vue b/sample-form-client-ui/admin/src/components/formDes/custom/configs/button.vue deleted file mode 100644 index 1118db11842a1fef5d58481d27883f199851f1db..0000000000000000000000000000000000000000 --- a/sample-form-client-ui/admin/src/components/formDes/custom/configs/button.vue +++ /dev/null @@ -1,93 +0,0 @@ -<template> - <div v-show="props.compType === 'button'"> - <el-form-item label="ID"> - <el-tooltip class="item" effect="dark" content="璇锋敞鎰�,ID鐨勪慨鏀瑰彲鑳戒細瀵艰嚧璇ョ粍浠剁浉鍏充簨浠跺け鏁堬紒" placement="left"> - <el-input class="input" v-model="props.id" ></el-input> - </el-tooltip> - </el-form-item> - <el-form-item label="鎸夐挳鏂囧瓧"> - <el-input class="input" v-model="props.text"></el-input> - </el-form-item> - <el-form-item label="鏄剧ず鏍囩"> - <el-switch v-model="props.showLabel" @change="handlerShowLabel"></el-switch> - </el-form-item> - <el-form-item label="鏍囩鏂囧瓧" v-show="props.showLabel"> - <el-input class="input" v-model="props.label"></el-input> - </el-form-item> - <el-form-item label="鏍囩闀垮害" v-show="props.showLabel"> - <el-input-number v-model="props.labelWidth" :min="1" :max="200"></el-input-number> - </el-form-item> - <el-form-item label="鍗犵敤鍒楁暟" v-show="props.span"> - <el-input-number v-model="props.span" :min="1" :max="24"></el-input-number> - </el-form-item> - - <el-form-item label="鎸夐挳绫诲瀷" > - <el-select v-model="props.type" placeholder="璇烽€夋嫨"> - <el-option label="primary" value="primary"/> - <el-option label="success" value="success"/> - <el-option label="warning" value="warning"/> - <el-option label="danger" value="danger"/> - <el-option label="info" value="info"/> - <el-option label="text" value="text"/> - </el-select> - </el-form-item> - <el-form-item label="鎸夐挳澶у皬"> - <el-radio-group v-model="props.size"> - <el-radio-button label="medium">澶�</el-radio-button> - <el-radio-button label="small">涓�</el-radio-button> - <el-radio-button label="mini">灏�</el-radio-button> - </el-radio-group> - </el-form-item> - <el-form-item label="绂佺敤"> - <el-switch v-model="props.disabled"></el-switch> - </el-form-item> - <el-form-item label="绠€鍗曟牱寮�"> - <el-switch v-model="props.plain"></el-switch> - </el-form-item> - <el-form-item label="鍦嗚"> - <el-switch v-model="props.round"></el-switch> - </el-form-item> - <el-form-item label="鍦嗗舰"> - <el-switch v-model="props.circle"></el-switch> - </el-form-item> - <el-form-item label="鍥炬爣"> - <el-input placeholder="璇烽€夋嫨鍥炬爣" readonly v-model="props.icon"> - <template slot="append" > - <i class="el-icon-picture" style="cursor: pointer;" @click="handlerSelectIcon"/> - </template> - </el-input> - </el-form-item> - <icon-dialog v-model="props.icon" :visible.sync="iconDialogVisible"/> - </div> -</template> -<script> - -/** - * input鐨勯厤缃」 - */ -export default { - name:"buttonConfig", - props:{ - props:{} - }, - data(){ - return { - iconDialogVisible:false - } - }, - methods:{ - handlerShowLabel(val){ - if(val){ - this.props.labelWidth = 80; - }else{ - this.props.labelWidth = 0; - } - }, - handlerSelectIcon(){ - this.iconDialogVisible = true; - } - }, - mounted(){ - } -} -</script> diff --git a/sample-form-client-ui/admin/src/components/formDes/custom/configs/cascader.vue b/sample-form-client-ui/admin/src/components/formDes/custom/configs/cascader.vue deleted file mode 100644 index 1cc5a1d926b95ef3a8c52af2f43ba8ea31646633..0000000000000000000000000000000000000000 --- a/sample-form-client-ui/admin/src/components/formDes/custom/configs/cascader.vue +++ /dev/null @@ -1,192 +0,0 @@ -<template> - <div v-show="props.compType === 'cascader'"> - <!-- <el-form-item label="瀛楁鍚�"> - <el-input class="input" v-model="props"></el-input> - </el-form-item> --> - <el-form-item label="ID"> - <el-tooltip class="item" effect="dark" content="璇锋敞鎰�,ID鐨勪慨鏀瑰彲鑳戒細瀵艰嚧璇ョ粍浠剁浉鍏充簨浠跺け鏁堬紒" placement="left"> - <el-input class="input" v-model="props.id" @change="handlerChangeId" ></el-input> - </el-tooltip> - </el-form-item> - <el-form-item label="鏍囬"> - <el-input class="input" v-model="props.label"></el-input> - </el-form-item> - <el-form-item label="鏍呮牸"> - <el-input-number v-model="props.span" :min="1" :max="24"/> - </el-form-item> - <el-form-item label="瀹藉害"> - <el-input-number v-model="props.width" :min="0" :max="100"/>% - </el-form-item> - <el-form-item label="鎻愮ず绗�"> - <el-input class="input" v-model="props.placeholder" placeholder="璇疯緭鍏ユ彁绀虹"/> - </el-form-item> - <!-- <el-form-item label="琛ㄥ崟鏍呮牸"> - <el-slider class="input" v-model="props.span" :max="24" :min="1" :marks="{12:''}"></el-slider> - </el-form-item> --> - <el-form-item label="鏍呮牸闂撮殧"> - <el-input-number v-model="props.gutter" :min="0"></el-input-number> - </el-form-item> - <el-form-item label="鏍囩瀹藉害"> - <el-input-number v-model="props.labelWidth" :min="0" :max="200"></el-input-number> - </el-form-item> - <el-form-item label="鏄剧ず鏍囩"> - <el-switch v-model="props.showLabel" @change="handlerChangeLabel"></el-switch> - </el-form-item> - <el-form-item label="澶у皬"> - <el-radio-group v-model="props.size"> - <el-radio-button label="medium">姝e父</el-radio-button> - <el-radio-button label="small">鐣ュ皬</el-radio-button> - <el-radio-button label="mini">杩蜂綘</el-radio-button> - </el-radio-group> - </el-form-item> - <el-form-item label="娓呴櫎"> - <el-switch v-model="props.clearable"></el-switch> - </el-form-item> - <el-form-item label="绂佺敤"> - <el-switch v-model="props.disabled" ></el-switch> - </el-form-item> - <el-form-item label="瀹屾暣璺緞"> - <el-switch v-model="props.props['show-all-levels']" ></el-switch> - </el-form-item> - <el-form-item label="鍒嗛殧绗�"> - <el-input v-model="props.props.separator" ></el-input> - </el-form-item> - <el-form-item label="鎼滅储"> - <el-switch v-model="props.props.filterable" ></el-switch> - </el-form-item> - <el-form-item label="灞曞紑鏂瑰紡"> - <el-radio-group v-model="props.props.props.expandTrigger"> - <el-radio-button label="click">鐐瑰嚮</el-radio-button> - <el-radio-button label="hover">鎮仠</el-radio-button> - </el-radio-group> - </el-form-item> - <el-form-item label="澶氶€�"> - <el-switch v-model="props.props.props.multiple"></el-switch> - </el-form-item> - <el-form-item label="浠讳竴绾у彲閫�"> - <el-switch v-model="props.props.props.checkStrictly"></el-switch> - </el-form-item> - <el-form-item label="鏁版嵁绫诲瀷"> - <el-radio-group v-model="props.dataType" @change="handlerChangeDataType"> - <el-radio-button label="static">闈欐€佹暟鎹�</el-radio-button> - <el-radio-button label="dynamic">鍔ㄦ€佹暟鎹�</el-radio-button> - </el-radio-group> - </el-form-item> - <div v-show="props.dataType ==='dynamic'"> - <el-form-item label="鍦板潃"> - <el-input v-model="props.action"></el-input> - </el-form-item> - <el-form-item label="鏄剧ず鏍囪瘑"> - <el-input v-model="props.props.props.label"></el-input> - </el-form-item> - <el-form-item label="鍊兼爣璇�"> - <el-input v-model="props.props.props.value"></el-input> - </el-form-item> - <el-form-item label="涓嬬骇鏍囪瘑"> - <el-input v-model="props.props.props.children"></el-input> - </el-form-item> - </div> - <div v-show="props.dataType ==='static'"> - <el-form-item label="闈欐€佹暟鎹�"> - <el-button icon="el-icon-edit-outline" circle @click="handlerStaticData"></el-button> - </el-form-item> - <el-form-item label="鐪佸競鍖�"> - <el-checkbox v-model="props['china-area-data']" @change="handlerSetAreaData"/> - </el-form-item> - </div> - <!-- <el-form-item label="URL"> - <el-input v-model="props.action"></el-input> - </el-form-item> --> - - <el-dialog :visible.sync="staticDataVisible" width="70%" - :close-on-press-escape="false" - :close-on-click-modal="false" - :show-close="false" - :center="true" - top="20px" - > - <codemirror v-model="staticOptions" :options="codeMirror"/> - <span slot="footer" class="dialog-footer"> - <el-button type="primary" @click="handlerSave">纭� 瀹�</el-button> - </span> - </el-dialog> - </div> -</template> -<script> -import {changeId} from '../mixin' -//寮曞叆 鐪佸競鍖� 鏁版嵁 -import {areaData} from '../../utils/chinaAreaData'; -import {codemirror} from 'vue-codemirror'; -// 鏍稿績鏍峰紡 -import 'codemirror/lib/codemirror.css'; -// 寮曞叆涓婚鍚庤繕闇€瑕佸湪 options 涓寚瀹氫富棰樻墠浼氱敓鏁� -import 'codemirror/theme/dracula.css'; -import 'codemirror/mode/javascript/javascript' -const options = { - tabSize: 2, // 缂╄繘鏍煎紡 - theme: 'dracula', // 涓婚锛屽搴斾富棰樺簱 JS 闇€瑕佹彁鍓嶅紩鍏� - lineNumbers: true, // 鏄剧ず琛屽彿 - line: true, - styleActiveLine: true, // 楂樹寒閫変腑琛� - hintOptions: { - completeSingle: true // 褰撳尮閰嶅彧鏈変竴椤圭殑鏃跺€欐槸鍚﹁嚜鍔ㄨˉ鍏� - } - } -/** - * input鐨勯厤缃」 - */ -export default { - name:"cascaderConfig", - props:['props'], - components:{ - codemirror - }, - mixins:[changeId], - data(){ - return { - staticDataVisible:false, - codeMirror:options, - staticOptions:'', - tempOptions:[] - } - }, - methods:{ - handlerChangeLabel(val){ - this.props.labelWidth = val?'80':'1' - }, - handlerStaticData(){ - this.staticOptions = JSON.stringify(this.props.options,null,4); - this.staticDataVisible = true; - - }, - handlerSave(){ - this.props.options = JSON.parse(this.staticOptions); - this.staticDataVisible = false; - }, - handlerChangeDataType(value){ - if(value === 'static'){ - this.props.options = []; - this.props.options = this.tempOptions; - }else{ - this.tempOptions = this.props.options; - this.props.options = []; - } - }, - handlerSetAreaData(val){ - if(val){ - const areaoptions = areaData(); - this.tempOptions = this.props.options; - this.props.options = areaoptions; - }else{ - this.props.options = this.tempOptions; - } - } - }, - mounted(){ - }, - watch:{ - } -} -</script> -<style scoped> -</style> \ No newline at end of file diff --git a/sample-form-client-ui/admin/src/components/formDes/custom/configs/checkbox.vue b/sample-form-client-ui/admin/src/components/formDes/custom/configs/checkbox.vue deleted file mode 100644 index 461149a61f28689b49e706cff4a4dffd6a3f746f..0000000000000000000000000000000000000000 --- a/sample-form-client-ui/admin/src/components/formDes/custom/configs/checkbox.vue +++ /dev/null @@ -1,231 +0,0 @@ -<template> - <div v-show="props.compType === 'checkbox'"> - <!-- <el-form-item label="瀛楁鍚�"> - <el-input class="input" v-model="props"></el-input> - </el-form-item> --> - <el-form-item label="ID"> - <el-tooltip - class="item" - effect="dark" - content="璇锋敞鎰�,ID鐨勪慨鏀瑰彲鑳戒細瀵艰嚧璇ョ粍浠剁浉鍏充簨浠跺け鏁堬紒" - placement="left" - > - <el-input - class="input" - v-model="props.id" - @change="handlerChangeId" - ></el-input> - </el-tooltip> - </el-form-item> - <el-form-item label="鏍囬"> - <el-input class="input" v-model="props.label"></el-input> - </el-form-item> - <el-form-item label="鎻愮ず绗�"> - <el-input - class="input" - v-model="props.placeholder" - placeholder="璇疯緭鍏ユ彁绀虹" - /> - </el-form-item> - <!-- <el-form-item label="琛ㄥ崟鏍呮牸"> - <el-slider class="input" v-model="props.span" :max="24" :min="1" :marks="{12:''}"></el-slider> - </el-form-item> --> - <el-form-item label="鏍呮牸闂撮殧"> - <el-input-number v-model="props.gutter" :min="0"></el-input-number> - </el-form-item> - <el-form-item label="鏍囩瀹藉害"> - <el-input-number - v-model="props.labelWidth" - :min="1" - :max="200" - ></el-input-number> - </el-form-item> - <el-form-item label="鏄剧ず鏍囩"> - <el-switch - v-model="props.showLabel" - @change="handlerChangeLabel" - ></el-switch> - </el-form-item> - <el-form-item label="蹇呭~"> - <el-switch v-model="props.required"></el-switch> - </el-form-item> - <el-form-item label="鍨傜洿"> - <el-switch v-model="props.vertical"></el-switch> - </el-form-item> - <el-form-item label="鏈€灏忔暟閲�"> - <el-input-number v-model="props.min" :min="1"></el-input-number> - </el-form-item> - <el-form-item label="鏈€澶ф暟閲�"> - <el-input-number v-model="props.max" :min="1"></el-input-number> - </el-form-item> - <el-form-item label="閫夐」鏍峰紡"> - <el-radio-group v-model="props.optionType"> - <el-radio-button label="default">榛樿</el-radio-button> - <el-radio-button label="button">鎸夐挳</el-radio-button> - </el-radio-group> - </el-form-item> - <el-form-item label="鏄剧ず杈规"> - <el-switch v-model="props.border"></el-switch> - </el-form-item> - <el-form-item - label="閫夐」灏哄" - v-show="props.border || props.optionType === 'button'" - > - <el-radio-group v-model="props.size"> - <el-radio-button label="medium">姝e父</el-radio-button> - <el-radio-button label="small">鐣ュ皬</el-radio-button> - <el-radio-button label="mini">杩蜂綘</el-radio-button> - </el-radio-group> - </el-form-item> - <el-form-item label="绂佺敤"> - <el-switch - v-model="props.disabled" - @change="handlerChangeDisStatus('disabled')" - ></el-switch> - </el-form-item> - <el-form-item label="榛樿鍊�"> - <el-input - class="input" - :value="setDefaultValue(props.value)" - placeholder="璇疯緭鍏ラ粯璁ゅ€�" - @input="onDefaultValueInput" - /> - </el-form-item> - <el-form-item label="鏁版嵁绫诲瀷"> - <el-radio-group v-model="props.dataType" @change="handlerChangeDataType"> - <el-radio-button label="static">闈欐€佹暟鎹�</el-radio-button> - <el-radio-button label="dynamic">鍔ㄦ€佹暟鎹�</el-radio-button> - </el-radio-group> - </el-form-item> - <div v-show="props.dataType === 'static'"> - <el-divider>閫夐」</el-divider> - <draggable :list="props.options" handle=".option-drag"> - <div - v-for="(item, index) in props.options" - :key="index" - class="select-item" - > - <div class="select-line-icon option-drag"> - <i class="el-icon-s-operation" /> - </div> - <el-input v-model="item.label" placeholder="閫夐」鍚�" size="small" /> - <el-input - placeholder="閫夐」鍊�" - size="small" - :value="item.value" - @input="setOptionValue(item, $event)" - /> - <div - class="close-btn select-line-icon" - @click="props.options.splice(index, 1)" - > - <i class="el-icon-remove-outline" /> - </div> - </div> - </draggable> - <div style="margin-left: 20px"> - <el-button - style="padding-bottom: 0" - icon="el-icon-circle-plus-outline" - type="text" - @click="addSelectItem" - > - 娣诲姞閫夐」 - </el-button> - </div> - </div> - <div v-show="props.dataType === 'dynamic'"> - <el-form-item label="鍦板潃"> - <el-input v-model="props.action"></el-input> - </el-form-item> - </div> - </div> -</template> -<script> -import { changeId } from "../mixin"; -import draggable from "vuedraggable"; -import { isNumberStr } from "../../utils/index"; -/** - * input鐨勯厤缃」 - */ -let vm = { - name: "checkboxConfig", - props: ["props", "getFormId"], - components: { - draggable, - }, - mixins: [changeId], - data() { - return {}; - }, - methods: { - handlerChangeLabel(val) { - this.props.labelWidth = val ? "80" : "1"; - }, - handlerChangeDisStatus(val) { - this.props.readOnly = !val; - }, - handlerChangeReadStatus(val) { - this.props.disabled = !val; - }, - setDefaultValue(val) { - if (Array.isArray(val)) { - return val.join(","); - } - if (["string", "number"].indexOf(val) > -1) { - return val; - } - if (typeof val === "boolean") { - return `${val}`; - } - return val; - }, - onDefaultValueInput(str) { - if (Array.isArray(this.props.value)) { - // 鏁扮粍 - this.$set( - this.props, - "value", - str.split(",").map((val) => (isNumberStr(val) ? +val : val)) - ); - } else if (["true", "false"].indexOf(str) > -1) { - // 甯冨皵 - this.$set(this.props, "value", JSON.parse(str)); - } else { - // 瀛楃涓插拰鏁板瓧 - this.$set(this.props, "value", isNumberStr(str) ? +str : str); - } - }, - setOptionValue(item, val) { - item.value = isNumberStr(val) ? +val : val; - }, - addSelectItem() { - this.props.options.push({ - label: "", - value: "", - }); - }, - multipleChange(val) { - // this.$set(this.props, 'value', val ? [] : '') - return val; - }, - handlerChangeDataType(value) { - if (value === "static") { - this.props.options = []; - this.props.options = this.tempOptions; - } else { - this.tempOptions = this.props.options; - this.props.options = []; - } - }, - }, - mounted() {}, - watch: {}, -}; -export default vm; -</script> -<style lang="less" scoped> -.input { - width: 75%; -} -</style> \ No newline at end of file diff --git a/sample-form-client-ui/admin/src/components/formDes/custom/configs/colorPicker.vue b/sample-form-client-ui/admin/src/components/formDes/custom/configs/colorPicker.vue deleted file mode 100644 index 3ef564df6a4a09369914b5daa71477b468fb9c3f..0000000000000000000000000000000000000000 --- a/sample-form-client-ui/admin/src/components/formDes/custom/configs/colorPicker.vue +++ /dev/null @@ -1,91 +0,0 @@ -<template> - <div v-show="props.compType === 'colorPicker'"> - <el-form-item label="ID"> - <el-tooltip class="item" effect="dark" content="璇锋敞鎰�,ID鐨勪慨鏀瑰彲鑳戒細瀵艰嚧璇ョ粍浠剁浉鍏充簨浠跺け鏁堬紒" placement="left"> - <el-input class="input" v-model="props.id" @change="handlerChangeId" ></el-input> - </el-tooltip> - </el-form-item> - <el-form-item label="鏄剧ず鏍囩"> - <el-switch v-model="props.showLabel" @change="handlerShowLabel"></el-switch> - </el-form-item> - <el-form-item label="鏍囩鏂囧瓧" v-show="props.showLabel"> - <el-input class="input" v-model="props.label"></el-input> - </el-form-item> - <el-form-item label="鏍囩闀垮害" v-show="props.showLabel"> - <el-input-number v-model="props.labelWidth" :min="1" :max="200"></el-input-number> - </el-form-item> - <el-form-item label="閫忔槑"> - <el-switch v-model="props['show-alpha']"></el-switch> - </el-form-item> - <el-form-item label="榛樿棰滆壊"> - <el-color-picker v-model="props.value" /> - </el-form-item> - <el-form-item label="澶у皬"> - <el-radio-group v-model="props.size"> - <el-radio-button label="medium">甯歌</el-radio-button> - <el-radio-button label="small">鐣ュ皬</el-radio-button> - <el-radio-button label="mini">杩蜂綘</el-radio-button> - </el-radio-group> - </el-form-item> - <el-form-item label="棰勫畾涔夐鑹�"> - <div class="select-item" v-for="(item,index) in props.predefine" :key="item"> - <span class="el-color-picker__color"><!--style="background-color: rgb(64, 158, 255);"--> - <span class="el-color-picker__color-inner" :style="{'background-color':item}"> - </span> - </span> - <div class="close-btn select-line-icon"> - <i class="el-icon-remove-outline" @click="handlerRemoveColor(index)"/> - </div> - </div> - <br/> - <el-color-picker v-model="color" @change="handlerAddPreColor"></el-color-picker> - </el-form-item> -</div> -</template> -<script> -import {changeId} from '../mixin' -export default { - name:"buttonConfig", - props:{ - props:{} - }, - mixins:[changeId], - data(){ - return { - color:'#409EFF', - } - }, - methods:{ - handlerShowLabel(val){ - if(val){ - this.props.labelWidth = 80; - }else{ - this.props.labelWidth = 0; - } - }, - handlerAddPreColor(val){ - console.log(val); - this.props.predefine.push(val); - console.log(this.props.predefine); - }, - handlerRemoveColor(index){ - this.props.predefine.splice(index,1); - } - }, - mounted(){ - } -} -</script> -<style scoped> -.el-color-picker__color{ - position: relative; - display: block; - box-sizing: border-box; - border: 1px solid #999; - border-radius: 2px; - width:100px; - height:30px; - float:left; - margin-right:2px; -} -</style> diff --git a/sample-form-client-ui/admin/src/components/formDes/custom/configs/date.vue b/sample-form-client-ui/admin/src/components/formDes/custom/configs/date.vue deleted file mode 100644 index 82dd498cf8acfa5ba8ee22e6037c52101078d39d..0000000000000000000000000000000000000000 --- a/sample-form-client-ui/admin/src/components/formDes/custom/configs/date.vue +++ /dev/null @@ -1,127 +0,0 @@ -<template> - <div v-show="props.compType === 'date'"> - <el-form-item label="ID"> - <el-tooltip class="item" effect="dark" content="璇锋敞鎰�,ID鐨勪慨鏀瑰彲鑳戒細瀵艰嚧璇ョ粍浠剁浉鍏充簨浠跺け鏁堬紒" placement="left"> - <el-input class="input" v-model="props.id" @change="handlerChangeId"></el-input> - </el-tooltip> - </el-form-item> - <el-form-item label="鏍囬"> - <el-input class="input" v-model="props.label"></el-input> - </el-form-item> - <el-form-item label="鏍呮牸闂撮殧"> - <el-input-number v-model="props.gutter" :min="0"></el-input-number> - </el-form-item> - <el-form-item label="鏍囩瀹藉害"> - <el-input-number v-model="props.labelWidth" :min="1" :max="200"></el-input-number> - </el-form-item> - <el-form-item label="鏄剧ず鏍囩"> - <el-switch v-model="props.showLabel"></el-switch> - </el-form-item> - <el-form-item label="鎻愮ず绗�"> - <el-input class="input" v-model="props.placeholder"></el-input> - </el-form-item> - <el-form-item label="蹇呭~"> - <el-switch v-model="props.required"></el-switch> - </el-form-item> - <el-form-item label="鏃堕棿绫诲瀷"> - <el-select class="input" v-model="props.type" @change="handlerFormatChange"> - <el-option v-for="item in dateTypeOptions" :key="item.value" :label="item.label" :value="item.value"></el-option> - </el-select> - </el-form-item> - <el-form-item label="鏃堕棿鏍煎紡"> - <el-input class="input" :value="props.format" @change="handlerChangeValueFormat"/> - </el-form-item> - <el-form-item label="娓呯┖"> - <el-switch v-model="props.clearable"></el-switch> - </el-form-item> - <el-form-item label="鍙"> - <el-switch v-model="props.readonly"></el-switch> - </el-form-item> - <el-form-item label="绂佺敤"> - <el-switch v-model="props.disabled"></el-switch> - </el-form-item> - <el-form-item label="鍒嗛殧绗�" v-show="props.type === 'monthrange'||props.type === 'daterange'||props.type === 'datetimerange'"> - <el-input v-model="props['range-separator']"></el-input> - </el-form-item> - <el-form-item label="榛樿鍊�"> - <el-date-picker class="input" v-model="props.value" value-format="yyyy-MM-dd" type="date" placeholder="閫夋嫨鏃ユ湡"/> - </el-form-item> - - </div> -</template> -<script> -import {changeId} from '../mixin' -const dateType =[ - { - label: '鏃�(date)', - value: 'date' - }, - { - label: '鍛�(week)', - value: 'week' - }, - { - label: '鏈�(month)', - value: 'month' - }, - { - label: '骞�(year)', - value: 'year' - }, - { - label: '鏃ユ湡鏃堕棿(datetime)', - value: 'datetime' - }, - { - label: '鏈堜唤鑼冨洿', - value: 'monthrange' - }, - { - label: '鏃ユ湡鑼冨洿', - value: 'daterange' - }, - { - label: '鏃ユ湡鏃堕棿鑼冨洿', - value: 'datetimerange' - } - ]; -const dateTimeFormat = { - date: 'yyyy-MM-dd', - week: 'yyyy 绗� WW 鍛�', - month: 'yyyy-MM', - year: 'yyyy', - datetime: 'yyyy-MM-dd HH:mm:ss', - daterange: 'yyyy-MM-dd', - monthrange: 'yyyy-MM', - datetimerange: 'yyyy-MM-dd HH:mm:ss' -} - -export default { - name:"inputConfig", - props:['props','getFormId'], - components: { - }, - mixins:[changeId], - data(){ - return { - dateTypeOptions:dateType - } - }, - methods:{ - handlerFormatChange(val){ - this.props.format = dateTimeFormat[val]; - this.props['value-format'] = dateTimeFormat[val]; - }, - handlerChangeValueFormat(val){ - this.props['value-format'] = val; - } - }, - mounted(){ - } -} -</script> -<style scoped> -.input{ - width:75% -} -</style> diff --git a/sample-form-client-ui/admin/src/components/formDes/custom/configs/dialogList.vue b/sample-form-client-ui/admin/src/components/formDes/custom/configs/dialogList.vue deleted file mode 100644 index 460210526cc598c8f7c6de8a02f3bd60e1a4fdab..0000000000000000000000000000000000000000 --- a/sample-form-client-ui/admin/src/components/formDes/custom/configs/dialogList.vue +++ /dev/null @@ -1,172 +0,0 @@ -<template> - <div v-show="props.compType === 'dialogList'" class="dialogList"> - <el-collapse v-model="activePanel" accordion> - <el-collapse-item title="鍩虹璁剧疆" name="1"> - <el-form-item label="ID" > - <el-tooltip class="item" effect="dark" content="璇锋敞鎰�,ID鐨勪慨鏀瑰彲鑳戒細瀵艰嚧璇ョ粍浠剁浉鍏充簨浠跺け鏁堬紒" placement="left"> - <el-input class="input" v-model="props.id" ></el-input> - </el-tooltip> - </el-form-item> - <el-form-item label="鏍囬" > - <el-input class="input" v-model="props.label"></el-input> - </el-form-item> - <el-form-item label="鏍呮牸" > - <el-input-number v-model="props.span" :min="1" :max="24"/> - </el-form-item> - <el-form-item label="鏍囩瀹藉害"> - <el-input-number v-model="props.labelWidth" :min="1" :max="200"></el-input-number> - </el-form-item> - <el-form-item label="鏄剧ず鏍囩"> - <el-switch v-model="props.showLabel"></el-switch> - </el-form-item> - <el-form-item label="蹇呭~"> - <el-switch v-model="props.required"></el-switch> - </el-form-item> - <el-form-item label="绂佺敤" > - <el-switch v-model="props.disabled"></el-switch> - </el-form-item> - <el-form-item label="榛樿鍊�" > - <el-input class="input" v-model="props.value"></el-input> - </el-form-item> - <el-form-item label="璇锋眰鍦板潃"> - <el-input v-model="props.action"></el-input> - </el-form-item> - <el-form-item label="鏍囬"> - <el-input v-model="props.title"></el-input> - </el-form-item> - <el-form-item label="澶氶€�"> - <el-switch v-model="props.multi"></el-switch> - </el-form-item> - <el-form-item label="鏄剧ず搴忓彿"> - <el-switch v-model="props.showIndex"></el-switch> - </el-form-item> - <el-form-item label="琛ㄦ牸楂樺害"> - <el-input-number v-model="props.height" :step="10" :max="1500" :min="100"></el-input-number> - </el-form-item> - <el-form-item label="瀛楁鍊�"> - <el-input v-model="props.dval"></el-input> - </el-form-item> - <el-form-item label="瀛楁鍚嶇О"> - <el-input v-model="props.dlabel"></el-input> - </el-form-item> - </el-collapse-item> - <el-collapse-item title="瀛楁閰嶇疆" name="2"> - <el-table - :data="colOptions" - @row-dblclick="handlerDeleteRow" - > - <el-table-column property="label" label="瀛楁" align="center" /> - <el-table-column property="property" label="灞炴€�" align="center" /> - <el-table-column property="width" label="瀹藉害" align="center" width="70" /> - <el-table-column label="鏄剧ず"> - - </el-table-column> - </el-table> - <br/> - <el-alert title="瀛楁鍜屽睘鎬т笉鑳戒负绌�,璇锋鏌�" v-show="alertShow" type="error" :closable="false"/> - <el-alert title="灞炴€у凡瀛樺湪璇锋鏌�" v-show="propertyExistShow" type="error" :closable="false"/> - <br> - <el-form-item label="瀛楁" label-width="60px"> - <el-input v-model="dLabel" /> - </el-form-item> - <el-form-item label="灞炴€�" label-width="60px"> - <el-input v-model="dProperty"/> - </el-form-item> - <el-form-item label="瀹藉害" label-width="60px"> - <el-input-number v-model="dWidth" /> - </el-form-item> - <el-form-item label="鏄剧ず" label-width="60px"> - <el-switch v-model="dShow" /> - </el-form-item> - <div style="margin-left: 20px;"> - <el-button - style="padding-bottom: 0" - icon="el-icon-circle-plus-outline" - type="text" - @click="addColItem" - > - 娣诲姞閫夐」 - </el-button> - </div> - </el-collapse-item> - <el-collapse-item title="鏁板€艰仈鍔�" name="3"> - - </el-collapse-item> - </el-collapse> - </div> -</template> -<script> -/** - * text鐨勯厤缃」 - */ -export default { - name:"textConfig", - props:{ - props:{} - }, - data(){ - return { - activePanel:'1', - colOptions:[], - dLabel:'', - dProperty:'', - dWidth:150, - dShow:true, - alertShow:false, - propertyExistShow:false, - } - }, - methods:{ - addColItem(){ - if(this.dLabel!==''&&this.dProperty!==''){ - const existOptions = this.colOptions.find(item=>item.property === this.dProperty); - if( typeof existOptions === 'undefined'){ - this.alertShow = false; - this.propertyExistShow = false; - const obj = {}; - obj.index = this.colOptions.length; - obj.show = this.dShow; - obj.label = this.dLabel; - obj.property = this.dProperty; - obj.width = this.dWidth; - this.colOptions.push(obj); - this.resetFields(); - }else{ - this.propertyExistShow = true; - } - }else{ - this.alertShow = true; - } - }, - resetFields(){ - this.dLabel = ''; - this.dProperty = ''; - this.dWidth = 150; - this.dShow = true; - }, - handlerDeleteRow(row){ - let index = this.colOptions.findIndex(item=>item.property==row.property); - this.colOptions.splice(index,1); - } - }, - mounted() { - this.$nextTick(()=> { - this.colOptions = this.colOptions.concat(JSON.parse(this.props.colConf)); - }) - }, - watch:{ - 'colOptions'(newVal){ - this.props.colConf = JSON.stringify(newVal); - } - } -} -</script> -<style scoped> -.dialogList >>> .el-collapse-item__header{ - background-color: #f4f6fc; - padding-left:10px; -} -.dialogList >>> .el-collapse-item__header{ - height:35px; -} -</style> \ No newline at end of file diff --git a/sample-form-client-ui/admin/src/components/formDes/custom/configs/divider.vue b/sample-form-client-ui/admin/src/components/formDes/custom/configs/divider.vue deleted file mode 100644 index df2dd4b6058e64aaa28699a1580baec694b78283..0000000000000000000000000000000000000000 --- a/sample-form-client-ui/admin/src/components/formDes/custom/configs/divider.vue +++ /dev/null @@ -1,39 +0,0 @@ -<template> - <div v-show="props.compType === 'divider'"> - <el-form-item label="ID"> - <el-tooltip class="item" effect="dark" content="璇锋敞鎰�,ID鐨勪慨鏀瑰彲鑳戒細瀵艰嚧璇ョ粍浠剁浉鍏充簨浠跺け鏁堬紒" placement="left"> - <el-input class="input" v-model="props.id" ></el-input> - </el-tooltip> - </el-form-item> - <el-form-item label="鏂囧瓧"> - <el-input class="input" v-model="props.text"></el-input> - </el-form-item> - <el-form-item label="鏂囧瓧澶у皬"> - <el-radio-group v-model="props['content-position']"> - <el-radio-button label="left">宸�</el-radio-button> - <el-radio-button label="center">涓�</el-radio-button> - <el-radio-button label="right">鍙�</el-radio-button> - </el-radio-group> - </el-form-item> - </div> -</template> -<script> -/** - * input鐨勯厤缃」 - */ -export default { - name:"dividerConfig", - props:{ - props:{} - }, - data(){ - return { - } - }, - methods:{ - - }, - mounted(){ - } -} -</script> diff --git a/sample-form-client-ui/admin/src/components/formDes/custom/configs/dynamicTable.vue b/sample-form-client-ui/admin/src/components/formDes/custom/configs/dynamicTable.vue deleted file mode 100644 index 10ce53693ed17999844e4b69134df27827cbe077..0000000000000000000000000000000000000000 --- a/sample-form-client-ui/admin/src/components/formDes/custom/configs/dynamicTable.vue +++ /dev/null @@ -1,44 +0,0 @@ -<template> - <div v-show="props.compType === 'dynamicTable'"> - <el-form-item label="ID"> - <el-tooltip class="item" effect="dark" content="璇锋敞鎰�,ID鐨勪慨鏀瑰彲鑳戒細瀵艰嚧璇ョ粍浠剁浉鍏充簨浠跺け鏁堬紒" placement="left"> - <el-input class="input" v-model="props.id" @change="handlerChangeId"></el-input> - </el-tooltip> - </el-form-item> - <el-form-item label="鏄剧ず鏂板鎸夐挳" label-width="120px"> - <el-switch v-model="props.buttonAdd"></el-switch> - </el-form-item> - <el-form-item label="鏄剧ず鍒犻櫎鎸夐挳" label-width="120px"> - <el-switch v-model="props.buttonDel"></el-switch> - </el-form-item> - <el-form-item label="鏄剧ず琛屽彿" label-width="120px"> - <el-switch v-model="props.showIndex"></el-switch> - </el-form-item> - <el-form-item label="澶氶€�" label-width="120px"> - <el-switch v-model="props.multiCheck"></el-switch> - </el-form-item> - <el-form-item label="鍚堣琛�" label-width="120px"> - <el-switch v-model="props['show-summary']"></el-switch> - </el-form-item> - <el-form-item label="鍚堣鏂囨湰" label-width="120px"> - <el-input v-model="props['sum-text']"></el-input> - </el-form-item> - <el-form-item label="鍗曚綅鏂囨湰" label-width="120px"> - <el-input v-model="props['summary-text']"></el-input> - </el-form-item> - </div> -</template> -<script> -import {changeId} from '../mixin' -export default { - name:"dynamicTableConfig", - props:['props','getFormId'], - mixins:[changeId], - data(){ - return { - } - }, - methods:{ - } -} -</script> \ No newline at end of file diff --git a/sample-form-client-ui/admin/src/components/formDes/custom/configs/editor.vue b/sample-form-client-ui/admin/src/components/formDes/custom/configs/editor.vue deleted file mode 100644 index 8c1acfbe35c355da33b634f018f9772a1c478fb2..0000000000000000000000000000000000000000 --- a/sample-form-client-ui/admin/src/components/formDes/custom/configs/editor.vue +++ /dev/null @@ -1,47 +0,0 @@ -<template> - <div v-show="props.compType === 'editor'"> - <el-form-item label="ID"> - <el-tooltip class="item" effect="dark" content="璇锋敞鎰�,ID鐨勪慨鏀瑰彲鑳戒細瀵艰嚧璇ョ粍浠剁浉鍏充簨浠跺け鏁堬紒" placement="left"> - <el-input class="input" v-model="props.id" @change="handlerChangeId" ></el-input> - </el-tooltip> - </el-form-item> - <el-form-item label="鏄剧ず鏍囩"> - <el-switch v-model="props.showLabel" @change="handlerShowLabel"></el-switch> - </el-form-item> - <el-form-item label="鏍囩鏂囧瓧" v-show="props.showLabel"> - <el-input class="input" v-model="props.label"></el-input> - </el-form-item> - <el-form-item label="鏍囩闀垮害" v-show="props.showLabel"> - <el-input-number v-model="props.labelWidth" :min="1" :max="200"></el-input-number> - </el-form-item> - <el-form-item label="蹇呭~"> - <el-switch v-model="props.required"></el-switch> - </el-form-item> - <el-form-item label="楠岃瘉鏈€澶у瓧鏁�"> - <el-switch v-model="props.validateMaxText"></el-switch> - </el-form-item> - <el-form-item label="鏈€澶у瓧鏁�"> - <el-input-number v-model="props.max" :min="100" ></el-input-number> - </el-form-item> - </div> -</template> -<script> -import {changeId} from '../mixin' -export default { - name:"editorConfig", - props:{ - props:{} - }, - mixins:[changeId], - methods:{ - handlerShowLabel(val){ - if(val){ - this.props.labelWidth = 80; - }else{ - this.props.labelWidth = 0; - } - } - } - -} -</script> diff --git a/sample-form-client-ui/admin/src/components/formDes/custom/configs/html.vue b/sample-form-client-ui/admin/src/components/formDes/custom/configs/html.vue deleted file mode 100644 index 42e97726d616323154722b5431cabd23e2c67af4..0000000000000000000000000000000000000000 --- a/sample-form-client-ui/admin/src/components/formDes/custom/configs/html.vue +++ /dev/null @@ -1,54 +0,0 @@ -<!--搴熷純--> -<template> - <div v-show="props.compType === 'html'"> - <!-- <el-form-item label="瀛楁鍚�"> - <el-input class="input" v-model="props"></el-input> - </el-form-item> --> - <el-form-item label="ID" labelWidth="40px"> - <el-tooltip class="item" effect="dark" content="璇锋敞鎰�,ID鐨勪慨鏀瑰彲鑳戒細瀵艰嚧璇ョ粍浠剁浉鍏充簨浠跺け鏁堬紒" placement="left"> - <el-input class="input" v-model="props.id" ></el-input> - </el-tooltip> - </el-form-item> - <el-form-item label="鏂囨湰" labelWidth="40px"> - <!-- <el-input type="textarea" class="input" v-model="props.text" rows="12"></el-input> --> - <el-button icon="el-icon-edit-outline" circle @click="handlerEditMore"></el-button> - </el-form-item> - <el-dialog :visible.sync="editTextVisible" width="70%" - :close-on-press-escape="false" - :close-on-click-modal="false" - :show-close="false" - :center="true" - top="20px" - > - <fancy-editor v-model="props.text"/> - <span slot="footer" class="dialog-footer"> - <el-button type="primary" @click="handlerSave">纭� 瀹�</el-button> - </span> - </el-dialog> - </div> -</template> -<script> - -/** - * text鐨勯厤缃」 - */ -export default{ - name:"htmlConfig", - props:{ - props:{} - }, - data(){ - return { - editTextVisible:false - } - }, - methods:{ - handlerEditMore(){ - this.editTextVisible = true; - }, - handlerSave(){ - this.editTextVisible = false; - } - } -} -</script> diff --git a/sample-form-client-ui/admin/src/components/formDes/custom/configs/input.vue b/sample-form-client-ui/admin/src/components/formDes/custom/configs/input.vue deleted file mode 100644 index d202e9f947964b2ceed685a80a5109407e4dac20..0000000000000000000000000000000000000000 --- a/sample-form-client-ui/admin/src/components/formDes/custom/configs/input.vue +++ /dev/null @@ -1,224 +0,0 @@ -<template> - <div v-show="props.compType === 'input'"> - <!-- <el-form-item label="瀛楁鍚�"> - <el-input class="input" v-model="props"></el-input> - </el-form-item> --> - <el-form-item label="ID"> - <el-tooltip - class="item" - effect="dark" - content="璇锋敞鎰�,ID鐨勪慨鏀瑰彲鑳戒細瀵艰嚧璇ョ粍浠剁浉鍏充簨浠跺け鏁堬紒" - placement="left" - > - <el-input - class="input" - v-model="props.id" - @change="handlerChangeId" - ></el-input> - </el-tooltip> - </el-form-item> - <el-form-item label="鏍囬"> - <el-input class="input" v-model="props.label"></el-input> - </el-form-item> - <el-form-item label="鏍呮牸"> - <el-input-number v-model="props.span" :min="1" :max="24" /> - </el-form-item> - <!-- <el-form-item label="瀹藉害">--> - <!-- <el-input-number v-model="props.width" :min="1" :max="100"/>%--> - <!-- </el-form-item>--> - <el-form-item label="鎻愮ず绗�"> - <el-input - class="input" - v-model="props.placeholder" - placeholder="璇疯緭鍏ユ彁绀虹" - /> - </el-form-item> - <el-form-item label="鏍呮牸闂撮殧"> - <el-input-number v-model="props.gutter" :min="0"></el-input-number> - </el-form-item> - <el-form-item label="鏍囩瀹藉害"> - <el-input-number - v-model="props.labelWidth" - :min="1" - :max="200" - ></el-input-number> - </el-form-item> - <el-form-item label="鏄剧ず鏍囩"> - <el-switch - v-model="props.showLabel" - @change="handlerChangeLabel" - ></el-switch> - </el-form-item> - <el-form-item label="蹇呭~"> - <el-switch v-model="props.required"></el-switch> - </el-form-item> - <el-form-item label="娓呴櫎"> - <el-switch v-model="props.clearable"></el-switch> - </el-form-item> - <el-form-item label="绂佺敤"> - <el-switch v-model="props.disabled"></el-switch> - </el-form-item> - <el-form-item label="鍙"> - <el-switch v-model="props.readonly"></el-switch> - </el-form-item> - <el-form-item label="鍓嶇疆鍥炬爣"> - <el-input - placeholder="璇烽€夋嫨鍥炬爣" - readonly - v-model="props['prefix-icon']" - > - <template slot="append"> - <i - class="el-icon-picture" - style="cursor: pointer" - @click="handlerPrefixSelectIcon" - /> - </template> - </el-input> - </el-form-item> - <el-form-item label="鍚庣疆鍥炬爣"> - <el-input - placeholder="璇烽€夋嫨鍥炬爣" - readonly - v-model="props['suffix-icon']" - > - <template slot="append"> - <i - class="el-icon-picture" - style="cursor: pointer" - @click="handlerSuffixSelectIcon" - /> - </template> - </el-input> - </el-form-item> - <el-form-item label="鍓嶇紑"> - <el-input v-model="props.prepend"> </el-input> - </el-form-item> - <el-form-item label="鍚庣紑"> - <el-input v-model="props.append"> </el-input> - </el-form-item> - <el-form-item label="榛樿鍊�"> - <el-input class="input" v-model="props.value"></el-input> - </el-form-item> - <el-divider>鏍¢獙</el-divider> - <el-form-item label="楠岃瘉绫诲瀷"> - <el-select v-model="props.rulesType" @change="handlerChangeRulesType"> - <el-option label="鏃�" value="default" /> - <el-option label="鐢佃瘽" value="phone" /> - <el-option label="閭" value="email" /> - <el-option label="绾暟瀛�" value="number" /> - <el-option label="韬唤璇�" value="idcard" /> - </el-select> - </el-form-item> - <div v-for="(item, index) in props.rules" :key="index" class="rule-item"> - <el-input v-model="item.rule" placeholder="姝e垯" size="small" /> - <p /> - <el-input v-model="item.msg" placeholder="鑷畾涔夋彁绀�" size="small" /> - <div - class="close-btn select-line-icon" - @click="props.rules.splice(index, 1)" - > - <i class="el-icon-remove-outline close-icon" /> - </div> - </div> - <div style="margin-left: 20px"> - <el-button - style="padding-bottom: 0" - icon="el-icon-circle-plus-outline" - type="text" - @click="addRuleItem" - > - 娣诲姞閫夐」 - </el-button> - </div> - <icon-dialog - v-model="props['suffix-icon']" - :visible.sync="iconDialogVisible_suffix" - /> - <icon-dialog - v-model="props['prefix-icon']" - :visible.sync="iconDialogVisible_prefix" - /> - </div> -</template> -<script> -import { changeId } from "../mixin"; -import iconDialog from "../../iconDialog"; -const defaultRules = { - phone: { - rule: "^1[3-9]\\d{9}$", - msg: "鎮ㄨ緭鍏ョ殑鐢佃瘽鍙风爜涓嶇鍚堣鍒�", - }, - email: { - rule: "^[a-zA-Z0-9_-]+@[a-zA-Z0-9_-]+(\\.[a-zA-Z0-9_-]+)+$", - msg: "鎮ㄨ緭鍏ョ殑閭欢鍦板潃涓嶇鍚堣鍒�", - }, - number: { rule: "^[0-9]*$", msg: "鎮ㄨ緭鍏ョ殑鍐呭涓嶇鍚堢函鏁板瓧瑙勫垯" }, - idcard: { - rule: "^[1-9]\\d{5}(18|19|([23]\\d))\\d{2}((0[1-9])|(10|11|12))(([0-2][1-9])|10|20|30|31)\\d{3}[0-9Xx]$", - msg: "鎮ㄨ緭鍏ョ殑韬唤璇佸彿鐮佷笉绗﹀悎瑙勫垯", - }, -}; -/** - * input鐨勯厤缃」 - */ -export default { - name: "inputConfig", - props: ["props", "getFormId"], - components: { - iconDialog, - }, - mixins: [changeId], - data() { - return { - val: "", - iconDialogVisible_suffix: false, - iconDialogVisible_prefix: false, - }; - }, - methods: { - handlerChangeLabel(val) { - this.props.labelWidth = val ? "80" : "1"; - }, - handlerSuffixSelectIcon() { - this.iconDialogVisible_suffix = true; - }, - handlerPrefixSelectIcon() { - this.iconDialogVisible_prefix = true; - }, - addRuleItem() { - this.props.rules.push({ - rule: "", - msg: "", - }); - }, - handlerChangeRulesType(val) { - const obj = defaultRules[val]; - this.props.rules.push({ - rule: obj.rule, - msg: obj.msg, - }); - }, - }, - mounted() {}, - watch: {}, -}; -</script> -<style scoped> -.input { - width: 75%; -} -.rule-item { - padding-top: 5px; - padding-bottom: 5px; -} -.close-btn { - text-align: center; -} -.close-icon:hover { - cursor: pointer; -} -.close-btn >>> .el-icon-remove-outline { - color: "red"; -} -</style> \ No newline at end of file diff --git a/sample-form-client-ui/admin/src/components/formDes/custom/configs/inputNumber.vue b/sample-form-client-ui/admin/src/components/formDes/custom/configs/inputNumber.vue deleted file mode 100644 index 3dc357f2bbaeb8422edaad55c6f5cf1bb75965db..0000000000000000000000000000000000000000 --- a/sample-form-client-ui/admin/src/components/formDes/custom/configs/inputNumber.vue +++ /dev/null @@ -1,83 +0,0 @@ -<template> - <div v-show="props.compType === 'inputNumber'"> - <el-form-item label="ID"> - <el-tooltip class="item" effect="dark" content="璇锋敞鎰�,ID鐨勪慨鏀瑰彲鑳戒細瀵艰嚧璇ョ粍浠剁浉鍏充簨浠跺け鏁堬紒" placement="left"> - <el-input class="input" v-model="props.id" @change="handlerChangeId"></el-input> - </el-tooltip> - </el-form-item> - <el-form-item label="鏍囬"> - <el-input class="input" v-model="props.label"></el-input> - </el-form-item> - <!-- <el-form-item label="琛ㄥ崟鏍呮牸"> - <el-slider class="input" v-model="props.span" :max="24" :min="1" :marks="{12:''}"></el-slider> - </el-form-item> --> - <el-form-item label="鏍呮牸闂撮殧"> - <el-input-number v-model="props.gutter" :min="0"></el-input-number> - </el-form-item> - <el-form-item label="鏍囩瀹藉害"> - <el-input-number v-model="props.labelWidth" :min="1" :max="200"></el-input-number> - </el-form-item> - <el-form-item label="鏄剧ず鏍囩"> - <el-switch v-model="props.showLabel" @change="handlerChangeLabel"></el-switch> - </el-form-item> - <el-form-item label="蹇呭~"> - <el-switch v-model="props.required"></el-switch> - </el-form-item> - <el-form-item label="鏈€灏忓€�"> - <el-input-number v-model="props.min"></el-input-number> - </el-form-item> - <el-form-item label="鏈€澶у€�"> - <el-input-number v-model="props.max"></el-input-number> - </el-form-item> - <el-form-item label="姝ラ暱"> - <el-input-number v-model="props.step"></el-input-number> - </el-form-item> - <el-form-item label="绮惧害"> - <el-input-number v-model="props.precision" :min="0" :max="10"></el-input-number> - </el-form-item> - <el-form-item label="鎸夐挳浣嶇疆"> - <el-radio-group v-model="props['controls-position']"> - <el-radio-button label="default">榛樿</el-radio-button> - <el-radio-button label="right">鍙充晶</el-radio-button> - </el-radio-group> - </el-form-item> - <el-form-item label="绂佺敤"> - <el-switch v-model="props.disabled" @change="handlerChangeDisStatus('disabled')"></el-switch> - </el-form-item> - <el-form-item label="榛樿鍊�"> - <el-input class="input" v-model="props.value"></el-input> - </el-form-item> - </div> -</template> -<script> -import {changeId} from '../mixin' -export default { - name:"inputConfig", - props:['props','getFormId'], - components: { - }, - mixins:[changeId], - data(){ - return { - } - }, - methods:{ - handlerChangeLabel(val){ - this.props.labelWidth = val?'80':'1' - }, - handlerChangeDisStatus(val){ - this.props.readOnly = val?false:true - }, - handlerChangeReadStatus(val){ - this.props.disabled = val?false:true - }, - }, - mounted(){ - } -} -</script> -<style scoped> -.input{ - width:75% -} -</style> \ No newline at end of file diff --git a/sample-form-client-ui/admin/src/components/formDes/custom/configs/link.vue b/sample-form-client-ui/admin/src/components/formDes/custom/configs/link.vue deleted file mode 100644 index 651353157b573ca8b5e5487fb02c1b56ee1b82cf..0000000000000000000000000000000000000000 --- a/sample-form-client-ui/admin/src/components/formDes/custom/configs/link.vue +++ /dev/null @@ -1,68 +0,0 @@ -<template> - <div v-show="props.compType === 'link'"> - <!-- <el-form-item label="瀛楁鍚�"> - <el-input class="input" v-model="props"></el-input> - </el-form-item> --> - <el-form-item label="ID"> - <el-tooltip class="item" effect="dark" content="璇锋敞鎰�,ID鐨勪慨鏀瑰彲鑳戒細瀵艰嚧璇ョ粍浠剁浉鍏充簨浠跺け鏁堬紒" placement="left"> - <el-input class="input" v-model="props.id" @change="handlerChangeId" ></el-input> - </el-tooltip> - </el-form-item> - <el-form-item label="閾炬帴鏂囧瓧"> - <el-input class="input" v-model="props.text"></el-input> - </el-form-item> - <el-form-item label="绫诲瀷" > - <el-select v-model="props.type" placeholder="璇烽€夋嫨"> - <el-option label="primary" value="primary"/> - <el-option label="success" value="success"/> - <el-option label="warning" value="warning"/> - <el-option label="danger" value="danger"/> - <el-option label="info" value="info"/> - </el-select> - </el-form-item> - <el-form-item label="url"> - <el-input class="input" v-model="props.href"></el-input> - </el-form-item> - <el-form-item label="绂佺敤"> - <el-switch v-model="props.disabled"></el-switch> - </el-form-item> - <el-form-item label="鏂扮獥鍙�"> - <el-switch v-model="isNewWindow" @change="handlerChangeTargetValue"></el-switch> - </el-form-item> - </div> -</template> -<script> -import {changeId} from '../mixin' -export default { - name:"buttonConfig", - props:{ - props:{} - }, - components:{ - }, - mixins:[changeId], - data(){ - return { - isNewWindow:true - } - }, - methods:{ - handlerShowLabel(val){ - if(val){ - this.props.labelWidth = 80; - }else{ - this.props.labelWidth = 0; - } - }, - handlerChangeTargetValue(val){ - if(val){ - this.props.target = '_blank'; - }else{ - this.props.target = '_self'; - } - } - }, - mounted(){ - } -} -</script> diff --git a/sample-form-client-ui/admin/src/components/formDes/custom/configs/radio.vue b/sample-form-client-ui/admin/src/components/formDes/custom/configs/radio.vue deleted file mode 100644 index c2af25ec87b657c8d757d3eae403b11fc89daadc..0000000000000000000000000000000000000000 --- a/sample-form-client-ui/admin/src/components/formDes/custom/configs/radio.vue +++ /dev/null @@ -1,227 +0,0 @@ -<template> - <div v-show="props.compType === 'radio'"> - <!-- <el-form-item label="瀛楁鍚�"> - <el-input class="input" v-model="props"></el-input> - </el-form-item> --> - <el-form-item label="ID"> - <el-tooltip - class="item" - effect="dark" - content="璇锋敞鎰�,ID鐨勪慨鏀瑰彲鑳戒細瀵艰嚧璇ョ粍浠剁浉鍏充簨浠跺け鏁堬紒" - placement="left" - > - <el-input - class="input" - v-model="props.id" - @change="handlerChangeId" - ></el-input> - </el-tooltip> - </el-form-item> - <el-form-item label="鏍囬"> - <el-input class="input" v-model="props.label"></el-input> - </el-form-item> - <el-form-item label="鎻愮ず绗�"> - <el-input - class="input" - v-model="props.placeholder" - placeholder="璇疯緭鍏ユ彁绀虹" - /> - </el-form-item> - <!-- <el-form-item label="琛ㄥ崟鏍呮牸"> - <el-slider class="input" v-model="props.span" :max="24" :min="1" :marks="{12:''}"></el-slider> - </el-form-item> --> - <el-form-item label="鏍呮牸闂撮殧"> - <el-input-number v-model="props.gutter" :min="0"></el-input-number> - </el-form-item> - <el-form-item label="鏍囩瀹藉害"> - <el-input-number - v-model="props.labelWidth" - :min="1" - :max="200" - ></el-input-number> - </el-form-item> - <el-form-item label="鏄剧ず鏍囩"> - <el-switch - v-model="props.showLabel" - @change="handlerChangeLabel" - ></el-switch> - </el-form-item> - <el-form-item label="蹇呭~"> - <el-switch v-model="props.required"></el-switch> - </el-form-item> - <el-form-item label="鍨傜洿"> - <el-switch v-model="props.vertical"></el-switch> - </el-form-item> - <el-form-item label="閫夐」鏍峰紡"> - <el-radio-group v-model="props.optionType"> - <el-radio-button label="default">榛樿</el-radio-button> - <el-radio-button label="button">鎸夐挳</el-radio-button> - </el-radio-group> - </el-form-item> - <el-form-item label="鏄剧ず杈规"> - <el-switch v-model="props.border"></el-switch> - </el-form-item> - <el-form-item - label="澶у皬" - v-show="props.border || props.optionType === 'button'" - > - <el-radio-group v-model="props.size"> - <el-radio-button label="medium">姝e父</el-radio-button> - <el-radio-button label="small">鐣ュ皬</el-radio-button> - <el-radio-button label="mini">杩蜂綘</el-radio-button> - </el-radio-group> - </el-form-item> - <el-form-item label="绂佺敤"> - <el-switch - v-model="props.disabled" - @change="handlerChangeDisStatus('disabled')" - ></el-switch> - </el-form-item> - <el-form-item label="榛樿鍊�"> - <el-input - class="input" - :value="setDefaultValue(props.value)" - placeholder="璇疯緭鍏ラ粯璁ゅ€�" - @input="onDefaultValueInput" - /> - </el-form-item> - <el-form-item label="鏁版嵁绫诲瀷"> - <el-radio-group v-model="props.dataType" @change="handlerChangeDataType"> - <el-radio-button label="static">闈欐€佹暟鎹�</el-radio-button> - <el-radio-button label="dynamic">鍔ㄦ€佹暟鎹�</el-radio-button> - </el-radio-group> - </el-form-item> - <div v-show="props.dataType === 'static'"> - <el-divider>閫夐」</el-divider> - <draggable :list="props.options" handle=".option-drag"> - <div - v-for="(item, index) in props.options" - :key="index" - class="select-item" - > - <div class="select-line-icon option-drag"> - <i class="el-icon-s-operation" /> - </div> - <el-input v-model="item.label" placeholder="閫夐」鍚�" size="small" /> - <el-input - placeholder="閫夐」鍊�" - size="small" - :value="item.value" - @input="setOptionValue(item, $event)" - /> - <div - class="close-btn select-line-icon" - @click="props.options.splice(index, 1)" - > - <i class="el-icon-remove-outline" /> - </div> - </div> - </draggable> - <div style="margin-left: 20px"> - <el-button - style="padding-bottom: 0" - icon="el-icon-circle-plus-outline" - type="text" - @click="addSelectItem" - > - 娣诲姞閫夐」 - </el-button> - </div> - </div> - <div v-show="props.dataType === 'dynamic'"> - <el-form-item label="鍦板潃"> - <el-input v-model="props.action"></el-input> - </el-form-item> - </div> - </div> -</template> -<script> -import { changeId } from "../mixin"; -import draggable from "vuedraggable"; -import { isNumberStr } from "../../utils/index"; -/** - * input鐨勯厤缃」 - */ -let vm = { - name: "inputConfig", - props: ["props", "getFormId"], - components: { - draggable, - }, - mixins: [changeId], - data() { - return { - val: 123, - }; - }, - methods: { - handlerChangeLabel(val) { - this.props.labelWidth = val ? "80" : "1"; - }, - handlerChangeDisStatus(val) { - this.props.readOnly = !val; - }, - handlerChangeReadStatus(val) { - this.props.disabled = !val; - }, - setDefaultValue(val) { - if (Array.isArray(val)) { - return val.join(","); - } - if (["string", "number"].indexOf(val) > -1) { - return val; - } - if (typeof val === "boolean") { - return `${val}`; - } - return val; - }, - onDefaultValueInput(str) { - if (Array.isArray(this.props.value)) { - // 鏁扮粍 - this.$set( - this.props, - "value", - str.split(",").map((val) => (isNumberStr(val) ? +val : val)) - ); - } else if (["true", "false"].indexOf(str) > -1) { - // 甯冨皵 - this.$set(this.props, "value", JSON.parse(str)); - } else { - // 瀛楃涓插拰鏁板瓧 - this.$set(this.props, "value", isNumberStr(str) ? +str : str); - } - }, - setOptionValue(item, val) { - item.value = isNumberStr(val) ? +val : val; - }, - addSelectItem() { - this.props.options.push({ - label: "", - value: "", - }); - }, - multipleChange(val) { - // this.$set(this.props, 'value', val ? [] : '') - return val; - }, - handlerChangeDataType(value) { - if (value === "static") { - this.props.options = []; - this.props.options = this.tempOptions; - } else { - this.tempOptions = this.props.options; - this.props.options = []; - } - }, - }, - mounted() {}, - watch: {}, -}; -export default vm; -</script> -<style lang="less" scoped> -.input { - width: 75%; -} -</style> \ No newline at end of file diff --git a/sample-form-client-ui/admin/src/components/formDes/custom/configs/rate.vue b/sample-form-client-ui/admin/src/components/formDes/custom/configs/rate.vue deleted file mode 100644 index fae0cbd4e080d7410a7d112c4e728e9c0e582cc9..0000000000000000000000000000000000000000 --- a/sample-form-client-ui/admin/src/components/formDes/custom/configs/rate.vue +++ /dev/null @@ -1,68 +0,0 @@ -<template> - <div v-show="props.compType === 'rate'"> - <!-- <el-form-item label="瀛楁鍚�"> - <el-input class="input" v-model="props"></el-input> - </el-form-item> --> - <el-form-item label="ID"> - <el-tooltip class="item" effect="dark" content="璇锋敞鎰�,ID鐨勪慨鏀瑰彲鑳戒細瀵艰嚧璇ョ粍浠剁浉鍏充簨浠跺け鏁堬紒" placement="left"> - <el-input class="input" v-model="props.id" @change="handlerChangeId"></el-input> - </el-tooltip> - </el-form-item> - <el-form-item label="鏍囬"> - <el-input class="input" v-model="props.label"></el-input> - </el-form-item> - <!-- <el-form-item label="琛ㄥ崟鏍呮牸"> - <el-slider class="input" v-model="props.span" :max="24" :min="1" :marks="{12:''}"></el-slider> - </el-form-item> --> - <el-form-item label="鏍呮牸闂撮殧"> - <el-input-number v-model="props.gutter" :min="0"></el-input-number> - </el-form-item> - <el-form-item label="鏍囩瀹藉害"> - <el-input-number v-model="props.labelWidth" :min="1" :max="200"></el-input-number> - </el-form-item> - <el-form-item label="鏄剧ず鏍囩"> - <el-switch v-model="props.showLabel"></el-switch> - </el-form-item> - <el-form-item label="蹇呭~"> - <el-switch v-model="props.required"></el-switch> - </el-form-item> - <el-form-item label="鍏佽鍗婇€�"> - <el-switch v-model="props['allow-half']"></el-switch> - </el-form-item> - <el-form-item label="鏄剧ず鍒嗘暟"> - <el-switch v-model="props['show-score']"></el-switch> - </el-form-item> - <el-form-item label="鏈€澶у€�"> - <el-input-number v-model="props.max"></el-input-number> - </el-form-item> - <el-form-item label="绂佺敤"> - <el-switch v-model="props.disabled"></el-switch> - </el-form-item> - <el-form-item label="榛樿鍊�"> - <el-input class="input" v-model="props.value"></el-input> - </el-form-item> - </div> -</template> -<script> -import {changeId} from '../mixin' -export default { - name:"rate", - props:['props','getFormId'], - components: { - }, - mixins:[changeId], - data(){ - return { - } - }, - methods:{ - }, - mounted(){ - } -} -</script> -<style scoped> -.input{ - width:75% -} -</style> \ No newline at end of file diff --git a/sample-form-client-ui/admin/src/components/formDes/custom/configs/row.vue b/sample-form-client-ui/admin/src/components/formDes/custom/configs/row.vue deleted file mode 100644 index 8bbb5f026df823d448d44623d8060b764977794f..0000000000000000000000000000000000000000 --- a/sample-form-client-ui/admin/src/components/formDes/custom/configs/row.vue +++ /dev/null @@ -1,55 +0,0 @@ -<!--鍚庢湡鏀寔flex甯冨眬--> -<template> - <div v-show="props.compType === 'row'"> - <el-form-item label="鏍呮牸闂撮殧"> - <el-input-number size="small" v-model="props.gutter" :min="0" :max="100"/> - </el-form-item> - <el-divider>鍒楅厤缃」</el-divider> - <div v-for="(item, index) in props.columns" :key="index" class="select-item"> - <div class="select-line-icon"> - <i class="el-icon-s-operation" /> - </div> - <el-input-number - size="normal" - v-model="item.span" - :min="1" :max="24" - /> - <div class="close-btn select-line-icon" @click="props.columns.splice(index,1)"> - <i class="el-icon-remove-outline" /> - </div> - </div> - <div style="margin-left: 30px;"> - <el-button - style="padding-bottom: 0" - icon="el-icon-circle-plus-outline" - type="text" - @click="handlerAddCol" - > - 娣诲姞閫夐」 - </el-button> - </div> - </div> -</template> -<script> - -export default { - name:"rowConfig", - props:['props','getFormId'], - data(){ - return { - } - }, - methods:{ - handlerAddCol(){ - const colIndex = this.props.columns+1; - this.props.columns.push({ - index:colIndex, - span:12, - list:[] - }) - }, - }, - mounted(){ - } -} -</script> diff --git a/sample-form-client-ui/admin/src/components/formDes/custom/configs/select.vue b/sample-form-client-ui/admin/src/components/formDes/custom/configs/select.vue deleted file mode 100644 index e4b1d6ac4bee559a2f8931ebaa159b71095c6858..0000000000000000000000000000000000000000 --- a/sample-form-client-ui/admin/src/components/formDes/custom/configs/select.vue +++ /dev/null @@ -1,202 +0,0 @@ -<template> - <div v-show="props.compType === 'select'"> - <!-- <el-form-item label="瀛楁鍚�"> - <el-input class="input" v-model="props"></el-input> - </el-form-item> --> - <el-form-item label="ID"> - <el-tooltip - class="item" - effect="dark" - content="璇锋敞鎰�,ID鐨勪慨鏀瑰彲鑳戒細瀵艰嚧璇ョ粍浠剁浉鍏充簨浠跺け鏁堬紒" - placement="left" - > - <el-input - class="input" - v-model="props.id" - @change="handlerChangeId" - ></el-input> - </el-tooltip> - </el-form-item> - <el-form-item label="鏍囬"> - <el-input class="input" v-model="props.label"></el-input> - </el-form-item> - <el-form-item label="鎻愮ず绗�"> - <el-input - class="input" - v-model="props.placeholder" - placeholder="璇疯緭鍏ユ彁绀虹" - /> - </el-form-item> - <!-- <el-form-item label="琛ㄥ崟鏍呮牸"> - <el-slider class="input" v-model="props.span" :max="24" :min="1" :marks="{12:''}"></el-slider> - </el-form-item> --> - <el-form-item label="鏍呮牸闂撮殧"> - <el-input-number v-model="props.gutter" :min="0"></el-input-number> - </el-form-item> - <el-form-item label="鏍囩瀹藉害"> - <el-input-number - v-model="props.labelWidth" - :min="1" - :max="200" - ></el-input-number> - </el-form-item> - <el-form-item label="鏄剧ず鏍囩"> - <el-switch - v-model="props.showLabel" - @change="handlerChangeLabel" - ></el-switch> - </el-form-item> - <el-form-item label="蹇呭~"> - <el-switch v-model="props.required"></el-switch> - </el-form-item> - <el-form-item label="娓呴櫎"> - <el-switch v-model="props.clearable"></el-switch> - </el-form-item> - <el-form-item label="绂佺敤"> - <el-switch v-model="props.disabled"></el-switch> - </el-form-item> - <el-form-item label="澶氶€�"> - <el-switch v-model="props.multiple" @change="multipleChange"></el-switch> - </el-form-item> - <el-form-item label="鎶樺彔" v-show="props.multiple"> - <el-switch v-model="props['collapse-tags']"></el-switch> - </el-form-item> - <el-form-item label="鎼滅储"> - <el-switch v-model="props.filterable"></el-switch> - </el-form-item> - <el-form-item label="榛樿鍊�"> - <el-input - class="input" - :value="setValue(props.value)" - placeholder="璇疯緭鍏ラ粯璁ゅ€�" - @input="onValueInput" - /> - </el-form-item> - <el-form-item label="鏁版嵁绫诲瀷"> - <el-radio-group v-model="props.dataType" @change="handlerChangeDataType"> - <el-radio-button label="static">闈欐€佹暟鎹�</el-radio-button> - <el-radio-button label="dynamic">鍔ㄦ€佹暟鎹�</el-radio-button> - </el-radio-group> - </el-form-item> - <div v-show="props.dataType === 'static'"> - <el-divider>閫夐」</el-divider> - <draggable :list="props.options" handle=".option-drag"> - <div - v-for="(item, index) in props.options" - :key="index" - class="select-item" - > - <div class="select-line-icon option-drag"> - <i class="el-icon-s-operation" /> - </div> - <el-input v-model="item.label" placeholder="閫夐」鍚�" size="small" /> - <el-input - placeholder="閫夐」鍊�" - size="small" - :value="item.value" - @input="setOptionValue(item, $event)" - /> - <div - class="close-btn select-line-icon" - @click="props.options.splice(index, 1)" - > - <i class="el-icon-remove-outline" /> - </div> - </div> - </draggable> - <div style="margin-left: 20px"> - <el-button - style="padding-bottom: 0" - icon="el-icon-circle-plus-outline" - type="text" - @click="addSelectItem" - > - 娣诲姞閫夐」 - </el-button> - </div> - </div> - <div v-show="props.dataType === 'dynamic'"> - <el-form-item label="鍦板潃"> - <el-input v-model="props.action"></el-input> - </el-form-item> - </div> - </div> -</template> -<script> -import { changeId } from "../mixin"; -import draggable from "vuedraggable"; -import { isNumberStr } from "../../utils/index"; -export default { - name: "inputConfig", - props: ["props", "getFormId"], - components: { - draggable, - }, - mixins: [changeId], - data() { - return { - tempOptions: [], - }; - }, - methods: { - handlerChangeLabel(val) { - this.props.labelWidth = val ? "80" : "1"; - }, - setValue(val) { - if (Array.isArray(val)) { - return val.join(","); - } - if (["string", "number"].indexOf(val) > -1) { - return val; - } - if (typeof val === "boolean") { - return `${val}`; - } - return val; - }, - onValueInput(str) { - if (Array.isArray(this.props.value)) { - // 鏁扮粍 - this.$set( - this.props, - "value", - str.split(",").map((val) => (isNumberStr(val) ? +val : val)) - ); - } else if (["true", "false"].indexOf(str) > -1) { - // 甯冨皵 - this.$set(this.props, "value", JSON.parse(str)); - } else { - // 瀛楃涓插拰鏁板瓧 - this.$set(this.props, "value", isNumberStr(str) ? +str : str); - } - }, - setOptionValue(item, val) { - item.value = isNumberStr(val) ? +val : val; - }, - addSelectItem() { - this.props.options.push({ - label: "", - value: "", - }); - }, - multipleChange(val) { - this.$set(this.props, "value", val ? [] : ""); - }, - handlerChangeDataType(value) { - if (value === "static") { - this.props.options = []; - this.props.options = this.tempOptions; - } else { - this.tempOptions = this.props.options; - this.props.options = []; - } - }, - }, - mounted() {}, -}; -</script> -<style lang="less" scoped> -.input { - width: 75%; -} -</style> \ No newline at end of file diff --git a/sample-form-client-ui/admin/src/components/formDes/custom/configs/slider.vue b/sample-form-client-ui/admin/src/components/formDes/custom/configs/slider.vue deleted file mode 100644 index da501e255424aed9f353aae540f9d7aa2e749acb..0000000000000000000000000000000000000000 --- a/sample-form-client-ui/admin/src/components/formDes/custom/configs/slider.vue +++ /dev/null @@ -1,78 +0,0 @@ -<template> - <div v-show="props.compType === 'slider'"> - <!-- <el-form-item label="瀛楁鍚�"> - <el-input class="input" v-model="props"></el-input> - </el-form-item> --> - <el-form-item label="ID"> - <el-tooltip class="item" effect="dark" content="璇锋敞鎰�,ID鐨勪慨鏀瑰彲鑳戒細瀵艰嚧璇ョ粍浠剁浉鍏充簨浠跺け鏁堬紒" placement="left"> - <el-input class="input" v-model="props.id" @change="handlerChangeId"></el-input> - </el-tooltip> - </el-form-item> - <el-form-item label="鏍囬"> - <el-input class="input" v-model="props.label"></el-input> - </el-form-item> - <!-- <el-form-item label="琛ㄥ崟鏍呮牸"> - <el-slider class="input" v-model="props.span" :max="24" :min="1" :marks="{12:''}"></el-slider> - </el-form-item> --> - <el-form-item label="鏍呮牸闂撮殧"> - <el-input-number v-model="props.gutter" :min="0"></el-input-number> - </el-form-item> - <el-form-item label="鏍囩瀹藉害"> - <el-input-number v-model="props.labelWidth" :min="1" :max="200"></el-input-number> - </el-form-item> - <el-form-item label="鏄剧ず鏍囩"> - <el-switch v-model="props.showLabel"></el-switch> - </el-form-item> - <el-form-item label="蹇呭~"> - <el-switch v-model="props.required"></el-switch> - </el-form-item> - - <el-form-item label="鏈€灏忓€�"> - <el-input-number v-model="props.min" :min="0"></el-input-number> - </el-form-item> - <el-form-item label="鏈€澶у€�"> - <el-input-number v-model="props.max" placeholder="瀛楃闀垮害"/> - </el-form-item> - <el-form-item label="姝ラ暱"> - <el-input-number v-model="props.step"></el-input-number> - </el-form-item> - <el-form-item label="鑼冨洿閫夋嫨"> - <el-switch v-model="props.range"></el-switch> - </el-form-item> - <el-form-item label="鏄剧ず鏂偣"> - <el-switch v-model="props['show-stops']"></el-switch> - </el-form-item> - <el-form-item label="鏄剧ず鎻愮ず娑堟伅"> - <el-switch v-model="props['show-tooltip']"></el-switch> - </el-form-item> - <el-form-item label="绂佺敤"> - <el-switch v-model="props.disabled"></el-switch> - </el-form-item> - <el-form-item label="榛樿鍊�"> - <el-input class="input" v-model="props.value"></el-input> - </el-form-item> - </div> -</template> -<script> -import {changeId} from '../mixin' -export default { - name:"inputConfig", - props:['props','getFormId'], - components: { - }, - mixins:[changeId], - data(){ - return { - } - }, - methods:{ - }, - mounted(){ - } -} -</script> -<style scoped> -.input{ - width:75% -} -</style> \ No newline at end of file diff --git a/sample-form-client-ui/admin/src/components/formDes/custom/configs/table.vue b/sample-form-client-ui/admin/src/components/formDes/custom/configs/table.vue deleted file mode 100644 index 1041fcb25aead1609d98ecc9b62c18a9f56a559e..0000000000000000000000000000000000000000 --- a/sample-form-client-ui/admin/src/components/formDes/custom/configs/table.vue +++ /dev/null @@ -1,40 +0,0 @@ -<template> - <div v-show="props.compType === 'table'"> - <el-form-item label="ID" > - <el-tooltip class="item" effect="dark" content="璇锋敞鎰�,ID鐨勪慨鏀瑰彲鑳戒細瀵艰嚧璇ョ粍浠剁浉鍏充簨浠跺け鏁堬紒" placement="left"> - <el-input class="input" v-model="props.id" @change="handlerChangeId" ></el-input> - </el-tooltip> - </el-form-item> - <el-form-item label="鍗曞厓鏍兼牱寮�"> - <el-input class="input" v-model="props.tdStyle"></el-input> - </el-form-item> - <el-form-item label="琛ㄦ牸瀹藉害"> - <el-inputNumber class="input" :min="0" :max="500" v-model="props.width"></el-inputNumber> - </el-form-item> - <el-form-item label="琛岄珮"> - <el-inputNumber class="input" :min="0" :max="1500" :step="5" v-model="props.height"></el-inputNumber> - </el-form-item> - </div> -</template> -<script> -import {changeId} from '../mixin' -/** - * input鐨勯厤缃」 - */ -export default { - name:"inputConfig", - props:['props','getFormId'], - components:{ - }, - mixins:[changeId], - data(){ - return { - - } - }, - methods:{ - } -} -</script> -<style scoped> -</style> \ No newline at end of file diff --git a/sample-form-client-ui/admin/src/components/formDes/custom/configs/tdItem.vue b/sample-form-client-ui/admin/src/components/formDes/custom/configs/tdItem.vue deleted file mode 100644 index ef0988493e9c0020930b6a2877f3a6363c81cbcb..0000000000000000000000000000000000000000 --- a/sample-form-client-ui/admin/src/components/formDes/custom/configs/tdItem.vue +++ /dev/null @@ -1,28 +0,0 @@ -<template> - <div v-show="props.compType === 'tdItem'"> - <el-form-item label="鍗曞厓鏍艰儗鏅�"> - <el-color-picker v-model="props.style.background" :predefine="predefineColors"/> - </el-form-item> - <el-form-item label="琛ㄦ牸瀹藉害(%)"> - <el-inputNumber class="input" :min="0" :max="100" v-model="props.style.width"/> - </el-form-item> - </div> -</template> -<script> -/** - * input鐨勯厤缃」 - */ -export default { - name:"tdItemConfig", - props:['props'], - data(){ - return { - predefineColors: [ - '#F6F6F6' - ] - } - }, - methods:{ - } -} -</script> \ No newline at end of file diff --git a/sample-form-client-ui/admin/src/components/formDes/custom/configs/text.vue b/sample-form-client-ui/admin/src/components/formDes/custom/configs/text.vue deleted file mode 100644 index 7b4b48dd3164ea7bd6b788832ba8b3a96a65ca69..0000000000000000000000000000000000000000 --- a/sample-form-client-ui/admin/src/components/formDes/custom/configs/text.vue +++ /dev/null @@ -1,51 +0,0 @@ -<template> - <div v-show="props.compType === 'text'"> - <!-- <el-form-item label="瀛楁鍚�"> - <el-input class="input" v-model="props"></el-input> - </el-form-item> --> - <el-form-item label="ID" labelWidth="40px"> - <el-tooltip class="item" effect="dark" content="璇锋敞鎰�,ID鐨勪慨鏀瑰彲鑳戒細瀵艰嚧璇ョ粍浠剁浉鍏充簨浠跺け鏁堬紒" placement="left"> - <el-input class="input" v-model="props.id" @change="handlerChangeId" ></el-input> - </el-tooltip> - </el-form-item> - <el-form-item label="鏂囨湰" labelWidth="40px"> - <el-input type="textarea" class="input" v-model="props.text" rows="12" ></el-input> - </el-form-item> - <el-form-item label="棰滆壊" labelWidth="40px"> - <el-color-picker v-model="props.color" /> - </el-form-item> - <el-form-item label="甯冨眬" labelWidth="40px"> - <el-radio-group v-model="props.align"> - <el-radio-button label="left">宸�</el-radio-button> - <el-radio-button label="center">涓�</el-radio-button> - <el-radio-button label="right">鍙�</el-radio-button> - </el-radio-group> - </el-form-item> - <el-form-item label="澶у皬" labelWidth="40px"> - <el-input-number v-model="props.size" :min="10" :max="50" @change="handlerChangeSize"></el-input-number> - </el-form-item> - <el-form-item label="鍔犵矖" labelWidth="40px"> - <el-input-number v-model="props.bold" :min="100" :max="800" :step="100" @change="handlerChangeBold"></el-input-number> - </el-form-item> - </div> -</template> -<script> -import {changeId} from '../mixin' -export default { - name:"textConfig", - props:['props'], - data(){ - return{ - } - }, - mixins:[changeId], - methods:{ - handlerChangeSize(val){ - this.props.size = val+''; - }, - handlerChangeBold(val){ - this.props.bold = val+''; - } - } -} -</script> diff --git a/sample-form-client-ui/admin/src/components/formDes/custom/configs/textarea.vue b/sample-form-client-ui/admin/src/components/formDes/custom/configs/textarea.vue deleted file mode 100644 index 277316abd46a653657cc95f06848a7bb80cefccc..0000000000000000000000000000000000000000 --- a/sample-form-client-ui/admin/src/components/formDes/custom/configs/textarea.vue +++ /dev/null @@ -1,83 +0,0 @@ -<template> - <div v-show="props.compType === 'textarea'"> - <!-- <el-form-item label="瀛楁鍚�"> - <el-input class="input" v-model="props"></el-input> - </el-form-item> --> - <el-form-item label="ID"> - <el-tooltip class="item" effect="dark" content="璇锋敞鎰�,ID鐨勪慨鏀瑰彲鑳戒細瀵艰嚧璇ョ粍浠剁浉鍏充簨浠跺け鏁堬紒" placement="left"> - <el-input class="input" v-model="props.id" @change="handlerChangeId"></el-input> - </el-tooltip> - </el-form-item> - <el-form-item label="鏍囬"> - <el-input class="input" v-model="props.label"></el-input> - </el-form-item> - <el-form-item label="鎻愮ず绗�"> - <el-input class="input" v-model="props.placeholder" placeholder="璇疯緭鍏ユ彁绀虹"/> - </el-form-item> - <!-- <el-form-item label="琛ㄥ崟鏍呮牸"> - <el-slider class="input" v-model="props.span" :max="24" :min="1" :marks="{12:''}"></el-slider> - </el-form-item> --> - <el-form-item label="鏍呮牸闂撮殧"> - <el-input-number v-model="props.gutter" :min="0"></el-input-number> - </el-form-item> - <el-form-item label="鏍囩瀹藉害"> - <el-input-number v-model="props.labelWidth" :min="1" :max="200"></el-input-number> - </el-form-item> - <el-form-item label="鏄剧ず鏍囩"> - <el-switch v-model="props.showLabel" @change="handlerChangeLabel"></el-switch> - </el-form-item> - <el-form-item label="蹇呭~"> - <el-switch v-model="props.required"></el-switch> - </el-form-item> - <el-form-item label="杈撳叆妗嗚鏁�"> - <el-input-number v-model="props.rows" :min="0"></el-input-number> - </el-form-item> - <el-form-item label="闀垮害闄愬埗"> - <el-input-number v-model="props.maxlength" placeholder="瀛楃闀垮害"/> - </el-form-item> - <el-form-item label="杈撳叆缁熻"> - <el-switch v-model="props['show-word-limit']"></el-switch> - </el-form-item> - <el-form-item label="绂佺敤"> - <el-switch v-model="props.disabled" @change="handlerChangeDisStatus"></el-switch> - </el-form-item> - <el-form-item label="鍙"> - <el-switch v-model="props.readonly" @change="handlerChangeReadStatus"></el-switch> - </el-form-item> - <el-form-item label="榛樿鍊�"> - <el-input class="input" v-model="props.value"></el-input> - </el-form-item> - </div> -</template> -<script> -import {changeId} from '../mixin' -export default { - name:"inputConfig", - props:['props','getFormId'], - components: { - }, - mixins:[changeId], - data(){ - return { - } - }, - methods:{ - handlerChangeLabel(val){ - this.props.labelWidth = val?'80':'1' - }, - handlerChangeDisStatus(val){ - this.props.readOnly = !val - }, - handlerChangeReadStatus(val){ - this.props.disabled = !val - } - }, - mounted(){ - } -} -</script> -<style scoped> -.input{ - width:75% -} -</style> \ No newline at end of file diff --git a/sample-form-client-ui/admin/src/components/formDes/custom/configs/time.vue b/sample-form-client-ui/admin/src/components/formDes/custom/configs/time.vue deleted file mode 100644 index a0ef6893aea63bbd56fd5072ab726423aa3b55a6..0000000000000000000000000000000000000000 --- a/sample-form-client-ui/admin/src/components/formDes/custom/configs/time.vue +++ /dev/null @@ -1,74 +0,0 @@ -<template> - <div v-show="props.compType === 'time'"> - <!-- <el-form-item label="瀛楁鍚�"> - <el-input class="input" v-model="props"></el-input> - </el-form-item> --> - <el-form-item label="ID"> - <el-tooltip class="item" effect="dark" content="璇锋敞鎰�,ID鐨勪慨鏀瑰彲鑳戒細瀵艰嚧璇ョ粍浠剁浉鍏充簨浠跺け鏁堬紒" placement="left"> - <el-input class="input" v-model="props.id" @change="handlerChangeId"></el-input> - </el-tooltip> - </el-form-item> - <el-form-item label="鏍囬"> - <el-input class="input" v-model="props.label"></el-input> - </el-form-item> - <!-- <el-form-item label="琛ㄥ崟鏍呮牸"> - <el-slider class="input" v-model="props.span" :max="24" :min="1" :marks="{12:''}"></el-slider> - </el-form-item> --> - <el-form-item label="鏍呮牸闂撮殧"> - <el-input-number v-model="props.gutter" :min="0"></el-input-number> - </el-form-item> - <el-form-item label="鏍囩瀹藉害"> - <el-input-number v-model="props.labelWidth" :min="1" :max="200"></el-input-number> - </el-form-item> - <el-form-item label="鏄剧ず鏍囩"> - <el-switch v-model="props.showLabel"></el-switch> - </el-form-item> - <el-form-item label="鏄剧ず鏍囩"> - <el-input class="input" v-model="props.placeholder"></el-input> - </el-form-item> - <el-form-item label="蹇呭~"> - <el-switch v-model="props.required"></el-switch> - </el-form-item> - <el-form-item label="娓呯┖"> - <el-switch v-model="props.clearable"></el-switch> - </el-form-item> - <el-form-item label="鍙"> - <el-switch v-model="props.readonly"></el-switch> - </el-form-item> - <el-form-item label="绂佺敤"> - <el-switch v-model="props.disabled"></el-switch> - </el-form-item> - <el-form-item label="鑼冨洿閫夋嫨"> - <el-switch v-model="props['is-range']"></el-switch> - </el-form-item> - <el-form-item label="鍒嗛殧绗�" v-show="props['is-range']"> - <el-input v-model="props['range-separator']"></el-input> - </el-form-item> - <el-form-item label="榛樿鍊�"> - <el-time-picker class="input" v-model="props.value" placeholder="閫夋嫨榛樿鏃堕棿"/> - </el-form-item> - </div> -</template> -<script> -import {changeId} from '../mixin' -export default { - name:"timeConfig", - components: { - }, - mixins:[changeId], - props:['props','getFormId'], - data(){ - return { - } - }, - methods:{ - }, - mounted(){ - } -} -</script> -<style scoped> -.input{ - width:75% -} -</style> \ No newline at end of file diff --git a/sample-form-client-ui/admin/src/components/formDes/custom/configs/upload.vue b/sample-form-client-ui/admin/src/components/formDes/custom/configs/upload.vue deleted file mode 100644 index b84c81f675201be197d19090edcf367502864aca..0000000000000000000000000000000000000000 --- a/sample-form-client-ui/admin/src/components/formDes/custom/configs/upload.vue +++ /dev/null @@ -1,119 +0,0 @@ -<template> - <div v-show="props.compType === 'upload'"> - <el-form-item label="ID"> - <el-tooltip - class="item" - effect="dark" - content="璇锋敞鎰�,ID鐨勪慨鏀瑰彲鑳戒細瀵艰嚧璇ョ粍浠剁浉鍏充簨浠跺け鏁堬紒" - placement="left" - > - <el-input - class="input" - v-model="props.id" - @change="handlerChangeId" - ></el-input> - </el-tooltip> - </el-form-item> - <el-form-item label="鏍囬"> - <el-input class="input" v-model="props.label"></el-input> - </el-form-item> - <el-form-item label="鏍呮牸"> - <el-input-number v-model="props.span" :min="1" :max="24" /> - </el-form-item> - <el-form-item label="瀹藉害%"> - <el-input-number v-model="props.width" :min="1" :max="100" /> - </el-form-item> - <el-form-item label="鎻愮ず绗�"> - <el-input - class="input" - v-model="props.placeholder" - placeholder="璇疯緭鍏ユ彁绀虹" - /> - </el-form-item> - <!-- <el-form-item label="琛ㄥ崟鏍呮牸"> - <el-slider class="input" v-model="props.span" :max="24" :min="1" :marks="{12:''}"></el-slider> - </el-form-item> --> - <el-form-item label="鏍呮牸闂撮殧"> - <el-input-number v-model="props.gutter" :min="0"></el-input-number> - </el-form-item> - <el-form-item label="鏍囩瀹藉害"> - <el-input-number - v-model="props.labelWidth" - :min="1" - :max="200" - ></el-input-number> - </el-form-item> - <el-form-item label="鏄剧ず鏍囩"> - <el-switch - v-model="props.showLabel" - @change="handlerChangeLabel" - ></el-switch> - </el-form-item> - <el-form-item label="璇锋眰鍦板潃"> - <el-input v-model="props.action"></el-input> - </el-form-item> - <el-form-item label="澶у皬(MB)"> - <el-input-number - v-model="props.fileSize" - :min="1" - :max="10000" - :step="10" - /> - </el-form-item> - <el-form-item label="鏁伴噺闄愬埗"> - <el-input-number v-model="props.limit" :min="1" :max="6" :step="1" /> - </el-form-item> - <el-form-item label="鍏佽鏂囦欢绫诲瀷"> - <el-input v-model="props.accept"></el-input> - </el-form-item> - <el-form-item label="蹇呭~"> - <el-switch v-model="props.required"></el-switch> - </el-form-item> - <el-form-item label="澶氭枃浠朵笂浼�"> - <el-switch v-model="props.multiple"></el-switch> - </el-form-item> - <el-form-item label="鏄剧ず鏂囦欢鍒楄〃"> - <el-switch v-model="props['show-file-list']"></el-switch> - </el-form-item> - <el-form-item label="鏄剧ず绫诲瀷"> - <el-radio-group v-model="props['list-type']"> - <el-radio-button label="text">鏅€�</el-radio-button> - <!-- <el-radio-button label="picture">鐓х墖</el-radio-button> --> - <el-radio-button label="picture-card">鐓х墖</el-radio-button> - </el-radio-group> - </el-form-item> - <el-form-item label="鎸夐挳鏂囧瓧"> - <el-input v-model="props.buttonText"></el-input> - </el-form-item> - <el-form-item label="鏄剧ず鎻愮ず"> - <el-switch v-model="props.showTip"></el-switch> - </el-form-item> - <el-form-item label="鎻愮ず鍐呭" v-show="props.showTip"> - <el-input v-model="props.tips"></el-input> - </el-form-item> - </div> -</template> -<script> -import { changeId } from "../mixin"; -export default { - name: "uploadConfig", - props: ["props"], - components: {}, - mixins: [changeId], - data() { - return {}; - }, - methods: { - handlerChangeLabel(val) { - this.props.labelWidth = val ? "80" : "1"; - }, - }, - mounted() {}, - watch: {}, -}; -</script> -<style scoped> -.input { - width: 75%; -} -</style> \ No newline at end of file diff --git a/sample-form-client-ui/admin/src/components/formDes/custom/formConf.js b/sample-form-client-ui/admin/src/components/formDes/custom/formConf.js deleted file mode 100644 index a9328efae522e7663e5a8ac96db85e4717370d0d..0000000000000000000000000000000000000000 --- a/sample-form-client-ui/admin/src/components/formDes/custom/formConf.js +++ /dev/null @@ -1,52 +0,0 @@ -/** - * 琛ㄥ崟閰嶇疆 - */ -const formConf = { - version:'1.10', - formRef: 'elForm', - formModel: 'form', - rules: 'rules', - size: 'medium', - labelPosition: 'top', - labelWidth: 80, - formRules: 'rules', - gutter: 15, - disabled: false, - dynamicTableAllowed:true -}; -export default formConf; - -//鍔ㄦ€佽〃鍗曞厑璁告斁鍏ョ殑缁勪欢 -export const dynamicTableAllowedItems = [ - 'input', - 'select', - 'radio', - 'checkbox', - 'Switch', - 'inputNumber', - 'textarea', - 'slider', - 'rate', - 'date', - 'time' -]; - -//row鍏佽鏀惧叆鐨刬tems -export const rowAllowedItems = [ - 'input', - 'input', - 'select', - 'radio', - 'checkbox', - 'Switch', - 'inputNumber', - 'textarea', - 'slider', - 'rate', - 'date', - 'time' -] -//table鍏佽鏀惧叆鐨刬tems -export const tableAllowedItems = [ - 'row','dynamicTable' -] \ No newline at end of file diff --git a/sample-form-client-ui/admin/src/components/formDes/custom/formDraw.js b/sample-form-client-ui/admin/src/components/formDes/custom/formDraw.js deleted file mode 100644 index 7375c863e66de6201368be81acdb412a2caaefc9..0000000000000000000000000000000000000000 --- a/sample-form-client-ui/admin/src/components/formDes/custom/formDraw.js +++ /dev/null @@ -1,108 +0,0 @@ -//鍒濆鍖杁ata閲岄潰鐨勬暟鎹紙1銆侀粯璁や负绌猴紝2銆佷箣鍓嶅瓨鍦ㄧ殑鏁版嵁銆傘€傦級 -let itemDatas = {} -export function datas() { - itemDatas = {}; - // let self = this; - this.itemList.forEach(val => { - if (val.layout === 'rowItem') { //row甯冨眬 - dataResolveRowItem(val); //瑙f瀽row甯冨眬 - } else if (val.layout === 'dynamicItem') { //鍔ㄦ€佽〃鍗曞竷灞€ - let obj = dataResolveDynamicItem(val); - let array = []; - let { columnsCount } = val - for (let i = 0; i <= columnsCount-1; i++) { - array.push({...obj}); - } - itemDatas[val.id] = array; - } else if (val.layout === 'tableItem') { //琛ㄦ牸甯冨眬 - dataResolveTableItem(val); - } else { //琛ㄥ崟 - dataResolveColItem(val); - } - }) - Object.keys(itemDatas).forEach(key => { - this.$set(this.buildData.form, key, itemDatas[key]); - }) -} - -function dataResolveRowItem(val) { - const columns = val.columns; - columns.forEach(v => { - v.list.forEach(item => { - if (item.layout === 'dynamicItem') { - let obj = dataResolveDynamicItem(item); - let array = []; - array.push(obj); - itemDatas[item.id] = array; - } else { - dataResolveColItem(item); - } - }) - }) -} -function dataResolveDynamicItem(val) { - const columns = val.columns; - let obj = {}; - columns.forEach(v => { - const key = v.id; - obj[key] = v.value; - }) - return obj; -} - -/* -閬嶅巻琛ㄦ牸瀹炵幇缁勪欢娓叉煋 -*/ -function dataResolveTableItem(val) { - val.layoutArray.map((tr) => { - tr.map((td) => { - td.columns.map(item => dataResolveColItem(item)); - }) - }) -} - -function dataResolveColItem(val) { - itemDatas[val.id] = val.value; -} - -export function fillDatas(jsonValue) { - const self = this; - Object.keys(jsonValue).forEach(key => { - - if (typeof (self.buildData.form[key]) === 'string' || typeof (self.buildData.form[key]) === 'number') { - self.$set(self.buildData.form, key, jsonValue[key]); - } else if (self.buildData.form[key] instanceof Array) {//鏈夊彲鑳芥槸澶氶€夋垨鑰呮槸鏄庣粏琛� - //鍒ゆ柇鏄惁鏁扮粍涓负瀵硅薄 - if (jsonValue[key].length > 0) { - const firsValue = jsonValue[key][0];//鑾峰彇绗竴涓璞″垽鏂槸浠€涔堢被鍨� - if (typeof (firsValue) === 'string' || typeof (firsValue) === 'number') { - self.$set(self.buildData.form, key, jsonValue[key]); - } else { //鏄庣粏琛ㄦ暟缁� - const arrayData = jsonValue[key]; - //self.form[key] = []; - arrayData.forEach((v, index) => { - const newV = JSON.parse(JSON.stringify(v)); - self.$set(self.buildData.form[key], index, newV); - }) - } - } - } - }) - //console.log(this.form); -} - -export function addRow(element) { - let obj = dataResolveDynamicItem(element); - this.buildData.form[element.id].push(obj); -} - -export function deleteRow(scope, element) { - this.buildData.form[element.id].splice(scope.$index, 1); -} - -export function batchDeleteRow(indexs, element) { - for (let i = 0; i < indexs.length; i++) { - const index = indexs[i]; - this.buildData.form[element.id].splice(index, 1); - } -} diff --git a/sample-form-client-ui/admin/src/components/formDes/custom/itemList.js b/sample-form-client-ui/admin/src/components/formDes/custom/itemList.js deleted file mode 100644 index c7b5375593bfd37623d44514820188a21f3881bc..0000000000000000000000000000000000000000 --- a/sample-form-client-ui/admin/src/components/formDes/custom/itemList.js +++ /dev/null @@ -1,34 +0,0 @@ -import {input} from "./items/input"; -import {select} from "./items/select"; -import {radio} from "./items/radio"; -import {checkbox} from "./items/checkbox"; -import {Switch} from "./items/Switch"; -import {inputNumber} from "./items/inputNumber"; -import {textarea} from "./items/textarea"; -import {slider} from "./items/slider"; -import {rate} from "./items/rate"; -import {date} from "./items/date"; -import {time} from "./items/time"; -import {editor} from "./items/editor"; -import {colorPicker} from "./items/colorPicker"; -import {cascader} from "./items/cascader"; -import {upload} from "./items/upload"; -import {dialogList} from "./items/dialogList"; - -import {dynamicTable} from "./items/dynamicTable"; -import {button} from "./items/button"; -import {divider} from "./items/divider"; -import {row} from "./items/row"; -import {table} from "./items/table"; - -import {alert} from "./items/alert"; -import {link} from "./items/link"; -import {text} from "./items/text"; -import {barCode} from "./items/barCode"; - -export const formItems = [ - input,select,radio,checkbox,Switch,inputNumber,textarea,slider - ,rate,date,time,editor,colorPicker,cascader,upload,dialogList,barCode,dynamicTable -]; -export const assistFormItems = [button,divider,alert,link,text]; -export const layoutFormItems = [row,table]; diff --git a/sample-form-client-ui/admin/src/components/formDes/custom/items/Switch.js b/sample-form-client-ui/admin/src/components/formDes/custom/items/Switch.js deleted file mode 100644 index 228b775e4a59577633777b82033dd68156e4ef27..0000000000000000000000000000000000000000 --- a/sample-form-client-ui/admin/src/components/formDes/custom/items/Switch.js +++ /dev/null @@ -1,32 +0,0 @@ -/** - * 寮€鍏筹紝switch鏄痡s鍏抽敭瀛楋紝鎵€浠澶у啓锛岄伩杩� - */ -export let Switch = { - id:'', - _id:'', - compType: 'Switch', - ele: 'el-switch', - //鎺т欢鍚嶇О(宸︿晶鏄剧ず) - compName:'寮€鍏�', - label: '寮€鍏�', - //鍥炬爣 - compIcon:'switch', - //灞曠ず琛ㄥ崟鐨勬ā寮� - viewType:'component', - //鏆傛椂榛樿涓簍rue锛屾棤娉曟洿鏀癸紝鍚庢湡鑰冭檻鏌愪簺鏃跺€欐棤娉曢厤缃� - config: true, - // 鎺т欢宸︿晶label鍐呭 - showLabel:true, - //鏍呮牸闂撮殧 - gutter:15, - labelWidth: '80', - value: false, - rules:[], - span: 24, - disabled: false, - required: false, - 'active-color': '#409EFF', - 'inactive-color': '#DCDFE6', - 'active-value': 'true', - 'inactive-value': 'false' -} \ No newline at end of file diff --git a/sample-form-client-ui/admin/src/components/formDes/custom/items/alert.js b/sample-form-client-ui/admin/src/components/formDes/custom/items/alert.js deleted file mode 100644 index d57d00afd64c6b02b17fdc1da258ce2fb9f19e1d..0000000000000000000000000000000000000000 --- a/sample-form-client-ui/admin/src/components/formDes/custom/items/alert.js +++ /dev/null @@ -1,36 +0,0 @@ -/** - * 璀﹀憡 - */ -export let alert = { - id:'', - _id:'', - compType: 'alert', - ele: 'el-alert', - compName:'璀﹀憡', - compIcon:'alert', - //灞曠ず琛ㄥ崟鐨勬ā寮� - viewType:'component', - config: true, - - form:false, //鏄惁琛ㄥ崟缁勪欢 - // 鎺т欢宸︿晶label鍐呭 - showLabel:false, - labelWidth: '0', - span:24, - //鏍囬 - title:'alert', - //涓婚 - type:'success', - //杈呭姪鏂囧瓧 - description:'form-designer', - //鏄惁鍙叧闂� - closable:true, - //鏄惁灞呬腑 - center:false, - //鍏抽棴鐨勬寜閽� - 'close-text':'', - //鏄惁鏄剧ず鍥炬爣 - 'show-icon':false, - //涓婚 light/dark - effect:'light' -} diff --git a/sample-form-client-ui/admin/src/components/formDes/custom/items/barCode.js b/sample-form-client-ui/admin/src/components/formDes/custom/items/barCode.js deleted file mode 100644 index b35595cffb9680c1c23c1abf3337de49942e2178..0000000000000000000000000000000000000000 --- a/sample-form-client-ui/admin/src/components/formDes/custom/items/barCode.js +++ /dev/null @@ -1,30 +0,0 @@ -/** - * 璀﹀憡 - */ - export let barCode = { - id:'', - _id:'', - compType: 'barCode', - ele: 'fancy-bar-code', - compName:'鏉$爜', - compIcon:'barcode', - //灞曠ず琛ㄥ崟鐨勬ā寮� - viewType:'component', - config: true, - - form:true, //鏄惁琛ㄥ崟缁勪欢 - // 鎺т欢宸︿晶label鍐呭 - showLabel:false, - labelWidth: '0', - label:'鏉″舰鐮�', - span:24, - value:'formDesigner', - format:'CODE128', - lineColor:'#000', - background:'#fff', - width:5, - height:30, - fontSize:12, - displayValue:true - } - \ No newline at end of file diff --git a/sample-form-client-ui/admin/src/components/formDes/custom/items/button.js b/sample-form-client-ui/admin/src/components/formDes/custom/items/button.js deleted file mode 100644 index dd1fca5348cfb06ed3234c5195ac62e341355384..0000000000000000000000000000000000000000 --- a/sample-form-client-ui/admin/src/components/formDes/custom/items/button.js +++ /dev/null @@ -1,42 +0,0 @@ -/** - * 鍗曡&澶氳杈撳叆妗� - */ -export let button = { - id:'', - _id:'', - compType: 'button', - ele: 'el-button', - //鎺т欢鍚嶇О(宸︿晶鏄剧ず) - compName:'鎸夐挳', - //鍥炬爣 - compIcon:'button', - //灞曠ず琛ㄥ崟鐨勬ā寮� - viewType:'component', - - //鏆傛椂榛樿涓簍rue锛屾棤娉曟洿鏀癸紝鍚庢湡鑰冭檻鏌愪簺鏃跺€欐棤娉曢厤缃� - config: true, - // 鎺т欢宸︿晶label鍐呭 - showLabel:false, - label: '鍗曡鏂囨湰', - labelWidth: 0, - //鏄惁鍙互绂佺敤 - // disabled:false, - //澶у皬锛宮edium / small / mini - size:'medium', - //primary / success / warning / danger / info / text - type:'primary', - span:24, - text:'鎸夐挳', - //绠€鍗� - plain:false, - //鍦嗚 - round:false, - //鍦嗗舰 - circle:false, - //鍔犺浇涓� - loading:false, - //绂佺敤 - disabled:false, - //鍥炬爣 - icon:'', -} diff --git a/sample-form-client-ui/admin/src/components/formDes/custom/items/cascader.js b/sample-form-client-ui/admin/src/components/formDes/custom/items/cascader.js deleted file mode 100644 index 7807950ad1cc1edd782f543cd4abe948bd28fcad..0000000000000000000000000000000000000000 --- a/sample-form-client-ui/admin/src/components/formDes/custom/items/cascader.js +++ /dev/null @@ -1,73 +0,0 @@ -/** - * 绾ц仈閫夋嫨鍣� - */ -export let cascader = { - id:'', - _id:'', - compType: 'cascader', - ele: 'el-cascader', - //鎺т欢鍚嶇О(宸︿晶鏄剧ず) - compName:'绾ц仈閫夋嫨鍣�', - //鍥炬爣 - compIcon:'cascader', - //灞曠ず琛ㄥ崟鐨勬ā寮� - viewType:'component', - // 鏄惁鍙厤缃� - //鏆傛椂榛樿涓簍rue锛屾棤娉曟洿鏀癸紝鍚庢湡鑰冭檻鏌愪簺鏃跺€欐棤娉曢厤缃� - config: true, - // 鎺т欢宸︿晶label鍐呭 - showLabel:true, - label: '绾ц仈閫夋嫨', - labelWidth: '80', - placeholder: '璇烽€夋嫨', - //鏍呮牸闂撮殧 - gutter:15, - //榛樿鏍呮牸 - span:24, - value: [], - //澶у皬 - size:"medium", - //绂佺敤 - disabled:false, - //鏁版嵁绫诲瀷 static锛宒ynamic - dataType:'static', - 'china-area-data':false, - //璇锋眰鍦板潃 - action:'https://www.fastmock.site/mock/51715c0157535b99010bde55f2df33c8/formDesigner/api/cascaderOptions', - props:{ - //娓呯┖ - clearable:true, - //鍒嗛殧绗� - separator:"/", - //鏄剧ず瀹屾暣璺緞 - 'show-all-levels':false, - filterable:false, - props: { - - //瑙﹀彂鏂瑰紡,hover - expandTrigger:'click', - //澶氶€� - multiple:false, - //鍙€変换涓€绾� - checkStrictly:false, - label: 'label', - value: 'value', - children: 'children' - } - }, - options:[ - { - value: 'zhinan', - label: '鎸囧崡', - children: [{ - value: 'shejiyuanze', - label: '璁捐鍘熷垯', - children: [{ - value: 'yizhi', - label: '涓€鑷�' - }] - }] - } - ] - } - \ No newline at end of file diff --git a/sample-form-client-ui/admin/src/components/formDes/custom/items/checkbox.js b/sample-form-client-ui/admin/src/components/formDes/custom/items/checkbox.js deleted file mode 100644 index 0ea362e0403488fc61e2ddefcb34f123554c45f6..0000000000000000000000000000000000000000 --- a/sample-form-client-ui/admin/src/components/formDes/custom/items/checkbox.js +++ /dev/null @@ -1,62 +0,0 @@ -// export default (_self, h) => { -// return [ -// h("Input", {}) -// ]; -// }; - -export let checkbox = { - id:'', - _id:'', - compType: 'checkbox', - //鎺т欢鍚嶇О - compName:'澶嶉€夋', - //element鏍囩 - ele: 'el-checkbox-group', - //鍥炬爣 - compIcon:'checkbox', - //灞曠ず琛ㄥ崟鐨勬ā寮� - viewType:'component', - // 鏄惁鍙厤缃� - config: true, - // 鎺т欢宸︿晶label鍐呭 - label: '澶嶉€夋', - placeholder: '璇烽€夋嫨', - // 鏈€澶ч暱搴� - maxLength: 50, - //琛ㄥ崟鏍呮牸 - span:24, - //鏍呮牸闂撮殧 - gutter:'15', - //鏍囩瀹藉害 - labelWidth:80, - //鏄剧ず鏍囩 - showLabel:true, - //蹇呭~ - required:false, - //绂佺敤 - disabled:false, - //鏄惁鏈夎竟妗� - border:false, - //閫夐」鏄惁鍨傜洿 - vertical:false, - //閫夐」澶у皬 - size:'medium', - //鏄惁鏄寜閽� - optionType:'default', - //閫夐」鍒楄〃 - options:[{ - label: '閫夐」涓€', - value: 1 - }, { - label: '閫夐」浜�', - value: 2 - }], - //鏁版嵁绫诲瀷 static锛宒ynamic - dataType:'static', - //榛樿娓叉煋鐨勬暟鎹� - action:'https://www.fastmock.site/mock/51715c0157535b99010bde55f2df33c8/formDesigner/api/options', - value: [], - rules:[], - // 楠岃瘉閿欒鎻愮ず淇℃伅 - ruleError: '璇ュ瓧娈典笉鑳戒负绌�' -} diff --git a/sample-form-client-ui/admin/src/components/formDes/custom/items/colorPicker.js b/sample-form-client-ui/admin/src/components/formDes/custom/items/colorPicker.js deleted file mode 100644 index 53048494b1e860cb048349671bc9c57874b3339f..0000000000000000000000000000000000000000 --- a/sample-form-client-ui/admin/src/components/formDes/custom/items/colorPicker.js +++ /dev/null @@ -1,37 +0,0 @@ -/** - * 鍗曡&澶氳杈撳叆妗� - */ -export let colorPicker = { - id:'', - _id:'', - compType: 'colorPicker', - ele: 'el-color-picker', - //鎺т欢鍚嶇О(宸︿晶鏄剧ず) - compName:'棰滆壊閫夋嫨鍣�', - //鍥炬爣 - compIcon:'colorpicker', - //灞曠ず琛ㄥ崟鐨勬ā寮� - viewType:'component', - - //鏆傛椂榛樿涓簍rue锛屾棤娉曟洿鏀癸紝鍚庢湡鑰冭檻鏌愪簺鏃跺€欐棤娉曢厤缃� - config: true, - // 鎺т欢宸︿晶label鍐呭 - showLabel:false, - label: '鍗曡鏂囨湰', - labelWidth: 0, - //鏄惁鍙互绂佺敤 - disabled:false, - //澶у皬锛宮edium / small / mini - size:'medium', - //primary / success / warning / danger / info / text - type:'primary', - span:24, - //閫夋嫨閫忔槑搴� - 'show-alpha':false, - //鏍煎紡 - 'color-format':'hex', - //棰勫畾涔夐鑹� - predefine:[], - value:'#409EFF' - } - \ No newline at end of file diff --git a/sample-form-client-ui/admin/src/components/formDes/custom/items/date.js b/sample-form-client-ui/admin/src/components/formDes/custom/items/date.js deleted file mode 100644 index c3781c089527c4adea0067f4250fd9d6cf9e23e5..0000000000000000000000000000000000000000 --- a/sample-form-client-ui/admin/src/components/formDes/custom/items/date.js +++ /dev/null @@ -1,44 +0,0 @@ -/** - * 鍗曡&澶氳杈撳叆妗� - */ -export let date = { - id:'', - _id:'', - compType: 'date', - ele: 'el-date-picker', - //鎺т欢鍚嶇О(宸︿晶鏄剧ず) - compName:'鏃ユ湡', - //鍥炬爣 - compIcon:'date', - //灞曠ず琛ㄥ崟鐨勬ā寮� - viewType:'text', - // 鏄惁鍙厤缃� - //鏆傛椂榛樿涓簍rue锛屾棤娉曟洿鏀癸紝鍚庢湡鑰冭檻鏌愪簺鏃跺€欐棤娉曢厤缃� - config: true, - // 鎺т欢宸︿晶label鍐呭 - showLabel:true, - label: '鏃ユ湡', - labelWidth: '80', - placeholder: '璇烽€夋嫨', - // 鏄惁蹇呭~ - required: false, - // 鏈€澶ч暱搴� - maxLength: 50, - //鏍呮牸闂撮殧 - gutter:15, - //榛樿鏍呮牸 - span:24, - //鏄惁鍙竻绌� - clearable:true, - disabled:false, - readonly:false, - value: '', - rules:[], - //鏃堕棿绫诲瀷 - type:'date', - format:'yyyy骞碝M鏈坉d鏃�', - 'value-format':'yyyy骞碝M鏈坉d鏃�', - 'range-separator':'-', - 'start-placeholder':'寮€濮嬫棩鏈�', - 'end-placeholder':'缁撴潫鏃ユ湡' -} diff --git a/sample-form-client-ui/admin/src/components/formDes/custom/items/dialogList.js b/sample-form-client-ui/admin/src/components/formDes/custom/items/dialogList.js deleted file mode 100644 index b2117962d1b0b7764d91c33d1b06ac35703cb0f8..0000000000000000000000000000000000000000 --- a/sample-form-client-ui/admin/src/components/formDes/custom/items/dialogList.js +++ /dev/null @@ -1,50 +0,0 @@ -/** - * dialogList - */ - export let dialogList = { - id:'', - _id:'', - compType: 'dialogList', - ele: 'fancy-dialog-list', - //鎺т欢鍚嶇О(宸︿晶鏄剧ず) - compName:'閫夋嫨鍒楄〃', - //鍥炬爣 - compIcon:'dialog', - //灞曠ず琛ㄥ崟鐨勬ā寮� - viewType:'component', - - // 鏄惁鍙厤缃� - //鏆傛椂榛樿涓簍rue锛屾棤娉曟洿鏀癸紝鍚庢湡鑰冭檻鏌愪簺鏃跺€欐棤娉曢厤缃� - config: true, - // 鎺т欢宸︿晶label鍐呭 - showLabel:true, - label: '閫夋嫨鍒楄〃', - labelWidth: '80', - // showLabel: true, - // labelWidth: 80, - // 鏄惁蹇呭~ - required: false, - //鏍呮牸闂撮殧 - gutter:15, - //榛樿鏍呮牸 - span:24, - //绂佺敤 - disabled:false, - //鏍囬 - title:'璇烽€夋嫨', - //澶氶€� - multi:false, - //鏄剧ず搴忓彿 - showIndex:false, - //璇锋眰鍦板潃 - action:'https://www.fastmock.site/mock/51715c0157535b99010bde55f2df33c8/formDesigner/api/dialogListData', - //瀛楁閰嶇疆 - colConf:'[{"index":0,"label":"濮撳悕","property":"name","width":"250","show":true},{"index":1,"label":"鏃ユ湡","property":"date","width":"150","show":true},{"index":2,"label":"鍦板潃","property":"address","width":"","show":true}]', - // //鍊� - dval:'id', - //瀛楁 - dlabel:'name', - height:500, - value: '' - } - \ No newline at end of file diff --git a/sample-form-client-ui/admin/src/components/formDes/custom/items/divider.js b/sample-form-client-ui/admin/src/components/formDes/custom/items/divider.js deleted file mode 100644 index 825a2ba14f09afca0151831460346efb4ee81b05..0000000000000000000000000000000000000000 --- a/sample-form-client-ui/admin/src/components/formDes/custom/items/divider.js +++ /dev/null @@ -1,21 +0,0 @@ -/** - * 鍒嗗壊绾� - */ -export let divider = { - id:'', - _id:'', - compType: 'divider', - ele: 'el-divider', - compName:'鍒嗗壊绾�', - compIcon:'divider', - //灞曠ず琛ㄥ崟鐨勬ā寮� - viewType:'component', - config: true, - form:false, - //鍐呭鍧愭爣 left|center|right - 'content-position':'left', - text:'', - // 鎺т欢宸︿晶label鍐呭 - showLabel:false, - labelWidth: '0' -} diff --git a/sample-form-client-ui/admin/src/components/formDes/custom/items/dynamicTable.js b/sample-form-client-ui/admin/src/components/formDes/custom/items/dynamicTable.js deleted file mode 100644 index 18cf16fad337c1ea2a090b6690f0ff3228559d42..0000000000000000000000000000000000000000 --- a/sample-form-client-ui/admin/src/components/formDes/custom/items/dynamicTable.js +++ /dev/null @@ -1,35 +0,0 @@ -/** - * 鍔ㄦ€佽〃鍗� - */ -export let dynamicTable = { - id:'', - _id:'', - compType: 'dynamicTable', - ele: 'dynamic-table', - //鎺т欢鍚嶇О(宸︿晶鏄剧ず) - compName:'鍔ㄦ€佽〃鏍�', - layout:'dynamicItem', - //鍥炬爣 - compIcon:'table', - // 鏄惁鍙厤缃� - //鏆傛椂榛樿涓簍rue锛屾棤娉曟洿鏀癸紝鍚庢湡鑰冭檻鏌愪簺鏃跺€欐棤娉曢厤缃� - //鏄剧ず鏍囩 - labelWidth:0, - showLabel:false, - config: true, - //鏄剧ず鏂板鎸夐挳 - buttonAdd:true, - //鏄剧ず鍒犻櫎鎸夐挳 - buttonDel:true, - //鏄剧ず琛屽彿 - showIndex:true, - visible:true, - multiCheck:false, - columnsCount:3, // 榛樿琛屾暟 - //鍚堣琛� - 'show-summary':false, - 'sum-text':'鍚堣', - 'summary-text':'鍏�', - columns:[ - ] -} diff --git a/sample-form-client-ui/admin/src/components/formDes/custom/items/editor.js b/sample-form-client-ui/admin/src/components/formDes/custom/items/editor.js deleted file mode 100644 index 546965ddaee490e8420aa2f3576755d9410887db..0000000000000000000000000000000000000000 --- a/sample-form-client-ui/admin/src/components/formDes/custom/items/editor.js +++ /dev/null @@ -1,27 +0,0 @@ -/** - * 瀵屾枃鏈紪杈戝櫒 - */ -export let editor = { - id:'', - _id:'', - compType: 'editor', - ele: 'fancy-editor', - compName:'缂栬緫鍣�', - compIcon:'editor', - //灞曠ず琛ㄥ崟鐨勬ā寮� - viewType:'html', - config: true, - form:true, - // 鎺т欢宸︿晶label鍐呭 - showLabel:true, - labelWidth: '80', - label:'鏂囨湰缂栬緫鍣�', - value:'', - required:false, - validateMaxText:false, - //鏈€澶ч暱搴� - max:2000, - //鑷畾涔塺ules - customRules:[] - } - \ No newline at end of file diff --git a/sample-form-client-ui/admin/src/components/formDes/custom/items/html.js b/sample-form-client-ui/admin/src/components/formDes/custom/items/html.js deleted file mode 100644 index 8e2ff76bcf5469186ac4d925e1ab36e5837a4e49..0000000000000000000000000000000000000000 --- a/sample-form-client-ui/admin/src/components/formDes/custom/items/html.js +++ /dev/null @@ -1,21 +0,0 @@ -/**搴熷純 */ -/** - * html - */ -export let html = { - id:'', - _id:'', - compType: 'html', - ele: 'fancy-html', - compName:'HTML', - compIcon:'html', - //灞曠ず琛ㄥ崟鐨勬ā寮� - viewType:'component', - config: true, - form:false, - text:'<span style="color:red">html</span>', - // 鎺т欢宸︿晶label鍐呭 - showLabel:false, - label:'', - labelWidth: '0' -} diff --git a/sample-form-client-ui/admin/src/components/formDes/custom/items/input.js b/sample-form-client-ui/admin/src/components/formDes/custom/items/input.js deleted file mode 100644 index 201877e41eb41d0601f00be457bd84be99a5fad6..0000000000000000000000000000000000000000 --- a/sample-form-client-ui/admin/src/components/formDes/custom/items/input.js +++ /dev/null @@ -1,53 +0,0 @@ -/** - * 鍗曡&澶氳杈撳叆妗� - */ -export let input = { - id:'', - _id:'', - compType: 'input', - ele: 'el-input', - //鎺т欢鍚嶇О(宸︿晶鏄剧ず) - compName:'鍗曡鏂囨湰', - //鍥炬爣 - compIcon:'input', - //灞曠ず琛ㄥ崟鐨勬ā寮� - viewType:'text', - - // 鏄惁鍙厤缃� - //鏆傛椂榛樿涓簍rue锛屾棤娉曟洿鏀癸紝鍚庢湡鑰冭檻鏌愪簺鏃跺€欐棤娉曢厤缃� - config: true, - // 鎺т欢宸︿晶label鍐呭 - showLabel:true, - label: '鍗曡鏂囨湰', - labelWidth: '80', - placeholder: '璇疯緭鍏ユ枃鏈�', - // 鏄惁蹇呭~ - required: false, - // 鏈€澶ч暱搴� - maxLength: 50, - //鏍呮牸闂撮殧 - gutter:15, - //榛樿鏍呮牸 - span:24, - //缁勪欢闀垮害 - width: '100%', - //鏄惁鍙竻绌� - clearable:true, - disabled:false, - readonly:false, - //鐘舵€侊紝姝e父锛屽彧璇伙紝绂佺敤 - status:'normal', - //鍓嶇疆鍥炬爣 - 'prefix-icon':'', - //鍚庣疆鍥炬爣 - 'suffix-icon':'', - value: '', - //楠岃瘉瑙勫垯(瀛楃,phone,email,number) - rules:[], - //楠岃瘉瑙勫垯 - rulesType:'default', - //鍓嶇紑 - prepend:'', - //鍚庣紑 - append:'' -} diff --git a/sample-form-client-ui/admin/src/components/formDes/custom/items/inputNumber.js b/sample-form-client-ui/admin/src/components/formDes/custom/items/inputNumber.js deleted file mode 100644 index 58b72f716f5e2e646242021c215a51e49942b7f9..0000000000000000000000000000000000000000 --- a/sample-form-client-ui/admin/src/components/formDes/custom/items/inputNumber.js +++ /dev/null @@ -1,36 +0,0 @@ -/** - * 璁℃暟鍣� - */ -export let inputNumber = { - id:'', - _id:'', - compType: 'inputNumber', - ele: 'el-inputNumber', - //鎺т欢鍚嶇О(宸︿晶鏄剧ず) - compName:'璁℃暟鍣�', - label: '璁℃暟鍣�', - //鍥炬爣 - compIcon:'inputNumber', - //灞曠ず琛ㄥ崟鐨勬ā寮� - viewType:'text', - //鏆傛椂榛樿涓簍rue锛屾棤娉曟洿鏀癸紝鍚庢湡鑰冭檻鏌愪簺鏃跺€欐棤娉曢厤缃� - config: true, - // 鎺т欢宸︿晶label鍐呭 - showLabel:true, - //鏍呮牸闂撮殧 - gutter:15, - labelWidth: '80', - value: 0, - rules:[], - span: 24, - min: 0, - max: 100, - step: 1, - 'step-strictly': false, - precision: 0, - 'controls-position': 'default', - disabled: false, - readonly: false, - required: false, - regList: [] -} diff --git a/sample-form-client-ui/admin/src/components/formDes/custom/items/link.js b/sample-form-client-ui/admin/src/components/formDes/custom/items/link.js deleted file mode 100644 index c9bafddad4a3b63ee952f5d10ef22af640cf5de4..0000000000000000000000000000000000000000 --- a/sample-form-client-ui/admin/src/components/formDes/custom/items/link.js +++ /dev/null @@ -1,32 +0,0 @@ -/** - * 鏂囧瓧閾炬帴 - */ -export let link = { - id:'', - _id:'', - compType: 'link', - ele: 'el-link', - compName:'鏂囧瓧閾炬帴', - compIcon:'link', - //灞曠ず琛ㄥ崟鐨勬ā寮� - viewType:'component', - config: true, - - form:false, //鏄惁琛ㄥ崟缁勪欢 - // 鎺т欢宸︿晶label鍐呭 - showLabel:false, - labelWidth: '0', - span:24, - - //涓婚 - type:'primary', - //閾炬帴鍦板潃 - href:'http://www.baidu.com', - //鏄惁涓嬪垝绾� - underline:true, - //鏄惁绂佺敤 - disabled:false, - text:'閾炬帴', - target:'_blank' - } - \ No newline at end of file diff --git a/sample-form-client-ui/admin/src/components/formDes/custom/items/radio.js b/sample-form-client-ui/admin/src/components/formDes/custom/items/radio.js deleted file mode 100644 index 6cde4fc937ee9205559c67612511c26ecadbd99e..0000000000000000000000000000000000000000 --- a/sample-form-client-ui/admin/src/components/formDes/custom/items/radio.js +++ /dev/null @@ -1,62 +0,0 @@ -// export default (_self, h) => { -// return [ -// h("Input", {}) -// ]; -// }; - -export let radio = { - id:'', - _id:'', - compType: 'radio', - //鎺т欢鍚嶇О - compName:'鍗曢€夋', - //element鏍囩 - ele: 'el-radio-group', - //鍥炬爣 - compIcon:'radio', - //灞曠ず琛ㄥ崟鐨勬ā寮� - viewType:'component', - // 鏄惁鍙厤缃� - config: true, - // 鎺т欢宸︿晶label鍐呭 - label: '鍗曢€夋', - placeholder: '璇烽€夋嫨', - // 鏈€澶ч暱搴� - maxLength: 50, - //琛ㄥ崟鏍呮牸 - span:24, - //鏍呮牸闂撮殧 - gutter:'15', - //鏍囩瀹藉害 - labelWidth:80, - //鏄剧ず鏍囩 - showLabel:true, - //蹇呭~ - required:false, - //绂佺敤 - disabled:false, - //鏄惁鏈夎竟妗� - border:false, - //閫夐」鏄惁鍨傜洿 - vertical:false, - //閫夐」澶у皬 - size:'medium', - //鏄惁鏄寜閽� - optionType:'default', - //閫夐」鍒楄〃 - options:[{ - label: '閫夐」涓€', - value: 1 - }, { - label: '閫夐」浜�', - value: 2 - }], - //鏁版嵁绫诲瀷 static锛宒ynamic - dataType:'static', - //榛樿娓叉煋鐨勬暟鎹� - action:'https://www.fastmock.site/mock/51715c0157535b99010bde55f2df33c8/formDesigner/api/options', - value: '', - rules:[], - // 楠岃瘉閿欒鎻愮ず淇℃伅 - ruleError: '璇ュ瓧娈典笉鑳戒负绌�' -} diff --git a/sample-form-client-ui/admin/src/components/formDes/custom/items/rate.js b/sample-form-client-ui/admin/src/components/formDes/custom/items/rate.js deleted file mode 100644 index 8f9d1e882df5a6d5a98a578d7f40aa37174b2e20..0000000000000000000000000000000000000000 --- a/sample-form-client-ui/admin/src/components/formDes/custom/items/rate.js +++ /dev/null @@ -1,31 +0,0 @@ -/** - * 璇勫垎 - */ -export let rate = { - id:'', - _id:'', - compType: 'rate', - ele: 'el-rate', - //鎺т欢鍚嶇О(宸︿晶鏄剧ず) - compName:'璇勫垎', - label: '璇勫垎', - //鍥炬爣 - compIcon:'rate', - //灞曠ず琛ㄥ崟鐨勬ā寮� - viewType:'component', - //鏆傛椂榛樿涓簍rue锛屾棤娉曟洿鏀癸紝鍚庢湡鑰冭檻鏌愪簺鏃跺€欐棤娉曢厤缃� - config: true, - // 鎺т欢宸︿晶label鍐呭 - showLabel:true, - //鏍呮牸闂撮殧 - gutter:15, - labelWidth: '80', - value: 1, - rules:[], - span: 24, - disabled: false, - required: false, - max: 5, - 'allow-half': false, - 'show-score': false -} \ No newline at end of file diff --git a/sample-form-client-ui/admin/src/components/formDes/custom/items/row.js b/sample-form-client-ui/admin/src/components/formDes/custom/items/row.js deleted file mode 100644 index 43fbbe4134f6074e4989c0d3e5a4865956d1d7c6..0000000000000000000000000000000000000000 --- a/sample-form-client-ui/admin/src/components/formDes/custom/items/row.js +++ /dev/null @@ -1,43 +0,0 @@ -/** - * 鏍呮牸甯冨眬 - */ - - // export default (_self, h) => { -// return [ -// h("Input", {}) -// ]; -// }; - -export let row = { - id:'', - _id:'', - compType: 'row', - //鎺т欢鍚嶇О - compName:'鏍呮牸甯冨眬', - //element鏍囩 - ele: 'el-row', - //鍥炬爣 - compIcon:'col', - layout:'rowItem', - // 鏄惁鍙厤缃� - config: true, - // - flex:'default', - justify:'start', - align:'top', - gutter:0, - columns:[ - { - index:0, - span:12, - list:[] - }, - { - index:1, - span:12, - list:[] - } - ], - - -} diff --git a/sample-form-client-ui/admin/src/components/formDes/custom/items/select.js b/sample-form-client-ui/admin/src/components/formDes/custom/items/select.js deleted file mode 100644 index f66bece4a478c872f2b6a61fd02af9c402a95339..0000000000000000000000000000000000000000 --- a/sample-form-client-ui/admin/src/components/formDes/custom/items/select.js +++ /dev/null @@ -1,56 +0,0 @@ -export let select = { - id:'', - _id:'', - compType: 'select', - //鎺т欢鍚嶇О - compName:'涓嬫媺妗�', - //element鏍囩 - ele: 'el-select', - //鍥炬爣 - compIcon:'select', - //灞曠ず琛ㄥ崟鐨勬ā寮� - viewType:'component', - // 鏄惁鍙厤缃� - config: true, - // 鎺т欢宸︿晶label鍐呭 - label: '涓嬫媺妗�', - placeholder: '璇烽€夋嫨', - // 鏈€澶ч暱搴� - maxLength: 50, - //琛ㄥ崟鏍呮牸 - span:24, - //鏍呮牸闂撮殧 - gutter:'15', - //鏍囩瀹藉害 - labelWidth:80, - //鏄剧ず鏍囩 - showLabel:true, - //蹇呭~ - required:false, - //澶氶€� - multiple:false, - 'collapse-tags':false, - //绂佺敤 - disabled:false, - //鎼滅储 - filterable:false, - - //閫夐」鍒楄〃 - options:[{ - label: '閫夐」涓€', - value: 1 - }, { - label: '閫夐」浜�', - value: 2 - }], - //鏁版嵁绫诲瀷 static锛宒ynamic - dataType:'static', - //榛樿娓叉煋鐨勬暟鎹� - action:'https://www.fastmock.site/mock/51715c0157535b99010bde55f2df33c8/formDesigner/api/options', - //鏄惁鍙互娓呯┖ - clearable:false, - value: '', - rules:[], - // 楠岃瘉閿欒鎻愮ず淇℃伅 - ruleError: '璇ュ瓧娈典笉鑳戒负绌�' -} diff --git a/sample-form-client-ui/admin/src/components/formDes/custom/items/slider.js b/sample-form-client-ui/admin/src/components/formDes/custom/items/slider.js deleted file mode 100644 index dada6c187d0e3421885027cbe009028f594b5ca7..0000000000000000000000000000000000000000 --- a/sample-form-client-ui/admin/src/components/formDes/custom/items/slider.js +++ /dev/null @@ -1,40 +0,0 @@ -/** - * 鍗曡&澶氳杈撳叆妗� - */ -export let slider = { - id:'', - _id:'', - compType: 'slider', - ele: 'el-slider', - //鎺т欢鍚嶇О(宸︿晶鏄剧ず) - compName:'婊戝潡', - label: '婊戝潡', - //鍥炬爣 - compIcon:'slider', - //灞曠ず琛ㄥ崟鐨勬ā寮� - viewType:'component', - //鏆傛椂榛樿涓簍rue锛屾棤娉曟洿鏀癸紝鍚庢湡鑰冭檻鏌愪簺鏃跺€欐棤娉曢厤缃� - config: true, - // 鎺т欢宸︿晶label鍐呭 - showLabel:true, - //鏍呮牸闂撮殧 - gutter:15, - labelWidth: '80', - value: 0, - rules:[], - span: 24, - disabled: false, - required: false, - //鏈€灏忓€� - min: 0, - //鏈€澶у€� - max: 20, - //姝ラ暱 - step: 1, - //鏄惁鏄剧ず鏂偣 - 'show-stops': true, - //鏄惁鏄剧ずtooltip - 'show-tooltip': true, - //鑼冨洿閫夋嫨 1,50 - range: false -} \ No newline at end of file diff --git a/sample-form-client-ui/admin/src/components/formDes/custom/items/table.js b/sample-form-client-ui/admin/src/components/formDes/custom/items/table.js deleted file mode 100644 index 4741a7aaab1b6d6762709021e31ba5449151293d..0000000000000000000000000000000000000000 --- a/sample-form-client-ui/admin/src/components/formDes/custom/items/table.js +++ /dev/null @@ -1,24 +0,0 @@ -/** - * 琛ㄦ牸甯冨眬 - */ -import {getDefaultTrs} from '../../table/table' -let trs = getDefaultTrs(); - export let table = { - id:'', - _id:'', - compType: 'table', - ele: 'fancy-table', - //鎺т欢鍚嶇О(宸︿晶鏄剧ず) - compName:'琛ㄦ牸甯冨眬', - //鍥炬爣 - compIcon:'table_layout', - layout:'tableItem', - // 鏄惁鍙厤缃� - //鏆傛椂榛樿涓簍rue锛屾棤娉曟洿鏀癸紝鍚庢湡鑰冭檻鏌愪簺鏃跺€欐棤娉曢厤缃� - config: true, - layoutArray:trs, - //鍗曞厓鏍兼牱寮� - tdStyle:'', - width:100, - height:50 - } \ No newline at end of file diff --git a/sample-form-client-ui/admin/src/components/formDes/custom/items/text.js b/sample-form-client-ui/admin/src/components/formDes/custom/items/text.js deleted file mode 100644 index 9fddbb45e47b399164c62be52ab09efee2e7a722..0000000000000000000000000000000000000000 --- a/sample-form-client-ui/admin/src/components/formDes/custom/items/text.js +++ /dev/null @@ -1,25 +0,0 @@ -/** - * 鏂囨湰 - */ -export let text = { - id:'', - _id:'', - compType: 'text', - ele: 'fancy-text', - compName:'鏂囨湰', - compIcon:'text', - //灞曠ず琛ㄥ崟鐨勬ā寮� - viewType:'component', - config: true, - form:false, - show:true, - text:'鏂囨湰', - align:'left', - color:'#000000', - size:'14', - bold:'400', - // 鎺т欢宸︿晶label鍐呭 - showLabel:false, - labelWidth: '0' - } - \ No newline at end of file diff --git a/sample-form-client-ui/admin/src/components/formDes/custom/items/textarea.js b/sample-form-client-ui/admin/src/components/formDes/custom/items/textarea.js deleted file mode 100644 index fad6bdf979cbf8630435787f4f00f6a54e6a4747..0000000000000000000000000000000000000000 --- a/sample-form-client-ui/admin/src/components/formDes/custom/items/textarea.js +++ /dev/null @@ -1,45 +0,0 @@ -/** - * 鍗曡&澶氳杈撳叆妗� - */ -export let textarea = { - id:'', - _id:'', - compType: 'textarea', - ele: 'el-input', - //鎺т欢鍚嶇О(宸︿晶鏄剧ず) - compName:'澶氳鏂囨湰', - //鍥炬爣 - compIcon:'textarea', - //灞曠ず琛ㄥ崟鐨勬ā寮� - viewType:'text', - // 鏄惁鍙厤缃� - //鏆傛椂榛樿涓簍rue锛屾棤娉曟洿鏀癸紝鍚庢湡鑰冭檻鏌愪簺鏃跺€欐棤娉曢厤缃� - config: true, - // 鎺т欢宸︿晶label鍐呭 - showLabel:true, - label: '澶氳鏂囨湰', - labelWidth: '80', - placeholder: '璇疯緭鍏ユ枃鏈�', - type:'textarea', - // 鏄惁蹇呭~ - required: false, - // 鏈€澶ч暱搴� - maxlength: 50, - //杈撳叆缁熻 - 'show-word-limit':false, - //鏍呮牸闂撮殧 - gutter:15, - //榛樿鏍呮牸 - span:24, - //鏄惁鍙竻绌� - clearable:true, - disabled:false, - readonly:false, - rows:4, - //鐘舵€侊紝姝e父锛屽彧璇伙紝绂佺敤 - status:'normal', - value: '', - rules:[], - // 楠岃瘉閿欒鎻愮ず淇℃伅 - ruleError: '璇ュ瓧娈典笉鑳戒负绌�' -} diff --git a/sample-form-client-ui/admin/src/components/formDes/custom/items/time.js b/sample-form-client-ui/admin/src/components/formDes/custom/items/time.js deleted file mode 100644 index 8a8cf4b2b930daa99098290ca34dedb0a585ae28..0000000000000000000000000000000000000000 --- a/sample-form-client-ui/admin/src/components/formDes/custom/items/time.js +++ /dev/null @@ -1,46 +0,0 @@ -/** - * 鍗曡&澶氳杈撳叆妗� - */ -export let time = { - id:'', - _id:'', - compType: 'time', - ele: 'el-time-picker', - //鎺т欢鍚嶇О(宸︿晶鏄剧ず) - compName:'鏃堕棿', - //鍥炬爣 - compIcon:'time', - //灞曠ず琛ㄥ崟鐨勬ā寮� - viewType:'text', - // 鏄惁鍙厤缃� - //鏆傛椂榛樿涓簍rue锛屾棤娉曟洿鏀癸紝鍚庢湡鑰冭檻鏌愪簺鏃跺€欐棤娉曢厤缃� - config: true, - // 鎺т欢宸︿晶label鍐呭 - showLabel:true, - label: '鏃堕棿', - labelWidth: '80', - placeholder: '璇烽€夋嫨', - // 鏄惁蹇呭~ - required: false, - // 鏈€澶ч暱搴� - maxLength: 50, - //鏍呮牸闂撮殧 - gutter:15, - //榛樿鏍呮牸 - span:24, - //鏄惁鍙竻绌� - clearable:true, - disabled:false, - readonly:false, - value: '', - rules:[], - 'picker-options': { - selectableRange: '00:00:00-23:59:59' - }, - 'arrow-control':true, - align:'left', - format: 'HH:mm:ss', - 'value-format': 'HH:mm:ss', - 'is-range':false, - 'range-separator':'-' -} diff --git a/sample-form-client-ui/admin/src/components/formDes/custom/items/upload.js b/sample-form-client-ui/admin/src/components/formDes/custom/items/upload.js deleted file mode 100644 index fdd455d679f048830c693bbfcf049b249fe3d785..0000000000000000000000000000000000000000 --- a/sample-form-client-ui/admin/src/components/formDes/custom/items/upload.js +++ /dev/null @@ -1,52 +0,0 @@ -/** - * 涓婁紶缁勪欢 - */ -export let upload = { - id:'', - _id:'', - compType: 'upload', - ele: 'el-upload', - //鎺т欢鍚嶇О(宸︿晶鏄剧ず) - compName:'闄勪欢', - //鍥炬爣 - compIcon:'att', - //灞曠ず琛ㄥ崟鐨勬ā寮� - viewType:'component', - - // 鏄惁鍙厤缃� - //鏆傛椂榛樿涓簍rue锛屾棤娉曟洿鏀癸紝鍚庢湡鑰冭檻鏌愪簺鏃跺€欐棤娉曢厤缃� - config: true, - // 鎺т欢宸︿晶label鍐呭 - showLabel:true, - label: '闄勪欢涓婁紶', - labelWidth: '80', - //鏍呮牸闂撮殧 - gutter:15, - //榛樿鏍呮牸 - span:24, - // 鏄惁蹇呭~ - required: false, - //涓婁紶鍦板潃 - action:'http://192.168.0.98:8090/api/upload/file', - //澶氶€変笂浼� - multiple:false, - name:'file', - //鏄剧ず涓婁紶鏂囦欢鍒楄〃 - 'show-file-list':true, - //鏂囦欢鍒楄〃绫诲瀷 - 'list-type':'text', - value:'', - width:100, - //鎸夐挳鏂囧瓧 - buttonText:'璇蜂笂浼犻檮浠�', - //鏄惁鏄剧ず鎻忚堪 - showTip:false, - //鎻忚堪鍐呭 - tips:'鐐瑰嚮鎸夐挳涓婁紶闄勪欢', - //鍏佽鏂囦欢绫诲瀷 - accept:'.pdf, .doc, .docx, .xls, .xlsx', - //鏂囦欢澶у皬MB - fileSize:10, - // 鏈€澶у厑璁镐笂浼犱釜鏁� - limit:1, -} diff --git a/sample-form-client-ui/admin/src/components/formDes/custom/mixin/index.js b/sample-form-client-ui/admin/src/components/formDes/custom/mixin/index.js deleted file mode 100644 index 36214d283d6eada2ef6ece13749c5542958d6531..0000000000000000000000000000000000000000 --- a/sample-form-client-ui/admin/src/components/formDes/custom/mixin/index.js +++ /dev/null @@ -1,30 +0,0 @@ -// 妯℃€佹 -export const remoteData = { - methods: { - getRemoteData(){ - //鍔ㄦ€佹暟鎹� - if(this.conf.dataType === 'dynamic'){ - this.$axios.get(this.conf.action).then(res => { - if(this.conf.options.length===0){ - this.conf.options = this.conf.options.concat(res.data); - } - }) - } - } - } -} - -export const changeId = { - methods: { - handlerChangeId(val){ - let idArray = this.getFormId(this.props._id); - console.log(idArray); - if(idArray.includes(val)){ //濡傛灉瀛樺湪id鐩哥瓑锛屽垯鎻愮ず - this.$message.error('璇D宸茬粡瀛樺湪锛岃淇敼'); - this.props.id=this.props._id; - }else{ - this.props._id=val; - } - } - } -} diff --git a/sample-form-client-ui/admin/src/components/formDes/custom/previewRender.js b/sample-form-client-ui/admin/src/components/formDes/custom/previewRender.js deleted file mode 100644 index 5943980c6d9c3afb36bedd7a436c2b754f259d96..0000000000000000000000000000000000000000 --- a/sample-form-client-ui/admin/src/components/formDes/custom/previewRender.js +++ /dev/null @@ -1,69 +0,0 @@ -import { isAttr,jsonClone } from '../utils'; -import childrenItem from './slot/index'; -import {remoteData} from './mixin'; -//鍏堜慨鏀瑰湪杩欓噷,鍚庣画闇€瑕佷紭鍖� -function vModel(self, dataObject) { - dataObject.props.value = self.value; - dataObject.on.input = val => { - self.$emit('input', val) - } - //鍒ゆ柇鏄惁涓轰笂浼犵粍浠� - if(self.conf.compType === 'upload'){ - dataObject.attrs['before-upload'] = file=>{ - //闈為檺瀹氬悗缂€涓嶅厑璁镐笂浼� - const fileName = file.name; - const suffixName = fileName.split('.').pop(); - if(!self.conf.accept.includes(suffixName)){ - self.$message.error('璇ュ悗缂€鏂囦欢涓嶅厑璁镐笂浼�'); - return false; - } - const fileSize = file.size; - if(fileSize>dataObject.props.fileSize*1024*1024){ - self.$message.error('鏂囦欢澶у皬瓒呭嚭闄愬埗锛岃妫€鏌ワ紒'); - return false; - } - } - dataObject.attrs['on-success'] = (response, file, fileList)=>{ - let uloadData = fileList.map(v => v.response.data).join(',') - self.$emit('input',uloadData) - } - dataObject.attrs['on-remove'] = ( file, fileList)=>{ - let uloadData = fileList.map(v => v.response.data).join(',') - self.$emit('input',uloadData) - } - } -} - -export default { - render(h) { - let dataObject = { - attrs: {}, - props: {}, - on: {}, - style: {} - } - //杩滅▼鑾峰彇鏁版嵁 - this.getRemoteData(); - const confClone = jsonClone(this.conf); - const children = childrenItem(h,confClone); - Object.keys(confClone).forEach(key => { - const val = confClone[key] - if (dataObject[key]) { - dataObject[key] = val - } else if(key ==='width'){ - dataObject.style= 'width:'+val; - } else if (!isAttr(key)) { - dataObject.props[key] = val - }else { - if(key !== 'value'){ - dataObject.attrs[key] = val - } - } - }) - /*璋冩暣璧嬪€兼ā寮忥紝瑙勯伩cascader缁勪欢璧嬪€紁rops浼氬嚭鐜拌鐩栭鍒跺弬鏁扮殑bug */ - vModel(this, dataObject); - return h(confClone.ele, dataObject, children) - }, - props: ['conf','value'], - mixins:[remoteData] -} diff --git a/sample-form-client-ui/admin/src/components/formDes/custom/register.js b/sample-form-client-ui/admin/src/components/formDes/custom/register.js deleted file mode 100644 index 4fe26a3be69886b3e40394a3a7c5c2f7e007b77d..0000000000000000000000000000000000000000 --- a/sample-form-client-ui/admin/src/components/formDes/custom/register.js +++ /dev/null @@ -1,41 +0,0 @@ -//鍦ㄦ娉ㄥ唽缁勪欢 -const components = [ - 'input', - 'select', - 'radio', - 'checkbox', - 'Switch', - 'inputNumber', - 'textarea', - 'slider', - 'rate', - 'date', - 'time', - 'editor', - 'colorPicker', - 'cascader', - 'upload', - 'button', - 'divider', - 'alert', - 'link', - 'dialogList', - 'barCode', - 'text', - 'html', - 'row', - 'dynamicTable', - 'table', - 'tdItem' -]; - - -let comps = []; -for (let i in components) { - const comp = { - name: components[i], - content : null - } - comps.push(comp); -} -export default comps; \ No newline at end of file diff --git a/sample-form-client-ui/admin/src/components/formDes/custom/render.js b/sample-form-client-ui/admin/src/components/formDes/custom/render.js deleted file mode 100644 index 95e68d6f21dfaa3a4a297997c5230e80c8802183..0000000000000000000000000000000000000000 --- a/sample-form-client-ui/admin/src/components/formDes/custom/render.js +++ /dev/null @@ -1,41 +0,0 @@ -import {isAttr,jsonClone} from '../utils/index'; -import childrenItem from './slot/index'; -import {remoteData} from './mixin'; -function vModel(self, dataObject) { - dataObject.on.input = val => { - self.$emit('input', val) - } -} - -export default { - render(h) { - let dataObject = { - attrs: {}, - props: {}, - on: {}, - style: {} - } - - //杩滅▼鑾峰彇鏁版嵁 - this.getRemoteData(); - const confClone = jsonClone(this.conf); - const children = childrenItem(h,confClone); - Object.keys(confClone).forEach(key => { - const val = confClone[key] - if (dataObject[key]) { - dataObject[key] = val - } else if (!isAttr(key)) { - dataObject.props[key] = val - } else if(key ==='width'){ - dataObject.style= 'width:'+val; - }else { - dataObject.attrs[key] = val - } - }) - /*璋冩暣璧嬪€兼ā寮忥紝瑙勯伩cascader缁勪欢璧嬪€紁rops浼氬嚭鐜拌鐩栭鍒跺弬鏁扮殑bug */ - vModel(this, dataObject); - return h(confClone.ele, dataObject, children) - }, - props: ['conf'], - mixins:[remoteData] -} diff --git a/sample-form-client-ui/admin/src/components/formDes/custom/rule/index.js b/sample-form-client-ui/admin/src/components/formDes/custom/rule/index.js deleted file mode 100644 index 426b9c2370356e509918a56aadacab4c5f583527..0000000000000000000000000000000000000000 --- a/sample-form-client-ui/admin/src/components/formDes/custom/rule/index.js +++ /dev/null @@ -1,21 +0,0 @@ -export default function checkRules(element) { - let r = []; - const _trigger = ['blur','change']; - if(element.required){ - r.push({required: true, message: element.label+'涓嶈兘涓虹┖', trigger:_trigger}); - } - //鍒ゆ柇鏄惁鏈夎鍒� - if(element.rules){ - element.rules.forEach(obj=>{ - r.push({pattern:new RegExp(obj.rule),message:obj.msg, trigger:_trigger}); - }); - } - //缂栬緫鍣ㄦ渶澶у瓧鏁伴獙璇� - if(typeof element.validateMaxText !== 'undefined'&&element.validateMaxText){ - const maxRules = { - max: element.max, message: element.label+'瓒呭嚭鏈€澶у瓧鏁伴檺鍒�', trigger:_trigger - } - r.push(maxRules); - } - return r; -} \ No newline at end of file diff --git a/sample-form-client-ui/admin/src/components/formDes/custom/slot/el-button.js b/sample-form-client-ui/admin/src/components/formDes/custom/slot/el-button.js deleted file mode 100644 index a9ed0c15ed966b22ee6d65b9ea73453810f29fa1..0000000000000000000000000000000000000000 --- a/sample-form-client-ui/admin/src/components/formDes/custom/slot/el-button.js +++ /dev/null @@ -1,5 +0,0 @@ -export default { - slot(h,conf) { - return conf.text; - } -} \ No newline at end of file diff --git a/sample-form-client-ui/admin/src/components/formDes/custom/slot/el-checkbox-group.js b/sample-form-client-ui/admin/src/components/formDes/custom/slot/el-checkbox-group.js deleted file mode 100644 index e399f512ee448002b7b2ca678c79811e92db58a1..0000000000000000000000000000000000000000 --- a/sample-form-client-ui/admin/src/components/formDes/custom/slot/el-checkbox-group.js +++ /dev/null @@ -1,11 +0,0 @@ -export default { - slot(h,conf) { - const list = [] - const vertical = conf.vertical?'display:block;':''; - conf.options.forEach(item => { - if (conf.optionType === 'button') list.push(<el-checkbox-button label={item.value}>{item.label}</el-checkbox-button>) - else list.push(<el-checkbox label={item.value} style={vertical} border={conf.border}>{item.label}</el-checkbox>) - }) - return list - } -} \ No newline at end of file diff --git a/sample-form-client-ui/admin/src/components/formDes/custom/slot/el-divider.js b/sample-form-client-ui/admin/src/components/formDes/custom/slot/el-divider.js deleted file mode 100644 index af75bf57c73fa1451af41d1d197ff7ca858d8ae5..0000000000000000000000000000000000000000 --- a/sample-form-client-ui/admin/src/components/formDes/custom/slot/el-divider.js +++ /dev/null @@ -1,2 +0,0 @@ -import text from './el-button'; -export default text; \ No newline at end of file diff --git a/sample-form-client-ui/admin/src/components/formDes/custom/slot/el-input.js b/sample-form-client-ui/admin/src/components/formDes/custom/slot/el-input.js deleted file mode 100644 index ad1d28640e798905ec592cee5b0793696e75934e..0000000000000000000000000000000000000000 --- a/sample-form-client-ui/admin/src/components/formDes/custom/slot/el-input.js +++ /dev/null @@ -1,12 +0,0 @@ -export default { - slot(h,conf) { - const slotText = [] - if(conf.prepend!==''){ - slotText.push(<template slot="prepend">{conf.prepend}</template>); - } - if(conf.append!==''){ - slotText.push(<template slot="append">{conf.append}</template>); - } - return slotText; - } -} \ No newline at end of file diff --git a/sample-form-client-ui/admin/src/components/formDes/custom/slot/el-link.js b/sample-form-client-ui/admin/src/components/formDes/custom/slot/el-link.js deleted file mode 100644 index af75bf57c73fa1451af41d1d197ff7ca858d8ae5..0000000000000000000000000000000000000000 --- a/sample-form-client-ui/admin/src/components/formDes/custom/slot/el-link.js +++ /dev/null @@ -1,2 +0,0 @@ -import text from './el-button'; -export default text; \ No newline at end of file diff --git a/sample-form-client-ui/admin/src/components/formDes/custom/slot/el-radio-group.js b/sample-form-client-ui/admin/src/components/formDes/custom/slot/el-radio-group.js deleted file mode 100644 index 8f3f99868711b7e8883d753c438723c39f4675cc..0000000000000000000000000000000000000000 --- a/sample-form-client-ui/admin/src/components/formDes/custom/slot/el-radio-group.js +++ /dev/null @@ -1,11 +0,0 @@ -export default { - slot(h,conf) { - const list = []; - const vertical = conf.vertical?'display:block;':''; - conf.options.forEach(item => { - if (conf.optionType === 'button') list.push(<el-radio-button label={item.value} style="">{item.label}</el-radio-button>) - else list.push(<el-radio label={item.value} style={vertical} border={conf.border}>{item.label}</el-radio>) - }) - return list - } -} \ No newline at end of file diff --git a/sample-form-client-ui/admin/src/components/formDes/custom/slot/el-select.js b/sample-form-client-ui/admin/src/components/formDes/custom/slot/el-select.js deleted file mode 100644 index 534a9bc5b31f56dcec0b078ae7f74c577d09e7e6..0000000000000000000000000000000000000000 --- a/sample-form-client-ui/admin/src/components/formDes/custom/slot/el-select.js +++ /dev/null @@ -1,9 +0,0 @@ -export default { - slot(h,conf) { - const list = [] - conf.options.forEach(item => { - list.push(<el-option label={item.label} value={item.value} disabled={item.disabled}></el-option>) - }) - return list; - } -} \ No newline at end of file diff --git a/sample-form-client-ui/admin/src/components/formDes/custom/slot/el-upload.js b/sample-form-client-ui/admin/src/components/formDes/custom/slot/el-upload.js deleted file mode 100644 index af4bdf587d6697d32edac866dac59e00eae28847..0000000000000000000000000000000000000000 --- a/sample-form-client-ui/admin/src/components/formDes/custom/slot/el-upload.js +++ /dev/null @@ -1,14 +0,0 @@ -export default { - slot(h,conf) { - const list = []; - if (conf['list-type'] === 'picture-card') { - list.push(<i class="el-icon-plus"/>) - } else { - list.push(<el-button size="small" type="primary" icon="el-icon-upload">{conf.buttonText}</el-button>) - } - if (conf.showTip) { - list.push(<div slot="tip" class="el-upload__tip">{conf.tips}</div>) - } - return list - } -} \ No newline at end of file diff --git a/sample-form-client-ui/admin/src/components/formDes/custom/slot/index.js b/sample-form-client-ui/admin/src/components/formDes/custom/slot/index.js deleted file mode 100644 index cc960830c2bf0e091aa7022a116e02311e919090..0000000000000000000000000000000000000000 --- a/sample-form-client-ui/admin/src/components/formDes/custom/slot/index.js +++ /dev/null @@ -1,21 +0,0 @@ -const slots = require.context('./', false, /\.js$/); -const componentChild = {}; -slots.keys().forEach(obj=>{ - const tag = obj.replace('./','').replace('.js',''); - if(tag !=='index'){ - componentChild[tag] = slots(obj).default; - } -}); - - -export default function childrenItem(h,confClone) { - let children = []; - const childObjs = componentChild[confClone.ele] - if (childObjs&&childObjs.slot) { - Object.keys(childObjs).forEach(key => { - const childFunc = childObjs[key] - children.push(childFunc(h,confClone)) - }) - } - return children; -} \ No newline at end of file diff --git a/sample-form-client-ui/admin/src/components/formDes/custom/viewRender.js b/sample-form-client-ui/admin/src/components/formDes/custom/viewRender.js deleted file mode 100644 index 6dea8f1590bfa6156e558db67a1ac03b57fe4abb..0000000000000000000000000000000000000000 --- a/sample-form-client-ui/admin/src/components/formDes/custom/viewRender.js +++ /dev/null @@ -1,43 +0,0 @@ -import { isAttr,jsonClone } from '../utils'; -import childrenItem from './slot/index'; -import {remoteData} from './mixin'; - -function vModel(self, dataObject) { - dataObject.props.value=self.value; - dataObject.on.input = val => { - self.$emit('input', val) - } -} - -export default { - render(h) { - let dataObject = { - attrs: {}, - props: {}, - on: {}, - style: {} - } - - //杩滅▼鑾峰彇鏁版嵁 - this.getRemoteData(); - const confClone = jsonClone(this.conf); - const children = childrenItem(h,confClone); - Object.keys(confClone).forEach(key => { - const val = confClone[key] - if (dataObject[key]) { - dataObject[key] = val - } else if(key ==='width'){ - dataObject.style= 'width:'+val+'%'; - } else if (!isAttr(key)) { - dataObject.props[key] = val - } else { - dataObject.attrs[key] = val - } - }) - /*璋冩暣璧嬪€兼ā寮忥紝瑙勯伩cascader缁勪欢璧嬪€紁rops浼氬嚭鐜拌鐩栭鍒跺弬鏁扮殑bug */ - vModel(this, dataObject); - return h(confClone.ele, dataObject, children) - }, - props: ['conf','value'], - mixins:[remoteData] -} diff --git a/sample-form-client-ui/admin/src/components/formDes/designItem.vue b/sample-form-client-ui/admin/src/components/formDes/designItem.vue deleted file mode 100644 index e6e22e3a06029b6f3b4fe97979e69ea3d265cab4..0000000000000000000000000000000000000000 --- a/sample-form-client-ui/admin/src/components/formDes/designItem.vue +++ /dev/null @@ -1,348 +0,0 @@ -<script> -import draggable from "vuedraggable"; -import render from "./custom/render"; -import { getSimpleId } from "./utils/IdGenerate"; -import { dynamicTableAllowedItems, tableAllowedItems } from "./custom/formConf"; -import dynamicTable from "./dynamic/dynamicTable"; -import dynamicTableItem from "./dynamic/dynamicTableItem"; -import fancyTable from "./table/fancyTable"; -import fancyTableItem from "./table/fancyTableItem"; -/** - * 鍔ㄦ€佽〃鍗曞厑璁稿鍔犵殑缁勪欢鍒楄〃 - */ -const components = { - itemBtns(h, element, parent) { - const { copyItem, deleteItem } = this.$listeners; - return [ - <span - class="drawing-item-copy" - title="澶嶅埗" - onClick={(event) => { - copyItem(element, parent); - event.stopPropagation(); - }} - > - <i class="el-icon-copy-document" /> - </span>, - <span - class="drawing-item-delete" - title="鍒犻櫎" - onClick={(event) => { - deleteItem(element, parent); - event.stopPropagation(); - }} - > - <i class="el-icon-delete" /> - </span>, - ]; - }, -}; -const layouts = { - colItem(h, element, parent) { - console.log(parent); - let className = - this.activeItem.id === element.id - ? "drawing-item active-from-item" - : "drawing-item"; - let labelWidth = element.labelWidth ? `${element.labelWidth}px` : null; - const { onActiveItemChange } = this.$listeners; - return ( - <el-col - class={className} - span={element.span} - nativeOnClick={(event) => { - onActiveItemChange(element); - event.stopPropagation(); - }} - > - <span class="component-name component-id">{element.id}</span> - <el-form-item - label={element.showLabel ? element.label : ""} - label-width={labelWidth} - required={element.required} - > - <render - key={element.id} - conf={element} - onInput={(event) => { - this.$set(element, "value", event); - }} - /> - </el-form-item> - {components.itemBtns.apply(this, arguments)} - </el-col> - ); - }, - rowItem(h, element) { - const { onActiveItemChange } = this.$listeners; - const className = - this.activeItem.id === element.id - ? "drawing-item drawing-row-item active-from-item" - : "drawing-item drawing-row-item"; - return ( - <el-col class={className}> - <el-row - gutter={element.gutter} - nativeOnClick={(event) => { - onActiveItemChange(element); - event.stopPropagation(); - }} - > - <span class="component-name">{element.id}</span> - <div - class="drag-wrapper" - style="padding-left: 7.5px; padding-right: 7.5px;" - > - {element.columns.map((item) => { - return ( - <el-col class="drag-col-wrapper" span={item.span}> - <draggable - class="drag-wrapper row-drag" - v-model={item.list} - animation="100" - group="componentsGroup" - onAdd={(e) => { - this.handlerAdd(e, item, element); - }} - > - {item.list.map((obj) => { - return renderChildren.call(this, h, obj, element); - })} - </draggable> - </el-col> - ); - })} - </div> - </el-row> - {components.itemBtns.call(this, h, element)} - </el-col> - ); - }, - tableItem(h, element) { - let className = ""; - className = - this.activeItem.id === element.id - ? "drawing-item drawing-row-item active-from-item" - : "drawing-item drawing-row-item"; - const { onActiveItemChange } = this.$listeners; - return ( - <el-col - class={className} - nativeOnClick={(event) => { - onActiveItemChange(element); - event.stopPropagation(); - }} - > - <span class="component-name" style="margin-bottom:15px"> - {element.id} - </span> - <fancy-table - layoutArray={element.layoutArray} - tdStyle={element.tdStyle} - width={element.width} - height={element.height} - onSelectItem={(item) => { - onActiveItemChange(item); - }} - scopedSlots={{ - default: (item) => { - return ( - <draggable - tag="div" - class="table__content row-drag" - v-model={item.td.columns} - animation="100" - group="componentsGroup" - onAdd={(e) => { - this.handlerTableAdd(e, item.td); - e.stopPropagation(); - }} - > - {item.td.columns.map((obj) => { - return renderChildren.call(this, h, obj, item.td); - })} - </draggable> - ); - }, - }} - /> - {components.itemBtns.call(this, h, element)} - </el-col> - ); - }, - dynamicItem(h, element) { - let className = ""; - className = - this.activeItem.id === element.id - ? className + "drawing-item active-from-item" - : className + "drawing-item"; - const { onActiveItemChange } = this.$listeners; - return ( - <el-col class={className}> - <dynamic-table - conf={element} - activeItem={this.activeItem} - nativeOnClick={(event) => { - onActiveItemChange(element); - event.stopPropagation(); - }} - > - <draggable - tag="div" - class="dynamic-table__content row-drag" - ghost-class="dynamicGhost" - v-model={element.columns} - animation="100" - group="componentsGroup" - onAdd={(e) => { - this.handlerDynamicAdd(e, element); - }} - > - {element.columns.map((item, index) => { - return ( - <dynamic-table-item - item={item} - activeItem={this.activeItem} - onSelectItem={(evt, item) => { - onActiveItemChange(item); - evt.stopPropagation(); - }} - onCopyItem={(evt) => { - this.handlerCopyItem(evt, element, index); - evt.stopPropagation(); - }} - onDeleteItem={(evt) => { - this.handlerDeleteItem(evt, element, index); - evt.stopPropagation(); - }} - /> - ); - })} - </draggable> - </dynamic-table> - {components.itemBtns.call(this, h, element)} - </el-col> - ); - }, -}; -/** - * 鐢熸垚row鐨勫瓙閫夐」 - */ -function renderChildren(h, element, parent) { - const layout = layouts[element.layout]; - if (layout) { - return layout.call(this, h, element, parent); - } - return layoutIsNotFound.call(this); -} - -function layoutIsNotFound() { - throw new Error(`娌℃湁涓�${this.element.layout}鍖归厤鐨刲ayout`); -} -export default { - name: "designItem", - components: { - render, - draggable, - dynamicTable, - dynamicTableItem, - fancyTable, - fancyTableItem, - }, - props: { - model: { - type: Object, - default: () => { - return {}; - }, - }, - activeItem: { - type: Object, - default: () => { - return {}; - }, - }, - }, - data() { - return { - activeComponent: this.activeItem, - }; - }, - render(h) { - const layout = layouts[this.model.layout]; - if (layout) { - return layout.call(this, h, this.model); - } - return layoutIsNotFound.call(this); - }, - methods: { - handlerAdd(evt, item, row) { - console.log(this.activeItem.compType, row); - if (evt.pullMode === "clone") { - if ( - !( - evt.to.className.indexOf("row-drag") > -1 && - this.activeItem.compType === "row" - ) - ) { - item.list.splice(evt.newIndex, 0, this.activeItem); - } - } else { - if (evt.item.className.indexOf("el-row") > -1) { - //闃叉row宓屽 - const newIndex = evt.newIndex; - const oldIndex = evt.oldIndex; - const rowItem = item.list[newIndex]; - item.list.splice(newIndex, 1); - this.$message.error("甯冨眬缁勪欢涓嶅厑璁歌宓屽锛�"); - this.$emit("rowItemRollBack", rowItem, oldIndex); //杩樺師鍒板師鍏堢殑鍒楄〃涓� - return false; - } - } - }, - /** - * 鍔ㄦ€佽〃鍗� - */ - handlerDynamicAdd(evt, item) { - if (evt.pullMode === "clone") { - if (dynamicTableAllowedItems.includes(this.activeItem.compType)) { - item.columns.splice(evt.newIndex, 0, this.activeItem); - } else { - this.$message.error("璇ョ粍浠朵笉鍏佽琚斁鍏ュ姩鎬佽〃鏍煎唴锛�"); - } - } else { - if (evt.item.className.indexOf("el-row") > -1) { - //闃叉row宓屽 - const newIndex = evt.newIndex; - const oldIndex = evt.oldIndex; - const rowItem = item.columns[newIndex]; - item.columns.splice(newIndex, 1); - this.$message.error("甯冨眬缁勪欢涓嶅厑璁告斁鍏ュ姩鎬佽〃鏍硷紒"); - this.$emit("rowItemRollBack", rowItem, oldIndex); //杩樺師鍒板師鍏堢殑鍒楄〃涓� - return false; - } - } - }, - handlerTableAdd(evt, td) { - if (evt.pullMode === "clone") { - if (!tableAllowedItems.includes(this.activeItem.compType)) { - td.columns.splice(evt.newIndex, 0, this.activeItem); - } else { - this.$message.error("璇ョ粍浠朵笉鍏佽琚斁鍏ヨ〃鏍煎唴锛�"); - } - } - }, - handlerCopyItem(evt, element, index) { - const item = element.columns[index]; - const clone = JSON.parse(JSON.stringify(item)); - let uId = "fd_" + getSimpleId(); - clone.id = uId; - clone._id = uId; - element.columns.push(clone); - }, - handlerDeleteItem(evt, element, index) { - element.columns.splice(index, 1); - }, - }, -}; -</script> \ No newline at end of file diff --git a/sample-form-client-ui/admin/src/components/formDes/designer.vue b/sample-form-client-ui/admin/src/components/formDes/designer.vue deleted file mode 100644 index c55eb97fa37a087c31563e8d4aa10a36db68c546..0000000000000000000000000000000000000000 --- a/sample-form-client-ui/admin/src/components/formDes/designer.vue +++ /dev/null @@ -1,419 +0,0 @@ -<template> - <!--涓棿闈㈡澘--> - <div class="center-board"> - <div class="action-bar"> - <el-button icon="el-icon-view" type="text" @click="preview"> - 棰勮 - </el-button> - <el-button icon="el-icon-view" type="text" @click="view"> - 鏌ョ湅 - </el-button> - <el-button icon="el-icon-tickets" type="text" @click="viewJSON"> - JSON - </el-button> - <el-button icon="el-icon-s-tools" type="text" @click="setting"> - 璁剧疆 - </el-button> - <el-button - class="delete-btn" - icon="el-icon-delete-solid" - type="text" - @click="clear" - > - 娓呯┖ - </el-button> - <el-button icon="el-icon-question" type="text" @click="help"> - 甯姪 - </el-button> - </div> - <el-scrollbar class="center-scrollbar"> - <el-row class="center-board-row" :gutter="formConf.gutter"> - <el-form - :size="formConf.size" - :label-position="formConf.labelPosition" - :disabled="formConf.disabled" - :label-width="formConf.labelWidth + 'px'" - > - <draggable - class="drawing-board" - :list="list" - :animation="100" - group="componentsGroup" - draggable=".drawing-item" - > - <design-item - v-for="(element, index) in list" - :key="index" - :model="element" - :activeItem="activeItem" - @rowItemRollBack="handlerRollBack" - @onActiveItemChange="handlerActiveItemChange" - @copyItem="handlerItemCopy" - @deleteItem="handlerItemDelete" - /> - </draggable> - <div v-show="infoShow" class="empty-info"> - <el-empty description="浠庡乏渚ф嫋鎷芥坊鍔犳帶浠�"></el-empty> - </div> - </el-form> - </el-row> - </el-scrollbar> - <config-panel :activeItem="activeItem" :itemList="list" /> - <!-- 璁捐鍣ㄩ厤缃脊鍑烘 --> - <el-dialog - :visible.sync="formConfVisible" - width="50%" - top="30px" - append-to-body - :center="true" - > - <el-tabs v-model="activeName"> - <el-tab-pane label="琛ㄥ崟閰嶇疆" name="formConf"> - <el-form ref="formConf" :model="formConf" label-width="100px"> - <el-form-item label="琛ㄥ崟鍚�"> - <el-input class="input" v-model="formConf.formRef"></el-input> - </el-form-item> - <el-form-item label="琛ㄥ崟妯″瀷"> - <el-input class="input" v-model="formConf.formModel"></el-input> - </el-form-item> - <el-form-item label="鏍¢獙妯″瀷"> - <el-input class="input" v-model="formConf.formRules"></el-input> - </el-form-item> - <el-form-item label="琛ㄥ崟灏哄"> - <el-radio-group v-model="formConf.size"> - <el-radio-button label="medium">涓瓑</el-radio-button> - <el-radio-button label="small">杈冨皬</el-radio-button> - <el-radio-button label="mini">杩蜂綘</el-radio-button> - </el-radio-group> - </el-form-item> - <el-form-item label="鏍囩瀵归綈"> - <el-radio-group v-model="formConf.labelPosition"> - <el-radio-button label="right">鍙冲榻�</el-radio-button> - <el-radio-button label="left">宸﹀榻�</el-radio-button> - <el-radio-button label="top">椤堕儴瀵归綈</el-radio-button> - </el-radio-group> - </el-form-item> - <el-form-item label="鏍囩瀹藉害"> - <el-input-number - v-model="formConf.labelWidth" - :min="60" - :max="140" - ></el-input-number> - </el-form-item> - <el-form-item label="鏍呮牸闂撮殧"> - <el-input-number - v-model="formConf.gutter" - :min="0" - :max="30" - ></el-input-number> - </el-form-item> - <el-form-item label="鍔ㄦ€佽〃鏍兼敮鎸�"> - <el-switch v-model="formConf.dynamicTableAllowed"></el-switch> - </el-form-item> - <!-- <el-form-item label="缁勪欢楂樹寒鏄剧ず"> - <el-switch v-model="formConf.dynamicTableAllowed"></el-switch> - </el-form-item> --> - <el-form-item label="绂佺敤琛ㄥ崟"> - <el-switch v-model="formConf.disabled"></el-switch> - </el-form-item> - </el-form> - </el-tab-pane> - <!-- <el-tab-pane label="鎻愪氦鍓�" name="fourth">寮€鍙戜腑...</el-tab-pane> --> - </el-tabs> - <span slot="footer" class="dialog-footer"> - <el-button type="primary" @click="handlerSaveFormConf">纭� 瀹�</el-button> - </span> - </el-dialog> - <el-dialog - :visible.sync="previewVisible" - width="70%" - append-to-body - title="棰勮" - > - <preview - :itemList="itemList" - :formConf="formConf" - v-if="previewVisible" - /> - </el-dialog> - <el-dialog - :visible.sync="JSONVisible" - width="70%" - title="JSON" - center - append-to-body - :close-on-click-modal="false" - > - <codemirror v-model="viewCode" :options="options" /> - <span slot="footer" class="dialog-footer"> - <el-button type="primary" @click="handlerSetJson()">纭� 瀹�</el-button> - </span> - </el-dialog> - </div> -</template> -<script> -import draggable from "vuedraggable"; -import configPanel from "./configPanel"; -import designItem from "./designItem"; -import { getSimpleId } from "./utils/IdGenerate"; -import { isLayout, isTable, inTable, jsonClone } from "./utils/index"; -import formConf from "./custom/formConf"; -import preview from "./preview"; -import { codemirror } from "vue-codemirror"; -// 鏍稿績鏍峰紡 -import "codemirror/lib/codemirror.css"; -// 寮曞叆涓婚鍚庤繕闇€瑕佸湪 options 涓寚瀹氫富棰樻墠浼氱敓鏁� -import "codemirror/theme/dracula.css"; -import "codemirror/mode/javascript/javascript"; - -export default { - name: "designer", - components: { - draggable, - configPanel, - designItem, - preview, - codemirror, - }, - props: { - list: { - type: Array, - default: () => { - return []; - }, - }, - formConfig: { - type: Object, - default: formConf, - }, - }, - provide() { - return { - getContext: this, - }; - }, - data() { - return { - formConf: formConf, - activeItem: {}, - lastActiveItem: {}, - formConfVisible: false, - previewVisible: false, - JSONVisible: false, - itemList: [], - activeName: "formConf", - editorCode: "", - viewCode: "", - // 榛樿閰嶇疆 - options: { - tabSize: 2, // 缂╄繘鏍煎紡 - theme: "dracula", // 涓婚锛屽搴斾富棰樺簱 JS 闇€瑕佹彁鍓嶅紩鍏� - lineNumbers: true, // 鏄剧ず琛屽彿 - line: true, - styleActiveLine: true, // 楂樹寒閫変腑琛� - hintOptions: { - completeSingle: true, // 褰撳尮閰嶅彧鏈変竴椤圭殑鏃跺€欐槸鍚﹁嚜鍔ㄨˉ鍏� - }, - }, - }; - }, - mounted() {}, - methods: { - preview() { - const clone = JSON.parse(JSON.stringify(this.list)); - this.itemList = clone; - this.previewVisible = true; - }, - viewJSON() { - this.viewCode = this.code; - this.JSONVisible = true; - }, - view() { - localStorage.setItem("formValue", this.code); - window.open("#/view"); - }, - setting() { - this.formConfVisible = true; - }, - clear() { - console.log(11); - this.$confirm("姝ゆ搷浣滃皢娓呯┖鏁翠釜琛ㄥ崟,鏄惁缁х画?").then(() => { - this.$emit("clear"); - }); - }, - help() { - window.open("https://gitee.com/wurong19870715/formDesigner"); - }, - handlerActiveItemChange(obj) { - this.lastActiveItem = this.activeItem; - this.activeItem = obj; - }, - handlerItemCopy(origin, parent) { - if (isLayout(origin)) { - //row - const clone = jsonClone(origin); - const uId = "row_" + getSimpleId(); - console.log(uId); - clone.id = uId; - clone._id = uId; - clone.columns.map((column) => { - let itemList = []; - column.list.map((item) => { - const cloneitem = jsonClone(item); - const uId = "fd_" + getSimpleId(); - cloneitem.id = uId; - cloneitem._id = uId; - itemList.push(cloneitem); - }); - column.list = []; - column.list = itemList; - }); - this.list.push(clone); - this.handlerActiveItemChange(clone); - } else if (isTable(origin)) { - //琛ㄦ牸甯冨眬 - const clone = jsonClone(origin); - const uId = "table_" + getSimpleId(); - clone.id = uId; - clone._id = uId; - clone.layoutArray.map((tr) => { - tr.map((td) => { - let itemList = []; - td.id = getSimpleId(); - td.columns.map((item) => { - const cloneitem = jsonClone(item); - const uId = "fd_" + getSimpleId(); - cloneitem.id = uId; - cloneitem._id = uId; - itemList.push(cloneitem); - }); - td.columns = []; - td.columns = itemList; - }); - }); - this.list.push(clone); - this.handlerActiveItemChange(clone); - } else { - //濡傛灉鏄櫘閫氱粍浠讹紝闇€瑕佸垽鏂粬鏄惁鍐嶅竷灞€缁勪欢涓嬨€� - if (parent) { - if (inTable(parent)) { - //澧炲姞琛ㄦ牸缁勪欢鐨勬敮鎸� - if (parent.columns.some((item) => item.id === origin.id)) { - const clone = jsonClone(origin); - const uId = "fd_" + getSimpleId(); - clone.id = uId; - clone._id = uId; - parent.columns.push(clone); - this.handlerActiveItemChange(clone); - } - } else { - parent.columns.map((column) => { - if (column.list.some((item) => item.id === origin.id)) { - const clone = jsonClone(origin); - const uId = "fd_" + getSimpleId(); - clone.id = uId; - clone._id = uId; - column.list.push(clone); - this.handlerActiveItemChange(clone); - } - }); - } - } else { - const clone = jsonClone(origin); - const uId = "fd_" + getSimpleId(); - clone.id = uId; - clone._id = uId; - this.list.push(clone); - this.handlerActiveItemChange(clone); - } - } - }, - handlerItemDelete(origin, parent) { - if (isLayout(origin) || isTable(origin)) { - //濡傛灉鏄竷灞€缁勪欢,鍒欑洿鎺ュ垹闄� - const index = this.list.findIndex((item) => item.id === origin.id); - this.list.splice(index, 1); - } else { - //濡傛灉涓嶆槸甯冨眬缁勪欢锛屽垯鍏堝垽鏂槸涓嶆槸鍐嶅竷灞€鍐呴儴锛屽鏋滀笉鏄紝鍒欑洿鎺ュ垹闄ゅ氨鍙互锛屽鏋滄槸锛屽垯瑕佸湪甯冨眬鍐呴儴鍒犻櫎 - if (parent) { - if (inTable(parent)) { - //澧炲姞琛ㄦ牸缁勪欢鐨勬敮鎸� - const colIndex = parent.columns.findIndex( - (item) => item.id === origin.id - ); - if (colIndex > -1) { - parent.columns.splice(colIndex, 1); - } - } else { - parent.columns.map((column) => { - const colIndex = column.list.findIndex( - (item) => item.id === origin.id - ); - if (colIndex > -1) { - column.list.splice(colIndex, 1); - } - }); - } - } else { - const index = this.list.findIndex((item) => item.id === origin.id); - this.list.splice(index, 1); - } - } - }, - handlerSaveFormConf() { - this.formConfVisible = false; - }, - handlerRollBack(rowItem, oldIndex) { - //杩樺師 - this.list.splice(oldIndex, 0, rowItem); - }, - handlerSetJson() { - this.$emit("updateJSON", this.viewCode); - this.JSONVisible = false; - }, - }, - computed: { - infoShow() { - return this.list.length < 1; - }, - code() { - let json = {}; - json.config = this.formConf; - json.list = this.list; - return JSON.stringify(json, null, 4); - }, - }, - watch: { - activeItem(newValue, oldValue) { - this.lastActiveItem = oldValue; - }, - }, -}; -</script> -<style scoped> -.el-rate { - display: inline-block; -} -.center-scrollbar >>> .el-scrollbar__bar.is-horizontal { - display: none; -} -.center-scrollbar >>> .el-scrollbar__wrap { - overflow-x: hidden; -} -.empty-info >>> .el-empty__description p { - color: #ccb1ea; - font-size: 16px; -} -.drawing-board >>> .el-radio.is-bordered + .el-radio.is-bordered { - margin-left: 0px; -} -.drawing-board >>> .el-checkbox.is-bordered + .el-checkbox.is-bordered { - margin-left: 0px; -} -</style> -<style lang="less"> -@import "./style/designer.less"; -</style> -<style> -@import "./style/designer.css"; -</style> \ No newline at end of file diff --git a/sample-form-client-ui/admin/src/components/formDes/dynamic/dynamicTable.vue b/sample-form-client-ui/admin/src/components/formDes/dynamic/dynamicTable.vue deleted file mode 100644 index 3311e6965722206e8878aa4e6d7ef5d5f2fd518d..0000000000000000000000000000000000000000 --- a/sample-form-client-ui/admin/src/components/formDes/dynamic/dynamicTable.vue +++ /dev/null @@ -1,28 +0,0 @@ -<!--鍔ㄦ€佽〃鍗曪紙璁捐鍣級--> -<template> - - <div class="dynamic-table"> - <slot> - </slot> - </div> - -</template> -<script> -export default { - name:'dynamicTable', - props:['conf','activeItem'], - data(){ - return { - test1:'', - list:[] - } - }, - components:{ - }, - methods:{ - } -} -</script> -<style> - -</style> \ No newline at end of file diff --git a/sample-form-client-ui/admin/src/components/formDes/dynamic/dynamicTableItem.vue b/sample-form-client-ui/admin/src/components/formDes/dynamic/dynamicTableItem.vue deleted file mode 100644 index aa439f7e3bcaaa09ce31dbad16988371d6ee813c..0000000000000000000000000000000000000000 --- a/sample-form-client-ui/admin/src/components/formDes/dynamic/dynamicTableItem.vue +++ /dev/null @@ -1,137 +0,0 @@ -<!--鍔ㄦ€佽〃鍗曪紙璁捐鍣級--> -<script> -import draggable from "vuedraggable"; -import render from "../custom/render"; - -const colItem = function (h, element) { - const { selectItem, copyItem, deleteItem } = this.$listeners; - return ( - <div - class={{ - "dynamic-table__item": true, - active: this.isHover || this.isActive, - }} - style="min-width:200px;width: auto;position:relative" - onClick={(e) => { - selectItem(e, element); - }} - onMouseover={() => { - this.isHover = true; - }} - onMouseleave={() => { - this.isHover = false; - }} - > - <div class="dynamic-table__item_title">{element.label}</div> - <div class="dynamic-table__item_body"> - <render conf={element} /> - <span v-show={element.required} style="color:#F56C6C"> - * - </span> - </div> - <span - class="dynamic-table-item-copy" - title="澶嶅埗" - v-show={this.showbutton} - onClick={(e) => { - copyItem(e, element); - }} - > - <i class="el-icon-copy-document" /> - </span> - <span - class="dynamic-table-item-delete" - title="鍒犻櫎" - v-show={this.showbutton} - onClick={(e) => { - deleteItem(e, element); - }} - > - <i class="el-icon-delete" /> - </span> - </div> - ); -}; - -export default { - name: "dynamicTableItem", - props: ["item", "activeItem"], - data() { - return { - isActive: false, - isHover: false, - }; - }, - components: { - draggable, - render, - }, - methods: { - handlerCopy(evt) { - this.$emit("copy", evt, this.item); - }, - handlerDelete(evt) { - this.$emit("delete", evt, this.item); - }, - }, - watch: { - activeItem(newvalue) { - this.isActive = newvalue.id === this.item.id ? true : false; - }, - }, - computed: { - showbutton() { - return this.isActive || this.isHover; - }, - }, - render: function (h) { - return colItem.call(this, h, this.item); - }, -}; -</script> -<style lang="less" scoped> -@lighterBlue: #409eff; -.active { - background: #e6f2ff; -} -.dynamic-table-item-copy { - position: absolute; - width: 22px; - height: 22px; - top: 0px; - right: 30px; - border: 1px solid; - border-radius: 50%; - cursor: pointer; - font-size: 12px; - line-height: 22px; - text-align: center; - color: @lighterBlue; - background: #fff; - z-index: 2; -} -.dynamic-table-item-copy:hover { - color: #fff; - background: @lighterBlue; -} -.dynamic-table-item-delete { - position: absolute; - width: 22px; - height: 22px; - top: 0px; - right: 0px; - border: 1px solid; - border-radius: 50%; - cursor: pointer; - font-size: 12px; - line-height: 22px; - text-align: center; - color: #f56c6c; - background: #fff; - z-index: 2; -} -.dynamic-table-item-delete:hover { - color: #fff; - background: #f56c6c; -} -</style> diff --git a/sample-form-client-ui/admin/src/components/formDes/dynamic/dynamicTableOptButton.vue b/sample-form-client-ui/admin/src/components/formDes/dynamic/dynamicTableOptButton.vue deleted file mode 100644 index a048c5b7877369bef378a450a45ac406f5569877..0000000000000000000000000000000000000000 --- a/sample-form-client-ui/admin/src/components/formDes/dynamic/dynamicTableOptButton.vue +++ /dev/null @@ -1,29 +0,0 @@ -<!--鎿嶄綔鍖哄煙锛屽垹闄ゅ拰澶嶅埗锛屾柊澧炪€佸簭鍙凤紝闆嗘垚鍦ㄤ竴涓枃浠朵腑--> -<template> - <div class="dynamic-table__item_opt" style="width: 100%;" > - <div class="dynamic-table__item_title"> - 鎿嶄綔 - </div> - <div class="dynamic-table__item_body" style="text-align:center"> - <i class="el-icon-document-copy" style="margin:2px"></i> - <i class="el-icon-delete" style="margin:2px"></i> - </div> - </div> -</template> -<script> -export default { - name:'dynamicTableOptButton', - props:['type'], - data(){ - return{ - - } - } -} -</script> -<style scoped> - -.dynamic-table__item_opt{ - padding-top:5px; -} -</style> diff --git a/sample-form-client-ui/admin/src/components/formDes/dynamic/fancyDynamicTable.vue b/sample-form-client-ui/admin/src/components/formDes/dynamic/fancyDynamicTable.vue deleted file mode 100644 index 5c866aafa165b6d06ede52fd6b60facdc28c8f6b..0000000000000000000000000000000000000000 --- a/sample-form-client-ui/admin/src/components/formDes/dynamic/fancyDynamicTable.vue +++ /dev/null @@ -1,181 +0,0 @@ -<!--鍔ㄦ€佽〃鍗曪紙璁捐鍣級--> -<template> - <div class="fancyDynamicTable"> - <el-table - :data="tableData" - :fit="true" - border - :ref="conf.id" - size="mini" - :cell-style="{ padding: '5px 0' }" - :header-cell-style="{ background: '#F5F7FA' }" - style="width: 100%" - :row-class-name="tableRowClassName" - @selection-change="handlerSelectionChange" - :show-summary="conf['show-summary']" - :summary-method="sumTotal" - > - <el-table-column - align="center" - type="selection" - width="35px" - v-if="conf.multiCheck" - fixed="left" - /> - <el-table-column - align="center" - type="index" - label="搴忓彿" - width="50px" - v-if="conf.showIndex" - fixed="left" - /> - <el-table-column - align="center" - :prop="item.id" - v-for="(item, index) in conf.columns" - :key="index" - > - <template slot="header"> - {{ tableColumnLabels[index] }} - </template> - <template slot-scope="scope"> - <slot name="item" :rowScope="scope" :item="item"></slot> - </template> - </el-table-column> - <el-table-column - align="center" - label="鎿嶄綔" - width="100px" - v-if="conf.buttonDel" - fixed="right" - > - <template slot-scope="scope"> - <el-form-item label-width="0px" style="margin: 10px 3px 15px 3px"> - <i - class="el-icon-delete optIcon" - style="" - @click="handlerDelete(scope, conf)" - ></i> - </el-form-item> - </template> - </el-table-column> - </el-table> - <div class="column-buttons"> - <i - class="el-icon-circle-plus-outline optIcon button-plus" - v-if="conf.buttonAdd" - @click="handlerAdd(conf)" - /> - <i - class="el-icon-remove-outline optIcon button-plus" - v-if="BachDeleteButtonShow(conf.id)" - @click="handlerBachDelete" - /> - </div> - </div> -</template> -<script> -export default { - name: "fancyDynamicTable", - props: ["data", "conf"], - data() { - return { - tableData: this.data, - tableColumns: [], - tableColumnLabels: [], - multipleSelection: [], - componentsMount: false, - }; - }, - mounted() { - this.conf.columns.forEach((element) => { - this.tableColumnLabels.push(element.label); - let tableCol = {}; - Object.assign(tableCol, element); - this.tableColumns.push(tableCol); - }); - this.componentsMount = true; - }, - components: {}, - methods: { - handlerAdd(origin) { - this.$emit("addRow", origin); - }, - handlerDelete(scope, element) { - this.$emit("deleteRow", scope, element); - }, - handlerBachDelete() { - this.$confirm("纭鍒犻櫎閫変腑鐨勬暟鎹�?").then(() => { - const indexs = []; - this.multipleSelection.forEach((item) => indexs.push(item.index)); - this.$emit("batchDeleteRow", indexs, this.conf); - }); - }, - handlerSelectionChange(val) { - this.multipleSelection = val; - }, - tableRowClassName(row) { - row.row.index = row.rowIndex; - }, - sumTotal(param) { - const { columns, data } = param; - const sums = []; - columns.forEach((column, index) => { - if (index === 0) { - sums[index] = this.conf["sum-text"]; - return; - } - const values = data.map((item) => Number(item[column.property])); - if (!values.every((value) => isNaN(value))) { - sums[index] = values.reduce((prev, curr) => { - const value = Number(curr); - if (!isNaN(value)) { - return prev + curr; - } else { - return prev; - } - }, 0); - sums[index] += " " + this.conf["summary-text"]; - } else { - sums[index] = ""; - } - }); - - return sums; - }, - }, - computed: { - BachDeleteButtonShow() { - return function (id) { - if (this.componentsMount) { - return this.conf.multiCheck && this.$refs[id].selection.length > 0; - } - }; - }, - }, -}; -</script> -<style scoped> -.fancyDynamicTable { - width: 100%; - padding: 10px; -} -.column-buttons { - padding: 5px 0 5px 0; - text-align: center; - background-color: #f6f6f6; -} -.optIcon { - font-size: 18px; - margin-right: 5px; - cursor: pointer; -} -.button-plus { - font-size: 30px; - margin-right: 10px; -} -.button-plus:hover { - color: #000000; -} -</style> \ No newline at end of file diff --git a/sample-form-client-ui/admin/src/components/formDes/dynamic/fancyDynamicTableItem.vue b/sample-form-client-ui/admin/src/components/formDes/dynamic/fancyDynamicTableItem.vue deleted file mode 100644 index 9db75661e9674c4d29c446b7f06398c674c60fbe..0000000000000000000000000000000000000000 --- a/sample-form-client-ui/admin/src/components/formDes/dynamic/fancyDynamicTableItem.vue +++ /dev/null @@ -1,71 +0,0 @@ -<script> -import render from "../custom/previewRender"; -import checkRules from "../custom/rule"; -const layouts = { - colItem(element, value, parent, index) { - const { valChange } = this.$listeners; - let rules = []; - if (element && element.rules) { - rules = rules.concat(checkRules(element)); - return ( - <el-form-item - label={""} - label-width={"0px"} - prop={parent.id + "." + index + "." + element.id} - rules={rules} - > - <render - key={element.id} - conf={element} - value={value} - onInput={(event) => { - this.eleValue = event; - valChange( - this.eleParent.id, - this.index, - element.id, - this.eleValue - ); - }} - /> - {element.required ? <span style="color:#F56C6C">*</span> : ""} - </el-form-item> - ); - } - }, -}; - -export default { - name: "fancyDynamicTableItem", - components: { - render, - }, - props: ["model", "value", "parent", "index"], - mounted() { - let __eleConfig = {}; - Object.assign(__eleConfig, this.model); - this.eleConfig = __eleConfig; - }, - data() { - return { - eleConfig: {}, - eleParent: this.parent, - eleValue: this.value, - }; - }, - render() { - return layouts.colItem.call( - this, - this.eleConfig, - this.eleValue, - this.eleParent, - this.index - ); - }, - watch: { - value(newVal) { - this.eleValue = newVal; - }, - }, -}; -</script> \ No newline at end of file diff --git a/sample-form-client-ui/admin/src/components/formDes/dynamic/fancyDynamicTableViewItem.vue b/sample-form-client-ui/admin/src/components/formDes/dynamic/fancyDynamicTableViewItem.vue deleted file mode 100644 index e518b439e2876c0fa95120e8371456b0346f4cce..0000000000000000000000000000000000000000 --- a/sample-form-client-ui/admin/src/components/formDes/dynamic/fancyDynamicTableViewItem.vue +++ /dev/null @@ -1,46 +0,0 @@ -<script> -import render from "../custom/viewRender"; -const layouts = { - colItem(h, element, value) { - element.disabled = true; - // let labelWidth = element.labelWidth ? `${element.labelWidth}px` : null - if (element.viewType === "component") { - return ( - <render - key={element.id} - conf={element} - value={value} - onInput={(event) => { - this.$set(element, "value", event); - }} - /> - ); - } else if (element.viewType === "html") { - return <fancy-html text={value} />; - } else { - return <fancy-text text={value} align="center" />; - } - }, -}; - -export default { - name: "fancyDynamicTableViewItem", - components: { - render, - }, - props: ["model", "value"], - data() { - return { - eleConfig: this.model, - }; - }, - render(h) { - return layouts.colItem.call(this, h, this.eleConfig, this.value); - }, -}; -</script> -<style> -/* .el-form-item__label{ - font-weight: 600; -} */ -</style> \ No newline at end of file diff --git a/sample-form-client-ui/admin/src/components/formDes/dynamic/fancyDynamicViewTable.vue b/sample-form-client-ui/admin/src/components/formDes/dynamic/fancyDynamicViewTable.vue deleted file mode 100644 index 732bdab95a7d7174c403b296ec3649c82fbd42b6..0000000000000000000000000000000000000000 --- a/sample-form-client-ui/admin/src/components/formDes/dynamic/fancyDynamicViewTable.vue +++ /dev/null @@ -1,88 +0,0 @@ -<!--鍔ㄦ€佽〃鍗曪紙璁捐鍣級--> -<template> -<div class="fancyDynamicTable"> - <el-table - :data="data" - :fit="true" - border - size="mini" - :cell-style="{padding:'5px 0'}" - :header-cell-style="{background:'#F5F7FA'}" - :show-summary="conf['show-summary']" - :summary-method="sumTotal" - style="width: 100%"> - <el-table-column align="center" type="index" label="搴忓彿" width="50px" v-if="conf.showIndex" fixed="left"/> - <el-table-column align="center" :prop="item.id" v-for="(item,index) in conf.columns" :key="index" min-width="150px;"> - <template slot="header"> - {{tableColumnLables[index]}} - </template> - <template slot-scope="scope"> - <slot name="item" :rowScope="scope" :item="item"></slot> - </template> - </el-table-column> - </el-table> -</div> -</template> -<script> -export default { - name:'fancyDynamicViewTable', - props:['data','conf'], - data(){ - return { - tableColumns:[], - tableColumnLables:[] - } - }, - mounted(){ - this.conf.columns.forEach(element =>{ - this.tableColumnLables.push(element.label); - let tableCol = {}; - Object.assign(tableCol,element); - this.tableColumns.push(tableCol); - }); - }, - methods:{ - sumTotal(param){ - const { columns, data } = param; - const sums = []; - columns.forEach((column, index) => { - if (index === 0) { - sums[index] = this.conf['sum-text']; - return; - } - const values = data.map(item => Number(item[column.property])); - if (!values.every(value => isNaN(value))) { - sums[index] = values.reduce((prev, curr) => { - const value = Number(curr); - if (!isNaN(value)) { - return prev + curr; - } else { - return prev; - } - }, 0); - sums[index] += ' '+this.conf['summary-text']; - } else { - sums[index] = ''; - } - }); - - return sums; - } - } -} -</script> -<style scoped> -.fancyDynamicTable{ - widows: 100%; - padding:10px; -} -.column-buttons{ - margin-top:15px; - text-align: center; -} -.optIcon{ - font-size:18px; - margin-right:5px; - cursor: pointer; -} -</style> \ No newline at end of file diff --git a/sample-form-client-ui/admin/src/components/formDes/extend/fancyDialogList.vue b/sample-form-client-ui/admin/src/components/formDes/extend/fancyDialogList.vue deleted file mode 100644 index f2cba248a6cbaf436c42794d26029456a9ae8fac..0000000000000000000000000000000000000000 --- a/sample-form-client-ui/admin/src/components/formDes/extend/fancyDialogList.vue +++ /dev/null @@ -1,258 +0,0 @@ -<!--鏂囨湰鎵╁睍--> -<template> - <div class="dialog-list"> - <el-input v-model="dialogValue" readonly @click.native="handlerShowDialog" :disabled="disabled" style="width:95%" suffix-icon="el-icon-search"></el-input> - <el-dialog - :visible.sync="dialogVisible" - :title="title" - width="60%" - center - :append-to-body="true" - :show-close="true" - :lock-scroll="true" - @open="show()" - :destroy-on-close="true" - top="15px" - > - <!--鎼滅储鏆備笉鍚敤--> - <!-- <div class="search-text" v-show="searchable"> - <el-input v-model="searchText" placeholder="璇疯緭鍏ョ瓫閫夊唴瀹�" size="mini" suffix-icon="el-icon-search" clearable style="width:30%"></el-input> - </div> --> - <el-table - ref="dataTable" - :data="filterGridData" - border - :row-class-name="tableRowClassName" - :row-style="{height: '10px'}" - :cell-style="{padding: '5px 0'}" - :header-cell-style="{ - 'background-color': '#fafafa', - 'border-bottom': '1px #e6f7ff solid' - }" - :highlight-current-row="!multi" - :max-height="height" - @row-dblclick="handlerRowDoubleClick" - @current-change="handleCurrentChange" - @selection-change="handleSelectionChange" - > - <el-table-column type="selection" width="55" v-if="multi"></el-table-column> - <el-table-column type="index" v-if="showIndex" align="center"></el-table-column> - <el-table-column :property="item.property" :label="item.label" :width="item.width" align="center" :key="index" v-for="(item,index) in jsonColConf"/> - </el-table> - <span slot="footer" class="dialog-footer"> - <el-button type="primary" @click="handlerSelect">纭� 瀹�</el-button> - <el-button @click="handlerHideDialog">鍙� 娑�</el-button> - </span> - </el-dialog> - </div> - -</template> - -<script> -const splitKey = ";"; -export default { - name:"fancyDialogList", - props:{ - value: { - type: String, - default:'' - }, - title:{ - type:String, - default:'璇烽€夋嫨' - }, - multi:{ - type:Boolean, - default:false - }, - disabled:{ - type:Boolean, - default:false - }, - showIndex:{ //鏄剧ず搴忓彿 - type:Boolean, - default:false - }, - action:{ - type:String, - default:'' - }, - height:{ - type:Number, - default:600 - }, - colConf:{ - type:String, - default:'' - }, - dval:{ - type:String, - default:'id' - }, - dlabel:{ - type:String, - default:'name' - } - }, - data() { - return { - currentRow: null, - dialogValue:'', - dialogVisible:false, - gridData: [] - } - }, - mounted(){ - this.$nextTick(() => { - this.$axios.get(this.action).then(res => { - this.gridData = []; - this.gridData = this.gridData.concat(res.data.list); - if(this.value !=='' && this.dialogValue ===''){ - if(this.multi){ - const ids = this.value.split(splitKey); - this.currentRow = []; - ids.forEach(e=>{ - const index = this.gridData.findIndex(element=>(element[this.dval]+"") == e); - if(index>0){ - const row = this.gridData[index]; - this.currentRow.push(row); - } - }) - this.dialogValue = this.selectName; - }else{ - const index = this.gridData.findIndex(element=>element[this.dval] == this.value); - if(index>0){ - const row = this.gridData[index]; - this.dialogValue = row[this.dlabel]; - } - } - - } - }) - }) - }, - methods:{ - handlerShowDialog(){ - if(this.disabled) return; - this.dialogVisible = true; - }, - handleClose(){ - - }, - tableRowClassName(v){ - if(v.rowIndex%2 ==1){ - return 'odd-row'; - } - return ''; - }, - handleCurrentChange(val) { - if(!this.multi){ - this.currentRow = val; - } - }, - - handlerRowDoubleClick(val){ - if(!this.multi){ - this.currentRow = val; - this.handlerSelect(); - } - }, - handleSelectionChange(val){ - this.currentRow = val; - }, - handlerSelect(){ - this.dialogVisible = false; - let dialogVal = ''; - let dialogId = ''; - dialogVal = this.selectName; - dialogId = this.selectId; - this.dialogValue = dialogVal; - this.$emit('input',dialogId+''); - }, - handlerHideDialog(){ - this.dialogVisible = false; - this.dialogValue = ''; - this.$emit('input',''); - }, - setDialogValue(){ - if(this.multi){ - const ids = this.value.split(splitKey); - this.currentRow = []; - ids.forEach(e=>{ - const index = this.gridData.findIndex(element=>element[this.dval] == e); - if(index>0){ - const row = this.gridData[index]; - this.$refs.dataTable.toggleRowSelection(row); - } - }) - }else{ - const index = this.gridData.findIndex(element=>element[this.dval] == this.value); - const row = this.gridData[index]; - this.$refs.dataTable.setCurrentRow(row); - } - - }, - show(){ - this.$nextTick(() => { - this.setDialogValue(); - }) - } - }, - computed:{ - jsonColConf(){ - return JSON.parse(this.colConf); - }, - selectName(){ - if(this.currentRow == null){ - return ''; - } - if(this.multi){ - let names = ''; - this.currentRow.forEach(element=>{ - names = names+splitKey+element[this.dlabel]; - }) - if(names.length>0){ - names = names.substring(1); - } - return names; - }else{ - return this.currentRow[this.dlabel]; - } - }, - selectId(){ - if(this.currentRow == null){ - return ''; - } - if(this.multi){ - let ids = ''; - this.currentRow.forEach(element=>{ - ids = ids+splitKey+element[this.dval]; - }) - if(ids.length>0){ - ids = ids.substring(1); - } - return ids; - }else{ - return this.currentRow[this.dval]; - } - }, - filterGridData(){ - return this.gridData; - } - } -} -</script> -<style scoped> -/**#e6f7ff; */ -.dialog-list >>>.el-table--enable-row-hover .el-table__body tr:hover>td{ - background-color: #d1dfd5 -} -.search-text{ - margin-bottom: 10px; -} -</style> -<style> -.el-table .odd-row { - background-color:#FAFAFA; -} -</style> \ No newline at end of file diff --git a/sample-form-client-ui/admin/src/components/formDes/extend/fancyEditor.vue b/sample-form-client-ui/admin/src/components/formDes/extend/fancyEditor.vue deleted file mode 100644 index 6636bd1a725d6f4400d5425d00bfed94dd490d9b..0000000000000000000000000000000000000000 --- a/sample-form-client-ui/admin/src/components/formDes/extend/fancyEditor.vue +++ /dev/null @@ -1,108 +0,0 @@ -<template> - <div class="edit_container" :class="{ warn_edit_container: warnTextLength }"> - <quill-editor - v-model="content" - ref="myQuillEditor" - :options="editorOption" - @blur="onEditorBlur($event)" - @focus="onEditorFocus($event)" - @change="onEditorChange($event)" - > - </quill-editor> - <div - class="text_number_tips" - :class="{ warn_text_number_tips: warnTextLength }" - > - {{ currentLength }}/{{ maxTextLength }} - </div> - </div> -</template> - -<script> -import "quill/dist/quill.core.css"; -import "quill/dist/quill.snow.css"; -import "quill/dist/quill.bubble.css"; -import { quillEditor } from "vue-quill-editor"; -export default { - components: { - quillEditor, - }, - props: { - value: { - type: String, - default: "", - }, - max: { - type: Number, - default: 0, - }, - validateMaxText: { - type: Boolean, - default: false, - }, - id: { - type: String, - default: "", - }, - }, - data() { - return { - content: this.value, - currentLength: 0, - defaultMaxLength: 2000, - editorOption: {}, - }; - }, - methods: { - onEditorBlur(editor) { - return editor; - }, // 澶卞幓鐒︾偣浜嬩欢 - onEditorFocus(v) { - return v; - }, // 鑾峰緱鐒︾偣浜嬩欢 - onEditorChange(v) { - this.currentLength = v.text.length - 1; - this.$emit("input", this.content); - }, // 鍐呭鏀瑰彉浜嬩欢 - }, - computed: { - editor() { - return this.$refs.myQuillEditor.quill; - }, - maxTextLength() { - let len = this.defaultMaxLength; - if (this.max >= 1) { - len = this.max; - } - return len; - }, - warnTextLength() { - const warn = - this.validateMaxText && this.currentLength > this.maxTextLength; - return warn; - }, - }, - watch: { - value(newVal) { - this.content = newVal; - }, - }, -}; -</script> - -<style> -.ql-editor { - height: 400px; -} -.edit_container .text_number_tips { - float: right; - margin-top: -30px; - padding-right: 10px; -} -.warn_edit_container { - border: solid 1px #f56c6c; -} -.warn_text_number_tips { - color: #f56c6c; -} -</style> \ No newline at end of file diff --git a/sample-form-client-ui/admin/src/components/formDes/extend/fancyHtml.vue b/sample-form-client-ui/admin/src/components/formDes/extend/fancyHtml.vue deleted file mode 100644 index 80141ea58f425c306732c991943681f2ab1933d8..0000000000000000000000000000000000000000 --- a/sample-form-client-ui/admin/src/components/formDes/extend/fancyHtml.vue +++ /dev/null @@ -1,24 +0,0 @@ -<!--搴熷純--> -<!--鏂囨湰鎵╁睍--> -<template> - <div v-if="show"> - <p v-html="text"/> - </div> - -</template> - -<script> -export default { - name:"fancyHtml", - props:{ - text: { - type: String, - default:'' - }, - show:{ - type:Boolean, - default:true - } - } -} -</script> diff --git a/sample-form-client-ui/admin/src/components/formDes/extend/fancyText.vue b/sample-form-client-ui/admin/src/components/formDes/extend/fancyText.vue deleted file mode 100644 index 0222e095e1c90baefa8446d94656b0044de8cbc3..0000000000000000000000000000000000000000 --- a/sample-form-client-ui/admin/src/components/formDes/extend/fancyText.vue +++ /dev/null @@ -1,51 +0,0 @@ -<!--鏂囨湰鎵╁睍--> -<template> - <div v-show="show" class="test"> - <p v-html="text" style="margin-block-start:0em;margin-block-end:0em;" - :style="{'text-align':align, - 'color':color, - 'font-size':size+'px', - 'font-weight':bold - }"/> - </div> - -</template> - -<script> -export default { - name:"fancyText", - props:{ - text: { - type: String, - default:'' - }, - show:{ - type:Boolean, - default:true - }, - align:{ - type:String, - default:'left' - }, - color:{ - type:String, - default:'' - }, - size:{ - type:Number, - default:14, - }, - bold:{ - type:Number, - default:400, - } - }, - data(){ - return { - htmlText:'' - } - } -} -</script> -<style> -</style> diff --git a/sample-form-client-ui/admin/src/components/formDes/formBuilder.vue b/sample-form-client-ui/admin/src/components/formDes/formBuilder.vue deleted file mode 100644 index e921ddde98a2a8f9df81d1322a511c9b97ba602e..0000000000000000000000000000000000000000 --- a/sample-form-client-ui/admin/src/components/formDes/formBuilder.vue +++ /dev/null @@ -1,285 +0,0 @@ -<template> - <div> - <el-row :gutter="formConf.gutter" class="form-builder"> - <el-form - :rules="rules" - :ref="formConf.formModel" - :size="formConf.size" - :model="buildData.form" - :label-position="formConf.labelPosition" - :disabled="formConf.disabled" - :validate-on-rule-change="false" - :label-width="formConf.labelWidth + 'px'" - > - <template v-for="(element, index) in itemList"> - <preview-row-item - v-if="element.compType === 'row'" - :key="'row-' + index" - :model="element" - > - <el-col - v-for="column in element.columns" - :key="column.index" - :span="column.span" - > - <template v-for="(col, i) in column.list"> - <preview-item - v-if="col.compType !== 'dynamicTable'" - :key="col.id" - :model="col" - v-model="buildData.form[col.id]" - @valChange="handlerValChange" - /> - <fancy-dynamic-table - v-else-if="col.compType === 'dynamicTable'" - ref="dynamicTable" - :key="'dynamic-' + i" - :data="form[col.id]" - :conf="col" - @addRow="handlerAddRow" - @deleteRow="handlerDeleteRow" - > - <template v-slot:item="{ rowScope, item }"> - <fancy-dynamic-table-item - :model="item" - :parent="col" - :key="'tableIndex-' + rowScope.$index" - :index="rowScope.$index" - v-model="rowScope.row[item.id]" - @valChange="handlerDynamicValChange" - /> - </template> - </fancy-dynamic-table> - </template> - </el-col> - </preview-row-item> - <fancy-dynamic-table - v-else-if="element.compType === 'dynamicTable'" - :key="'dynamic-' + index" - :data="buildData.form[element.id]" - :ref="element.id" - :conf="element" - @addRow="handlerAddRow" - @deleteRow="handlerDeleteRow" - > - <template v-slot:item="{ rowScope, item }"> - <fancy-dynamic-table-item - :model="item" - :ref="item.id + rowScope.$index" - :parent="element" - :key="'tableIndex-' + rowScope.$index" - :index="rowScope.$index" - v-model="rowScope.row[item.id]" - @valChange="handlerDynamicValChange" - /> - </template> - </fancy-dynamic-table> - <fancy-edit-table - v-else-if="element.compType === 'table'" - :key="'table_' + index" - :layoutArray="element.layoutArray" - :tdStyle="element.tdStyle" - :width="element.width" - :height="element.height" - > - <template v-slot="{ td }"> - <template v-for="col in td.columns"> - <preview-item - v-if="col.compType !== 'dynamicTable'" - :key="col.id" - :model="col" - v-model="buildData.form[col.id]" - @valChange="handlerValChange" - /> - </template> - </template> - </fancy-edit-table> - <!--item--> - - <el-col - class="drag-col-wrapper" - :key="index" - :span="element.span" - v-else - > - <preview-item - :model="element" - v-model="buildData.form[element.id]" - @valChange="handlerValChange" - /> - </el-col> - </template> - </el-form> - </el-row> - </div> -</template> -<script> -import previewItem from "./previewItem"; -import previewRowItem from "./previewRowItem"; -import fancyDynamicTable from "./dynamic/fancyDynamicTable"; -import fancyDynamicTableItem from "./dynamic/fancyDynamicTableItem"; -import { datas, addRow, deleteRow, fillDatas } from "./custom/formDraw"; -import fancyEditTable from "./table/fancyEditTable"; -export default { - name: "formBuilder", - props: { - value: { - type: String, - default: "", - }, - buildData: { - type: Object, - default: () => { - return {}; - }, - }, - disabled: { - type: Boolean, - default: false, - }, - }, - components: { - previewItem, - previewRowItem, - fancyDynamicTable, - fancyDynamicTableItem, - fancyEditTable, - }, - data() { - return { - form: {}, - rules: {}, - currentIndex: -1, - }; - }, - mounted() { - this.$nextTick(() => { - if (this.value !== "") { - const jsonValue = JSON.parse(this.value); - this.handlerFillDatas(jsonValue); - } - }); - }, - methods: { - handlerValChange(key, origin) { - this.$set(this.buildData.form, key, origin); - }, - handlerDynamicValChange(parentId, index, key, origin) { - this.$set(this.buildData.form[parentId][index], key, origin); - this.currentIndex = index; - }, - validate() { - let bool; - this.$refs[this.formConf.formModel].validate((valid) => { - bool = valid; - }); - return bool; - }, - handlerAddRow: addRow, - handlerDeleteRow: deleteRow, - handlerInitDatas: datas, - handlerFillDatas: fillDatas, - }, - created() { - console.log(this.buildData); - this.handlerInitDatas(); - }, - computed: { - itemList() { - return this.buildData.formContent.list; - // if (this.buildData !== "") { - // const buildData = JSON.parse(this.buildData); - // return buildData.list; - // } else { - // return []; - // } - }, - formConf() { - return this.buildData.formContent.config; - // if (this.buildData !== "") { - // const buildData = JSON.parse(this.buildData); - // buildData.config.disabled = this.disabled; - // return buildData.config; - // } else { - // return {}; - // } - }, - }, -}; -</script> - -<style lang="less" scoped> -// /deep/.el-form-item__label { -// font-size: 22px; -// font-family: Source Han Sans CN; -// color: #555555; -// } -// /deep/.el-radio__label { -// font-size: 22px; -// font-family: Source Han Sans CN; -// color: #333333; -// } -// /deep/.el-radio__inner { -// width: 24px; -// height: 24px; -// &::after { -// width: 10px; -// height: 10px; -// } -// } - -// /deep/.el-table__cell { -// color: #333333; -// } - -// /deep/.el-checkbox__inner { -// width: 24px; -// height: 24px; -// &::after { -// height: 12px; -// width: 6px; -// border-width: 2px; -// left: 7px; -// } -// } -// /deep/.el-input__icon { -// font-size: 22px; -// } -// /deep/.el-checkbox__label { -// font-size: 22px; -// color: #333333; -// } -// /deep/.el-input__inner { -// height: 54px; -// background: #f1f7fd; -// border-radius: 8px; -// font-size: 22px; -// color: #333333; -// } -// /deep/.el-textarea__inner { -// background: #f1f7fd; -// border-radius: 8px; -// font-size: 22px; -// color: #333333; -// } -.preview-board { - border: 1px dashed #ccc; -} -.form-builder { - width: 100%; -} -/deep/.el-date-editor.el-input { - width: 100%; -} -/deep/.el-form-item { - margin-left: 10px; - margin-right: 10px; - margin-bottom: 20px; -} -.form-builder .el-radio.is-bordered + .el-radio.is-bordered { - margin-left: 0px; -} -.form-builder .el-checkbox.is-bordered + .el-checkbox.is-bordered { - margin-left: 0px; -} -</style> \ No newline at end of file diff --git a/sample-form-client-ui/admin/src/components/formDes/formDesigner.vue b/sample-form-client-ui/admin/src/components/formDes/formDesigner.vue deleted file mode 100644 index 8ac61d6d267e34ff2e7677cabdc07581be6f5789..0000000000000000000000000000000000000000 --- a/sample-form-client-ui/admin/src/components/formDes/formDesigner.vue +++ /dev/null @@ -1,220 +0,0 @@ -<template> - <div class="container"> - <div class="left-board"> - <div class="d-logo-wrapper"> - <div class="d-logo">Form designer</div> - </div> - - <el-scrollbar class="left-scrollbar"> - <!--宸︿晶缁勪欢鍒楄〃--> - <div class="components-list"> - <div class="components-title">甯哥敤缁勪欢</div> - <draggable - class="components-draggable" - :list="formItems" - :group="{ name: 'componentsGroup', pull: 'clone', put: false }" - :clone="cloneComponent" - draggable=".components-item" - :sort="false" - @start="onStart" - @end="onEnd" - > - <div - v-for="(element, index) in formItems" - :key="index" - class="components-item" - @click="addComponent(element)" - > - <div - class="components-body" - :class="{ 'dynamicTable-tips': dynamicTableExist(element) }" - > - <icon :code="element.compIcon" :text="element.compName" /> - </div> - </div> - </draggable> - <div class="components-title">甯冨眬缁勪欢</div> - <draggable - class="components-draggable" - :list="layoutFormItems" - :group="{ name: 'componentsGroup', pull: 'clone', put: false }" - :clone="cloneComponent" - draggable=".components-item" - :sort="false" - @start="onStart" - @end="onEnd" - > - <div - v-for="(element, index) in layoutFormItems" - :key="index" - class="components-item" - @click="addComponent(element)" - > - <div class="components-body"> - <icon :code="element.compIcon" :text="element.compName" /> - </div> - </div> - </draggable> - <div class="components-title">杈呭姪缁勪欢</div> - <draggable - class="components-draggable" - :list="assistFormItems" - :group="{ name: 'componentsGroup', pull: 'clone', put: false }" - :clone="cloneComponent" - draggable=".components-item" - :sort="false" - @start="onStart" - @end="onEnd" - > - <div - v-for="(element, index) in assistFormItems" - :key="index" - class="components-item" - @click="addComponent(element)" - > - <div class="components-body"> - <icon :code="element.compIcon" :text="element.compName" /> - </div> - </div> - </draggable> - </div> - </el-scrollbar> - </div> - <designer - ref="designer" - :list="designList" - :formConfig="formConfig" - @clear="designList = []" - @updateJSON="handlerUpdateJSON" - :activeData="activeData" - /> - </div> -</template> -<script> -/** - * 1.0鐗堟湰 - */ -import draggable from "vuedraggable"; -import { formItems, assistFormItems, layoutFormItems } from "./custom/itemList"; -import designer from "./designer"; -import icon from "./icon"; -import { getSimpleId, setTableId } from "./utils/IdGenerate"; -import formConf from "./custom/formConf"; -import { dynamicTableAllowedItems } from "./custom/formConf"; -let tempActiveData; - -export default { - name: "formDesigner", - components: { - draggable, - icon, - designer, - }, - data() { - return { - formItems: formItems, - assistFormItems: assistFormItems, - layoutFormItems: layoutFormItems, - designList: [], - activeData: {}, - formConfig: formConf, - }; - }, - props: { - value: { - type: String, - default: "", - }, - }, - mounted() {}, - methods: { - addComponent(element) { - return element; - }, - cloneComponent(origin) { - const clone = JSON.parse(JSON.stringify(origin)); - if (!clone.layout) clone.layout = "colItem"; - if (clone.layout === "colItem" || clone.layout === "dynamicItem") { - let uId = "fd_" + getSimpleId(); - clone.id = uId; - clone._id = uId; - tempActiveData = clone; - } else if (clone.layout === "rowItem") { - let uId = "row_" + getSimpleId(); - clone.id = uId; - clone._id = uId; - tempActiveData = clone; - } else if (clone.layout === "tableItem") { - let uId = "table_" + getSimpleId(); - clone.id = uId; - clone._id = uId; - //澧炲姞td榛樿鐨刬d - setTableId(clone); - tempActiveData = clone; - } - this.$refs.designer.activeItem = tempActiveData; - }, - onStart(obj) { - return obj; - }, - onEnd(obj) { - if (obj.from !== obj.to) { - this.activeData = tempActiveData; - this.$refs.designer.activeItem = this.activeData; - if (obj.to.className.indexOf("row-drag") < 0) { - this.designList.splice(obj.newIndex, 0, this.activeData); - } - } else { - this.$refs.designer.activeItem = {}; - } - }, - getFormData() { - return this.formData; - }, - handlerUpdateJSON(json) { - const jsonObject = JSON.parse(json); - this.designList = []; - this.designList = this.designList.concat(jsonObject.list); - }, - }, - computed: { - formData: function () { - const list = this.designList; - const config = this.formConfig; - let formData = {}; - formData.list = list; - formData.config = config; - console.log(formData); - return JSON.stringify(formData); - //this.$emit('input',JSON.stringify(formData)); - }, - dynamicTableExist() { - return function (element) { - return ( - this.formConfig.dynamicTableAllowed && - this.designList.filter((item) => item.compType === "dynamicTable") - .length > 0 && - dynamicTableAllowedItems.includes(element.compType) - ); - }; - }, - }, - watch: { - value(newVal) { - if (newVal !== "") { - const formData = JSON.parse(newVal); - this.designList = formData.list; - this.formConfig = formData.config; - } - }, - }, -}; -</script> -<style scoped> -.container { - padding: 0px; -} -.dynamicTable-tips { - border: 1px solid#F08080; -} -</style> \ No newline at end of file diff --git a/sample-form-client-ui/admin/src/components/formDes/formViewItem.vue b/sample-form-client-ui/admin/src/components/formDes/formViewItem.vue deleted file mode 100644 index 886016c93d5d65b21f87f62b616151330ca08303..0000000000000000000000000000000000000000 --- a/sample-form-client-ui/admin/src/components/formDes/formViewItem.vue +++ /dev/null @@ -1,77 +0,0 @@ -<script> -import render from "./custom/viewRender"; - -const layouts = { - colItem(h, element, value) { - element.disabled = true; - let labelWidth = element.labelWidth ? `${element.labelWidth}px` : null; - if (element.viewType === "component") { - return ( - <el-form-item - label={element.showLabel ? element.label : ""} - label-width={labelWidth} - prop={element.id} - > - <render - key={element.id} - conf={element} - value={value} - onInput={(event) => { - this.$set(element, "value", event); - }} - /> - </el-form-item> - ); - } else if (element.viewType === "html") { - return ( - <el-form-item - label={element.showLabel ? element.label : ""} - label-width={labelWidth} - prop={element.id} - > - <fancy-html text={value} /> - </el-form-item> - ); - } else { - if (typeof value === "object") { - value = value[0] + " " + element["range-separator"] + " " + value[1]; - } - return ( - <el-form-item - label={element.showLabel ? element.label : ""} - label-width={labelWidth} - prop={element.id} - > - {value} - </el-form-item> - ); - } - }, -}; - -export default { - name: "formViewItem", - components: { - render, - }, - props: ["model", "value"], - data() { - return { - eleConfig: this.model, - }; - }, - render(h) { - return layouts.colItem.call(this, h, this.eleConfig, this.value); - }, -}; -</script> -<style> -/* .el-form-item__label{ - font-weight: 600; -} */ -/* .el-form-item { - margin-left: 10px; - margin-right: 10px; - margin-bottom: 5px; -} */ -</style> \ No newline at end of file diff --git a/sample-form-client-ui/admin/src/components/formDes/formViewer.vue b/sample-form-client-ui/admin/src/components/formDes/formViewer.vue deleted file mode 100644 index 396bd2669606a408fea75e823b985bfcd1c28e3c..0000000000000000000000000000000000000000 --- a/sample-form-client-ui/admin/src/components/formDes/formViewer.vue +++ /dev/null @@ -1,503 +0,0 @@ -<!--琛ㄥ崟鏌ョ湅椤甸潰--> -<template> - <div class="form-viewer"> - <el-row :gutter="formConf.gutter"> - <el-form - :ref="formConf.formModel" - :size="formConf.size" - :model="form" - :label-position="formConf.labelPosition" - :disabled="formConf.disabled" - > - <template v-for="(element, index) in itemList"> - <preview-row-item - v-if="element.compType === 'row'" - :key="'row-' + index" - :model="element" - > - <el-col - v-for="column in element.columns" - :key="column.index" - :span="column.span" - > - <form-view-item - v-for="item in column.list" - :key="item.id" - :model="item" - v-model="form[item.id]" - /> - </el-col> - </preview-row-item> - <fancy-dynamic-view-table - v-else-if="element.compType === 'dynamicTable'" - :key="'dynamic-' + index" - :data="form[element.id]" - :ref="element.id" - :conf="element" - > - <template v-slot:item="{ rowScope, item }"> - <fancy-dynamic-table-view-item - :model="item" - :ref="item.id + rowScope.$index" - :parent="element" - :key="'tableIndex-' + rowScope.$index" - :index="rowScope.$index" - v-model="rowScope.row[item.id]" - /> - </template> - </fancy-dynamic-view-table> - <fancy-edit-table - v-else-if="element.compType === 'table'" - :key="'table_type' + index" - :layoutArray="element.layoutArray" - :tdStyle="element.tdStyle" - :width="element.width" - :height="element.height" - > - <template v-slot="{ td }"> - <form-view-item - v-for="item in td.columns" - :key="item.id" - :model="item" - v-model="form[item.id]" - /> - </template> - </fancy-edit-table> - <!--item--> - <el-col - class="drag-col-wrapper" - :key="index" - :span="element.span" - v-else - > - <form-view-item :model="element" v-model="form[element.id]" /> - </el-col> - </template> - </el-form> - </el-row> - </div> -</template> - -<script> -import formViewItem from "./formViewItem"; -import previewRowItem from "./previewRowItem"; -import fancyDynamicViewTable from "./dynamic/fancyDynamicViewTable"; -import fancyDynamicTableViewItem from "./dynamic/fancyDynamicTableViewItem"; -import fancyEditTable from "./table/fancyEditTable"; -export default { - name: "formViewer", - data() { - return { - // 琛ㄥ崟閰嶇疆 - dataForm: { - // 閰嶇疆 - config: { - version: "1.10", - formRef: "elForm", - formModel: "form", - rules: "rules", - size: "medium", - labelPosition: "right", - labelWidth: 80, - formRules: "rules", - gutter: 30, - disabled: false, - dynamicTableAllowed: false, - }, - // 缁勪欢 - list: [ - { - id: "table_1664257854891", - _id: "table_1664257854891", - compType: "table", - ele: "fancy-table", - compName: "琛ㄦ牸甯冨眬", - compIcon: "table_layout", - layout: "tableItem", - config: true, - layoutArray: [ - [ - { - id: 1664257854901, - col: 1, - row: 1, - hide: false, - compType: "tdItem", - style: { - background: "#F6F6F6", - width: 15, - }, - columns: [ - { - id: "fd_1664257870473", - _id: "fd_1664257870473", - compType: "text", - ele: "fancy-text", - compName: "鏂囨湰", - compIcon: "text", - viewType: "component", - config: true, - form: false, - show: true, - text: "濮撳悕", - align: "left", - color: "#000000", - size: 14, - bold: 400, - showLabel: false, - labelWidth: "0", - layout: "colItem", - }, - ], - }, - { - id: 1664257854911, - col: 1, - row: 1, - hide: false, - compType: "tdItem", - style: { - background: "#FFFFFF", - width: 35, - }, - columns: [ - { - id: "fd_1664257875601", - _id: "fd_1664257875601", - compType: "input", - ele: "el-input", - compName: "鍗曡鏂囨湰", - compIcon: "input", - viewType: "text", - config: true, - showLabel: false, - label: "鍗曡鏂囨湰", - labelWidth: 1, - placeholder: "璇疯緭鍏ユ枃鏈�", - required: false, - maxLength: 50, - gutter: 15, - span: 24, - width: "100%", - clearable: true, - disabled: false, - readonly: false, - status: "normal", - "prefix-icon": "", - "suffix-icon": "", - value: "65465", - rules: [], - rulesType: "default", - prepend: "", - append: "", - layout: "colItem", - }, - ], - }, - { - id: 1663654709247, - col: 1, - row: 1, - hide: false, - compType: "tdItem", - style: { - background: "#F6F6F6", - width: 15, - }, - columns: [ - { - id: "fd_1664257907242", - _id: "fd_1664257907242", - compType: "text", - ele: "fancy-text", - compName: "鏂囨湰", - compIcon: "text", - viewType: "component", - config: true, - form: false, - show: true, - text: "鏂囨湰", - align: "left", - color: "#000000", - size: 14, - bold: 400, - showLabel: false, - labelWidth: "0", - layout: "colItem", - }, - ], - }, - { - id: 1663654709267, - col: 1, - row: 1, - hide: false, - compType: "tdItem", - style: { - background: "#FFFFFF", - width: 35, - }, - columns: [ - { - id: "fd_1664257878981", - _id: "fd_1664257878981", - compType: "input", - ele: "el-input", - compName: "鍗曡鏂囨湰", - compIcon: "input", - viewType: "text", - config: true, - showLabel: false, - label: "鍗曡鏂囨湰", - labelWidth: 1, - placeholder: "璇疯緭鍏ユ枃鏈�", - required: false, - maxLength: 50, - gutter: 15, - span: 24, - width: "100%", - clearable: true, - disabled: false, - readonly: false, - status: "normal", - "prefix-icon": "", - "suffix-icon": "", - value: "鑰屽凡", - rules: [], - rulesType: "default", - prepend: "", - append: "", - layout: "colItem", - }, - ], - }, - ], - [ - { - id: 1664257854921, - col: 1, - row: 1, - hide: false, - compType: "tdItem", - style: { - background: "#F6F6F6", - width: 15, - }, - columns: [ - { - id: "fd_1664257872938", - _id: "fd_1664257872938", - compType: "text", - ele: "fancy-text", - compName: "鏂囨湰", - compIcon: "text", - viewType: "component", - config: true, - form: false, - show: true, - text: "鏂囨湰", - align: "left", - color: "#000000", - size: 14, - bold: 400, - showLabel: false, - labelWidth: "0", - layout: "colItem", - }, - ], - }, - { - id: 1664257854931, - col: 1, - row: 1, - hide: false, - compType: "tdItem", - style: { - background: "#FFFFFF", - width: 35, - }, - columns: [ - { - id: "fd_1664257877363", - _id: "fd_1664257877363", - compType: "input", - ele: "el-input", - compName: "鍗曡鏂囨湰", - compIcon: "input", - viewType: "text", - config: true, - showLabel: false, - label: "鍗曡鏂囨湰", - labelWidth: 1, - placeholder: "璇疯緭鍏ユ枃鏈�", - required: false, - maxLength: 50, - gutter: 15, - span: 24, - width: "100%", - clearable: true, - disabled: false, - readonly: false, - status: "normal", - "prefix-icon": "", - "suffix-icon": "", - value: "澶鏄�", - rules: [], - rulesType: "default", - prepend: "", - append: "", - layout: "colItem", - }, - ], - }, - { - id: 1663654709327, - col: 1, - row: 1, - hide: false, - compType: "tdItem", - style: { - background: "#F6F6F6", - width: 15, - }, - columns: [ - { - id: "fd_1664257909094", - _id: "fd_1664257909094", - compType: "text", - ele: "fancy-text", - compName: "鏂囨湰", - compIcon: "text", - viewType: "component", - config: true, - form: false, - show: true, - text: "鏂囨湰", - align: "left", - color: "#000000", - size: 14, - bold: 400, - showLabel: false, - labelWidth: "0", - layout: "colItem", - }, - ], - }, - { - id: 1663654709347, - col: 1, - row: 1, - hide: false, - compType: "tdItem", - style: { - background: "#FFFFFF", - width: 35, - }, - columns: [ - { - id: "fd_1664257880668", - _id: "fd_1664257880668", - compType: "input", - ele: "el-input", - compName: "鍗曡鏂囨湰", - compIcon: "input", - viewType: "text", - config: true, - showLabel: false, - label: "鍗曡鏂囨湰", - labelWidth: 1, - placeholder: "璇疯緭鍏ユ枃鏈�", - required: false, - maxLength: 50, - gutter: 15, - span: 24, - width: "100%", - clearable: true, - disabled: false, - readonly: false, - status: "normal", - "prefix-icon": "", - "suffix-icon": "", - value: "缁曞お闃�", - rules: [], - rulesType: "default", - prepend: "", - append: "", - layout: "colItem", - }, - ], - }, - ], - ], - tdStyle: "", - width: 100, - height: 50, - }, - ], - }, - }; - }, - props: { - value: { - type: String, - default: "", - }, - buildData: { - type: String, - default: "", - }, - }, - components: { - formViewItem, - previewRowItem, - fancyDynamicViewTable, - fancyDynamicTableViewItem, - fancyEditTable, - }, - mounted() { - this.$nextTick(() => {}); - }, - computed: { - itemList() { - if (this.buildData !== "") { - const buildData = JSON.parse(this.buildData); - return buildData.list; - } else { - return []; - } - }, - form() { - //杞崲鎴恓son鐨勫€� - if (this.value !== "") { - const value = JSON.parse(this.value); - return value; - } else { - return {}; - } - }, - formConf() { - if (this.buildData !== "") { - const buildData = JSON.parse(this.buildData); - buildData.config.disabled = this.disabled; - return buildData.config; - } else { - return {}; - } - }, - }, -}; -</script> - -<style scoped> -.preview-board { - border: 1px dashed #ccc; -} -/* .form-viewer { - padding: 20px; - border: 1px solid #dcdfe6; -} */ -.el-form-item { - margin-left: 10px; - margin-right: 10px; -} -</style> \ No newline at end of file diff --git a/sample-form-client-ui/admin/src/components/formDes/generator/html.js b/sample-form-client-ui/admin/src/components/formDes/generator/html.js deleted file mode 100644 index 07c05418a285e7fa096e334cc30d3264ebc12120..0000000000000000000000000000000000000000 --- a/sample-form-client-ui/admin/src/components/formDes/generator/html.js +++ /dev/null @@ -1,104 +0,0 @@ -/** - * 鐢熸垚html鐨勬牳蹇僯s鍑芥暟 - */ -let globalConfig - - -export function vueTemplate(str) { - return `<template> - <div> - ${str} - </div> - </template>` -} - -export function vueScript(str) { - return `<script> - ${str} - </script>` -} - -export function cssStyle(cssStr) { - return `<style> - ${cssStr} - </style>` -} - -const items = { - 'input':el =>{ - const { - disabled, vModel, clearable, placeholder, width - } = attrBuilder(el) - const maxlength = el.maxlength ? `:maxlength="${el.maxlength}"` : '' - //const showWordLimit = el['show-word-limit'] ? 'show-word-limit' : '' - const readonly = el.readonly ? 'readonly' : '' - return `<${el.ele} ${vModel} ${placeholder} ${maxlength} ${readonly} ${disabled} ${clearable} />` - }, - 'textarea':el =>{ - const { - disabled, vModel, clearable, placeholder, width - } = attrBuilder(el) - const maxlength = el.maxlength ? `:maxlength="${el.maxlength}"` : '' - //const showWordLimit = el['show-word-limit'] ? 'show-word-limit' : '' - const readonly = el.readonly ? 'readonly' : '' - const type = el.type ? `type="${el.type}"` : '' - return `<${el.ele} ${vModel} ${type} ${placeholder} ${maxlength} ${readonly} ${disabled} ${clearable} />` - } -} - - -function colWrapper(element,str){ - if (element.span) { - return `<el-col :span="${element.span}"> - ${str} - </el-col>` - } - return str -} - -function attrBuilder(el) { - return { - vModel: `v-model="${globalConfig.formModel}.${el.id}"`, - clearable: el.clearable ? 'clearable' : '', - placeholder: el.placeholder ? `placeholder="${el.placeholder}"` : '', - //width: el.style && el.style.width ? ':style="{width: \'100%\'}"' : '', - disabled: el.disabled ? ':disabled=\'true\'' : '' - } -} - - -const layout = { - colFormItem(element) { - let labelWidth = `label-width="${globalConfig.labelWidth}px"` - let label = `label="${element.label}"` - if (element.labelWidth && element.labelWidth !== globalConfig.labelWidth) { - labelWidth = `label-width="${element.labelWidth}px"` - } - if (element.showLabel === false) { - labelWidth = 'label-width="0"' - label = '' - } - const required = element.required ? 'required' : '' - const itemDom = items[element.compType] ? items[element.compType](element) : null - let str = `<el-form-item ${labelWidth} ${label} ${required}> - ${itemDom} - </el-form-item>` - str = colWrapper(element,str); - return str; - } -} - - -/** - * 鐢熸垚html婧愮爜 - * 琛ㄥ崟閰嶇疆鍜岀粍浠跺垪琛� - */ -export function buildHtmlSource(itemList,formConf){ - globalConfig = formConf; - const htmlCode = [] - itemList.forEach(el => { - htmlCode.push(layout['colFormItem'](el)) - }) - const htmlStr = htmlCode.join('\n') - //console.log(htmlStr) -} \ No newline at end of file diff --git a/sample-form-client-ui/admin/src/components/formDes/generator/js.js b/sample-form-client-ui/admin/src/components/formDes/generator/js.js deleted file mode 100644 index 7da257ca7b1b2c19af9fed547819f10ee3379430..0000000000000000000000000000000000000000 --- a/sample-form-client-ui/admin/src/components/formDes/generator/js.js +++ /dev/null @@ -1,83 +0,0 @@ -/** - * 鐢熸垚js鐨勬牳蹇僯s鍑芥暟 - */ -let globalConfig - -export function buildJsSource(itemList,formConf){ - globalConfig = JSON.parse(JSON.stringify(formConf)) - const dataList = [] - const optionsList = [] - const propsList = [] - itemList.forEach(el =>{ - buildAttributes(el, dataList, optionsList, propsList) - }) - - const script = buildexport( - formConf, - dataList.join('\n'), - optionsList.join('\n'), - propsList.join('\n'), - ) - globalConfig = null; - console.log(script); - return script; -} - -function buildAttributes(el, dataList, optionsList, propsList) { - buildData(el, dataList) - - if (el.options && el.options.length) { - buildOptions(el, optionsList) - } - - if (el.props && el.props.props) { - buildProps(el, propsList) - } - - // if (el.children) { - // el.children.forEach(el2 => { - // buildAttributes(el2, dataList, ruleList, optionsList, methodList, propsList, uploadVarList) - // }) - // } -} - -function buildData(conf, dataList) { - let value - if (typeof (conf.value) === 'string' && !conf.multiple) { - value = `'${conf.value}'` - } else { - value = `${JSON.stringify(conf.value)}` - } - if(typeof(value) === 'undefined'||value === 'undefined') value = `''`; - console.log(value); - dataList.push(`${conf.id}: ${value},`) -} - -function buildOptions(conf, optionsList) { - const str = `${conf.id}Options: ${JSON.stringify(conf.options)},` - optionsList.push(str) -} - -function buildProps(conf, propsList) { - const str = `${conf.id}Props: ${JSON.stringify(conf.props.props)},` - propsList.push(str) -} - -function buildexport(conf, data, props) { - const str = `export default { - components: {}, - props: [], - data () { - return { - ${conf.formModel}: { - ${data} - } - } - }, - computed: {}, - watch: {}, - created () {}, - mounted () {}, -}` - return str -} \ No newline at end of file diff --git a/sample-form-client-ui/admin/src/components/formDes/icon.vue b/sample-form-client-ui/admin/src/components/formDes/icon.vue deleted file mode 100644 index 57e7a3359d3793a93b7c59817ad8547522bf63ac..0000000000000000000000000000000000000000 --- a/sample-form-client-ui/admin/src/components/formDes/icon.vue +++ /dev/null @@ -1,26 +0,0 @@ -<template> - <div class="text"> - <svg class="icon" aria-hidden="true"> - <use :xlink:href="iconFont"></use> - </svg> - {{text}} - </div> -</template> -<script> - export default { - name:'icon', - props:['code','text'], - computed: { - iconFont(){ - return '#icon-'+this.code; - } - } - } -</script> -<style scoped> -.icon{ - width:20px; - height:20px; - vertical-align:-5px; -} -</style> \ No newline at end of file diff --git a/sample-form-client-ui/admin/src/components/formDes/iconDialog.vue b/sample-form-client-ui/admin/src/components/formDes/iconDialog.vue deleted file mode 100644 index cc79408eea40f4172fec308b31d370f2aee3f4cd..0000000000000000000000000000000000000000 --- a/sample-form-client-ui/admin/src/components/formDes/iconDialog.vue +++ /dev/null @@ -1,117 +0,0 @@ -<!--elementUI 鍥炬爣閫夋嫨鍣�--> -<template> - <div> - <el-dialog - title="閫夋嫨icon" - width="60%" - top="0vh" - :visible.sync="dialogVisible" - > - <ul class="icon-list"> - <li - v-for="iconName in icons" - :key="iconName" - @click="handlerSelectIcon(iconName)" - :class="{ activeIcon: iconName === value }" - > - <i :class="iconName"></i> - <!-- <div class="icon-name">{{iconName}}</div> --> - </li> - </ul> - </el-dialog> - </div> -</template> - -<script> -import iconList from "./utils/icon.json"; -export default { - props: { - visible: { - type: Boolean, - default: true, - }, - value: { - type: String, - default: "", - }, - }, - data() { - return { - icons: iconList, - }; - }, - methods: { - handlerSelectIcon(iconName) { - this.$emit("input", iconName); - this.$emit("update:visible", false); - }, - }, - computed: { - dialogVisible: { - // getter - get: function () { - return this.visible; - }, - // setter - set: function (newValue) { - console.log(newValue); - this.$emit("update:visible", false); - }, - }, - }, -}; -</script> - -<style scoped> -.icon-list { - padding: 0; - margin: 0; - font-size: 0; -} -.icon-list li { - width: 10%; - height: 60px; - font-size: 14px; - text-align: center; - list-style-type: none; - overflow: hidden; - padding: 15px 6px 6px 0px; - display: inline-block; - box-sizing: border-box; -} -.icon-list li:hover { - background-color: #f2f6fc; - cursor: pointer; -} -.activeIcon { - background-color: #f2f6fc; - cursor: pointer; -} -.icon-list li i { - width: 100%; - font-size: 30px; - padding: 6px 6px 6px 0px; -} -.icon-name { - display: block; - padding-left: 6px; -} -.el-dialog { - border-radius: 8px; - margin-bottom: 0; - margin-top: 4vh !important; - display: flex; - flex-direction: column; - max-height: 92vh; - overflow: hidden; - box-sizing: border-box; -} -.el-dialog .el-dialog__header { - padding-top: 14px; -} -.el-dialog .el-dialog__body { - margin: 0 20px 20px 20px; - padding: 0; - overflow: auto; -} -</style> \ No newline at end of file diff --git a/sample-form-client-ui/admin/src/components/formDes/index.js b/sample-form-client-ui/admin/src/components/formDes/index.js deleted file mode 100644 index 16e84e15210b9ee3ab9e98e248078de5e197d86b..0000000000000000000000000000000000000000 --- a/sample-form-client-ui/admin/src/components/formDes/index.js +++ /dev/null @@ -1,23 +0,0 @@ -import formDesigner from './formDesigner'; -import fancyEditor from './extend/fancyEditor'; -import fancyHtml from './extend/fancyHtml'; -import fancyText from './extend/fancyText'; -import fancyBarCode from 'vue-barcode'; -import fancyDialogList from './extend/fancyDialogList'; -import iconDialog from './iconDialog'; -const plugins = { - install : function (Vue) { - Vue.component('form-designer',formDesigner); - Vue.component('fancy-editor',fancyEditor); - Vue.component('fancy-html',fancyHtml); - Vue.component('fancy-text',fancyText); - Vue.component('fancy-bar-code',fancyBarCode); - Vue.component('fancy-dialog-list',fancyDialogList); - Vue.component('icon-dialog',iconDialog); - } -}; -// 杩欎竴姝ュ垽鏂瓀indow.Vue鏄惁瀛樺湪锛屽洜涓虹洿鎺ュ紩鐢╲ue.min.js锛� 瀹冧細鎶奦ue缁戝埌Window涓婏紝鎴戜滑鐩存帴寮曠敤鎵撳寘濂界殑js鎵嶈兘姝e父璺戣捣鏉ャ€� -if (typeof window !== 'undefined' && window.Vue) { - window.Vue.use(plugins); -} -export default plugins; \ No newline at end of file diff --git a/sample-form-client-ui/admin/src/components/formDes/preview.vue b/sample-form-client-ui/admin/src/components/formDes/preview.vue deleted file mode 100644 index 7de5e83614c5a90edf025b94585ead1ce7468554..0000000000000000000000000000000000000000 --- a/sample-form-client-ui/admin/src/components/formDes/preview.vue +++ /dev/null @@ -1,189 +0,0 @@ -<template> - <div class="preview"> - <el-row :gutter="formConf.gutter"> - <el-form - :rules="rules" - :ref="formConf.formModel" - :size="formConf.size" - :model="form" - :label-position="formConf.labelPosition" - :disabled="formConf.disabled" - :validate-on-rule-change="false" - :label-width="formConf.labelWidth + 'px'" - > - <template v-for="(element, index) in list"> - <!-- <el-input v-model="element.id" placeholder=""></el-input> --> - <preview-row-item - v-if="element.compType === 'row'" - :key="'row-' + index" - :model="element" - > - <el-col - v-for="column in element.columns" - :key="column.index" - :span="column.span" - > - <template v-for="col in column.list"> - <preview-item - v-if="col.compType !== 'dynamicTable'" - :key="col.id" - :model="col" - v-model="form[col.id]" - @valChange="handlerValChange" - /> - <fancy-dynamic-table - v-else-if="col.compType === 'dynamicTable'" - ref="dynamicTable" - :key="'dynamic-' + col.id" - :data="form[col.id]" - :conf="col" - @addRow="handlerAddRow" - @deleteRow="handlerDeleteRow" - @batchDeleteRow="handlerBatchDeleteRow" - > - <template v-slot:item="{ rowScope, item }"> - <fancy-dynamic-table-item - :model="item" - :parent="col" - :key="'tableIndex-' + rowScope.$index" - :index="rowScope.$index" - v-model="rowScope.row[item.id]" - @valChange="handlerDynamicValChange" - /> - </template> - </fancy-dynamic-table> - </template> - </el-col> - </preview-row-item> - <fancy-dynamic-table - v-else-if="element.compType === 'dynamicTable'" - :key="'dynamic-' + index" - :data="form[element.id]" - :ref="element.id" - :conf="element" - @addRow="handlerAddRow" - @deleteRow="handlerDeleteRow" - @batchDeleteRow="handlerBatchDeleteRow" - > - <template v-slot:item="{ rowScope, item }"> - <fancy-dynamic-table-item - :model="item" - :ref="item.id + rowScope.$index" - :parent="element" - :key="'tableIndex-' + rowScope.$index" - :index="rowScope.$index" - v-model="rowScope.row[item.id]" - @valChange="handlerDynamicValChange" - /> - </template> - </fancy-dynamic-table> - <fancy-edit-table - v-else-if="element.compType === 'table'" - :key="'table_1' + index" - :layoutArray="element.layoutArray" - :tdStyle="element.tdStyle" - :width="element.width" - :height="element.height" - > - <template v-slot="{ td }"> - <template v-for="col in td.columns"> - <preview-item - :model="col" - :key="'table_2' + col.id" - v-model="form[col.id]" - @valChange="handlerValChange" - /> - </template> - </template> - </fancy-edit-table> - <!--item--> - <el-col - class="drag-col-wrapper" - :key="index" - :span="element.span" - v-else - > - <preview-item - :model="element" - v-model="form[element.id]" - @valChange="handlerValChange" - /> - </el-col> - </template> - </el-form> - </el-row> - <el-divider></el-divider> - <div style="text-align: center"> - <span slot="footer" class="dialog-footer"> - <el-button type="primary" @click="handlerSubForm">鎻愪氦</el-button> - </span> - </div> - </div> -</template> -<script> -import previewItem from "./previewItem"; -import previewRowItem from "./previewRowItem"; -import fancyDynamicTable from "./dynamic/fancyDynamicTable"; -import fancyDynamicTableItem from "./dynamic/fancyDynamicTableItem"; -import fancyEditTable from "./table/fancyEditTable"; -import { datas, addRow, batchDeleteRow, deleteRow } from "./custom/formDraw"; -export default { - name: "preview", - props: ["itemList", "formConf"], - components: { - previewItem, - previewRowItem, - fancyDynamicTable, - fancyDynamicTableItem, - fancyEditTable, - }, - data() { - return { - list: this.itemList, - form: {}, - rules: {}, - currentIndex: -1, - }; - }, - methods: { - handlerValChange(key, origin) { - console.log(key); - this.$set(this.form, key, origin); - }, - handlerDynamicValChange(parentId, index, key, origin) { - this.$set(this.form[parentId][index], key, origin); - this.currentIndex = index; - }, - handlerSubForm() { - this.$refs[this.formConf.formModel].validate((valid) => { - if (valid) { - this.$message.success("success"); - } - }); - }, - handlerAddRow: addRow, - handlerDeleteRow: deleteRow, - handlerBatchDeleteRow: batchDeleteRow, - handlerInitDatas: datas, - }, - created() { - this.handlerInitDatas(); //鍒濆鍖栬〃鍗� - }, - mounted() { - this.$nextTick(() => {}); - }, - beforeCreate() {}, - computed: {}, -}; -</script> -<style scoped> -.preview-board { - border: 1px dashed #ccc; -} -.preview >>> .el-radio.is-bordered + .el-radio.is-bordered { - margin-left: 0px; -} -.preview >>> .el-checkbox.is-bordered + .el-checkbox.is-bordered { - margin-left: 0px; -} -</style> \ No newline at end of file diff --git a/sample-form-client-ui/admin/src/components/formDes/previewItem.vue b/sample-form-client-ui/admin/src/components/formDes/previewItem.vue deleted file mode 100644 index b2680821c7f0c99f5fa17f0e5b1db43472f5fe58..0000000000000000000000000000000000000000 --- a/sample-form-client-ui/admin/src/components/formDes/previewItem.vue +++ /dev/null @@ -1,55 +0,0 @@ -<script> -import render from "./custom/previewRender"; -import checkRules from "./custom/rule"; - -const layouts = { - colItem(h, element, value) { - let labelWidth = element.labelWidth ? `${element.labelWidth}px` : null; - const { valChange } = this.$listeners; - const rules = checkRules(element); - return ( - <el-col style="padding-left: 7.5px; padding-right: 7.5px;"> - <el-form-item - label={element.showLabel ? element.label : ""} - label-width={labelWidth} - prop={element.id} - rules={rules} - > - <render - key={element.id} - conf={element} - value={value} - onInput={(event) => { - this.$set(element, "value", event); - valChange(element.id, event); - }} - /> - </el-form-item> - </el-col> - ); - }, -}; - -export default { - name: "previewItem", - components: { - render, - }, - props: ["model", "value"], - data() { - return { - eleConfig: this.model, - }; - }, - render(h) { - return layouts.colItem.call(this, h, this.eleConfig, this.value); - }, -}; -</script> -<style scoped> -/* .el-form-item { - margin-left: 10px; - margin-right: 10px; - margin-bottom: 5px; -} */ -</style> \ No newline at end of file diff --git a/sample-form-client-ui/admin/src/components/formDes/previewRowItem.vue b/sample-form-client-ui/admin/src/components/formDes/previewRowItem.vue deleted file mode 100644 index f5b4040ae73a34b09dcf0a6d4f998b98f9dd696c..0000000000000000000000000000000000000000 --- a/sample-form-client-ui/admin/src/components/formDes/previewRowItem.vue +++ /dev/null @@ -1,20 +0,0 @@ -<template> - <el-col> - <el-row :gutter="model.gutter"> - <div class="drag-wrapper"> - <slot></slot> - </div> - </el-row> - </el-col> -</template> -<script> -export default { - name: "previewRowItem", - components: {}, - props: ["model", "value"], - data() { - return {}; - }, - computed: {}, -}; -</script> \ No newline at end of file diff --git a/sample-form-client-ui/admin/src/components/formDes/style/designer.css b/sample-form-client-ui/admin/src/components/formDes/style/designer.css deleted file mode 100644 index b42ac2fe64086ee06a6685a07d2922897219965d..0000000000000000000000000000000000000000 --- a/sample-form-client-ui/admin/src/components/formDes/style/designer.css +++ /dev/null @@ -1,197 +0,0 @@ - -body{ - margin:0px; -} -.container { - position: relative; - width: 100%; - height: 100%; -} -.left-board { - width: 260px; - position: absolute; - left: 0; - top: 0; - height: 100vh; -} -.d-logo-wrapper{ - position: relative; - height: 42px; - background: #ffffff; - border-bottom: 1px solid #f1e8e8; - box-sizing: border-box; -} -.d-logo{ - position: absolute; - left: 12px; - top: 6px; - line-height: 30px; - color: #409eff; - font-weight: 600; - font-size: 17px; - white-space: nowrap; -} -.d-logo img{ - width: 30px; - height: 30px; - vertical-align: top; -} -.components-title{ - font-size: 14px; - color: #222; - margin: 6px 6px; - font-weight:700 -} -.components-draggable{ - padding-bottom: 20px; -} -.components-list { - padding: 8px; - box-sizing: border-box; - height: 100%; -} -.components-list .components-item { - display: inline-block; - width: 48%; - margin: 1%; - transition: transform 0ms !important; -} -.components-body { - padding: 8px 10px; - background: #f4f6fc; - font-size: 12px; - margin-left: 5px; - padding-top: 5px; - cursor: move; - border: 1px solid #409eff; - border-radius: 3px; -} -.components-body:hover { - border: 1px dashed #f56c6c; - color: #f56c6c; -} -.center-board { - height: 100vh; - width: auto; - margin: 0 350px 0 260px; - box-sizing: border-box; -} -.empty-info{ - position: absolute; - top: 30%; - left: 0; - right: 0; - text-align: center; - font-size: 18px; - letter-spacing: 4px; -} -.action-bar{ - position: relative; - height: 42px; - text-align: right; - padding: 0 15px; - box-sizing: border-box;; - border: 1px solid #f1e8e8; - border-top: none; - border-left: none; - background: #ffffff; -} -.action-bar .el-button{ - font-size: 18px; - vertical-align: middle; - position: relative; - top: -1px; - color:#409EFF -} -.action-bar .delete-btn{ - color: #F56C6C; -} -.center-scrollbar { - height: calc(100vh - 42px); - overflow: hidden; - border-left: 1px solid #f1e8e8; - border-right: 1px solid #f1e8e8; - box-sizing: border-box; -} - -.center-board-row { - padding: 10px 12px 100px 12px; - box-sizing: border-box; -} -.center-board-row .el-form { - height: calc(100vh - 69px); -} - -.dynamic-table{ - margin: 0px; - height: auto; - min-height: 120px; - padding: 10px 0px; -} -.dynamic-table__content{ - width:100%; - height:100%; - display: flex; - overflow-y: hidden; - outline: 1px dashed #ccc; - outline-offset: -1px; - min-height: 100px; - float:left -} -.dynamic-table__item { - margin:1px; - padding-top:5px; - border: 1px solid #EBEEF5; - background:#f2f6fc; - border-radius: 2px; -} -.dynamic-table__item:hover { - border: 1px solid #409EFF; -} -.dynamic-table__item_title{ - width:100%; - padding-top:8px; - line-height: 23px; - text-align: center; - border-bottom: 1px solid #EBEEF5; - font-size: 14px; - color:#606266; - height:30px; -} -.dynamic-table__item_body{ - padding:10px; - text-align: center; -} -.table__content{ - width:100%; - height:100%; - overflow-y: hidden; - outline: 1px dashed #ccc; - outline-offset: -1px; - min-height: 100px; - float:left -} -.el-radio:last-child { - margin-right:30px; -} -.el-checkbox:last-of-type{ - margin-right:30px; -} -.el-rate{ - margin-top:10px; -} - -.component-id{ - position: absolute; - top: 0; - left: 0; - font-size: 12px; - color: #bbb; - display: inline-block; - margin: 0 6px; -} - -/* .dynamic-table.active{ - border-left: 3px solid #409eff; - background:#ecf5ff -} */ \ No newline at end of file diff --git a/sample-form-client-ui/admin/src/components/formDes/style/designer.less b/sample-form-client-ui/admin/src/components/formDes/style/designer.less deleted file mode 100644 index a7654573977275693e572f4746bca71c1a015b2c..0000000000000000000000000000000000000000 --- a/sample-form-client-ui/admin/src/components/formDes/style/designer.less +++ /dev/null @@ -1,304 +0,0 @@ -@selectedColor: #e6f2ff; -@lighterBlue: #409EFF; -.drawing-board { - height: 100%; - position: relative; - border:1px dashed #ccc; - .components-body { - padding: 0; - margin: 0; - font-size: 0; - } - .sortable-ghost { - position: relative; - display: block; - overflow: hidden; - &::before { - content: " "; - position: absolute; - left: 0; - right: 0; - top: 0; - height: 3px; - background: #409EFF; - z-index: 2; - } - } - .components-item.sortable-ghost { - width: 100%; - height: 5px; - background-color: @selectedColor; - } - .drawing-item.sortable-ghost { - width: 100%; - height: 5px; - background-color: @selectedColor; - } - .active-from-item { - & > .el-form-item{ - background: @selectedColor; - border-radius:6px; - margin-top:15px; - } - & > .dynamic-table{ - background: @selectedColor; - border-radius:6px; - } - & > .drawing-item-copy, & > .drawing-item-delete{ - display: initial; - } - & > .component-name{ - color: @lighterBlue; - } - } - - .el-form-item{ - margin-bottom: 5px; - } -} -.drawing-item{ - position: relative; - cursor: move; - &.unfocus-bordered:not(.active-from-item) > div:first-child { - border: 1px dashed #ccc; - } - .el-form-item{ - padding: 12px 10px; - margin-top:15px; - } -} -.drawing-item{ - position: relative; - border: 1px dashed #ccc; - cursor: move; - .dynamic-table{ - padding: 12px 5px; - - } -} -.drawing-row-item{ - position: relative; - cursor: move; - box-sizing: border-box; - border: 1px dashed #ccc; - border-radius: 3px; - padding: 0 2px; - margin-bottom: 15px; - .el-col{ - margin-top: 15px; - } - .el-form-item{ - margin-bottom: 15px; - } - .drag-wrapper{ - min-height: 80px; - } - .drag-col-wrapper{ - height: auto; - border: 1px dashed #ccc; - } - &.active-from-item{ - border: 2px solid #e6a23c; - - } - .component-name{ - position: absolute; - top: 0; - left: 0; - font-size: 12px; - color: #bbb; - display: inline-block; - padding: 0 6px; - } -} -.drawing-item, .drawing-row-item{ - &:hover { - & > .el-form-item{ - background: #ebeef5; - } - & > .drawing-item-copy, & > .drawing-item-delete{ - display: initial; - } - } - & > .drawing-item-copy, & > .drawing-item-delete{ - display: none; - position: absolute; - top: -10px; - width: 22px; - height: 22px; - line-height: 22px; - text-align: center; - border-radius: 50%; - font-size: 12px; - border: 1px solid; - cursor: pointer; - z-index: 1; - } - & > .drawing-item-copy{ - right: 56px; - border-color: @lighterBlue; - color: @lighterBlue; - background: #fff; - &:hover{ - background: @lighterBlue; - color: #fff; - } - } - & > .drawing-item-delete{ - right: 24px; - border-color: #F56C6C; - color: #F56C6C; - background: #fff; - &:hover{ - background: #F56C6C; - color: #fff; - } - } -} -.drawing-item, .drawing-form-item{ - &:hover { - & > .el-form-item{ - background: #ebeef5; - } - & > .drawing-item-copy, & > .drawing-item-delete{ - display: initial; - } - } - & > .drawing-item-copy, & > .drawing-item-delete{ - display: none; - position: absolute; - top: -10px; - width: 22px; - height: 22px; - line-height: 22px; - text-align: center; - border-radius: 50%; - font-size: 12px; - border: 1px solid; - cursor: pointer; - z-index: 1; - } - & > .drawing-item-copy{ - right: 56px; - border-color: @lighterBlue; - color: @lighterBlue; - background: #fff; - &:hover{ - background: @lighterBlue; - color: #fff; - } - } - & > .drawing-item-delete{ - right: 24px; - border-color: #F56C6C; - color: #F56C6C; - background: #fff; - &:hover{ - background: #F56C6C; - color: #fff; - } - } -} -.right-board { - width: 350px; - position: absolute; - right: 0; - top: 0; - padding-top: 3px; - .field-box { - position: relative; - height: calc(100vh - 42px); - box-sizing: border-box; - overflow: hidden; - } - .el-scrollbar { - height: 100%; - } -} -.select-item { - display: flex; - border: 1px dashed #fff; - box-sizing: border-box; - & .close-btn { - cursor: pointer; - color: #f56c6c; - } - & .el-input + .el-input { - margin-left: 4px; - } -} -.select-item + .select-item { - margin-top: 4px; -} -.select-item.sortable-chosen { - border: 1px dashed #409eff; -} -.select-line-icon { - line-height: 32px; - font-size: 22px; - padding: 0 4px; - color: #777; -} -.option-drag { - cursor: move; -} -.time-range { - .el-date-editor { - width: 227px; - } - ::v-deep .el-icon-time { - display: none; - } -} -.document-link { - position: absolute; - display: block; - width: 26px; - height: 26px; - top: 0; - left: 0; - cursor: pointer; - background: #409eff; - z-index: 1; - border-radius: 0 0 6px 0; - text-align: center; - line-height: 26px; - color: #fff; - font-size: 18px; -} -.node-label{ - font-size: 14px; -} -.node-icon{ - color: #bebfc3; -} -.center-tabs{ - .el-tabs__header{ - margin-bottom: 0!important; - } - .el-tabs__item{ - width: 100%; - text-align: center; - } - .el-tabs__nav{ - width: 100%; - } -} -.right-scrollbar { - .el-scrollbar__view { - padding: 12px 18px 15px 15px; - } -} -.drawing-row-item .el-col{ - margin-bottom:5px; -} -.components-item.dynamicGhost { - width: 5px; - height: 120px; - background-color: #409EFF; -} -.dynamic-table_item.dynamicGhost { - width: 5px; - height: 120px; - background-color: #409EFF; -} diff --git a/sample-form-client-ui/admin/src/components/formDes/table/fancyEditTable.vue b/sample-form-client-ui/admin/src/components/formDes/table/fancyEditTable.vue deleted file mode 100644 index 79dd03b114fc1080c88aae16693d91fd2bd565e2..0000000000000000000000000000000000000000 --- a/sample-form-client-ui/admin/src/components/formDes/table/fancyEditTable.vue +++ /dev/null @@ -1,138 +0,0 @@ -<template> - <div> - <div style="padding:5px;margin-top:10px"> - <table class="table-layout" :style="tableWidth"> - <tbody> - <tr v-for="(tr, trIndex) in layoutArray" :key="trIndex" :style="trHeight"> - <fancy-edit-table-item v-for="(td,tdIndex) in tr" :key="tdIndex" - :item="td" - :tdIndex="tdIndex" - :trIndex="trIndex" - :tdStyle="tdStyle" - > - <slot :td="td" /> - </fancy-edit-table-item> - </tr> - </tbody> - </table> - </div> - </div> -</template> - -<script> -import fancyEditTableItem from './fancyEditTableItem'; -export default { - name: 'fancyEditTable', - components: { - fancyEditTableItem - }, - props: { - layoutArray: { - type: Array, - default: () => [] - }, - tdStyle:{ - type:String, - default:'' - }, - width:{ - type:Number, - default:100 - }, - height:{ - type:Number, - default:100 - } - }, - data() { - return { - } - }, - mounted() { - - }, - destroyed() { - }, - methods: { - }, - computed: { - tableWidth(){ - return 'width:'+this.width+'%'; - }, - trHeight(){ - return 'height:'+this.height+'px'; - } - } -} -</script> - -<style scoped> -table { - border-spacing: 0; - width: 100% -} - -tbody { - display: table-row-group; - vertical-align: middle; - border-color: inherit; -} - -td { - border: 1px #d2d2d2 solid; -} - -.table-layout { - background-color: #ffffff; - border-collapse: collapse; - - padding: 8px !important; - text-align: left; - margin: 0 auto; - width: 100%; - table-layout: fixed; -} - -.table-layout>tbody>tr>td { - padding: 6px; - word-break: break-word; - border: 1px solid #d2d2d2; - height: 20px; -} - -.table-layout>tbody>tr { - border-bottom: 1px solid #d2d2d2; - border-top: 1px solid #d2d2d2; -} - -.right-menu { - background-color: #ffffff; - z-index: 100; - width: 200px; - position: fixed; - border: 1px solid #ccc; - box-shadow: 3px 3px 8px #999; - border-radius: 3px; - padding: 8px 0; -} - -.right-menu ul { - margin: 0px; - padding: 0px; -} - -.right-menu ul li { - padding: 0 15px; - height: 30px; - line-height: 30px; -} - -.right-menu ul li:hover { - cursor: pointer; - background-color: #ccc; -} - -.CellHide { - display: none; -} -</style> \ No newline at end of file diff --git a/sample-form-client-ui/admin/src/components/formDes/table/fancyEditTableItem.vue b/sample-form-client-ui/admin/src/components/formDes/table/fancyEditTableItem.vue deleted file mode 100644 index 86659cd17c1b7b2e8be1e46ebf1ea66ba43a2d46..0000000000000000000000000000000000000000 --- a/sample-form-client-ui/admin/src/components/formDes/table/fancyEditTableItem.vue +++ /dev/null @@ -1,69 +0,0 @@ -<template> - <td - :colspan="item.col" - :rowspan="item.row" - :class="{ cellHide: item.hide }" - :style="{ - tdStyle, - 'background-color': item.style.background, - width: item.style.width + '%', - }" - style="" - @contextmenu.prevent="rightClick($event, trIndex, tdIndex)" - > - <slot :td="item" /> - </td> -</template> - -<script> -export default { - name: "fancyEditTableItem", - components: {}, - props: { - item: { - type: Object, - default: () => { - return {}; - }, - }, - tdIndex: { - type: Number, - default: 0, - }, - trIndex: { - type: Number, - default: 0, - }, - tdStyle: { - type: String, - default: "", - }, - }, -}; -</script> - -<style scoped> -td { - border: 1px #d2d2d2 solid; - padding: 6px; - padding-top: 0px; - word-break: break-word; - border: 1px solid #d2d2d2; - height: 20px; - height: 20px; -} -.cellHide { - display: none; -} -.activeItem { - border: 2px solid #e6a23c; -} - -.component-td { - font-size: 12px; - color: #bbb; -} -.activeItem div span { - color: #409eff; -} -</style> \ No newline at end of file diff --git a/sample-form-client-ui/admin/src/components/formDes/table/fancyTable.vue b/sample-form-client-ui/admin/src/components/formDes/table/fancyTable.vue deleted file mode 100644 index bcdcd2ccf7be5b3d2c283ec49ea3e4f8b1785853..0000000000000000000000000000000000000000 --- a/sample-form-client-ui/admin/src/components/formDes/table/fancyTable.vue +++ /dev/null @@ -1,265 +0,0 @@ -<template> - <div> - <div style="padding:5px;margin-top:10px"> - <table class="table-layout" :style="tableStyle"> - <tbody> - <tr v-for="(tr,trIndex) in layoutArray" :key="trIndex" :style="trHeight"> - <fancy-table-item v-for="(td,tdIndex) in tr" :key="tdIndex" - :item="td" - :tdIndex="tdIndex" - :trIndex="trIndex" - :tdStyle="tdStyle" - @rightClick="rightClick" - @click.native="handlerSelectedTd($event,td)" - > - <slot :td="td" /> - </fancy-table-item> - </tr> - </tbody> - </table> - </div> - <div v-show="showContextMunu" class="right-menu" :style="{ top: + positionY+'px',left: + positionX+'px', }"> - <ul style="list-style-type: none"> - <li @click="handlerRightCol" v-if="showRightColMenu"> - <icon code="zuoyouhebing" text="鍚戝彸鍚堝苟鍗曞厓鏍�" /> - </li> - <li @click="handlerDownRow" v-if="showDownRowMenu"> - <icon code="shangxiahebing" text="鍚戜笅鍚堝苟鍗曞厓鏍�" /> - </li> - <li @click="handlerResetTable" v-if="showResetTableMenu"> - <icon code="chaifen" text="鎷嗗垎鍗曞厓鏍�" /> - </li> - <li @click="handlerAppendCol"> - <icon code="zhuijiahang" text="杩藉姞琛�" /> - </li> - <li @click="handlerAppendRow"> - <icon code="zhuijialie" text="杩藉姞鍒�" /> - </li> - </ul> - </div> - </div> -</template> - -<script> -import icon from '../icon'; -import fancyTableItem from './fancyTableItem'; -import {jsonClone} from "../utils"; -import {getTrItem,getTdItem} from "./table"; -import { getSimpleId } from '../utils/IdGenerate'; -let tr = getTrItem(); -export default { - name:'fancyTable', - components:{ - icon, - fancyTableItem - }, - props:{ - layoutArray:{ - type:Array, - default:()=>[] - }, - tdStyle:{ - type:String, - default:'' - }, - width:{ - type:Number, - default:100 - }, - height:{ - type:Number, - default:100 - } - }, - data(){ - return{ - positionX:0, - positionY:0, - showContextMunu:false, - currentRowIndex:0, - currentColIndex:0, - //columns: this.trs - } - }, - mounted() { - // 娣诲姞鐩戝惉鍙栨秷鍙抽敭鑿滃崟 - document.addEventListener("click", this.hideRightContextMenu, true); - document.addEventListener("contextmenu", this.hideRightContextMenu, true); - // this.handlerAppendCol(); - // this.handlerAppendCol(); - }, - destroyed() { - // 绉婚櫎鐩戝惉 - document.removeEventListener("click", this.hideRightContextMenu, true); - document.removeEventListener("contextmenu",this.hideRightContextMenu,true); - }, - methods:{ - rightClick(e,rowIndex,colIndex){ - this.positionX = e.clientX; - this.positionY = e.clientY; - this.showContextMunu = true; - this.currentRowIndex = rowIndex; - this.currentColIndex = colIndex; - }, - hideRightContextMenu(){ - this.showContextMunu = false; - }, - //鍚戝彸鍚堝苟鍗曞厓鏍� - handlerRightCol(){ - let col = this.layoutArray[this.currentRowIndex][this.currentColIndex].col; - let row = this.layoutArray[this.currentRowIndex][this.currentColIndex].row; - if(row>1){ - for(let i =0;i<row;i++){ - this.layoutArray[this.currentRowIndex+i][this.currentColIndex+col].hide=true; - this.layoutArray[this.currentRowIndex][this.currentColIndex].col=col+1; - } - }else{ - this.layoutArray[this.currentRowIndex][this.currentColIndex+col].hide=true; - this.layoutArray[this.currentRowIndex][this.currentColIndex].col=col+1; - } - - }, - //鍚戜笅鍚堝苟鍗曞厓鏍� - handlerDownRow(){ - let col = this.layoutArray[this.currentRowIndex][this.currentColIndex].col; - let row = this.layoutArray[this.currentRowIndex][this.currentColIndex].row; - if(col>1){ - for(let i =0;i<col;i++){ - this.layoutArray[this.currentRowIndex+row][this.currentColIndex+i].hide=true; - this.layoutArray[this.currentRowIndex][this.currentColIndex].row=row+1; - } - }else{ - this.layoutArray[this.currentRowIndex+row][this.currentColIndex].hide=true; - this.layoutArray[this.currentRowIndex][this.currentColIndex].row=row+1; - } - // let nextCol = this.columns[this.currentRowIndex+1][this.currentColIndex].col; - // let nextRow = this.columns[this.currentRowIndex+1][this.currentColIndex].row; - // if(nextCol<2&nextRow<2){ - - // }else{ - // alert('璇峰厛鎷嗗垎涓嬫柟鍗曞厓鏍硷紒'); - // } - - }, - handlerResetTable(){ - //debugger; - let col = this.layoutArray[this.currentRowIndex][this.currentColIndex].col; - let row = this.layoutArray[this.currentRowIndex][this.currentColIndex].row; - if(col===1&&row===1)return; - - for(let i = 0;i<row;i++){ - for(let j = 0;j<col;j++){ - this.layoutArray[this.currentRowIndex+i][this.currentColIndex+j].hide = false; - } - } - this.layoutArray[this.currentRowIndex][this.currentColIndex].row=1; - this.layoutArray[this.currentRowIndex][this.currentColIndex].col=1; - }, - handlerSelectedTd(e,td){ - this.$emit('selectItem',td); - e.stopPropagation(); - }, - //杩藉姞琛� - handlerAppendCol(){ - let _trItem = jsonClone(tr); - _trItem.map(item=>item.id=getSimpleId()); - this.layoutArray.push(_trItem); - }, - handlerAppendRow(){ - tr.push(getTdItem()); - this.layoutArray.forEach(item=>{ - const _td = jsonClone(getTdItem()); - item.push(_td); - }) - } - }, - computed:{ - showRightColMenu(){ - if(this.showContextMunu){ - const col = this.layoutArray[this.currentRowIndex][this.currentColIndex].col; - const td = this.layoutArray[this.currentRowIndex][this.currentColIndex+col]; - return (td&&td.row<2&&td.col<2&&!td.hide); - }else{ - return false; - } - }, - showDownRowMenu(){ - if(this.showContextMunu){ - const row = this.layoutArray[this.currentRowIndex][this.currentColIndex].row; - let td = undefined; - if(typeof this.layoutArray[this.currentRowIndex+row] !== 'undefined'){ - td = this.layoutArray[this.currentRowIndex+row][this.currentColIndex]; - } - return (td&&td.row<2&&td.col<2&&!td.hide); - }else{ - return false; - } - }, - showResetTableMenu(){ - if(this.showContextMunu){ - const td = this.layoutArray[this.currentRowIndex][this.currentColIndex]; - return !(td.row<2&&td.col<2&&!td.hide); - }else{ - return false; - } - }, - tableStyle(){ - return 'width:'+this.width+'%;'; - }, - trHeight(){ - return 'height:'+this.height+'px'; - } - } -} -</script> - -<style scoped> -table{ - border-spacing:0; - width:100% -} -tbody{ - display: table-row-group; - vertical-align: middle; - border-color: inherit; -} -.table-layout{ - background-color: #ffffff; - border-collapse: collapse; - - padding: 8px !important; - text-align: left; - margin: 0 auto; - width: 100%; - table-layout: fixed; -} - -.table-layout > tbody > tr{ - border-bottom: 1px solid #d2d2d2; - border-top: 1px solid #d2d2d2; -} -.right-menu{ - background-color:#ffffff; - z-index:100; - width:200px; - position: fixed; - border: 1px solid #ccc; - box-shadow: 3px 3px 8px #999; - border-radius: 3px; - padding: 8px 0; -} -.right-menu ul{ - margin:0px; - padding:0px; -} -.right-menu ul li{ - padding:0 15px; - height:30px; - line-height: 30px; -} -.right-menu ul li:hover{ - cursor: pointer; - background-color: #ccc; -} - -</style> \ No newline at end of file diff --git a/sample-form-client-ui/admin/src/components/formDes/table/fancyTableItem.vue b/sample-form-client-ui/admin/src/components/formDes/table/fancyTableItem.vue deleted file mode 100644 index 2cb6a8b1c978ad9e0337cbfb8ea5dbc015ca8ea8..0000000000000000000000000000000000000000 --- a/sample-form-client-ui/admin/src/components/formDes/table/fancyTableItem.vue +++ /dev/null @@ -1,87 +0,0 @@ -<template> - <td - :colspan="item.col" - :rowspan="item.row" - :class="{ cellHide: item.hide, activeItem: isActiveItem }" - :style="{ - tdStyle, - 'background-color': item.style.background, - width: item.style.width + '%', - }" - style="" - @contextmenu.prevent="rightClick($event, trIndex, tdIndex)" - > - <div class="component-td"> - <span>{{ item.id }}</span> - <slot :td="item" /> - </div> - </td> -</template> - -<script> -export default { - name: "fancyTableItem", - components: {}, - props: { - item: { - type: Object, - default: () => { - return {}; - }, - }, - tdIndex: { - type: Number, - default: 0, - }, - trIndex: { - type: Number, - default: 0, - }, - tdStyle: { - type: String, - default: "", - }, - }, - data() { - return {}; - }, - inject: ["getContext"], - methods: { - rightClick(e, rowIndex, colIndex) { - this.$emit("rightClick", e, rowIndex, colIndex); - }, - }, - computed: { - isActiveItem() { - return this.getContext.activeItem.id === this.item.id ? true : false; - //this.designerActiveItem - }, - }, -}; -</script> - -<style scoped> -td { - border: 1px #d2d2d2 solid; - padding: 6px; - padding-top: 0px; - word-break: break-word; - border: 1px solid #d2d2d2; - height: 20px; - height: 20px; -} -.cellHide { - display: none; -} -.activeItem { - border: 2px solid #e6a23c; -} - -.component-td { - font-size: 12px; - color: #bbb; -} -.activeItem div span { - color: #409eff; -} -</style> \ No newline at end of file diff --git a/sample-form-client-ui/admin/src/components/formDes/table/table.js b/sample-form-client-ui/admin/src/components/formDes/table/table.js deleted file mode 100644 index cd568d53c68a7497e73d1d1db7571ac0871d270b..0000000000000000000000000000000000000000 --- a/sample-form-client-ui/admin/src/components/formDes/table/table.js +++ /dev/null @@ -1,44 +0,0 @@ -import {getSimpleId} from "../utils/IdGenerate"; -import constant from '../utils/constants' -import {jsonClone} from "../utils"; - -let tdItemObj = { - id:'', - col:1, - row:1, - hide:false, - compType:'tdItem', - style:{ - background:constant.defaultTdBackgroundColor, - width:35 - }, - columns:[] - } - -export function getTdItem(){ - let tdItem = cloneObj(tdItemObj); - tdItem.id = getSimpleId(); - return tdItem; -} -export function getTitleTdItem(){ - let tdItem = cloneObj(tdItemObj); - tdItem.style.background = constant.defaultTitleTdBackgroundColor; - tdItem.style.width = 15; - tdItem.id = getSimpleId(); - return tdItem; -} - -function cloneObj(source){ - let target = jsonClone(source); - target.id = getSimpleId(); - return target; -} - -export function getTrItem(){ - let trItem= [getTitleTdItem(),getTdItem(),getTitleTdItem(),getTdItem()]; - return trItem; -} -export function getDefaultTrs(){ - let trs = [getTrItem(),getTrItem()]; - return trs; -} \ No newline at end of file diff --git a/sample-form-client-ui/admin/src/components/formDes/utils/IdGenerate.js b/sample-form-client-ui/admin/src/components/formDes/utils/IdGenerate.js deleted file mode 100644 index cfd0b094830c55e35ab19b34106aec2bc21aaafc..0000000000000000000000000000000000000000 --- a/sample-form-client-ui/admin/src/components/formDes/utils/IdGenerate.js +++ /dev/null @@ -1,17 +0,0 @@ -export function getSimpleId(){ - sleep(10); //涓昏涓轰簡寤舵椂宸ヤ綔 - return new Date().getTime(); -} - -const sleep = function(time) { - const startTime = new Date().getTime() + parseInt(time, 10); - while(new Date().getTime() < startTime) {return} -}; - -export function setTableId(table){ - table.layoutArray.map((tr)=>{ - tr[0].id=getSimpleId(); - tr[1].id=getSimpleId(); - }) - return table; -} \ No newline at end of file diff --git a/sample-form-client-ui/admin/src/components/formDes/utils/chinaAreaData.js b/sample-form-client-ui/admin/src/components/formDes/utils/chinaAreaData.js deleted file mode 100644 index e648d09936b4f9e84a4c4107a6fc2bd95821a795..0000000000000000000000000000000000000000 --- a/sample-form-client-ui/admin/src/components/formDes/utils/chinaAreaData.js +++ /dev/null @@ -1,33 +0,0 @@ -import allData from 'china-area-data/v5/data'; - -export function areaData(){ - let options = []; - const allProvinceData = allData['86']; //寰楀埌鍏ㄤ腑鍥界殑鐪� - Object.keys(allProvinceData).forEach(key=>{ - let provinceObj={}; - provinceObj.label= allProvinceData[key]; - provinceObj.value= key; - const cityData = allData[key]; //甯� - provinceObj.children = []; - Object.keys(cityData).forEach(ckey=>{ - let cityObj = {}; - cityObj.label = cityData[ckey]; - cityObj.value = ckey; - const areaData = allData[ckey]; //鍖� - if(typeof areaData !== 'undefined'){ - cityObj.children = []; - Object.keys(areaData).forEach(akey=>{ - let areaObj = {}; - areaObj.label = areaData[akey]; - areaObj.value = akey; - cityObj.children.push(areaObj); - }); - } - - provinceObj.children.push(cityObj); - }) - options.push(provinceObj); - }); - return options; -} - diff --git a/sample-form-client-ui/admin/src/components/formDes/utils/constants.js b/sample-form-client-ui/admin/src/components/formDes/utils/constants.js deleted file mode 100644 index 9a5c87dfbc5665c3d951d0231ff797f3a3f53268..0000000000000000000000000000000000000000 --- a/sample-form-client-ui/admin/src/components/formDes/utils/constants.js +++ /dev/null @@ -1,7 +0,0 @@ -/** - * js鐨勫父閲忓氨鍦ㄨ繖閲� - */ -export default { - defaultTdBackgroundColor:'#FFFFFF', - defaultTitleTdBackgroundColor:'#F6F6F6' -} \ No newline at end of file diff --git a/sample-form-client-ui/admin/src/components/formDes/utils/icon.json b/sample-form-client-ui/admin/src/components/formDes/utils/icon.json deleted file mode 100644 index 07a240e88ae75afa62946abc275e73e1807b3f94..0000000000000000000000000000000000000000 --- a/sample-form-client-ui/admin/src/components/formDes/utils/icon.json +++ /dev/null @@ -1,282 +0,0 @@ -[ -"el-icon-platform-eleme", -"el-icon-eleme", -"el-icon-delete-solid", -"el-icon-delete", -"el-icon-s-tools", -"el-icon-setting", -"el-icon-user-solid", -"el-icon-user", -"el-icon-phone", -"el-icon-phone-outline", -"el-icon-more", -"el-icon-more-outline", -"el-icon-star-on", -"el-icon-star-off", -"el-icon-s-goods", -"el-icon-goods", -"el-icon-warning", -"el-icon-warning-outline", -"el-icon-question", -"el-icon-info", -"el-icon-remove", -"el-icon-circle-plus", -"el-icon-success", -"el-icon-error", -"el-icon-zoom-in", -"el-icon-zoom-out", -"el-icon-remove-outline", -"el-icon-circle-plus-outline", -"el-icon-circle-check", -"el-icon-circle-close", -"el-icon-s-help", -"el-icon-help", -"el-icon-minus", -"el-icon-plus", -"el-icon-check", -"el-icon-close", -"el-icon-picture", -"el-icon-picture-outline", -"el-icon-picture-outline-round", -"el-icon-upload", -"el-icon-upload2", -"el-icon-download", -"el-icon-camera-solid", -"el-icon-camera", -"el-icon-video-camera-solid", -"el-icon-video-camera", -"el-icon-message-solid", -"el-icon-bell", -"el-icon-s-cooperation", -"el-icon-s-order", -"el-icon-s-platform", -"el-icon-s-fold", -"el-icon-s-unfold", -"el-icon-s-operation", -"el-icon-s-promotion", -"el-icon-s-home", -"el-icon-s-release", -"el-icon-s-ticket", -"el-icon-s-management", -"el-icon-s-open", -"el-icon-s-shop", -"el-icon-s-marketing", -"el-icon-s-flag", -"el-icon-s-comment", -"el-icon-s-finance", -"el-icon-s-claim", -"el-icon-s-custom", -"el-icon-s-opportunity", -"el-icon-s-data", -"el-icon-s-check", -"el-icon-s-grid", -"el-icon-menu", -"el-icon-share", -"el-icon-d-caret", -"el-icon-caret-left", -"el-icon-caret-right", -"el-icon-caret-bottom", -"el-icon-caret-top", -"el-icon-bottom-left", -"el-icon-bottom-right", -"el-icon-back", -"el-icon-right", -"el-icon-bottom", -"el-icon-top", -"el-icon-top-left", -"el-icon-top-right", -"el-icon-arrow-left", -"el-icon-arrow-right", -"el-icon-arrow-down", -"el-icon-arrow-up", -"el-icon-d-arrow-left", -"el-icon-d-arrow-right", -"el-icon-video-pause", -"el-icon-video-play", -"el-icon-refresh", -"el-icon-refresh-right", -"el-icon-refresh-left", -"el-icon-finished", -"el-icon-sort", -"el-icon-sort-up", -"el-icon-sort-down", -"el-icon-rank", -"el-icon-loading", -"el-icon-view", -"el-icon-c-scale-to-original", -"el-icon-date", -"el-icon-edit", -"el-icon-edit-outline", -"el-icon-folder", -"el-icon-folder-opened", -"el-icon-folder-add", -"el-icon-folder-remove", -"el-icon-folder-delete", -"el-icon-folder-checked", -"el-icon-tickets", -"el-icon-document-remove", -"el-icon-document-delete", -"el-icon-document-copy", -"el-icon-document-checked", -"el-icon-document", -"el-icon-document-add", -"el-icon-printer", -"el-icon-paperclip", -"el-icon-takeaway-box", -"el-icon-search", -"el-icon-monitor", -"el-icon-attract", -"el-icon-mobile", -"el-icon-scissors", -"el-icon-umbrella", -"el-icon-headset", -"el-icon-brush", -"el-icon-mouse", -"el-icon-coordinate", -"el-icon-magic-stick", -"el-icon-reading", -"el-icon-data-line", -"el-icon-data-board", -"el-icon-pie-chart", -"el-icon-data-analysis", -"el-icon-collection-tag", -"el-icon-film", -"el-icon-suitcase", -"el-icon-suitcase-1", -"el-icon-receiving", -"el-icon-collection", -"el-icon-files", -"el-icon-notebook-1", -"el-icon-notebook-2", -"el-icon-toilet-paper", -"el-icon-office-building", -"el-icon-school", -"el-icon-table-lamp", -"el-icon-house", -"el-icon-no-smoking", -"el-icon-smoking", -"el-icon-shopping-cart-full", -"el-icon-shopping-cart-1", -"el-icon-shopping-cart-2", -"el-icon-shopping-bag-1", -"el-icon-shopping-bag-2", -"el-icon-sold-out", -"el-icon-sell", -"el-icon-present", -"el-icon-box", -"el-icon-bank-card", -"el-icon-money", -"el-icon-coin", -"el-icon-wallet", -"el-icon-discount", -"el-icon-price-tag", -"el-icon-news", -"el-icon-guide", -"el-icon-male", -"el-icon-female", -"el-icon-thumb", -"el-icon-cpu", -"el-icon-link", -"el-icon-connection", -"el-icon-open", -"el-icon-turn-off", -"el-icon-set-up", -"el-icon-chat-round", -"el-icon-chat-line-round", -"el-icon-chat-square", -"el-icon-chat-dot-round", -"el-icon-chat-dot-square", -"el-icon-chat-line-square", -"el-icon-message", -"el-icon-postcard", -"el-icon-position", -"el-icon-turn-off-microphone", -"el-icon-microphone", -"el-icon-close-notification", -"el-icon-bangzhu", -"el-icon-time", -"el-icon-odometer", -"el-icon-crop", -"el-icon-aim", -"el-icon-switch-button", -"el-icon-full-screen", -"el-icon-copy-document", -"el-icon-mic", -"el-icon-stopwatch", -"el-icon-medal-1", -"el-icon-medal", -"el-icon-trophy", -"el-icon-trophy-1", -"el-icon-first-aid-kit", -"el-icon-discover", -"el-icon-place", -"el-icon-location", -"el-icon-location-outline", -"el-icon-location-information", -"el-icon-add-location", -"el-icon-delete-location", -"el-icon-map-location", -"el-icon-alarm-clock", -"el-icon-timer", -"el-icon-watch-1", -"el-icon-watch", -"el-icon-lock", -"el-icon-unlock", -"el-icon-key", -"el-icon-service", -"el-icon-mobile-phone", -"el-icon-bicycle", -"el-icon-truck", -"el-icon-ship", -"el-icon-basketball", -"el-icon-football", -"el-icon-soccer", -"el-icon-baseball", -"el-icon-wind-power", -"el-icon-light-rain", -"el-icon-lightning", -"el-icon-heavy-rain", -"el-icon-sunrise", -"el-icon-sunrise-1", -"el-icon-sunset", -"el-icon-sunny", -"el-icon-cloudy", -"el-icon-partly-cloudy", -"el-icon-cloudy-and-sunny", -"el-icon-moon", -"el-icon-moon-night", -"el-icon-dish", -"el-icon-dish-1", -"el-icon-food", -"el-icon-chicken", -"el-icon-fork-spoon", -"el-icon-knife-fork", -"el-icon-burger", -"el-icon-tableware", -"el-icon-sugar", -"el-icon-dessert", -"el-icon-ice-cream", -"el-icon-hot-water", -"el-icon-water-cup", -"el-icon-coffee-cup", -"el-icon-cold-drink", -"el-icon-goblet", -"el-icon-goblet-full", -"el-icon-goblet-square", -"el-icon-goblet-square-full", -"el-icon-refrigerator", -"el-icon-grape", -"el-icon-watermelon", -"el-icon-cherry", -"el-icon-apple", -"el-icon-pear", -"el-icon-orange", -"el-icon-coffee", -"el-icon-ice-tea", -"el-icon-ice-drink", -"el-icon-milk-tea", -"el-icon-potato-strips", -"el-icon-lollipop", -"el-icon-ice-cream-square", -"el-icon-ice-cream-round" -] \ No newline at end of file diff --git a/sample-form-client-ui/admin/src/components/formDes/utils/index.js b/sample-form-client-ui/admin/src/components/formDes/utils/index.js deleted file mode 100644 index d900a9ef2f7b331ea3e40ecb1dd888334a454bea..0000000000000000000000000000000000000000 --- a/sample-form-client-ui/admin/src/components/formDes/utils/index.js +++ /dev/null @@ -1,138 +0,0 @@ -export function makeMap(str, expectsLowerCase) { - const map = Object.create(null) - const list = str.split(',') - for (let i = 0; i < list.length; i++) { - map[list[i]] = true - } - return expectsLowerCase - ? val => map[val.toLowerCase()] - : val => map[val] -} - -/** - * num 灏忎簬0锛屽乏缂╄繘num*2涓┖鏍硷紱 澶т簬0锛屽彸缂╄繘num*2涓┖鏍笺€� - * @param {string} str 浠g爜 - * @param {number} num 缂╄繘娆℃暟 - * @param {number} len 銆愬彲閫夈€戠缉杩涘崟浣嶏紝绌烘牸鏁� - */ -export function indent(str, num, len = 2) { - if (num === 0) return str - const isLeft = num < 0; const result = []; let reg; let - spaces = '' - if (isLeft) { - num *= -1 - reg = new RegExp(`(^\\s{0,${num * len}})`, 'g') - } else { - for (let i = 0; i < num * len; i++) spaces += ' ' - } - - str.split('\n').forEach(line => { - line = isLeft ? line.replace(reg, '') : spaces + line - result.push(line) - }) - return result.join('\n') -} - -// 棣栧瓧姣嶅ぇ灏� -export function titleCase(str) { - return str.replace(/( |^)[a-z]/g, L => L.toUpperCase()) -} - -// 涓嬪垝杞┘宄� -export function camelCase(str) { - return str.replace(/-[a-z]/g, str1 => str1.substr(-1).toUpperCase()) -} - -export function isNumberStr(str) { - return /^[+-]?(0|([1-9]\d*))(\.\d+)?$/g.test(str) -} - - -export const beautifierConf = { - html: { - indent_size: '2', - indent_char: ' ', - max_preserve_newlines: '-1', - preserve_newlines: false, - keep_array_indentation: false, - break_chained_methods: false, - indent_scripts: 'separate', - brace_style: 'end-expand', - space_before_conditional: true, - unescape_strings: false, - jslint_happy: false, - end_with_newline: true, - wrap_line_length: '110', - indent_inner_html: true, - comma_first: false, - e4x: true, - indent_empty_lines: true - }, - js: { - indent_size: '2', - indent_char: ' ', - max_preserve_newlines: '-1', - preserve_newlines: false, - keep_array_indentation: false, - break_chained_methods: false, - indent_scripts: 'normal', - brace_style: 'end-expand', - space_before_conditional: true, - unescape_strings: false, - jslint_happy: true, - end_with_newline: true, - wrap_line_length: '110', - indent_inner_html: true, - comma_first: false, - e4x: true, - indent_empty_lines: true - } -} - -function stringify(obj) { - return JSON.stringify(obj, (key, val) => { - if (typeof val === 'function') { - return `${val}` - } - return val - }) -} - -function parse(str) { - return JSON.parse(str, (k, v) => { - if (v!==null&&v.indexOf && v.indexOf('function') > -1) { - return eval(`(${v})`) - } - return v - }) -} - -export function jsonClone(obj) { - return parse(stringify(obj)); -} - -export function isLayout(obj) { - return obj.compType === 'row'; -} -export function isTable(obj) { - return obj.compType === 'table'; -} -export function inTable(obj) { - return obj.col&&obj.row; -} - -export const isAttr = makeMap( - 'accept,accept-charset,accesskey,action,align,alt,async,autocomplete,' - + 'autofocus,autoplay,autosave,bgcolor,border,buffered,challenge,charset,' - + 'checked,cite,class,code,codebase,color,cols,colspan,content,http-equiv,' - + 'name,contenteditable,contextmenu,controls,coords,data,datetime,default,' - + 'defer,dir,dirname,disabled,download,draggable,dropzone,enctype,method,for,' - + 'form,formaction,headers,height,hidden,high,href,hreflang,http-equiv,' - + 'icon,id,ismap,itemprop,keytype,kind,label,lang,language,list,loop,low,' - + 'manifest,max,maxlength,media,method,GET,POST,min,multiple,email,file,' - + 'muted,name,novalidate,open,optimum,pattern,ping,placeholder,poster,' - + 'preload,radiogroup,readonly,rel,required,reversed,rows,rowspan,sandbox,' - + 'scope,scoped,seamless,selected,shape,size,type,text,password,sizes,span,' - + 'spellcheck,src,srcdoc,srclang,srcset,start,step,style,summary,tabindex,' - + 'target,title,type,usemap,value,width,wrap' -) \ No newline at end of file diff --git a/sample-form-client-ui/admin/src/main.js b/sample-form-client-ui/admin/src/main.js index 129c20054085087af4fba34af0a3f5d81cefb1d7..ce9d76c6a94a4b0d569c117714a64ece5f846add 100644 --- a/sample-form-client-ui/admin/src/main.js +++ b/sample-form-client-ui/admin/src/main.js @@ -27,16 +27,12 @@ Vue.prototype.$message = message; // 婊氬姩鎻掍欢 import scroll from "vue-seamless-scroll"; Vue.use(scroll); -// 琛ㄦ牸鐢熸垚 -import plugins from "./components/formDes/index"; -Vue.use(plugins); // 鏍煎紡鍖栨彃浠� import format from "vue-text-format"; Vue.use(format); // 涓ぎ浜嬩欢 Vue.prototype.$bus = new Vue(); -Vue.config.productionTip = false; Vue.config.productionTip = false; diff --git a/sample-form-client-ui/admin/src/pages/searchpage/SearchPage.vue b/sample-form-client-ui/admin/src/pages/searchpage/SearchPage.vue index 4edad0ddf7dbba6e11b74a44078cfb903e562e22..8c661e75ff61e29d7959478a1580d65f11860065 100644 --- a/sample-form-client-ui/admin/src/pages/searchpage/SearchPage.vue +++ b/sample-form-client-ui/admin/src/pages/searchpage/SearchPage.vue @@ -41,7 +41,8 @@ <span class="matter-fullName">浜嬮」鍏ㄧО</span >{{ matter.matterFullName }} </div> - <div + <!-- 鏉愭枡灞曠ず --> + <!-- <div class="materials flex aic" v-for="(item, index) in matter.matterDatumList.slice(0, 3)" :key="item.id" @@ -65,7 +66,7 @@ }} </span> </span> - </div> + </div> --> </div> <div class="list" @@ -118,7 +119,7 @@ export default { searchVal: this.$route.query.val, total: 0, current: 1, - size: 12, + size: 16, matterInfo: {}, visible: false, matterTotal: 0, @@ -190,7 +191,8 @@ export default { } } .matter-box { - width: 100%; + width: 1840px; + height: 800px; padding: 30px; padding-bottom: 10px; background: #ffffff; @@ -202,15 +204,17 @@ export default { } .list { content: ""; - width: 426px; + width: 422px; border: 1px solid transparent; padding: 5px; overflow: hidden; } .matter-item { - width: 426px; - height: 210px; - padding: 10px 20px; + width: 422px; + // height: 210px; + height: 150px; + // padding: 10px 20px; + padding: 20px; margin-bottom: 30px; background: #edf6fe; border-radius: 16px; @@ -234,7 +238,8 @@ export default { } } .for-short { - margin-bottom: 10px; + // margin-bottom: 10px; + margin-bottom: 18px; font-size: 24px; font-weight: 500; color: #333333; diff --git a/sample-form-client-ui/admin/src/pages/showpage/MatterList.vue b/sample-form-client-ui/admin/src/pages/showpage/MatterList.vue index 50ede808e10e747e8117f4a49158428af82d0cf9..88a685e016bb760b24f6c9828f773a3e7d12a271 100644 --- a/sample-form-client-ui/admin/src/pages/showpage/MatterList.vue +++ b/sample-form-client-ui/admin/src/pages/showpage/MatterList.vue @@ -180,7 +180,8 @@ export default { } .matter-box { - height: 100%; + width: 1540px; + height: 800px; padding: 30px; background: #ffffff; border-radius: 16px;