Skip to content

Commit b2df691

Browse files
Scorrt-2021Scorrt-2021
committed
2 parents 61598ca + 1083a3b commit b2df691

File tree

12 files changed

+434
-94
lines changed

12 files changed

+434
-94
lines changed

‎package.json

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,8 +1,8 @@
11
{
2-
"name": "vue-admin-template",
3-
"version": "4.2.1",
4-
"description": "A vue admin template with Element UI & axios & iconfont & permission control & lint",
5-
"author": "Pan <panfree23@gmail.com>",
2+
"name": "diboot-element-admin",
3+
"version": "2.3.1",
4+
"description": "Diboot PC端前端框架（element-ui）",
5+
"author": "www.diboot.com",
66
"license": "MIT",
77
"scripts": {
88
"serve": "vue-cli-service serve --open",

‎src/components/diboot/components/dateRange/index.vue

Lines changed: 56 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,56 @@
1+
<template>
2+
<div>
3+
<el-date-picker
4+
v-model="value[0]"
5+
style="width: calc(50% - 15px);"
6+
type="date"
7+
clearable
8+
:format="format"
9+
:value-format="format"
10+
placeholder="开始日期"
11+
@change="onChange"
12+
/>
13+
~
14+
<el-date-picker
15+
v-model="value[1]"
16+
style="width: calc(50% - 15px);"
17+
type="date"
18+
clearable
19+
:format="format"
20+
:value-format="format"
21+
placeholder="结束日期"
22+
@change="onChange"
23+
/>
24+
</div>
25+
</template>
26+
27+
<script>
28+
export default {
29+
name: 'DateRange',
30+
props: {
31+
value: {
32+
type: Array,
33+
default: () => [undefined, undefined]
34+
},
35+
format: {
36+
type: String,
37+
default: 'yyyy-MM-dd'
38+
},
39+
allowClear: {
40+
type: Boolean,
41+
default: true
42+
}
43+
},
44+
methods: {
45+
onChange() {
46+
const { value } = this
47+
this.$emit('input', value)
48+
this.$emit('change', value)
49+
}
50+
}
51+
}
52+
</script>
53+
54+
<style scoped>
55+
56+
</style>

‎src/components/diboot/components/editTableCell/index.vue

Lines changed: 133 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,133 @@
1+
<template>
2+
<div class="editable-cell">
3+
<div v-if="editable" class="editable-cell-input-wrapper">
4+
<template v-if="formType === 'INPUT'">
5+
<el-input v-model="tempValue" @input="changeValue"/>
6+
</template>
7+
<template v-if="formType === 'INPUT_NUMBER'">
8+
<el-input-number
9+
v-model="tempValue"
10+
controls-position="right"
11+
@change="changeValue"
12+
/>
13+
</template>
14+
<template v-else-if="formType === 'TEXTAREA'">
15+
<el-input
16+
@input="changeValue"
17+
type="textarea"
18+
v-model="tempValue"
19+
/>
20+
</template>
21+
<template v-else-if="formType === 'S_SELECT'">
22+
<el-select
23+
filterable
24+
@change="changeValue"
25+
v-model="tempValue"
26+
>
27+
<el-option
28+
v-for="(item, index) in dataKvList || []"
29+
:key="index"
30+
:value="item.v"
31+
:label="item.k"
32+
>
33+
</el-option>
34+
</el-select>
35+
</template>
36+
<template v-else-if="formType === 'SWITCH'">
37+
<el-switch @change="changeValue" v-model="tempValue"/>
38+
</template>
39+
<template v-else-if="formType === 'DATEPICKER'">
40+
<el-date-picker
41+
v-model="tempValue"
42+
@change="changeValue"
43+
value-format="yyyy-MM-dd"
44+
type="date"
45+
/>
46+
</template>
47+
<template v-else-if="formType === 'DATETIMEPICKER'">
48+
<el-date-picker
49+
v-model="tempValue"
50+
@change="changeValue"
51+
value-format="yyyy-MM-dd HH:mm:ss"
52+
type="datetime"
53+
/>
54+
</template>
55+
</div>
56+
<div v-else :class="{'text-ellipsis': ellipsis, 'editable-cell-text-wrapper': true}">
57+
<template v-if="label">
58+
{{label}}
59+
</template>
60+
<template v-else>
61+
{{ (isBoolean ? (tempValue ? '是' : '否') : tempValue) || '-' }}
62+
</template>
63+
</div>
64+
</div>
65+
</template>
66+
67+
<script>
68+
export default {
69+
name: 'EditTableCell',
70+
// 文本值， 表单类型， 选择类型的数据集
71+
// props: ['text', 'formType', 'kvList'],
72+
props: {
73+
editable: {
74+
type: Boolean,
75+
default: false
76+
},
77+
value: {
78+
// eslint-disable-next-line vue/require-prop-type-constructor
79+
type: String | Boolean | Number,
80+
required: true
81+
},
82+
label: {
83+
type: String,
84+
default: ''
85+
},
86+
// 表单类型: 支持INPUT、INPUT_NUMBER、TEXTAREA、S_SELECT、SWITCH、DATEPICKER、DATETIMEPICKER
87+
formType: {
88+
type: String,
89+
required: true
90+
},
91+
// 是否是布尔
92+
isBoolean: {
93+
type: Boolean,
94+
default: false
95+
},
96+
// 选择类型的数据集
97+
dataKvList: {
98+
type: Array,
99+
default: () => []
100+
},
101+
// 选择类型的数据集
102+
ellipsis: {
103+
type: Boolean,
104+
default: false
105+
}
106+
},
107+
data() {
108+
return {
109+
tempValue: this.value
110+
}
111+
},
112+
methods: {
113+
changeValue(val) {
114+
this.$emit('input', val)
115+
}
116+
}
117+
}
118+
</script>
119+
120+
<style scoped>
121+
.editable-cell {
122+
position: relative;
123+
}
124+
editable-cell-text-wrapper {
125+
padding-right: 24px;
126+
}
127+
.editable-cell-input-wrapper {
128+
display: flex;
129+
}
130+
.editable-cell-text-wrapper {
131+
padding: 5px 24px 5px 5px;
132+
}
133+
</style>

‎src/components/diboot/components/protectField/index.vue

Lines changed: 132 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,132 @@
1+
<template>
2+
<el-form-item
3+
ref="formItem"
4+
:prop="prop"
5+
:label="label"
6+
:label-width="labelWidth"
7+
:error="error"
8+
:show-message="showMessage"
9+
:inline-message="inlineMessage"
10+
:rules="(edit || !id ) && !(disabled || readonly) ? rules : {}"
11+
:required="(edit || !id) && !(disabled || readonly) && required"
12+
>
13+
<slot slot="label" name="label" />
14+
<el-input
15+
ref="input"
16+
v-model="editValue"
17+
:placeholder="placeholder"
18+
:type="type"
19+
:size="size"
20+
:rows="rows"
21+
:resize="resize"
22+
:autosize="autosize"
23+
:clearable="clearable"
24+
:autofocus="autofocus"
25+
:prefix-icon="prefixIcon"
26+
:suffix-icon="suffixIcon"
27+
:maxlength="maxlength"
28+
:minlength="minlength"
29+
:show-word-limit="showWordLimit"
30+
:validate-event="validateEvent"
31+
:readonly="!edit && !!id || readonly"
32+
:disabled="!edit && !!id && !readonly || disabled"
33+
@blur="event => $emit('blur', event)"
34+
@focus="event => $emit('focus', event)"
35+
@clear="$emit('clear')"
36+
@change="inputChange"
37+
>
38+
<slot slot="prefix" name="prefix" />
39+
<slot slot="suffix" name="suffix" />
40+
<slot slot="prepend" name="prepend" />
41+
<el-button v-if="!disabled && !readonly && id" slot="append" @click="edit = !edit">{{ edit ? '取消' : '编辑' }}</el-button>
42+
<slot v-else slot="append" name="append" />
43+
</el-input>
44+
<template v-if="$slots.error" slot="error" slot-scope="{ error }">
45+
<slot name="error" :error="error" />
46+
</template>
47+
</el-form-item>
48+
</template>
49+
50+
<script>
51+
const stringNull = { type: String, default: undefined }
52+
53+
export default {
54+
name: 'ProtectField',
55+
props: {
56+
id: { type: [String, Number], required: true, default: 0 },
57+
58+
prop: stringNull,
59+
label: stringNull,
60+
labelWidth: stringNull,
61+
required: Boolean,
62+
rules: { type: [Object, Array], default: null },
63+
error: stringNull,
64+
showMessage: { type: Boolean, default: true },
65+
inlineMessage: { type: [String, Boolean], default: undefined },
66+
67+
value: stringNull,
68+
placeholder: stringNull,
69+
type: stringNull,
70+
size: stringNull,
71+
rows: { type: Number, default: 2 },
72+
resize: stringNull,
73+
autosize: { type: [Boolean, Object], default: false },
74+
validateEvent: { type: Boolean, default: true },
75+
maxlength: { type: Number, default: undefined },
76+
minlength: { type: Number, default: undefined },
77+
showWordLimit: Boolean,
78+
clearable: Boolean,
79+
disabled: Boolean,
80+
readonly: Boolean,
81+
autofocus: Boolean,
82+
prefixIcon: stringNull,
83+
suffixIcon: stringNull
84+
},
85+
data() {
86+
return {
87+
edit: false,
88+
protectValue: null,
89+
editValue: null
90+
}
91+
},
92+
watch: {
93+
id() {
94+
this.edit = false
95+
this.reset()
96+
},
97+
edit(v) {
98+
this.editValue = v ? null : this.protectValue
99+
this.inputChange()
100+
}
101+
},
102+
created() {
103+
this.reset()
104+
},
105+
methods: {
106+
resetField() {
107+
(this.edit || !this.id) && this.inputChange(this.editValue = null)
108+
this.clearValidate()
109+
},
110+
clearValidate() {
111+
this.$refs.formItem.clearValidate()
112+
},
113+
114+
inputChange(value) {
115+
this.protectValue !== value && this.$emit('input', value)
116+
},
117+
reset() {
118+
this.editValue = this.protectValue = this.value
119+
this.inputChange()
120+
},
121+
select() {
122+
this.$refs.input.select()
123+
},
124+
focus() {
125+
this.$refs.input.focus()
126+
},
127+
blur() {
128+
this.$refs.input.blur()
129+
}
130+
}
131+
}
132+
</script>

‎src/components/diboot/components/upload/Upload.vue

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -102,11 +102,11 @@ export default {
102102
},
103103
/**
104104
/**
105-
* 单个文件上传大小，默认2M
105+
* 单个文件上传大小，默认10M
106106
*/
107107
limitSize: {
108108
type: Number,
109-
default: 2
109+
default: 10
110110
},
111111
/**
112112
* 是否是图片，默认不是图片类型（主要用户上传后构建值）

0 commit comments

Comments
 (0)