Merge pull request '样式' (#5) from qiaopengfei into master
Reviewed-on: #5
This commit is contained in:
commit
1df345e012
|
@ -3,6 +3,7 @@ import App from '../src/App.vue'
|
||||||
|
|
||||||
//基于element组件封装,引入element组件库
|
//基于element组件封装,引入element组件库
|
||||||
import { Input } from 'element-ui';
|
import { Input } from 'element-ui';
|
||||||
|
import 'element-ui/lib/theme-chalk/index.css';
|
||||||
Vue.use(Input);
|
Vue.use(Input);
|
||||||
|
|
||||||
// 导入组件库
|
// 导入组件库
|
||||||
|
|
|
@ -1,77 +1,75 @@
|
||||||
<template>
|
<template>
|
||||||
<el-input
|
<el-input
|
||||||
class="w-input"
|
class="w-input"
|
||||||
:style="{ width }"
|
:style="{ width }"
|
||||||
:value="value"
|
:value="value"
|
||||||
:size="size"
|
:size="size"
|
||||||
v-on="inputListeners"
|
v-on="inputListeners"
|
||||||
v-bind="[$attrs]"
|
v-bind="[$attrs]"
|
||||||
>
|
>
|
||||||
<slot name="append" slot="append" />
|
<slot name="append" slot="append" />
|
||||||
<slot name="prefix" slot="prefix" />
|
<slot name="prefix" slot="prefix" />
|
||||||
<slot name="suffix" slot="suffix" />
|
<slot name="suffix" slot="suffix" />
|
||||||
<slot name="prepend" slot="prepend" />
|
<slot name="prepend" slot="prepend" />
|
||||||
</el-input>
|
</el-input>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script>
|
<script>
|
||||||
/**
|
/**
|
||||||
* WInput
|
* WInput
|
||||||
* @desc 处理输入的输入框(转大写,不能有中文空格等)
|
* @desc 处理输入的输入框(转大写,不能有中文空格等)
|
||||||
*/
|
*/
|
||||||
export default {
|
export default {
|
||||||
name: "WInput",
|
name: "WInput",
|
||||||
props: {
|
props: {
|
||||||
width: {
|
width: {
|
||||||
type: String,
|
type: String,
|
||||||
default: "180px",
|
default: "180px",
|
||||||
},
|
|
||||||
size: {
|
|
||||||
type: String,
|
|
||||||
default: "small",
|
|
||||||
},
|
|
||||||
value: {
|
|
||||||
type: String,
|
|
||||||
default: "",
|
|
||||||
},
|
|
||||||
toUpperCase: {
|
|
||||||
type: Boolean,
|
|
||||||
default: true,
|
|
||||||
},
|
|
||||||
},
|
},
|
||||||
computed: {
|
size: {
|
||||||
// 所有父级事件
|
type: String,
|
||||||
inputListeners() {
|
default: "small",
|
||||||
return Object.assign(
|
|
||||||
{},
|
|
||||||
// 我们从父级添加所有的监听器
|
|
||||||
this.$listeners,
|
|
||||||
// 然后我们添加自定义监听器,
|
|
||||||
// 或覆写一些监听器的行为
|
|
||||||
{
|
|
||||||
// 这里确保组件配合 `v-model` 的工作
|
|
||||||
input: (value) => {
|
|
||||||
this.$emit("input", this.toUpperCase ? value.toUpperCase() : value);
|
|
||||||
},
|
|
||||||
blur: (e) => {
|
|
||||||
let value = e.target.value
|
|
||||||
.trim()
|
|
||||||
.replace(/\s/g, (match) =>
|
|
||||||
match.charCodeAt(0) === 12288 ? String.fromCharCode(32) : match
|
|
||||||
);
|
|
||||||
|
|
||||||
// 失去焦点自动首位去空格
|
|
||||||
this.$emit("input", value);
|
|
||||||
},
|
|
||||||
}
|
|
||||||
);
|
|
||||||
},
|
|
||||||
},
|
},
|
||||||
mounted() {
|
value: {
|
||||||
// console.warn(this.$route.name);
|
type: String,
|
||||||
|
default: "",
|
||||||
},
|
},
|
||||||
};
|
toUpperCase: {
|
||||||
</script>
|
type: Boolean,
|
||||||
|
default: true,
|
||||||
|
},
|
||||||
|
},
|
||||||
|
computed: {
|
||||||
|
// 所有父级事件
|
||||||
|
inputListeners() {
|
||||||
|
return Object.assign(
|
||||||
|
{},
|
||||||
|
// 我们从父级添加所有的监听器
|
||||||
|
this.$listeners,
|
||||||
|
// 然后我们添加自定义监听器,
|
||||||
|
// 或覆写一些监听器的行为
|
||||||
|
{
|
||||||
|
// 这里确保组件配合 `v-model` 的工作
|
||||||
|
input: (value) => {
|
||||||
|
this.$emit("input", this.toUpperCase ? value.toUpperCase() : value);
|
||||||
|
},
|
||||||
|
blur: (e) => {
|
||||||
|
let value = e.target.value
|
||||||
|
.trim()
|
||||||
|
.replace(/\s/g, (match) =>
|
||||||
|
match.charCodeAt(0) === 12288 ? String.fromCharCode(32) : match
|
||||||
|
);
|
||||||
|
|
||||||
|
// 失去焦点自动首位去空格
|
||||||
|
this.$emit("input", value);
|
||||||
|
},
|
||||||
|
}
|
||||||
|
);
|
||||||
|
},
|
||||||
|
},
|
||||||
|
mounted() {},
|
||||||
|
};
|
||||||
|
</script>
|
||||||
|
|
||||||
<style lang="scss" scoped></style>
|
<style lang="scss" scoped></style>
|
||||||
|
|
|
@ -1,6 +1,6 @@
|
||||||
<template>
|
<template>
|
||||||
<div>
|
<div>
|
||||||
<Pedestal ref="ref_Pedestal" :options="options">
|
<Pedestal ref="ref_Pedestal" v-model="value">
|
||||||
<!-- <template #operate="">
|
<!-- <template #operate="">
|
||||||
<el-button
|
<el-button
|
||||||
class="excel"
|
class="excel"
|
||||||
|
@ -22,6 +22,7 @@ export default {
|
||||||
components: { Pedestal },
|
components: { Pedestal },
|
||||||
data() {
|
data() {
|
||||||
return {
|
return {
|
||||||
|
value: "",
|
||||||
options: {
|
options: {
|
||||||
fnSearch: this.fnSearch,
|
fnSearch: this.fnSearch,
|
||||||
formItemAttrs: {
|
formItemAttrs: {
|
||||||
|
|
|
@ -1,4 +1,4 @@
|
||||||
export default function cloneDeep(obj, hash = new WeakMap()) {
|
function cloneDeep(obj, hash = new WeakMap()) {
|
||||||
if (obj == null || typeof obj !== 'object') return obj
|
if (obj == null || typeof obj !== 'object') return obj
|
||||||
if (obj instanceof Date) return new Date(obj)
|
if (obj instanceof Date) return new Date(obj)
|
||||||
if (obj instanceof RegExp) return new RegExp(obj.source, obj.flags)
|
if (obj instanceof RegExp) return new RegExp(obj.source, obj.flags)
|
||||||
|
@ -10,4 +10,4 @@ export default function cloneDeep(obj, hash = new WeakMap()) {
|
||||||
deepObj[key] = cloneDeep(obj[key], hash)
|
deepObj[key] = cloneDeep(obj[key], hash)
|
||||||
}
|
}
|
||||||
return deepObj
|
return deepObj
|
||||||
}
|
}
|
||||||
|
|
Loading…
Reference in New Issue