120 lines
2.5 KiB
JavaScript
120 lines
2.5 KiB
JavaScript
import { h, Component, render } from '@/components/preact'
|
|
import Framework from '@/components/element/framework'
|
|
import { selector, warn, listenerClose, watch, safety, isArray } from '@/components/common/util'
|
|
import defaultOptions from '@/components/config/options'
|
|
|
|
|
|
|
|
/**
|
|
* 保留初始化的数据
|
|
*/
|
|
const initData = {};
|
|
const data = {};
|
|
const onClose = (el) => Object.keys(data).filter(a => a != el).forEach(el => data[el].closed());
|
|
listenerClose(data, onClose);
|
|
|
|
/**
|
|
* 子组件集合
|
|
*/
|
|
const childs = {};
|
|
|
|
|
|
/**
|
|
* 对外提供的处理方法
|
|
*/
|
|
class xmOptions {
|
|
|
|
constructor(options) {
|
|
//保留初始化时的数据
|
|
initData[options.el] = options;
|
|
//定义默认值
|
|
this.options = defaultOptions(options.language);
|
|
//开始渲染数据
|
|
this.update(options, true);
|
|
}
|
|
|
|
/**
|
|
* 更新数据 + 重新渲染
|
|
*/
|
|
update(options = {}, isNew){
|
|
//记录最新的配置项
|
|
this.options = {...this.options, ...options};
|
|
|
|
//如果dom不存在, 则不进行渲染事项
|
|
let dom = selector(this.options.el);
|
|
if(!dom){
|
|
warn(`没有找到渲染对象: ${options.el}, 请检查`)
|
|
return ;
|
|
}
|
|
//如果是历史渲染过的数据, 重置一下数据
|
|
isNew && childs[this.options.el] && childs[this.options.el].reset();
|
|
|
|
let isRender = false;
|
|
const onRef = (ref) => childs[this.options.el] = ref;
|
|
const onReset = result => {
|
|
this.options.data = result;
|
|
}
|
|
|
|
render(<Framework { ...this.options } onReset={ onReset } onClose={ onClose } onRef={ onRef } />, dom);
|
|
|
|
//记录数据
|
|
data[this.options.el] = this;
|
|
//返回多选对象
|
|
return this;
|
|
}
|
|
|
|
/**
|
|
* 重置多选, 回到初始化的状态
|
|
*/
|
|
reset(){
|
|
let initVal = this.options;
|
|
//设置options的默认数据
|
|
this.options = defaultOptions(initVal.language);
|
|
//更新渲染
|
|
this.update({ ...initData[initVal.el]});
|
|
//子组件初始化
|
|
childs[this.options.el].reset();
|
|
return this;
|
|
}
|
|
|
|
/**
|
|
* 主动打开多选
|
|
*/
|
|
opened(){
|
|
let ref = childs[this.options.el];
|
|
!ref.state.show && ref.onClick();
|
|
return this;
|
|
}
|
|
|
|
/**
|
|
* 主动关闭多选
|
|
*/
|
|
closed(){
|
|
let ref = childs[this.options.el];
|
|
ref.state.show && ref.onClick();
|
|
return this;
|
|
}
|
|
|
|
/**
|
|
* 获取多选选中的数据
|
|
*/
|
|
getValue(){
|
|
return safety(childs[this.options.el].state.sels);
|
|
}
|
|
|
|
/**
|
|
* 设置多选数据
|
|
*/
|
|
setValue(sels, show){
|
|
if(!isArray(sels)){
|
|
warn('请传入数组结构...')
|
|
return ;
|
|
}
|
|
childs[this.options.el].value(sels, !!show);
|
|
return this;
|
|
}
|
|
|
|
|
|
}
|
|
|
|
export default xmOptions; |