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

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

 <template>
- <div class='app-form-part' v-if="formOption">
+ <div class='app-form-part' v-if="loadState">
     <avue-form :option="formOption" v-model="formVal"></avue-form>
   </div>
 </template>
@@ -98,7 +98,7 @@ export default class AppFormPart extends Vue {
    * @type {(Subscription | undefined)}
    * @memberof AppFormPart
    */
-  public remoteUrl:string ="";
+  public remoteUrl:string =`/getFormModel/${this.appCodeName}/${this.deCodeName}/${this.formCodeName}/${this.formDetailCodeName}`;
 
   /**
    * 动态表单配置对象
@@ -109,12 +109,40 @@ export default class AppFormPart extends Vue {
   public formOption:any;
 
   /**
-   * 动态表单值对象
+   * 当前动态表单绑定值
    *
    * @type {*}
    * @memberof AppFormPart
    */
-  public formVal:any;
+  public curFormValue:any = {};
+
+  /**
+   * 获取动态表单值对象
+   *
+   * @type {*}
+   * @memberof AppFormPart
+   */
+  get formVal(){
+      return this.curFormValue;
+  }
+
+  /**
+   * 设置动态表单值对象
+   *
+   * @type {*}
+   * @memberof AppFormPart
+   */
+  set formVal(data:any){
+      this.$emit("change",{name:this.name,value:data});
+  }
+
+  /**
+   * 加载数据状态
+   *
+   * @type {*}
+   * @memberof AppFormPart
+   */
+  public loadState:boolean = false;
 
   /**
    * 初始化组件（vue生命周期）
@@ -126,12 +154,48 @@ export default class AppFormPart extends Vue {
     if (this.formState) {
       this.formStateEvent = this.formState.subscribe(({ type, data }) => {
         if (Object.is("load", type)){
-            this.loadRemoteFormModel();
+            this.loadRemoteFormModel().then((result:any) =>{
+                this.initStateData(result);
+            })
         }
       });
     }
   }
 
+  /**
+   * 初始化状态数据
+   *
+   * @type {Subject<any>}
+   * @memberof AppFormPart
+   */
+  public initStateData(modelData:any){
+    this.computedFormVal(modelData);
+    this.formOption = modelData;
+    this.loadState = true;
+  }
+
+  /**
+   * 计算动态表单绑定数据
+   *
+   * @type {Subject<any>}
+   * @memberof AppFormPart
+   */
+  public  computedFormVal(modelData:any){
+    this.curFormValue = {};
+    if(modelData && modelData.column && modelData.column.length > 0){
+        modelData.column.forEach((element:any) => {
+            Object.assign(this.curFormValue,{[element.prop]:null});
+        });
+    }
+    if(Object.keys(this.curFormValue).length > 0){
+        Object.keys(this.curFormValue).forEach((item:any) =>{
+            if(this.data && this.data[item]){
+                this.curFormValue[item] = this.data[item];
+            }
+        })
+    }
+  }
+
   /**
    * 加载动态表单数据模型
    *
@@ -139,15 +203,18 @@ export default class AppFormPart extends Vue {
    * @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("加载动态表单模型数据异常");
-      })
+    return new Promise((resolve:any,reject:any) =>{
+        this.$http.get(this.remoteUrl).then((res:any) =>{
+            if(res.status && res.status == 200){
+                let result:any = res.data;
+                resolve(result);
+            }else{
+                console.warn("加载动态表单模型数据异常");
+            }
+        }).catch((error:any) =>{
+            console.warn("加载动态表单模型数据异常");
+        })
+    })
   }
 
   /**