cy-element-ui 1.1.23 → 1.1.26

package/packages/transfer/src/main.vue

@@ -1,231 +1,231 @@
-<template>
-	<div class="el-transfer">
-		<transfer-panel
-			v-bind="$props"
-			ref="leftPanel"
-			:data="sourceData"
-			:title="titles[0] || t('el.transfer.titles.0')"
-			:default-checked="leftDefaultChecked"
-			:placeholder="filterPlaceholder || t('el.transfer.filterPlaceholder')"
-			@checked-change="onSourceCheckedChange">
-			<slot name="left-footer"></slot>
-		</transfer-panel>
-		<div class="el-transfer__buttons">
-			<el-button
-				type="primary"
-				:class="['el-transfer__button', hasButtonTexts ? 'is-with-texts' : '']"
-				@click.native="addToLeft"
-				:disabled="rightChecked.length === 0">
-				<i class="el-icon-arrow-left"></i>
-				<span v-if="buttonTexts[0] !== undefined">{{ buttonTexts[0] }}</span>
-			</el-button>
-			<el-button
-				type="primary"
-				:class="['el-transfer__button', hasButtonTexts ? 'is-with-texts' : '']"
-				@click.native="addToRight"
-				:disabled="leftChecked.length === 0">
-				<span v-if="buttonTexts[1] !== undefined">{{ buttonTexts[1] }}</span>
-				<i class="el-icon-arrow-right"></i>
-			</el-button>
-		</div>
-		<transfer-panel
-			v-bind="$props"
-			ref="rightPanel"
-			:data="targetData"
-			:title="titles[1] || t('el.transfer.titles.1')"
-			:default-checked="rightDefaultChecked"
-			:placeholder="filterPlaceholder || t('el.transfer.filterPlaceholder')"
-			@checked-change="onTargetCheckedChange">
-			<slot name="right-footer"></slot>
-		</transfer-panel>
-	</div>
-</template>
-
-<script>
-import ElButton from 'element-ui/packages/button';
-import Emitter from 'element-ui/src/mixins/emitter';
-import Locale from 'element-ui/src/mixins/locale';
-import TransferPanel from './transfer-panel.vue';
-import Migrating from 'element-ui/src/mixins/migrating';
-
-export default {
-	name: 'ElTransfer',
-
-	mixins: [Emitter, Locale, Migrating],
-
-	components: {
-		TransferPanel,
-		ElButton
-	},
-
-	props: {
-		data: {
-			type: Array,
-			default() {
-				return [];
-			}
-		},
-		titles: {
-			type: Array,
-			default() {
-				return [];
-			}
-		},
-		buttonTexts: {
-			type: Array,
-			default() {
-				return [];
-			}
-		},
-		filterPlaceholder: {
-			type: String,
-			default: ''
-		},
-		filterMethod: Function,
-		leftDefaultChecked: {
-			type: Array,
-			default() {
-				return [];
-			}
-		},
-		rightDefaultChecked: {
-			type: Array,
-			default() {
-				return [];
-			}
-		},
-		renderContent: Function,
-		value: {
-			type: Array,
-			default() {
-				return [];
-			}
-		},
-		format: {
-			type: Object,
-			default() {
-				return {};
-			}
-		},
-		filterable: Boolean,
-		props: {
-			type: Object,
-			default() {
-				return {
-					label: 'label',
-					key: 'key',
-					disabled: 'disabled'
-				};
-			}
-		},
-		targetOrder: {
-			type: String,
-			default: 'original'
-		}
-	},
-
-	data() {
-		return {
-			leftChecked: [],
-			rightChecked: []
-		};
-	},
-
-	computed: {
-		dataObj() {
-			const key = this.props.key;
-			return this.data.reduce((o, cur) => (o[cur[key]] = cur) && o, {});
-		},
-  
-		sourceData() {
-			return this.data.filter(item => this.value.indexOf(item[this.props.key]) === -1);
-		},
-
-		targetData() {
-			if (this.targetOrder === 'original') {
-				return this.data.filter(item => this.value.indexOf(item[this.props.key]) > -1);
-			} else {
-				return this.value.reduce((arr, cur) => {
-					const val = this.dataObj[cur];
-					if (val) {
-						arr.push(val);
-					}
-					return arr;
-				}, []);
-			}
-		},
-
-		hasButtonTexts() {
-			return this.buttonTexts.length === 2;
-		}
-	},
-
-	watch: {
-		value(val) {
-			this.dispatch('ElFormItem', 'el.form.change', val);
-		}
-	},
-
-	methods: {
-		getMigratingConfig() {
-			return {
-				props: {
-					'footer-format': 'footer-format is renamed to format.'
-				}
-			};
-		},
-
-		onSourceCheckedChange(val, movedKeys) {
-			this.leftChecked = val;
-			if (movedKeys === undefined) return;
-			this.$emit('left-check-change', val, movedKeys);
-		},
-
-		onTargetCheckedChange(val, movedKeys) {
-			this.rightChecked = val;
-			if (movedKeys === undefined) return;
-			this.$emit('right-check-change', val, movedKeys);
-		},
-
-		addToLeft() {
-			let currentValue = this.value.slice();
-			this.rightChecked.forEach(item => {
-				const index = currentValue.indexOf(item);
-				if (index > -1) {
-					currentValue.splice(index, 1);
-				}
-			});
-			this.$emit('input', currentValue);
-			this.$emit('change', currentValue, 'left', this.rightChecked);
-		},
-
-		addToRight() {
-			let currentValue = this.value.slice();
-			const itemsToBeMoved = [];
-			const key = this.props.key;
-			this.data.forEach(item => {
-				const itemKey = item[key];
-				if (
-					this.leftChecked.indexOf(itemKey) > -1 &&
-					this.value.indexOf(itemKey) === -1
-				) {
-					itemsToBeMoved.push(itemKey);
-				}
-			});
-			currentValue = this.targetOrder === 'unshift'
-				? itemsToBeMoved.concat(currentValue)
-				: currentValue.concat(itemsToBeMoved);
-			this.$emit('input', currentValue);
-			this.$emit('change', currentValue, 'right', this.leftChecked);
-		},
-
-		clearQuery(which) {
-			if (which === 'left') {
-				this.$refs.leftPanel.query = '';
-			} else if (which === 'right') {
-				this.$refs.rightPanel.query = '';
-			}
-		}
-	}
-};
-</script>
+<template>
+	<div class="el-transfer">
+		<transfer-panel
+			v-bind="$props"
+			ref="leftPanel"
+			:data="sourceData"
+			:title="titles[0] || t('el.transfer.titles.0')"
+			:default-checked="leftDefaultChecked"
+			:placeholder="filterPlaceholder || t('el.transfer.filterPlaceholder')"
+			@checked-change="onSourceCheckedChange">
+			<slot name="left-footer"></slot>
+		</transfer-panel>
+		<div class="el-transfer__buttons">
+			<el-button
+				type="primary"
+				:class="['el-transfer__button', hasButtonTexts ? 'is-with-texts' : '']"
+				@click.native="addToLeft"
+				:disabled="rightChecked.length === 0">
+				<i class="el-icon-arrow-left"></i>
+				<span v-if="buttonTexts[0] !== undefined">{{ buttonTexts[0] }}</span>
+			</el-button>
+			<el-button
+				type="primary"
+				:class="['el-transfer__button', hasButtonTexts ? 'is-with-texts' : '']"
+				@click.native="addToRight"
+				:disabled="leftChecked.length === 0">
+				<span v-if="buttonTexts[1] !== undefined">{{ buttonTexts[1] }}</span>
+				<i class="el-icon-arrow-right"></i>
+			</el-button>
+		</div>
+		<transfer-panel
+			v-bind="$props"
+			ref="rightPanel"
+			:data="targetData"
+			:title="titles[1] || t('el.transfer.titles.1')"
+			:default-checked="rightDefaultChecked"
+			:placeholder="filterPlaceholder || t('el.transfer.filterPlaceholder')"
+			@checked-change="onTargetCheckedChange">
+			<slot name="right-footer"></slot>
+		</transfer-panel>
+	</div>
+</template>
+
+<script>
+import ElButton from 'element-ui/packages/button';
+import Emitter from 'element-ui/src/mixins/emitter';
+import Locale from 'element-ui/src/mixins/locale';
+import TransferPanel from './transfer-panel.vue';
+import Migrating from 'element-ui/src/mixins/migrating';
+
+export default {
+	name: 'ElTransfer',
+
+	mixins: [Emitter, Locale, Migrating],
+
+	components: {
+		TransferPanel,
+		ElButton
+	},
+
+	props: {
+		data: {
+			type: Array,
+			default() {
+				return [];
+			}
+		},
+		titles: {
+			type: Array,
+			default() {
+				return [];
+			}
+		},
+		buttonTexts: {
+			type: Array,
+			default() {
+				return [];
+			}
+		},
+		filterPlaceholder: {
+			type: String,
+			default: ''
+		},
+		filterMethod: Function,
+		leftDefaultChecked: {
+			type: Array,
+			default() {
+				return [];
+			}
+		},
+		rightDefaultChecked: {
+			type: Array,
+			default() {
+				return [];
+			}
+		},
+		renderContent: Function,
+		value: {
+			type: Array,
+			default() {
+				return [];
+			}
+		},
+		format: {
+			type: Object,
+			default() {
+				return {};
+			}
+		},
+		filterable: Boolean,
+		props: {
+			type: Object,
+			default() {
+				return {
+					label: 'label',
+					key: 'key',
+					disabled: 'disabled'
+				};
+			}
+		},
+		targetOrder: {
+			type: String,
+			default: 'original'
+		}
+	},
+
+	data() {
+		return {
+			leftChecked: [],
+			rightChecked: []
+		};
+	},
+
+	computed: {
+		dataObj() {
+			const key = this.props.key;
+			return this.data.reduce((o, cur) => (o[cur[key]] = cur) && o, {});
+		},
+  
+		sourceData() {
+			return this.data.filter(item => this.value.indexOf(item[this.props.key]) === -1);
+		},
+
+		targetData() {
+			if (this.targetOrder === 'original') {
+				return this.data.filter(item => this.value.indexOf(item[this.props.key]) > -1);
+			} else {
+				return this.value.reduce((arr, cur) => {
+					const val = this.dataObj[cur];
+					if (val) {
+						arr.push(val);
+					}
+					return arr;
+				}, []);
+			}
+		},
+
+		hasButtonTexts() {
+			return this.buttonTexts.length === 2;
+		}
+	},
+
+	watch: {
+		value(val) {
+			this.dispatch('ElFormItem', 'el.form.change', val);
+		}
+	},
+
+	methods: {
+		getMigratingConfig() {
+			return {
+				props: {
+					'footer-format': 'footer-format is renamed to format.'
+				}
+			};
+		},
+
+		onSourceCheckedChange(val, movedKeys) {
+			this.leftChecked = val;
+			if (movedKeys === undefined) return;
+			this.$emit('left-check-change', val, movedKeys);
+		},
+
+		onTargetCheckedChange(val, movedKeys) {
+			this.rightChecked = val;
+			if (movedKeys === undefined) return;
+			this.$emit('right-check-change', val, movedKeys);
+		},
+
+		addToLeft() {
+			let currentValue = this.value.slice();
+			this.rightChecked.forEach(item => {
+				const index = currentValue.indexOf(item);
+				if (index > -1) {
+					currentValue.splice(index, 1);
+				}
+			});
+			this.$emit('input', currentValue);
+			this.$emit('change', currentValue, 'left', this.rightChecked);
+		},
+
+		addToRight() {
+			let currentValue = this.value.slice();
+			const itemsToBeMoved = [];
+			const key = this.props.key;
+			this.data.forEach(item => {
+				const itemKey = item[key];
+				if (
+					this.leftChecked.indexOf(itemKey) > -1 &&
+					this.value.indexOf(itemKey) === -1
+				) {
+					itemsToBeMoved.push(itemKey);
+				}
+			});
+			currentValue = this.targetOrder === 'unshift'
+				? itemsToBeMoved.concat(currentValue)
+				: currentValue.concat(itemsToBeMoved);
+			this.$emit('input', currentValue);
+			this.$emit('change', currentValue, 'right', this.leftChecked);
+		},
+
+		clearQuery(which) {
+			if (which === 'left') {
+				this.$refs.leftPanel.query = '';
+			} else if (which === 'right') {
+				this.$refs.rightPanel.query = '';
+			}
+		}
+	}
+};
+</script>