Skip to content

Commit 803cd93

Browse files
zhangfisherzhangfisher
committed
feat: 修复不能同步异步计算属性的问题
1 parent c347b82 commit 803cd93

File tree

5 files changed

+69
-10
lines changed

5 files changed

+69
-10
lines changed

‎docs/public/autoform.js‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -405,7 +405,7 @@ Make sure to test your application with a production build as repeat registratio
405405
${this._renderRequiredOption()}
406406
</span>
407407
${B(r==="top"&&!e.viewonly,()=>this.renderHelp())}
408-
</div>`}}renderInput(){return u``}isShowError(){return this.context.validAtInit?!!this.invalidTips:this.dirty?!!this.invalidTips:false}renderError(){return this.isShowError()?u`<div class="error">${this.invalidTips}</div>`:u``}_handleSchemaChange(){let e=this.context;if(e?.store&&this.schema){let r=this.getPath().join("_$_");this._subscribers.push(e.store.schemas.store.watch(`${r}.**`,i=>{let{reply:s,type:n,value:c,flags:a}=i;if(s||e.form.seq===a)return;(n==="batch"?c:[i]).forEach(m=>{let d=m.path.slice(1);Hr(this.schema,d,m.value),this.options[d[0]]=m.value;}),this.requestUpdate();},{operates:"write"}));}}renderView(){let e=this.value;if(this.options.toView&&this.options.toView)try{e=this.options.toView.call(this,this.value);}catch(r){console.error(`Error while toView<${this.path}>: ${r.message}`);}return u`${Ot(String(e))}`}_handleStateChange(){let e=this.context;e?.store&&this.schema&&this._subscribers.push(e.store.watch(this.getPath().join("."),r=>{this.value=this.toInput(r.value);},{operates:"write"}));}getStateValue(){return this.toInput(vn(this.context.store.state,this.getPath()))}connectedCallback(){super.connectedCallback(),this.updateOptions();}updateOptions(){let e=this.context;e?.store&&this.schema&&(this.options=this.getFieldOptions(),this.value=this.getStateValue(),this._handleSchemaChange(),this._handleStateChange(),this.path=this.getPath().join("."),this.name=this.options.name||this.path,this.path in e.store.schemas.errors&&(this.invalidTips=e.store.schemas.errors[this.path]),Array.isArray(this.options.actions)&&(this.beforeActions=this.options.actions.filter(r=>r.pos==="before"),this.afterActions=this.options.actions.filter(r=>r.pos!=="before")));}getInitialOptions(){return {}}disconnectedCallback(){super.disconnectedCallback(),this._subscribers.forEach(e=>e.off());}getLabelPos(){return this.options.labelPos||this.context.labelPos}_updateFormClasss(){this.context.form&&(wo(this.context.form,"dirty",this.dirty),wo(this.context.form,"invalid",!!this.invalidTips));}_updateFieldValue(){if(!this.schema)return;let e=this.getPath(),r=this.toState(this.getInputValue()),i=this.context;i.dirty=true,this.dirty=true;try{let s=this.context.store;this.noreactive||s.update(n=>{let c=yn(r,this.schema);Hr(n,e,c),this.invalidTips=void 0;},{flags:i.form.seq}),this.dispatchEvent(new CustomEvent("field-change",{detail:{value:r,options:this.options},composed:!0,bubbles:!0}));}catch(s){this.invalidTips=s.message;}finally{this._updateFormClasss();}}renderValue(){return u`
408+
</div>`}}renderInput(){return u``}isShowError(){return this.context.validAtInit?!!this.invalidTips:this.dirty?!!this.invalidTips:false}renderError(){return this.isShowError()?u`<div class="error">${this.invalidTips}</div>`:u``}_handleSchemaChange(){let e=this.context;if(e?.store&&this.schema){let r=this.getPath().join("_$_");this._subscribers.push(e.store.schemas.store.watch(`${r}.**`,i=>{let{reply:s,type:n,value:c,flags:a}=i;if(s||e.form.seq===a)return;(n==="batch"?c:[i]).forEach(m=>{let d=m.path.slice(1);Hr(this.schema,d,m.value),this.options[d[0]]=m.value;}),this.requestUpdate();},{operates:"write"}));}}renderView(){let e=this.value;if(this.options.toView&&this.options.toView)try{e=this.options.toView.call(this,this.value);}catch(r){console.error(`Error while toView<${this.path}>: ${r.message}`);}return u`${Ot(String(e))}`}_handleStateChange(){let e=this.context;e?.store&&this.schema&&this._subscribers.push(e.store.watch(this.getPath().join("."),r=>{this.value=this.toInput(r.value);},{operates:"write"}));}getStateValue(){return this.toInput(vn(this.context.store.state,this.getPath()))}connectedCallback(){super.connectedCallback(),this.updateOptions();}updateOptions(){let e=this.context;e?.store&&this.schema&&(this.options=this.getFieldOptions(),this.value=this.getStateValue(),this._handleSchemaChange(),this._handleStateChange(),this.path=this.getPath().join("."),this.name=this.options.name||this.path,this.path in e.store.schemas.errors&&(this.invalidTips=e.store.schemas.errors[this.path]),Array.isArray(this.options.actions)&&(this.beforeActions=this.options.actions.filter(r=>r.pos==="before"),this.afterActions=this.options.actions.filter(r=>r.pos!=="before")));}getInitialOptions(){return {}}disconnectedCallback(){super.disconnectedCallback(),this._subscribers.forEach(e=>{e.off();});}getLabelPos(){return this.options.labelPos||this.context.labelPos}_updateFormClasss(){this.context.form&&(wo(this.context.form,"dirty",this.dirty),wo(this.context.form,"invalid",!!this.invalidTips));}_updateFieldValue(){if(!this.schema)return;let e=this.getPath(),r=this.toState(this.getInputValue()),i=this.context;i.dirty=true,this.dirty=true;try{let s=this.context.store;this.noreactive||s.update(n=>{let c=yn(r,this.schema);Hr(n,e,c),this.invalidTips=void 0;},{flags:i.form.seq}),this.dispatchEvent(new CustomEvent("field-change",{detail:{value:r,options:this.options},composed:!0,bubbles:!0}));}catch(s){this.invalidTips=s.message;}finally{this._updateFormClasss();}}renderValue(){return u`
409409
${this.renderInput()} ${B(this.context.viewonly,()=>this.renderHelp())}
410410
${this.renderError()}
411411
`}getPath(){return this.options.path&&this.options.path.length===0?this.parent?.getPath():this.options.path}updated(){this.options.styles&&Nn(this.shadow,this.options.styles);}render(){let e=this.context,r=this.options.labelPos?this.options.labelPos:e.labelPos;return this.classs.use(e.size,{[`${e.border}-border`]:true,error:this.isShowError(),"left-label":r==="left"||e.viewonly,"top-label":r==="top"&&!e.viewonly,disable:this.options.enable===false,readonly:e.readonly,viewonly:e.viewonly,compact:this.compact===void 0?e.compact:this.compact,required:this.options.required===true,hidden:!this.options.visible,[`view-${e.viewAlign}`]:true,[`${e.layout}-layout`]:true}),u`
@@ -3417,7 +3417,7 @@ Make sure to test your application with a production build as repeat registratio
34173417
}
34183418
`;var xs="__AS_ASYNC_COMPUTED_VALUE__";function _i(t){return toString.call(t)==="[object Map]"}function Ie(t){return t&&typeof t=="object"&&t.hasOwnProperty(xs)}function Ss(t,o){let e=t.get(o);if(e!==void 0)return e;let r=t.get(Number(o)||o);if(r!==void 0)return r}function ye(t,o,e){if(!o||o.length===0)return t;let r=Array.isArray(o)?o:o.split("."),i,s=t;for(let n=0;n<r.length;n++){let c=r[n];if(_i(s))i=Ss(s,c);else if(c in s)i=s[c];else return e;s=i;}return i}function ks(t,o){return t.length>o.length?false:t.every((e,r)=>e===o[r])}(t=>typeof Be<"u"?Be:typeof Proxy<"u"?new Proxy(t,{get:(o,e)=>(typeof Be<"u"?Be:o)[e]}):t)(function(t){if(typeof Be<"u")return Be.apply(this,arguments);throw Error('Dynamic require of "'+t+'" is not supported')});var ze=class{constructor(o,e,r){this.path=e;this.handle=r;this._loading=false;this._ready=false;this.host=o,o.addController(this);}get loading(){return this._loading}get value(){return this._value}load(){let o=this.host.schema,e=ye(o,this.path);Ie(e)?e.loading?(this._loading=true,this._value=this.handle(void 0)):(this._ready=e.value!==void 0,this._value=this.handle(e.value),this._loading=false):(this._ready=true,this._value=this.handle(e),this._loading=false);}render(o){return u`
34193419
${B(this.loading,()=>u`<auto-loading></auto-loading>`,()=>o(this._value))}
3420-
`}hostUpdate(){this._ready||this.load();}hostUpdated(){}};exports.AutoFieldSelect=class fr extends R{constructor(){super(...arguments);this.valueKey="value";this.labelKey="label";this.items=new ze(this,"select",e=>e?e.map(r=>{let i={};return typeof r=="object"?Object.assign(i,r):typeof r=="string"&&r.startsWith("-")?Object.assign(i,{type:"divider"}):Object.assign(i,{label:r}),i}):[]);}getInitialOptions(){return {valueKey:"value",labelKey:"label",select:[],multiple:false,clearable:true,maxOptionsVisible:0,placement:"top"}}_renderItem(e){let r=this.options.renderItem;return typeof r=="string"?u`${Ot(r.replace(/\{(.+?)\}/g,(i,s)=>e[s]))}`:typeof r=="function"?u`${Ot(r(e))}`:e.label||e.value}_onDropdownMenu(){}renderInput(){return u`
3420+
`}hostUpdate(){this._ready||this.load();}hostUpdated(){}};exports.AutoFieldSelect=class fr extends R{constructor(){super(...arguments);this.valueKey="value";this.labelKey="label";this.items=new ze(this,"select",e=>!e||!Array.isArray(e)?[]:e.map(r=>{let i={};return typeof r=="object"?Object.assign(i,r):typeof r=="string"&&r.startsWith("-")?Object.assign(i,{type:"divider"}):Object.assign(i,{label:r}),i}));}getInitialOptions(){return {valueKey:"value",labelKey:"label",select:[],multiple:false,clearable:true,maxOptionsVisible:0,placement:"top"}}_renderItem(e){let r=this.options.renderItem;return typeof r=="string"?u`${Ot(r.replace(/\{(.+?)\}/g,(i,s)=>e[s]))}`:typeof r=="function"?u`${Ot(r(e))}`:e.label||e.value}_onDropdownMenu(){}renderInput(){return u`
34213421
<sl-select
34223422
name="${this.name}"
34233423
data-path="${this.path}"

‎packages/form/examples/ipSyncConfig.ts‎

Lines changed: 60 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -39,10 +39,69 @@ class IPConfigSyncForm extends LitElement {
3939
return value / 1000;
4040
},
4141
}),
42+
audioOut: configurable(3, {
43+
size: 'small',
44+
label: '扬声器',
45+
widget: 'select',
46+
group: 'deviceSettings',
47+
clearable: false,
48+
select: async () => {
49+
return [
50+
{id:1,label:'默认', value:1 },
51+
{id:2, label: '扬声器2', value:2},
52+
{id:3, label: '扬声器3', value:3}
53+
]
54+
}
55+
})
4256
},
4357
});
4458

45-
settingStore = new AutoStore({});
59+
settingStore = new AutoStore({
60+
// selected: {
61+
// video: configurable(1, {
62+
// size: 'small',
63+
// label: '摄像头',
64+
// widget: 'select',
65+
// group: 'deviceSettings',
66+
// clearable: false,
67+
// select: async () => {
68+
// return [
69+
// {id:1,label:'默认', value:1 },
70+
// {id:2, label: '摄像头2', value:2},
71+
// {id:3, label: '摄像头3', value:3}
72+
// ]
73+
// }
74+
// }),
75+
// audioIn: configurable(2, {
76+
// size: 'small',
77+
// label: '麦克风',
78+
// widget: 'select',
79+
// group: 'deviceSettings',
80+
// clearable: false,
81+
// select: async () => {
82+
// return [
83+
// {id:1,label:'默认', value:1 },
84+
// {id:2, label: '麦克风2', value:2},
85+
// {id:3, label: '麦克风3', value:3}
86+
// ]
87+
// }
88+
// }),
89+
// audioOut: configurable(3, {
90+
// size: 'small',
91+
// label: '扬声器',
92+
// widget: 'select',
93+
// group: 'deviceSettings',
94+
// clearable: false,
95+
// select: async () => {
96+
// return [
97+
// {id:1,label:'默认', value:1 },
98+
// {id:2, label: '扬声器2', value:2},
99+
// {id:3, label: '扬声器3', value:3}
100+
// ]
101+
// }
102+
// })
103+
//},
104+
});
46105
constructor() {
47106
super();
48107
this._syncSettings();

‎packages/form/index.html‎

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -29,7 +29,7 @@
2929
<sl-tab-group>
3030
<!-- <sl-tab slot="nav" panel="ip">网络配置</sl-tab> -->
3131

32-
<sl-tab slot="nav" panel="syncip2">无映射网络配置</sl-tab>
32+
<!-- <sl-tab slot="nav" panel="syncip2">无映射网络配置</sl-tab> -->
3333
<sl-tab slot="nav" panel="syncip">同步后网络配置</sl-tab>
3434
<!--<sl-tab slot="nav" panel="addcontact">增加联系人</sl-tab>-->
3535
<!-- <sl-tab slot="nav" panel="general">默认</sl-tab> -->
@@ -97,10 +97,10 @@
9797
<!-- <sl-tab-panel name="ip">
9898
<ip-config></ip-config>
9999
</sl-tab-panel> -->
100-
100+
<!--
101101
<sl-tab-panel name="syncip2">
102102
<ip-sync-config2></ip-sync-config2>
103-
</sl-tab-panel>
103+
</sl-tab-panel> -->
104104
<sl-tab-panel name="syncip">
105105
<ip-sync-config></ip-sync-config>
106106
</sl-tab-panel>

‎packages/form/src/widgets/select.ts‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -48,7 +48,7 @@ export class AutoFieldSelect extends AutoField<AutoFieldSelectOptions> {
4848
labelKey: string = "label";
4949

5050
items = new AsyncOptionState<any[]>(this, "select", (items) => {
51-
if (!items) return [];
51+
if (!items || !Array.isArray(items)) return [];
5252
return items.map((item: any) => {
5353
const selectItem: any = {};
5454
if (typeof item === "object") {

‎packages/syncer/src/syncer.ts‎

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -138,10 +138,10 @@ export class AutoStoreSyncer {
138138
// 路径变换
139139
const toPath = this._options.pathMap.toRemote(firstPath, operate.value);
140140
if (toPath) {
141-
operate.path = [[...remoteEntry, ...toPath].join("_$_"), operate.path[1]];
141+
operate.path = [[...remoteEntry, ...toPath].join("_$_"), ...operate.path.slice(1)];
142142
}
143143
} else {
144-
operate.path = [[...remoteEntry, ...firstPath].join("_$_"), operate.path[1]];
144+
operate.path = [[...remoteEntry, ...firstPath].join("_$_"), ...operate.path.slice(1)];
145145
}
146146
operate.parentPath = [operate.path[0]];
147147

@@ -457,7 +457,7 @@ export class AutoStoreSyncer {
457457
}
458458
return result;
459459
}, {} as any);
460-
const schemas = getSnapshot(schemaState, { includeFunc: true });
460+
const schemas = getSnapshot(schemaState, { includeFunc: true,reserveAsync:true });
461461
// 将store中的computed对象恢复为getter，以便在远程端可以重建computed对象
462462
// Object.entries(this.store.schemas.store.computedObjects).forEach(([key, computedObj]) => {});
463463
return schemas;

0 commit comments

Comments
 (0)