<template>
  <div>


    <el-card>
      <el-form :inline="true" :model="query" class="query-form" size="mini">
        <el-row>
          <el-form-item class="query-form-item">
            <el-input v-model="filterQuery.id" placeholder="记录ID"></el-input>
          </el-form-item>

          <el-form-item class="query-form-item">
            <el-select v-model="filterQuery.status" placeholder="处理状态">
              <el-option label="全部" value=""></el-option>
              <el-option label="任务待触发" value="1"></el-option>
              <el-option label="文件待生成" value="2"></el-option>
              <el-option label="文件待同步" value="3"></el-option>
              <el-option label="任务完成" value="4"></el-option>
            </el-select>
          </el-form-item>

          <el-form-item class="query-form-item">
            <el-date-picker v-model="syncTime" type="datetime" format="yyyy-MM-dd HH:mm:ss"
                            value-format="yyyy-MM-dd HH:mm:ss" placeholder="请选择同步时间">
            </el-date-picker>
          </el-form-item>

          <el-form-item>
            <el-button-group style="display:flex;">
              <el-button type="primary" icon="el-icon-refresh" @click="onReset"></el-button>
              <el-button type="primary" icon="search" @click="search">查询</el-button>
              <el-button type="primary" icon="search" @click="syncData('IO_ORDER')">同步单据
              </el-button>
              <el-button type="primary" icon="search" @click="syncData('DOCUMENT_TYPE_DATA')"
                         v-if="configParms.typeBus==2 || configParms.typeScan==2 || configParms.typeThird==2">
                同步单据类型
              </el-button>
              <el-button type="primary" icon="search" @click="syncData('BASIC_DATA')"
                         v-if="configParms.basicProducts==2|| configParms.basicCorp==2|| configParms.supCert==2">同步基础信息
              </el-button>
              <el-button type="primary" icon="search" @click="syncData('COUNTRY_DI_DATA')"
                         v-if="configParms.dbDiProducts==2">同步国家库DI数据
              </el-button>
              <el-button type="primary" icon="search" @click="syncData('OTHER_DATA')"
                         v-if="configParms.udiCodeLost==2||configParms.udiCodeRel==2">同步其他数据
              </el-button>

              <el-button type="success" icon="search" @click="syncNow('OTHER_DATA')">立即同步
              </el-button>


            </el-button-group>
          </el-form-item>
        </el-row>
      </el-form>

      <el-table v-loading="loading" :data="list" style="width: 100%" border :default-sort="defaultSort"
                @sort-change="handleSortChange">
        <el-table-column label="序号" type="index"></el-table-column>
        <el-table-column label="任务ID" prop="id" width="140" show-overflow-tooltip></el-table-column>

        <el-table-column label="任务类型" prop="type" width="140" show-overflow-tooltip>
        </el-table-column>
        <el-table-column label="中继服务状态" prop="status" width="140" show-overflow-tooltip>
          <template slot-scope="scope">
            <el-tag :type="statusFilterType(scope.row.status)">{{ status[scope.row.status] }}
            </el-tag>
          </template>
        </el-table-column>
        <el-table-column label="管理系统状态" prop="receiveStatus" width="140" show-overflow-tooltip>

          <template slot-scope="scope">
            <el-tag :type="wmsFilterType(scope.row.receiveStatus)">{{ wmsstatus[scope.row.receiveStatus] }}
            </el-tag>
          </template>


        </el-table-column>
        <el-table-column label="开始时间" width="180" prop="startTime" show-overflow-tooltip sortable="custom"
                         :sort-orders="['ascending', 'descending']"></el-table-column>
        <el-table-column label="结束时间" width="180" prop="endTime" show-overflow-tooltip></el-table-column>

        <el-table-column label="同步信息" prop="remark" show-overflow-tooltip></el-table-column>

        <el-table-column label="文件路径" prop="cacheFilePath" show-overflow-tooltip></el-table-column>

        <el-table-column label="操作" fixed="right" width="160">
          <template slot-scope="scope">
            <el-popconfirm @confirm="downFile(scope.row)" confirm-button-text='下载' cancel-button-text='不用了' class="mr10"
                           icon="el-icon-info" icon-color="blck" title="是否确认要下载文件？" v-if="scope.row.cacheFilePath">
              <el-button type="text" size="small" slot="reference">下载
              </el-button>
            </el-popconfirm>
            <el-popconfirm v-if="scope.row.status==4" @confirm="deleteData(scope.row.id)" confirm-button-text='删除'
                           cancel-button-text='不用了'
                           icon="el-icon-info" icon-color="red" title="是否确认要删除这条数据？">
              <el-button type="text" size="small" slot="reference">删除
              </el-button>
            </el-popconfirm>
          </template>
        </el-table-column>
      </el-table>
      <el-pagination :page-size="filterQuery.limit" @current-change="handleCurrentChange" layout="prev, pager, next"
                     :total="total" :current-page="filterQuery.page"></el-pagination>
    </el-card>

    <el-dialog title="同步信息" width="25%" :close-on-click-modal="false" :close-on-press-escape="false"
               :visible.sync="syncVisible">
      <span v-text="syncInfo" style="white-space:pre-line;" class="syncInfo"></span>
    </el-dialog>

  </div>
</template>

<script>
import {
  filterLog,
  deleteLog,
  createSchedule,
  findConfig,
  updateConfig,
  infoByStatus,
  syncData, syncNow
} from "../../api/sync/spsSyncStatus";
import store from "@/store";

export default {
  data() {
    return {
      filterQuery: {
        id: null,
        status: null,
        page: 1,
        limit: 10,
        syncTime: null,
      },
      list: [],
      headers: {},
      detailList: [],
      thirdSys: [],
      thirdSysDetail: null,
      total: 0,
      currentRow: null,
      editQuery: null,
      type: {
        "AutoDownloadOrder": "扫码单据",
        "AutoDownloadBusType": "单据类型",
        "AutoDownloadAllData": "基础信息",
        "AutoDownloadDiProducts": "国家库DI数据"
      },
      status: {
        1: "任务待触发",
        2: "文件待生成",
        3: "文件待同步",
        4: "任务完成",
      },

      wmsstatus: {
        "1": "处理成功",
        "": "未处理",
        "0": "未处理",
        null: "未处理",
      },


      configQuery: {
        id: null,
        typeBus: null,
        typeScan: null,
        typeThird: null,
        basicProducts: null,
        basicCorp: null,
        basicInv: null,
        basicThirdProducts: null,
        basicThirdCorp: null,
        basicThirdInv: null,
        basicThirdBusOrder: null,
        orderScanFinish: null,
        dbDiProducts: null,
        downstreamEnable: null,

      },
      uploadFileUrl: null,
      uploadData: {
        thirdSys: "thirdId",
      },
      templateDlUrl: null,
      checked: false,
      syncTime: null,
      configParms: {},
      syncInfo: null,
      syncVisible: false,
      defaultSort: {prop: 'startTime', order: 'desc'},
    };
  },

  methods: {
    onReset() {
      this.$router.push({
        path: "",
      });
      this.filterQuery = {
        id: null,
        status: null,
        page: 1,
        limit: 10,
        orderByColumn: null,
        isAsc: null,
      };
      this.syncTime = null;
      this.getList();
    },
    search() {
      this.filterQuery.page = 1;
      this.getList();
    },
    getList() {
      this.loading = true;
      this.filterQuery.syncTime = this.syncTime;
      filterLog(this.filterQuery)
        .then((response) => {
          this.loading = false;
          if (response.code == 20000) {
            this.list = response.data.list || [];
            this.total = response.data.total || 0;
          } else {
            this.$message.error(response.message);
          }
        })
        .catch(() => {
          this.loading = false;
          this.list = [];
          this.total = 0;
        });
    },


    handleSortChange(column, prop, order) {
      if (column.order === 'descending') {
        this.filterQuery.sort = 'desc'
      } else {
        this.filterQuery.sort = 'asc'
      }
      this.filterQuery.orderBy = column.prop;
      this.getList();
    },

    getConfig() {
      findConfig()
        .then((response) => {
          if (response.code == 20000) {
            this.configQuery = response.data;
          } else {
            this.$message.error(response.message);
          }
        })
        .catch(() => {
          this.loading = false;
          this.list = [];
          this.total = 0;
        });
    },
    saveConfig() {

      updateConfig(this.configQuery)
        .then((response) => {
          this.loading = false;
          if (response.code == 20000) {
            this.$message.success("更新成功！");
            this.getConfig();
          }
        })
        .catch(() => {
          this.loading = false;
        });
    },


    cancelDialog(val) {
      this.udiImportDetailVisible = false;
      this.thrCorpSelectVisible = false;
      if (val) {
        this.getList();
      }
    },
    handleCurrentChange(val) {
      this.filterQuery.page = val;
      this.getList();
    },

    createScheduleDialog(type) {
      if (this.$isNotBlank(this.syncTime)) {
        this.$confirm("此操作将从" + this.syncTime + "开始同步最新数据，是否继续", "提示", {
          confirmButtonText: "确定",
          cancelButtonText: "取消",
          type: "warning",
        })
          .then(() => {
            this.createSchedule(type);
          })
          .catch(() => {
          });
      } else {
        this.createSchedule(type);
      }

    },

    createSchedule(type) {
      let query = {
        createType: type,
        syncTime: this.syncTime,
      }

      createSchedule(query)
        .then((response) => {
          this.loading = false;
          if (response.code == 20000) {
            this.$message.success("创建成功！");
          } else if (response.code == 501) {

            this.$alert(response.message, '提示', {
              confirmButtonText: '确定',
              type: "warning",
              callback: action => {
              }
            });

          } else {
            this.$message.error(response.message);
          }
          this.getList();
        })
        .catch(() => {
          this.loading = false;
        });
    },
    deleteDialog(rowId) {
      this.$confirm("此操作将删除该任务信息, 是否继续?", "提示", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning",
      })
        .then(() => {
          let dQuery = {
            id: rowId,
          };
          deleteLog(dQuery)
            .then((response) => {
              this.loading = false;
              if (response.code == 20000) {
                this.$message.success("删除成功");
              } else {
                this.$message.error(response.message);
              }
              this.getList();
            })
            .catch(() => {
              this.loading = false;
            });
        })
        .catch(() => {
        });
    },
    handleChange(response, files, fileList) {
      if (response.code != 20000) {
        this.$message.error(response.message);
        this.getList();
      } else {
        this.$message.success(response.data);
        this.getList();
      }
    },
    statusFilterType(status) {
      const statusMap = {
        1: "danger",
        2: "danger",
        3: "danger",
        4: "success",
      };
      return statusMap[status];
    },
    wmsFilterType(status) {
      return status ? 'success' : 'warning';
    },


    getSyncConfig() {
      findConfig()
        .then((response) => {
          if (response.code == 20000) {
            this.configParms = response.data;
          }
        })
        .catch(() => {
        });
    },
    detailDialog(id) {
      this.syncVisible = true;
      this.list.forEach(item => {
        if (id === item.id) {
          this.syncInfo = item.remark;
        }
      })
    },
    downFile(rows) {
      infoByStatus({
        'id': rows.id
      }).then(res => {
        let blob = new Blob([res])
        let fileName = rows.cacheFilePath.substring(rows.cacheFilePath.lastIndexOf('/'))
        let link = document.createElement("a")
        link.href = window.URL.createObjectURL(blob)
        link.download = fileName
        link.style.display = 'none'
        document.body.appendChild(link)
        link.click()
        window.URL.revokeObjectURL(link.href)
        document.body.removeChild(link)
      })
    },
    deleteData(id) {
      deleteLog({id}).then((response) => {
        if (response.code == 20000) {
          this.filterQuery.page = 1
          this.$message.success("删除成功");
        } else {
          this.$message.error(response.message);
        }
        this.getList();
      })
        .catch(() => {
        });
    },
    syncData(exportType) {
      if (!this.syncTime) {
        this.$message.error("请选择同步时间");
        return false
      }
      let param = {
        exportType: exportType,
        syncTime: this.syncTime
      }
      syncData(param).then((response) => {
        if (response.code == 20000) {
          this.filterQuery.page = 1
          this.$message.success("任务执行中，请稍后查看");
        } else {
          this.$message.error(response.message);
        }
        this.syncTime = null
        setTimeout(() => {
          this.getList();
        }, 666)
      })
        .catch(() => {
        });
    },
    syncNow() {
      syncNow().then((response) => {
        if (response.code == 20000) {
          this.$message.success(response.data);
        } else {
          this.$message.error(response.message);
        }
      })
        .catch(() => {
        });
    },

  },

  mounted() {
  },
  components: {},
  created() {
    this.headers = {
      ADMIN_ID: store.getters.adminId,
      ADMIN_TOKEN: store.getters.token,
    };
    this.getSyncConfig();
    this.getList();
    this.getConfig();
  },
};
</script>
<style>
.itemTag {
  float: left;
  text-align: left;
  margin-top: 10px;
  width: 100px;
}

.text {
  font-size: 13px;
  font-family: "Microsoft YaHei";
}

.el-row {
  display: flex;
  flex-wrap: wrap;

}

.el-col {
  border-radius: 4px;
  flex-wrap: wrap;
}

.syncInfo {
  font-size: medium;
  font-family: "Microsoft YaHei";
  line-height: 25px;
}
</style>
