<template>
  <div class="attachment-info">
    <div
      v-if="orderStatus == 1 || orderStatus == 2"
      class="form-wrap"
    >
      <!-- 表单 -->
      <panel-form
        ref="objform"
        style="flex:1"
        table-name="T_FILETYPE_ORDER"
        class="strategy-panel"
        :label-width="210"
        display="flex"
        :no-resize="true"
        :readonly="panelFormData.objreadonly"
        :is-main-table="panelFormData.isMainTable"
        :default-data="panelFormData.data"
        @on-changeForm="onChangeForm"
      />
     
      <div class="form-wrap-r" v-if="!disabled">
        <Button
          type="primary"
          @click="add"
        >
          <Icon type="md-return-left" /><span>添加</span>
        </Button>
      </div>
    </div>
    <!-- 删除 -->
    <div class="handleBtn"   v-if="!disabled && orderStatus == 1 || !disabled && orderStatus == 2">
      <div
        class="handleItem"
        @click="deleteReturnGoods"
      >
        【删除】
      </div>
    </div>
    <div class="table-wrap">
      <arkCommonTableByAgGrid
        height="400px"
        :columns="columns"
        :data="data"
        @on-selection-change="onSelectionChanged"
      />

      <div class="page-wrap">
        <Page
          size="small"
          :current="currentPage"
          show-elevator
          :total="total"
          show-total
          show-sizer
          @on-change="handleChange"
          @on-page-size-change="handlePageSize"
        />
      </div>
    </div>
  </div>
</template>

<script>
  const R3 = window.R3;
  const { network, urlSearchParams } = R3;

  export default {
    name: 'AttachmentInfo',
    props: {
      orderStatus: {
        type: [String, Number], // 状态
        default: ''
      },
      TID: {
        type: String, // 平台单号
        default: '' 
      },
      pageMsgId: {
        type: String, // 订单号
        default: '' 
      },
      disabled: {
        type: Boolean, // 是否禁用
        default: false
      }
    },
    data() {
      return {
        columns: [
          // {
          //   field: 'index',
          //   headerName: '序号',
          //   checkboxSelection: true,
          //   width: 100,
          // },
          // {
          //   headerName: '平台单号',
          //   field: 'TID',
          //   thAlign: 'center',
          // },
          // {
          //   headerName: '附件类型',
          //   field: 'FILETYPE_ID',
          //   thAlign: 'center',
          // },
          // {
          //   headerName: '附件地址',
          //   field: 'FILE_URL',
          //   thAlign: 'center',
          // },
        ],
        data: [
          
        ],
        panelFormData: {
          objreadonly: false,
          isMainTable: true,
          size: 6, // 表单组件个数
          data: {
            addcolums: [
              {
                hrdisplay: 'expand',
                parentname: 'my-panel',
                childs: [
                  // {
                  //   col: 1,
                  //   objdisplay: 'object',
                  //   type: 'STRING',
                  //   colname: 'TID',
                  //   readonly: true,
                  //   isnotnull: false,
                  //   row: 1,
                  //   isfk: true,
                  //   isuppercase: false,
                  //   name: '平台单号',
                  //   valuedata: this.TID,
                  //   colid: 208858
                  // },
                  {
                    col: 1,
                    objdisplay: 'object',
                    type: 'STRING',
                    statsize: -1,
                    datelimit: 'all',
                    colname: 'FILETYPE_ID',
                    readonly: false,
                    isnotnull: true,
                    fkdisplay: 'drp',
                    row: 1,
                    serviceId: '',
                    webconf: {
                      definedType: 'yqArkDropDownSelectFilter'
                    },
                    inputname: 'FILETYPE_ID:NUM',
                    isfk: true,
                    reftable: 'T_FILETYPE',
                    display: 'text',
                    length: 20,
                    reftableid: 11814,
                    refobjid: '',
                    isuppercase: false,
                    name: '附件类型',
                    valuedata: '',
                    colid: 208858
                  },
                  {
                    row: 1,
                    col: 1,
                    display: 'doc',
                    daterange: '',
                    isnotnull: true,
                    type: 'STRING',
                    colname: 'FILE_URL',
                    name: '附件',
                    valuedata: '',
                    
                  }                
                ],
              },
            ],
            objviewcol: 3, // 表单默认展示几列
          },
        },
        mainTableName: 'T_V_OMSONLINEORDER', // 主表名称
        mainTableNameId: '10883', // 主表id
        tableName: 'T_FILETYPE_ORDER', //  当前表名称
        tableNameId: '208856', // 当前表的id
        currentPage: 1,
        total: 0,
        pageSize: 10,
        selectMonitorList: [] // 选中数据
      };
    },

    mounted() {
      this.getRows();
    },

    methods: {
      onChangeForm() {
        // this.formChangeData = data;
      },
      // 明细表格选中某项时触发
      onSelectionChanged(val) {
        this.selectMonitorList = val.map(item => ({
          ID: item.ID.val
        }));
      },

      handleChange(val) {
        this.currentPage = val;
        this.getRows();
        // this.updateMonitorList();
      },

      handlePageSize(val) {
        this.pageSize = val;
        // this.updateMonitorList();
      },
      getRows() {
        const params = {
          table: this.tableName, 
          objid: this.$route.params.customizedModuleId?this.$route.params.customizedModuleId:this.pageMsgId,
          mainTableName: this.mainTableName,
          refcolid: this.tableNameId,
          searchdata: {
            column_include_uicontroller: true, 
            startindex: this.pageSize * (this.currentPage - 1), 
            range: this.pageSize,            
            fixedcolumns: {}
          }
        };
        network.post('/p/cs/objectTableItem', 
                     urlSearchParams(params)).then((res) => {
                       if (res.data.code === 0) {
                         let data = res.data.data;
                         this.data = data.row || [];  
                         this.columns = data.tabth;
                         this.total = data.totalRowCount;        
                       }
                     });
      },
      async add() {
        let messageTip = this.$refs.objform.validate();
        if (messageTip.length > 0) {
          this.$Message.warning(messageTip[0].tip);
        } else {
          await this.save(this.$refs.objform.formChangeData);
        }
        // this.getRows();
      },
      async save(data) {
        // 保存逻辑
        let params = {
          ID: -1,
          TID: this.TID,
        };
        
        Object.keys(data).forEach((key)=>{
          if (Array.isArray(data[key]) && data[key][0] && data[key][0].ID) {
            let ID = data[key].reduce((arr, item)=>{
              arr.push(item.ID);
              return arr;
            }, []).join(',');
            params[key] = ID;
          } else {
            params[key] = data[key];
          }
        });
        const paramsData = {
          table: this.mainTableName, 
          objId: this.$route.params.customizedModuleId, 
          fixedData: {
            [this.tableName]: [params]
          }, 
        };
        network.post('/p/cs/objectSave', 
                     paramsData).then((res) => {
                       if (res.data.code === 0) {
                         // 重置表单
                         this.$refs.objform.setFormlist();
                         this.$refs.objform.formChangeData = {};
                         this.$Message.success(res.data.message);
                         this.currentPage = 1;
                         this.getRows();       
                       }
                     });
      },
      // 策略明细表删除
      deleteReturnGoods() {
        if (this.selectMonitorList.length === 0) {
          this.$Message.warning('请先选中明细列表');
          return true;
        }
        this.$Modal.fcWarning({
          title: '警告',
          mask: true,
          showCancel: true,
          content: '是否确认删除？',
          onOk: () => {
            console.log(this.selectMonitorList, '====');
            let params = {
              table: this.mainTableName, 
              objId: this.$route.params.customizedModuleId, 
              delMTable: false, 
              tabItem: { [this.tableName]: this.selectMonitorList }
            };
            network.post('/p/cs/objectDelete', params).then(res => {
              if (res.data.code == 0) {
                this.$Message.success('删除明细成功！');
                this.currentPage = 1;
                this.getRows();
              }
            });
          }
        });
      }
    },
  };
</script>

<style lang="less" scoped>
.form-wrap {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding-bottom: 8px;
  background-color: #fff;
  .form-wrap-l {
    display: flex;
  }

  .form-item {
    width: 300px;
    display: flex;
    align-items: center;
  }
}

.page-wrap {
  margin-top: 8px;
  display: flex;
  justify-content: flex-end;
}
.handleBtn{
    background-color: #fff;
    .handleItem{
      color: var(--primary-color);
      padding: 0px 8px 10px;
    }
  }
</style>
