From 6ff0a7f0215de1acd0490020b53485c45550df79 Mon Sep 17 00:00:00 2001 From: Henry Jameson Date: Wed, 24 Apr 2024 15:58:26 +0300 Subject: refactor sizesetting into unitsetting allowing more unit types with i18n support --- .../settings_modal/helpers/unit_setting.js | 48 ++++++++++++++++++++++ 1 file changed, 48 insertions(+) create mode 100644 src/components/settings_modal/helpers/unit_setting.js (limited to 'src/components/settings_modal/helpers/unit_setting.js') diff --git a/src/components/settings_modal/helpers/unit_setting.js b/src/components/settings_modal/helpers/unit_setting.js new file mode 100644 index 00000000..c9c23cb0 --- /dev/null +++ b/src/components/settings_modal/helpers/unit_setting.js @@ -0,0 +1,48 @@ +import Select from 'src/components/select/select.vue' +import Setting from './setting.js' + +export const allCssUnits = ['cm', 'mm', 'in', 'px', 'pt', 'pc', 'em', 'ex', 'ch', 'rem', 'vw', 'vh', 'vmin', 'vmax', '%'] +export const defaultHorizontalUnits = ['px', 'rem', 'vw'] +export const defaultVerticalUnits = ['px', 'rem', 'vh'] + +export default { + ...Setting, + components: { + ...Setting.components, + Select + }, + props: { + ...Setting.props, + min: Number, + units: { + type: Array, + default: () => allCssUnits + }, + unitSet: { + type: String, + default: 'none' + } + }, + computed: { + ...Setting.computed, + stateUnit () { + return this.state.replace(/\d+/, '') + }, + stateValue () { + return this.state.replace(/\D+/, '') + } + }, + methods: { + ...Setting.methods, + getUnitString (value) { + if (this.unitSet === 'none') return value + return this.$t(['settings', 'units', this.unitSet, value].join('.')) + }, + updateValue (e) { + this.configSink(this.path, parseInt(e.target.value) + this.stateUnit) + }, + updateUnit (e) { + this.configSink(this.path, this.stateValue + e.target.value) + } + } +} -- cgit v1.2.3-70-g09d2