Add form-create plug-in and alarm group management add sample demo
This commit is contained in:
parent
543aac5951
commit
ab884dfde6
|
|
@ -484,6 +484,7 @@ The text of each license is also included at licenses/ui-licenses/LICENSE-[proje
|
|||
========================================
|
||||
MIT licenses
|
||||
========================================
|
||||
@form-create/element-ui 1.0.18: https://github.com/xaboy/form-create MIT
|
||||
ans-UI 1.1.7: https://github.com/analysys/ans-ui MIT
|
||||
axios 0.16.2: https://github.com/axios/axios MIT
|
||||
bootstrap 3.3.7: https://github.com/twbs/bootstrap MIT
|
||||
|
|
|
|||
|
|
@ -0,0 +1,21 @@
|
|||
MIT License
|
||||
|
||||
Copyright (c) 2018 xaboy
|
||||
|
||||
Permission is hereby granted, free of charge, to any person obtaining a copy
|
||||
of this software and associated documentation files (the "Software"), to deal
|
||||
in the Software without restriction, including without limitation the rights
|
||||
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
|
||||
copies of the Software, and to permit persons to whom the Software is
|
||||
furnished to do so, subject to the following conditions:
|
||||
|
||||
The above copyright notice and this permission notice shall be included in all
|
||||
copies or substantial portions of the Software.
|
||||
|
||||
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
|
||||
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
|
||||
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
|
||||
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
|
||||
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
|
||||
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
|
||||
SOFTWARE.
|
||||
|
|
@ -12,6 +12,7 @@
|
|||
"build:release": "npm run clean && cross-env NODE_ENV=production PUBLIC_PATH=/dolphinscheduler/ui webpack --config ./build/webpack.config.release.js"
|
||||
},
|
||||
"dependencies": {
|
||||
"@form-create/element-ui": "^1.0.18",
|
||||
"@riophae/vue-treeselect": "^0.4.0",
|
||||
"ans-ui": "1.1.9",
|
||||
"axios": "^0.16.2",
|
||||
|
|
@ -22,8 +23,8 @@
|
|||
"d3": "^3.5.17",
|
||||
"dagre": "^0.8.5",
|
||||
"dayjs": "^1.7.8",
|
||||
"element-ui": "2.13.2",
|
||||
"echarts": "4.1.0",
|
||||
"element-ui": "2.13.2",
|
||||
"html2canvas": "^0.5.0-beta4",
|
||||
"jquery": "3.3.1",
|
||||
"jquery-ui": "^1.12.1",
|
||||
|
|
@ -32,7 +33,7 @@
|
|||
"lodash": "^4.17.11",
|
||||
"normalize.css": "^8.0.1",
|
||||
"vue": "^2.5.17",
|
||||
"vue-router": "2.7.0",
|
||||
"vue-router": "^2.7.0",
|
||||
"vuex": "^3.0.0",
|
||||
"vuex-router-sync": "^5.0.0"
|
||||
},
|
||||
|
|
|
|||
|
|
@ -38,6 +38,8 @@ import 'bootstrap/dist/css/bootstrap.min.css'
|
|||
import 'bootstrap/dist/js/bootstrap.min.js'
|
||||
import 'canvg/dist/browser/canvg.min.js'
|
||||
|
||||
import formCreate, {maker} from '@form-create/element-ui'
|
||||
|
||||
// Component internationalization
|
||||
const useOpt = i18n.globalScope.LOCALE === 'en_US' ? { locale: en_US } : {}
|
||||
|
||||
|
|
@ -46,6 +48,8 @@ Vue.use(ElementUI)
|
|||
// Vue.use(ans)
|
||||
Vue.use(ans, useOpt)
|
||||
|
||||
Vue.use(formCreate)
|
||||
|
||||
sync(store, router)
|
||||
|
||||
Vue.config.devtools = true
|
||||
|
|
|
|||
|
|
@ -16,6 +16,9 @@
|
|||
*/
|
||||
<template>
|
||||
<div class="list-model">
|
||||
<div>
|
||||
<form-create v-model="fApi" :rule="rule" :option="option"></form-create>
|
||||
</div>
|
||||
<div class="table-box">
|
||||
<table>
|
||||
<tr>
|
||||
|
|
@ -97,7 +100,53 @@
|
|||
name: 'user-list',
|
||||
data () {
|
||||
return {
|
||||
list: []
|
||||
list: [],
|
||||
fApi: {},
|
||||
rule: [
|
||||
{
|
||||
type: "input", // 生成组件的名称(就是表单的名称:如input,radio,checkbox,select,slider等)
|
||||
field: "userName", // 表单组件的字段名称(就是表单的name属性,注:该必须唯一),自定义组件可以不配置
|
||||
className: "user-name-dom", // 设置组件的class属性
|
||||
title: "用户名称:", // 组件的名称, 选填
|
||||
value: "", // 表单组件的字段值(就是表单的value值),自定义组件可以不用设置
|
||||
props: {
|
||||
placeholder: "请输入用户名称!",
|
||||
disabled: false,
|
||||
readonly: false,
|
||||
clearable: true // 是否显示清空按钮
|
||||
},
|
||||
validate: [
|
||||
{
|
||||
trigger: "blur",
|
||||
required: true,
|
||||
message: "用户名称不能为空!"
|
||||
}
|
||||
],
|
||||
col: {
|
||||
md: { span: 12 }
|
||||
}
|
||||
}
|
||||
],
|
||||
option: {
|
||||
// 显示重置表单按扭
|
||||
resetBtn: true,
|
||||
|
||||
// 表单提交按扭事件
|
||||
onSubmit: formData => {
|
||||
alert(JSON.stringify(formData));
|
||||
|
||||
console.log("获取表单中的数据:", formData);
|
||||
|
||||
//按钮进入提交状态
|
||||
// this.fApi.btn.loading();
|
||||
|
||||
//重置按钮禁用
|
||||
// this.fApi.resetBtn.disabled();
|
||||
|
||||
//按钮进入可点击状态
|
||||
// this.fApi.btn.finish();
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
props: {
|
||||
|
|
|
|||
|
|
@ -29,10 +29,14 @@ import ans from 'ans-ui/lib/ans-ui.min'
|
|||
import 'sass/conf/login/index.scss'
|
||||
import 'bootstrap/dist/js/bootstrap.min.js'
|
||||
|
||||
import formCreate, {maker} from '@form-create/element-ui'
|
||||
|
||||
Vue.use(ElementUI)
|
||||
|
||||
Vue.use(ans)
|
||||
|
||||
Vue.use(formCreate)
|
||||
|
||||
Vue.config.devtools = true
|
||||
Vue.config.productionTip = true
|
||||
Vue.config.silent = true
|
||||
|
|
|
|||
Loading…
Reference in New Issue