新增动态表单组件 --- fix1

src/components/app-form-part/app-form-part.vue

 <template>
  <div class='app-form-part'>
-      动态表单    
+    <avue-form :option="formOption" v-model="formVal"></avue-form>
   </div>
 </template>
 <script lang = 'ts'>
@@ -82,6 +82,40 @@ export default class AppFormPart extends Vue {
    */
   @Prop() public formState!: Subject<any>;
 
+  /**
+   * 订阅对象
+   *
+   * @protected
+   * @type {(Subscription | undefined)}
+   * @memberof AppFormPart
+   */
+  public formStateEvent: Subscription | undefined;
+
+  /**
+   * 远程地址
+   *
+   * @protected
+   * @type {(Subscription | undefined)}
+   * @memberof AppFormPart
+   */
+  public remoteUrl:string ="";
+
+  /**
+   * 动态表单配置对象
+   *
+   * @type {*}
+   * @memberof AppFormPart
+   */
+  public formOption:any;
+
+  /**
+   * 动态表单值对象
+   *
+   * @type {*}
+   * @memberof AppFormPart
+   */
+  public formVal:any;
+
   /**
    * 初始化组件（vue生命周期）
    *
@@ -89,7 +123,31 @@ export default class AppFormPart extends Vue {
    * @memberof AppFormPart
    */
   public created(){
+    if (this.formState) {
+      this.formStateEvent = this.formState.subscribe(({ type, data }) => {
+        if (Object.is("load", type)){
+            this.loadRemoteFormModel();
+        }
+      });
+    }
+  }
 
+  /**
+   * 加载动态表单数据模型
+   *
+   * @type {Subject<any>}
+   * @memberof AppFormPart
+   */
+  public loadRemoteFormModel(){
+      this.$http.get(this.remoteUrl).then((res:any) =>{
+          if(res.status && res.status == 200){
+              this.formOption = res.data;
+          }else{
+              console.warn("加载动态表单模型数据异常");
+          }
+      }).catch((error:any) =>{
+          console.warn("加载动态表单模型数据异常");
+      })
   }
 
   /**
@@ -99,7 +157,9 @@ export default class AppFormPart extends Vue {
    * @memberof AppFormPart
    */
   public destroy(){
-
+      if(this.formStateEvent){
+        this.formStateEvent.unsubscribe();
+      }
   }
 
 }