Skip to content

Commit 67f0fa4

Browse files
committed
feat: 同步时schema支持计算属性
1 parent 60e7588 commit 67f0fa4

File tree

18 files changed

+732
-661
lines changed

18 files changed

+732
-661
lines changed

.changeset/config.json

Lines changed: 9 additions & 22 deletions
Original file line numberDiff line numberDiff line change
@@ -1,24 +1,11 @@
11
{
2-
"$schema": "https://unpkg.com/@changesets/[email protected]/schema.json",
3-
"changelog": "@changesets/cli/changelog",
4-
"commit": true,
5-
"access": "public",
6-
"fixed": [
7-
[
8-
"autostore",
9-
"@autostorejs/react",
10-
"@autostorejs/syncer",
11-
"@autostorejs/form",
12-
"@autostorejs/devtools"
13-
]
14-
],
15-
"linked": [],
16-
"baseBranch": "master",
17-
"updateInternalDependencies": "patch",
18-
"ignore": [
19-
"autostore-docs",
20-
"@autostore-examples/benchmark",
21-
"@autostore-examples/syncer",
22-
"@autostore-examples/storybook"
23-
]
2+
"$schema": "https://unpkg.com/@changesets/[email protected]/schema.json",
3+
"changelog": "@changesets/cli/changelog",
4+
"commit": true,
5+
"access": "public",
6+
"fixed": [["autostore", "@autostorejs/react", "@autostorejs/syncer", "@autostorejs/form", "@autostorejs/devtools"]],
7+
"linked": [],
8+
"baseBranch": "master",
9+
"updateInternalDependencies": "patch",
10+
"ignore": ["autostore-docs"]
2411
}

docs/public/autoform.js

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -334,7 +334,7 @@ Make sure to test your application with a production build as repeat registratio
334334
}
335335
}
336336
}
337-
`;var yt={ATTRIBUTE:1,CHILD:2,PROPERTY:3,BOOLEAN_ATTRIBUTE:4},Pt=t=>(...o)=>({_$litDirective$:t,values:o}),At=class{constructor(o){}get _$AU(){return this._$AM._$AU}_$AT(o,e,r){this._$Ct=o,this._$AM=e,this._$Ci=r;}_$AS(o,e){return this.update(o,e)}update(o,e){return this.render(...e)}};var{I:Rc}=en;var Hn=(t,o)=>t?._$litType$!==void 0;var qr=t=>t.strings===void 0,Fn=()=>document.createComment(""),xo=(t,o,e)=>{let r=t._$AA.parentNode,i=o===void 0?t._$AB:o._$AA;if(e===void 0){let s=r.insertBefore(Fn(),i),n=r.insertBefore(Fn(),i);e=new Rc(s,n,t,t.options);}else {let s=e._$AB.nextSibling,n=e._$AM,c=n!==t;if(c){let a;e._$AQ?.(t),e._$AM=t,e._$AP!==void 0&&(a=t._$AU)!==n._$AU&&e._$AP(a);}if(s!==i||c){let a=e._$AA;for(;a!==s;){let h=a.nextSibling;r.insertBefore(a,i),a=h;}}}return e},Ee=(t,o,e=t)=>(t._$AI(o,e),t),zc={},Kr=(t,o=zc)=>t._$AH=o,Bn=t=>t._$AH,Gr=t=>{t._$AR(),t._$AA.remove();};var Wn=(t,o,e)=>{let r=new Map;for(let i=o;i<=e;i++)r.set(t[i],i);return r},tt=Pt(class extends At{constructor(t){if(super(t),t.type!==yt.CHILD)throw Error("repeat() can only be used in text expressions")}dt(t,o,e){let r;e===void 0?e=o:o!==void 0&&(r=o);let i=[],s=[],n=0;for(let c of t)i[n]=r?r(c,n):n,s[n]=e(c,n),n++;return {values:s,keys:i}}render(t,o,e){return this.dt(t,o,e).values}update(t,[o,e,r]){let i=Bn(t),{values:s,keys:n}=this.dt(o,e,r);if(!Array.isArray(i))return this.ut=n,s;let c=this.ut??=[],a=[],h,m,d=0,f=i.length-1,g=0,b=s.length-1;for(;d<=f&&g<=b;)if(i[d]===null)d++;else if(i[f]===null)f--;else if(c[d]===n[g])a[g]=Ee(i[d],s[g]),d++,g++;else if(c[f]===n[b])a[b]=Ee(i[f],s[b]),f--,b--;else if(c[d]===n[b])a[b]=Ee(i[d],s[b]),xo(t,a[b+1],i[d]),d++,b--;else if(c[f]===n[g])a[g]=Ee(i[f],s[g]),xo(t,i[d],i[f]),f--,g++;else if(h===void 0&&(h=Wn(n,g,b),m=Wn(c,d,f)),h.has(c[d]))if(h.has(c[f])){let x=m.get(n[g]),I=x!==void 0?i[x]:null;if(I===null){let E=xo(t,i[d]);Ee(E,s[g]),a[g]=E;}else a[g]=Ee(I,s[g]),xo(t,i[d],I),i[x]=null;g++;}else Gr(i[f]),f--;else Gr(i[d]),d++;for(;g<=b;){let x=xo(t,a[b+1]);Ee(x,s[g]),a[g++]=x;}for(;d<=f;){let x=i[d++];x!==null&&Gr(x);}return this.ut=n,Kr(t,a),at}});var _o=class{constructor(o){this.host=o,o.addController(this);}updateContext(){Object.assign(this.host.context,{labelPos:this.host.labelPos,labelWidth:this.host.labelWidth,readonly:this.host.readonly,viewonly:this.host.viewonly,viewAlign:this.host.viewAlign,compact:this.host.compact,border:this.host.border,group:this.host.group,layout:this.host.layout,advanced:this.host.advanced,validAt:this.host.validAt,size:this.host.size});}hostUpdate(){this.host.tagName==="AUTO-FORM"&&this.updateContext();}};var jn="important",Lc=" !"+jn,J=Pt(class extends At{constructor(t){if(super(t),t.type!==yt.ATTRIBUTE||t.name!=="style"||t.strings?.length>2)throw Error("The `styleMap` directive must be used in the `style` attribute and must be the only part in the attribute.")}render(t){return Object.keys(t).reduce(((o,e)=>{let r=t[e];return r==null?o:o+`${e=e.includes("-")?e:e.replace(/(?:^(webkit|moz|ms|o)|)(?=[A-Z])/g,"-$&").toLowerCase()}:${r};`}),"")}update(t,[o]){let{style:e}=t.element;if(this.ft===void 0)return this.ft=new Set(Object.keys(o)),this.render(o);for(let r of this.ft)o[r]==null&&(this.ft.delete(r),r.includes("-")?e.removeProperty(r):e[r]=null);for(let r in o){let i=o[r];if(i!=null){this.ft.add(r);let s=typeof i=="string"&&i.endsWith(Lc);r.includes("-")||s?e.setProperty(r,s?i.slice(0,-11):i,s?jn:""):e[r]=i;}}return at}});function B(t,o,e){return t?o(t):e?.(t)}var Ae=class{constructor(o,...e){this.initialClasses=[];this.host=o,o.addController(this),this.initialClasses=e;}_forEachClasss(o,e){o&&o.forEach(r=>{typeof r=="string"?(e(r,true),this.host.classList.add(r)):Object.entries(r).forEach(([i,s])=>{e(i,s);});});}add(...o){this.host&&o&&this._forEachClasss(o,e=>{this.host.classList.add(e);});}remove(...o){this.host&&o&&this._forEachClasss(o,e=>{this.host.classList.remove(e);});}toggle(...o){this.host&&this._forEachClasss(o,e=>{this.host.classList.toggle(e);});}use(...o){this.host&&this._forEachClasss(o,(e,r)=>{r?this.host.classList.add(e):this.host.classList.remove(e);});}has(o){return this.host.classList.contains(o)}hostConnected(){this.add(...this.initialClasses);}hostDisconnected(){this.remove(...this.initialClasses);}hostUpdate(){}};var Yo=class extends At{constructor(o){if(super(o),this.it=Y,o.type!==yt.CHILD)throw Error(this.constructor.directiveName+"() can only be used in child bindings")}render(o){if(o===Y||o==null)return this._t=void 0,this.it=o;if(o===at)return o;if(typeof o!="string")throw Error(this.constructor.directiveName+"() called with a non-string value");if(o===this.it)return this._t;this.it=o;let e=[o];return e.raw=e,this._t={_$litType$:this.constructor.resultType,strings:e,values:[]}}};Yo.directiveName="unsafeHTML",Yo.resultType=1;var Ot=Pt(Yo);function Nn(t,o){o&&Object.entries(o).forEach(([e,r])=>{(e==="root"?[t]:Array.from(t.querySelectorAll(e))).forEach(s=>{typeof r=="string"?s.style.cssText=r:typeof r=="object"&&Object.assign(s.style,r);});});}function wo(t,o,e){e?t.classList.add(o):t.classList.remove(o);}function Un(){return {widget:"input",name:"",path:[],visible:true,enable:true,required:false,order:0,advanced:false,actions:[]}}var R=class extends lt{constructor(){super(...arguments);this.theme=new _o(this);this.classs=new Ae(this);this.options=Un();this.value="";this.name="";this.path="";this.labelPos="top";this.dirty=false;this.noreactive=false;this.beforeActions=[];this.afterActions=[];this._subscribers=[];this.onFieldChange=()=>this._updateFieldValue();this.onFieldInput=()=>this._updateFieldValue();}static{this.styles=Mn;}get shadow(){return this.shadowRoot}getFieldOptions(){return Object.entries(this.schema||{}).reduce((e,[r,i])=>(ke(i)?e[r]=i.value:e[r]=i,e),Object.assign({},Un(),this.getInitialOptions()))}getPrefix(){}getSuffix(){}renderActions(e=true){return u`${this.renderBeforeActions(e)} ${this.renderAfterActions(e)}`}_onClickAction(e,r){return i=>{typeof r=="function"&&r(i),e.onClick&&typeof e.onClick=="function"&&e.onClick?.call(this,this.getInputValue(),{action:e,options:this.options,event:i,update:s=>{Hr(this.context.store.state,this.options.path,s);}});}}renderBeforeActions(e){if(Array.isArray(this.beforeActions)&&this.beforeActions.length>0)return u`<div
337+
`;var yt={ATTRIBUTE:1,CHILD:2,PROPERTY:3,BOOLEAN_ATTRIBUTE:4},Pt=t=>(...o)=>({_$litDirective$:t,values:o}),At=class{constructor(o){}get _$AU(){return this._$AM._$AU}_$AT(o,e,r){this._$Ct=o,this._$AM=e,this._$Ci=r;}_$AS(o,e){return this.update(o,e)}update(o,e){return this.render(...e)}};var{I:Rc}=en;var Hn=(t,o)=>t?._$litType$!==void 0;var qr=t=>t.strings===void 0,Fn=()=>document.createComment(""),xo=(t,o,e)=>{let r=t._$AA.parentNode,i=o===void 0?t._$AB:o._$AA;if(e===void 0){let s=r.insertBefore(Fn(),i),n=r.insertBefore(Fn(),i);e=new Rc(s,n,t,t.options);}else {let s=e._$AB.nextSibling,n=e._$AM,c=n!==t;if(c){let a;e._$AQ?.(t),e._$AM=t,e._$AP!==void 0&&(a=t._$AU)!==n._$AU&&e._$AP(a);}if(s!==i||c){let a=e._$AA;for(;a!==s;){let h=a.nextSibling;r.insertBefore(a,i),a=h;}}}return e},Ee=(t,o,e=t)=>(t._$AI(o,e),t),zc={},Kr=(t,o=zc)=>t._$AH=o,Bn=t=>t._$AH,Gr=t=>{t._$AR(),t._$AA.remove();};var Wn=(t,o,e)=>{let r=new Map;for(let i=o;i<=e;i++)r.set(t[i],i);return r},tt=Pt(class extends At{constructor(t){if(super(t),t.type!==yt.CHILD)throw Error("repeat() can only be used in text expressions")}dt(t,o,e){let r;e===void 0?e=o:o!==void 0&&(r=o);let i=[],s=[],n=0;for(let c of t)i[n]=r?r(c,n):n,s[n]=e(c,n),n++;return {values:s,keys:i}}render(t,o,e){return this.dt(t,o,e).values}update(t,[o,e,r]){let i=Bn(t),{values:s,keys:n}=this.dt(o,e,r);if(!Array.isArray(i))return this.ut=n,s;let c=this.ut??=[],a=[],h,m,d=0,f=i.length-1,g=0,b=s.length-1;for(;d<=f&&g<=b;)if(i[d]===null)d++;else if(i[f]===null)f--;else if(c[d]===n[g])a[g]=Ee(i[d],s[g]),d++,g++;else if(c[f]===n[b])a[b]=Ee(i[f],s[b]),f--,b--;else if(c[d]===n[b])a[b]=Ee(i[d],s[b]),xo(t,a[b+1],i[d]),d++,b--;else if(c[f]===n[g])a[g]=Ee(i[f],s[g]),xo(t,i[d],i[f]),f--,g++;else if(h===void 0&&(h=Wn(n,g,b),m=Wn(c,d,f)),h.has(c[d]))if(h.has(c[f])){let x=m.get(n[g]),I=x!==void 0?i[x]:null;if(I===null){let E=xo(t,i[d]);Ee(E,s[g]),a[g]=E;}else a[g]=Ee(I,s[g]),xo(t,i[d],I),i[x]=null;g++;}else Gr(i[f]),f--;else Gr(i[d]),d++;for(;g<=b;){let x=xo(t,a[b+1]);Ee(x,s[g]),a[g++]=x;}for(;d<=f;){let x=i[d++];x!==null&&Gr(x);}return this.ut=n,Kr(t,a),at}});var _o=class{constructor(o){this.host=o,o.addController(this);}updateContext(){Object.assign(this.host.context,{labelPos:this.host.labelPos,labelWidth:this.host.labelWidth,readonly:this.host.readonly,viewonly:this.host.viewonly,viewAlign:this.host.viewAlign,compact:this.host.compact,border:this.host.border,group:this.host.group,layout:this.host.layout,advanced:this.host.advanced,validAt:this.host.validAt,size:this.host.size});}hostUpdate(){this.host.tagName==="AUTO-FORM"&&this.updateContext();}};var jn="important",Lc=" !"+jn,J=Pt(class extends At{constructor(t){if(super(t),t.type!==yt.ATTRIBUTE||t.name!=="style"||t.strings?.length>2)throw Error("The `styleMap` directive must be used in the `style` attribute and must be the only part in the attribute.")}render(t){return Object.keys(t).reduce(((o,e)=>{let r=t[e];return r==null?o:o+`${e=e.includes("-")?e:e.replace(/(?:^(webkit|moz|ms|o)|)(?=[A-Z])/g,"-$&").toLowerCase()}:${r};`}),"")}update(t,[o]){let{style:e}=t.element;if(this.ft===void 0)return this.ft=new Set(Object.keys(o)),this.render(o);for(let r of this.ft)o[r]==null&&(this.ft.delete(r),r.includes("-")?e.removeProperty(r):e[r]=null);for(let r in o){let i=o[r];if(i!=null){this.ft.add(r);let s=typeof i=="string"&&i.endsWith(Lc);r.includes("-")||s?e.setProperty(r,s?i.slice(0,-11):i,s?jn:""):e[r]=i;}}return at}});function B(t,o,e){return t?o(t):e?.(t)}var Ae=class{constructor(o,...e){this.initialClasses=[];this.host=o,o.addController(this),this.initialClasses=e;}_forEachClasss(o,e){o&&o.forEach(r=>{typeof r=="string"?(e(r,true),this.host.classList.add(r)):Object.entries(r).forEach(([i,s])=>{e(i,s);});});}add(...o){this.host&&o&&this._forEachClasss(o,e=>{this.host.classList.add(e);});}remove(...o){this.host&&o&&this._forEachClasss(o,e=>{this.host.classList.remove(e);});}toggle(...o){this.host&&this._forEachClasss(o,e=>{this.host.classList.toggle(e);});}use(...o){this.host&&this._forEachClasss(o,(e,r)=>{r?this.host.classList.add(e):this.host.classList.remove(e);});}has(o){return this.host.classList.contains(o)}hostConnected(){this.add(...this.initialClasses);}hostDisconnected(){this.remove(...this.initialClasses);}hostUpdate(){}};var Yo=class extends At{constructor(o){if(super(o),this.it=Y,o.type!==yt.CHILD)throw Error(this.constructor.directiveName+"() can only be used in child bindings")}render(o){if(o===Y||o==null)return this._t=void 0,this.it=o;if(o===at)return o;if(typeof o!="string")throw Error(this.constructor.directiveName+"() called with a non-string value");if(o===this.it)return this._t;this.it=o;let e=[o];return e.raw=e,this._t={_$litType$:this.constructor.resultType,strings:e,values:[]}}};Yo.directiveName="unsafeHTML",Yo.resultType=1;var Ot=Pt(Yo);function Nn(t,o){o&&Object.entries(o).forEach(([e,r])=>{(e==="root"?[t]:Array.from(t.querySelectorAll(e))).forEach(s=>{typeof r=="string"?s.style.cssText=r:typeof r=="object"&&Object.assign(s.style,r);});});}function wo(t,o,e){e?t.classList.add(o):t.classList.remove(o);}function Un(){return {widget:"input",name:"",path:[],visible:true,enable:true,required:false,order:0,advanced:false,actions:[]}}var R=class extends lt{constructor(){super(...arguments);this.theme=new _o(this);this.classs=new Ae(this);this.options=Un();this.value="";this.name="";this.path="";this.labelPos="top";this.dirty=false;this.noreactive=false;this.beforeActions=[];this.afterActions=[];this._subscribers=[];this.onFieldChange=()=>this._updateFieldValue();this.onFieldInput=()=>this._updateFieldValue();}static{this.styles=Mn;}get shadow(){return this.shadowRoot}getFieldOptions(){let e=this.schema||{};return Object.entries(e).reduce((r,[i,s])=>(ke(s)?r[i]=s.value:r[i]=s,r),Object.assign({},Un(),this.getInitialOptions()))}getPrefix(){}getSuffix(){}renderActions(e=true){return u`${this.renderBeforeActions(e)} ${this.renderAfterActions(e)}`}_onClickAction(e,r){return i=>{typeof r=="function"&&r(i),e.onClick&&typeof e.onClick=="function"&&e.onClick?.call(this,this.getInputValue(),{action:e,options:this.options,event:i,update:s=>{Hr(this.context.store.state,this.options.path,s);}});}}renderBeforeActions(e){if(Array.isArray(this.beforeActions)&&this.beforeActions.length>0)return u`<div
338338
class="actions before"
339339
part="before-actions"
340340
slot="${w(e?"prefix":void 0)}"

docs/public/autostore.js

Lines changed: 1 addition & 1 deletion
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

docs/zh/store/guide/store/sync.md

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -540,5 +540,6 @@ syncer.stop();
540540
<demo react="store/syncStoreWithPathMap.tsx"/>
541541

542542
:::warning 注意
543-
同步功能无法同步计算属性和监视属性
543+
计算属性和监视属性也支持同步。
544+
但是需要注意,由于计算属性的函数的无法被序列化的,所以只是同步计算属性的值。这意味着,如果计算属性依赖的值被修改,同步方的对应计算属性也会更新。
544545
:::

packages/core/src/schema/manager.ts

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
import { PATH_DELIMITER } from "../consts";
22
import type { AutoStore } from "../store/store";
33
import type { Dict } from "../types";
4-
import { isPathEq, isSchemaBuilder, markRaw, pathStartsWith, setVal, watchObjectAccess } from "../utils";
4+
import { isSchemaBuilder, markRaw, pathStartsWith, setVal } from "../utils";
55
import { getVal } from "../utils/getVal";
66
import { isFuncDefine } from "../utils/isFuncDefine";
77
import { parseFunc } from "../utils/parseFunc";

packages/core/src/store/shadow.ts

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -47,6 +47,7 @@ export function createShadow<T extends Dict>(
4747

4848
// 将操作转到到shadowStore
4949
store.watch((operate) => {
50+
operate.shadow = true;
5051
shadowStore.operates.emit(operate.path.join(PATH_DELIMITER), operate);
5152
});
5253
return shadowStore;

packages/core/src/store/types.ts

Lines changed: 6 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -17,7 +17,7 @@ export type StateOperateType =
1717
| "remove" // 用于数组
1818
| "batch"; // 批量操作
1919

20-
export type StateOperate<Value = any, Parent = any> = {
20+
export interface StateOperate<Value = any, Parent = any> {
2121
type: StateOperateType;
2222
path: string[];
2323
value: Value;
@@ -30,7 +30,11 @@ export type StateOperate<Value = any, Parent = any> = {
3030
*/
3131
reply?: boolean;
3232
flags?: number;
33-
};
33+
/**
34+
* 该操作是否来自shadow转发
35+
*/
36+
shadow?: boolean;
37+
}
3438

3539
export interface AutoStoreOptions<State extends Dict> {
3640
/**

packages/core/src/utils/index.ts

Lines changed: 0 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -39,4 +39,3 @@ export * from "./createAsyncComptuedValue";
3939
export * from "./isValueSchema";
4040
export * from "./isRelPath";
4141
export * from "./isSchemaBuilder";
42-
export * from "./watchObjectAccess";

packages/form/examples/index.ts

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -8,5 +8,6 @@
88
// import './addContact';
99
import "./ipConfig";
1010
import "./ipSyncConfig";
11+
import "./ipSyncConfig-nomap";
1112
export * from "./debuger";
1213
// export * from './store';
Lines changed: 107 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,107 @@
1+
import "@autostorejs/syncer";
2+
import { customElement, query } from "lit/decorators.js";
3+
import { LitElement, type PropertyValues, html } from "lit";
4+
import { AutoStore, configurable } from "autostore";
5+
import type { AutoStoreSyncer } from "@autostorejs/syncer";
6+
7+
@customElement("ip-sync-config2")
8+
class IPConfigSyncForm2 extends LitElement {
9+
settingSyncer?: AutoStoreSyncer;
10+
store = new AutoStore({
11+
network: {
12+
dhcp: configurable(false, {
13+
label: "自动获取IP地址",
14+
widget: "switch",
15+
}),
16+
ip: configurable("192.168.1.100", {
17+
label: "IP地址",
18+
widget: "ipaddress",
19+
enable: (state) => !state.network.dhcp,
20+
}),
21+
mask: configurable("255.255.255.0", {
22+
label: "子网掩码",
23+
widget: "ipaddress",
24+
visible: (state) => !state.network.dhcp,
25+
}),
26+
gateway: configurable("192.168.1.1", {
27+
label: "默认网关",
28+
widget: "ipaddress",
29+
enable: (state) => !state.network.dhcp,
30+
}),
31+
timeout: configurable(100000, {
32+
label: "连接超时(秒)",
33+
group: "api",
34+
widget: "number",
35+
toState: (value: any) => {
36+
return value * 1000;
37+
},
38+
toInput: (value: any) => {
39+
return value / 1000;
40+
},
41+
}),
42+
},
43+
});
44+
45+
settingStore = new AutoStore({});
46+
constructor() {
47+
super();
48+
this._syncSettings();
49+
//@ts-expect-error
50+
window.fromStore = this.store;
51+
//@ts-expect-error
52+
window.toStore = this.settingStore;
53+
}
54+
connectedCallback(): void {
55+
super.connectedCallback();
56+
this.store.watch(() => {
57+
if (this.viewer) {
58+
this.viewer.innerText = JSON.stringify(this.store.state);
59+
}
60+
});
61+
}
62+
63+
private _syncSettings() {
64+
// 只有使用schema或configurable声明的配置项才会进行同步
65+
const filter = (path: string[]) => {
66+
return this.store.schemas.has(path.join(".") as any);
67+
};
68+
const syncSettings = {
69+
filter,
70+
// remote: "system",
71+
immediate: true,
72+
};
73+
// 将本模块的配置项同步到全局SettingManager中,这样在应用中就可以使用SettingManager管理应用的所有配置了
74+
this.settingSyncer = this.store.sync(this.settingStore, syncSettings);
75+
}
76+
77+
//@ts-expect-error
78+
@query("auto-form")
79+
formRef?: any;
80+
protected updated(_changedProperties: PropertyValues): void {
81+
this.formRef?.bind(this.settingStore);
82+
}
83+
84+
//@ts-expect-error
85+
@query("#viewjson")
86+
viewer?: any;
87+
88+
render() {
89+
return html`<div id="viewjson" style="padding:1em;width:100%;display:flex;"></div>
90+
<div style="margin: 1em; position: relative">
91+
<auto-form
92+
data-name="general"
93+
data-label="常规"
94+
data-icon="settings"
95+
data-actions="settings"
96+
>
97+
</auto-form>
98+
</div>`;
99+
}
100+
}
101+
102+
declare global {
103+
interface HTMLElementTagNameMap {
104+
"ip-sync-config2": IPConfigSyncForm2;
105+
}
106+
var store: AutoStore<any>;
107+
}

0 commit comments

Comments
 (0)