穿梭框本地文件

src/components/app-transfer/app-transfer.vue

@@ -6,7 +6,7 @@
       v-for="(item,i) in dataRight"
       :key="i"
     >{{dataLeft[item-1].label}}</Option>
-    <el-transfer v-model="dataRight" :data="dataLeft" @change=dataChange></el-transfer>
+    <el-transfer v-model="dataRight" :data="dataLeft" @change="dataChange"></el-transfer>
   </Select>
 </template>
 <script lang="ts">
@@ -14,11 +14,11 @@ import { Vue, Component, Watch, Prop, Model } from "vue-property-decorator";
 import CodeListService from "@service/app/codelist-service";
 
 @Component({})
-export default class FromTransfer extends Vue {
+export default class AppTransfer extends Vue {
   /**
    * 表单传递右侧框中的数据
    */
-  @Prop() public data: any;
+  @Prop() public data?: any;
   /**
    * 左侧框数据
    */
@@ -31,7 +31,7 @@ export default class FromTransfer extends Vue {
    * 代码表服务对象
    *
    * @type {CodeListService}
-   * @memberof FromTransfer
+   * @memberof AppTransfer
    */
 
   public codeListService: CodeListService = new CodeListService({
@@ -42,21 +42,21 @@ export default class FromTransfer extends Vue {
    * 额外参数
    *
    * @type {*}
-   * @memberof FromTransfer
+   * @memberof AppTransfer
    */
   public otherParam: any;
 
   /**
    * 查询参数
    * @type {*}
-   * @memberof FromTransfer
+   * @memberof AppTransfer
    */
   public queryParam: any;
 
   /**
    * 当前选中值
    * @type {any}
-   * @memberof Drop
+   * @memberof AppTransfer
    */
   @Model("change") readonly itemValue!: any;
 
@@ -64,7 +64,7 @@ export default class FromTransfer extends Vue {
    * 代码表标识
    *
    * @type {string}
-   * @memberof FromTransfer
+   * @memberof AppTransfer
    */
   @Prop() public tag?: string;
 
@@ -72,15 +72,14 @@ export default class FromTransfer extends Vue {
    * 代码表类型
    *
    * @type {string}
-   * @memberof FromTransfer
+   * @memberof AppTransfer
    */
   @Prop() public codelistType?: string;
 
-
   /**
    * 监听表单数据
    *
-   * @memberof FromTransfer
+   * @memberof AppTransfer
    */
 
   @Watch("data", { deep: true })
@@ -90,27 +89,27 @@ export default class FromTransfer extends Vue {
   }
   /**
    * 组件change事件,右侧框数据变化时
-   * @memberof FromTransfer
+   * @memberof AppTransfer
    */
-  dataChange(e:any){
+  dataChange(e: any) {
     console.log(e);
-    let val:any[]=[];
-    let newVal:any;
+    let val: any[] = [];
+    let newVal: any;
     this.dataLeft.forEach((elem: any) => {
       e.forEach((item: any) => {
         if (elem.key === item) val.push(elem.value);
       });
     });
-    newVal=val.join(',');
-    console.log(newVal);
-    this.$emit("change", newVal);
+    newVal = val.join(",");
+    console.log(newVal, typeof newVal);
+    if (newVal) this.$emit("change", newVal);
   }
 
   /**
    * 传入额外参数
    *
    * @type {*}
-   * @memberof FromTransfer
+   * @memberof AppTransfer
    */
   @Prop() public itemParam?: any;
 
@@ -133,7 +132,7 @@ export default class FromTransfer extends Vue {
   /**
    * 是否禁用
    * @type {any}
-   * @memberof FromTransfer
+   * @memberof AppTransfer
    *
    */
   @Prop() public disabled?: any;
@@ -141,43 +140,22 @@ export default class FromTransfer extends Vue {
   /**
    * 是否支持过滤
    * @type {boolean}
-   * @memberof FromTransfer
+   * @memberof AppTransfer
    */
   @Prop() public filterable?: boolean;
 
   /**
    * 下拉选提示内容
    * @type {string}
-   * @memberof FromTransfer
+   * @memberof AppTransfer
    */
   @Prop() public placeholder?: string;
 
-  /**
-   * 计算属性(当前值)
-   * @type {any}
-   * @memberof FromTransfer
-   */
-  set currentVal(val: any) {
-    // const type: string = this.$util.typeOf(val);
-    // val =
-    //   Object.is(type, "null") || Object.is(type, "undefined") ? undefined : val;
-    // this.dataLeft.forEach((elem: any) => {
-    //   this.dataRight.forEach((item: any) => {
-    //     if (elem.key === item) val.push(elem.value);
-    //   });
-    // });
-    // val=val.join(',');
-    // this.$emit("change", val);
-  }
-
   /**
    * 获取值对象
    *
-   * @memberof FromTransfer
+   * @memberof AppTransfer
    */
-  // get currentVal() {
-  //   return this.itemValue;
-  // }
   get currentVal() {
     return this.itemValue;
   }
@@ -186,7 +164,7 @@ export default class FromTransfer extends Vue {
    * 代码表
    *
    * @type {any[]}
-   * @memberof FromTransfer
+   * @memberof AppTransfer
    */
   // public items: any[] = [];
 
@@ -195,7 +173,7 @@ export default class FromTransfer extends Vue {
    *
    * @param {*} arg
    * @returns
-   * @memberof FromTransfer
+   * @memberof AppTransfer
    */
   public handlePublicParams(arg: any) {
     // 合并表单参数
@@ -225,11 +203,10 @@ export default class FromTransfer extends Vue {
   /**
    * vue  生命周期
    *
-   * @memberof FromTransfer
+   * @memberof AppTransfer
    */
   public created() {
     this.dataHandle();
-    this.initRight();
   }
 
   /**
@@ -241,7 +218,9 @@ export default class FromTransfer extends Vue {
       if (codelist) {
         this.dataLeft = [...JSON.parse(JSON.stringify(codelist.items))];
         this.initLeft();
+        this.initRight();
         console.log(this.dataLeft);
+        console.log(this.dataRight);
       } else {
         console.log(`----${this.tag}----代码表不存在`);
       }
@@ -257,8 +236,8 @@ export default class FromTransfer extends Vue {
         .then((res: any) => {
           this.dataLeft = res;
           console.log(this.dataLeft);
-
           this.initLeft();
+          this.initRight();
         })
         .catch((error: any) => {
           console.log(`----${this.tag}----代码表不存在`);
@@ -286,9 +265,16 @@ export default class FromTransfer extends Vue {
    * 初始化右侧框数据
    */
   public initRight() {
-    if (this.data) {
-      this.data.forEach((elem: any) => {
-        this.dataRight.push(elem);
+    let _data: string = this.data;
+    console.log(_data);
+    if (_data) {
+      let newData: any[] = _data.split(",");
+      this.dataLeft.forEach((elem: any) => {
+        newData.forEach((item: any) => {
+          if (item === elem.value) {
+            this.dataRight.push(elem.key);
+          }
+        });
       });
     }
   }