import HeaderMain from "../../components/HeaderMain";
import ShareSetting from "../../components/ShareSetting";
import api from '../../api/test'
import editorApi from '../../api/editor'
import timeFormat from '../../util/time'
export default {
  components: {
    HeaderMain, ShareSetting
  },
  data() {
    return {
      isCopy: false,
      isShareSetting: false,
      cities: [{
        value: 'Beijing',
        label: '北京'
      }, {
        value: 'Shanghai',
        label: '上海'
      }, {
        value: 'Nanjing',
        label: '南京'
      }, {
        value: 'Chengdu',
        label: '成都'
      }, {
        value: 'Shenzhen',
        label: '深圳'
      }, {
        value: 'Guangzhou',
        label: '广州'
      }],
      value: '',
      loading: false,
      houseList: [],
      ownHouseName: "所属项目",
      orderList: [{ orderName: "按创建时间排序", orderType: "created" }, { orderName: "按更新时间排序", orderType: "updated" }],
      currOrderName: "更新时间",
      currOrderType: "",
      currOrderStatus: "项目状态",
      selOrderType: "",
      statusList: [{ orderName: "已收到数据", orderStatus: "1" }, { orderName: "未收到数据", orderStatus: "0" }],
      shareModel: "",
      pageNo: 1,
      dataList: [],
      total: 0,
      itemCopyClass: "itemCopy",
      morehoverClass: "morehover",
      showDialog: false,
      remark: '',
      clickIndex: -1,
      clickItem: null,
      seen: false,
      x: 0,
      y: 0,
      positionStyle: { top: '20px', left: '20px' },
      currRemark: "",
    }
  },
  computed: {
    noMore() {
      console.log("SSSS", this.pageNo, this.total);
      return this.pageNo > this.total && this.pageNo > 2;
    },
    disabled() {
      return this.loading || this.noMore;
    }
  },
  watch: {
    isShareSetting: function (val) {
      var mo = function (e) { e.preventDefault(); };
      document.body.style.overflow = val ? 'hidden' : '';
      if (val) {
        document.addEventListener("touchmove", mo, false);
      } else {
        document.removeEventListener("touchmove", mo, false);
      }
    }
  },
  created() {
    this.houseList = [];
    editorApi.houseList().then((res) => {
      if (res.success) {
        this.houseList = res.list;
      }
    });
    this.getTestList(true);
  },
  methods: {
    more(isShow, item, index) {
      item.isMore = isShow;
      this.dataList.splice(index, 1, item);
    },
    operationCommand(command, item, index) {
      if (command == "download") {
        console.log("下载");
        this.download(item);
      } else if (command == "share") {
        console.log("分享");
        this.clickIndex = index;
        this.shareTest(item);
      } else if (command == "del") {
        console.log("删除");
        this.deleteTest(item, index);
      }
    },
    dataformat(val) {
      return timeFormat.dateStr(val);
    },
    getTestList(isFirst) {
      if (isFirst) {
        this.pageNo = 1;
      }
      console.log("XSSSSSSS", isFirst)
      console.log("加载第" + this.pageNo + "页");
      this.loading = true
      let data = {
        "orderType": this.currOrderType,
        "ownHouseName": this.ownHouseName == "所属项目" ? '' : this.ownHouseName,
        "pageNo": this.pageNo++,
        "pageSize": isFirst ? 39 : 40,
        "houseAnswerStatus": this.selOrderType
      }
      api.testList(data).then((res) => {
        if (res.success) {
          this.total = res.pageModel.total;
          if (isFirst) {
            this.dataList = [];
          }
          this.dataList.push(...res.pageModel.resultSet);
          console.log("success", this.dataList, res.pageModel);
        } else {
          console.log("error");
        }
        this.loading = false
      })
        .then(() => {
          this.loading = false
        })
        .catch(() => {
          this.loading = false
        });
    },
    projectCommand(command) {
      if (this.houseList.indexOf(command) == -1) {
        console.log("不存在");
        this.ownHouseName = "所属项目";
      } else {
        console.log("存在", command.houseName);
        this.ownHouseName = command.houseName;
      }
      this.getTestList(true);
    },
    orderCommand(command) {
      console.log(command);
      this.currOrderName = command.orderName;
      this.currOrderType = command.orderType;
      this.getTestList(true);
    },
    orderStatus(command) {
      console.log(command);
      this.currOrderStatus = command.orderName;
      this.selOrderType = command.orderStatus;
      this.getTestList(true);
    },
    createTest() {
      this.$router.push({ path: '/cncTestLists' });
    },
    download(item) {
      let data = {
        "id": item._id
      }
      console.log("下载数据", data);
      api.exportExcelPath(data).then((res) => {
        if (res.success) {
          console.log("下载数据", res);
          this.$message.success("下载成功");
          var tempLink = document.createElement("a");
          tempLink.style.display = "none";
          tempLink.href = res.single;
          tempLink.setAttribute("download", "用户来源导出表");
          if (typeof tempLink.download === "undefined") {
            tempLink.setAttribute("target", "_blank");
          }
          document.body.appendChild(tempLink);
          tempLink.click();
          document.body.removeChild(tempLink);
        } else {
          this.$message.error("下载失败,请重试");
        }
      })
    },
    deleteTest(item, index) {
      const h = this.$createElement;
      this.$msgbox({
        title: '删除',
        message: '删除后不可撤回，确定删除此套测题？',
        showCancelButton: true,
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        beforeClose: (action, instance, done) => {
          if (action === 'confirm') {
            instance.confirmButtonLoading = true;
            instance.confirmButtonText = '执行中...';
            let data = {
              "id": item._id,
              "operator": "admin"
            }
            api.deleteTest(data).then((res) => {
              if (res.success) {
                instance.confirmButtonLoading = false;
                this.$message.success("删除成功");
                this.dataList.splice(index, 1);
                done();
              } else {
                this.$message.error("删除失败,请重试");
                done();
              }
            })
          } else {
            done();
          }
        }
      }).then(() => {
      }).catch(() => { });
    },
    copyTest(item) {
      // document.getElementById("historyTools").scrollTo(0, 0);
      // document.getElementById("historyTools").scrollIntoView();
      // console.log("SSSS", document.getElementById("historyTools").scrollHeight)
      let data = {
        "id": item._id,
        "operator": "admin"
      }
      api.copyTest(data).then((res) => {
        if (res.success) {
          this.$message({
            message: '复制成功',
            type: 'success'
          });
          this.dataList.unshift(res.single);
          this.isCopy = true;
          setTimeout(() => {
            this.isCopy = false;
          }, 2000);
        } else {
          this.$message.error('复制失败,请重试');
        }
      })

    },
    editTest(item) {
      this.$router.replace({ path: '/h5editor', query: { itemId: item._id, testcaseId: item.testcaseId } })
    },
    shareTest(item) {
      editorApi.getPageByThemeId(item._id).then((res) => {
        if (res.success) {
          this.shareModel = {
            id: item._id,
            testcaseId: item.testcaseId,
            shareTitle: res.single.shareTitle,
            shareContent: res.single.shareContent,
            shareImg: res.single.shareImg,
            shareUrl: res.single.shareUrl,
            remark: item.remark
          };
          this.isShareSetting = true;
        } else {
          this.$message.error('数据加载失败,请重试');
        }
      })
    },
    excelReport(item) {
      console.log(item);
      let maindata = {
        houseId: this.houseId
      };
      console.log("***expot***", maindata);
      editorApi.exportStaffSource(maindata).then((res) => {
        if (res.success) {
          var tempLink = document.createElement("a");
          tempLink.style.display = "none";
          tempLink.href = result.data.single.url;
          tempLink.setAttribute("download", "用户来源导出表");
          if (typeof tempLink.download === "undefined") {
            tempLink.setAttribute("target", "_blank");
          }
          document.body.appendChild(tempLink);
          tempLink.click();
          document.body.removeChild(tempLink);
        } else {
          this.$message.error(result.data.message);
        }
      })
    },
    closeShare() {
      this.currItem = "";
      this.isShareSetting = false;
      this.clickIndex = -1;
    },
    clickEditBtn(item, index) {
      this.showDialog = true;
      this.remark = item.remark || '';
      this.clickIndex = index;
      this.clickItem = item;
    },
    saveRemark() {
      let param = {
        id: this.clickItem._id,
        remark: this.remark,
        updator: "admin"
      };
      editorApi.saveTheme(param).then(res => {
        if (res.success) {
          this.$message.success("保存成功");
          this.dataList[this.clickIndex].remark = this.remark;
          this.clickCancleBtn();
        } else {
          this.$message.error("数据加载失败,请重试");
          this.clickCancleBtn();
        }
      });
    },
    refreshItem(remark) {
      this.dataList[this.clickIndex].remark = remark;
      this.clickIndex = -1;
    },
    clickCancleBtn() {
      this.remark = '';
      this.clickIndex = -1;
      this.showDialog = false;
    },
    enterssss(item) {
      if (item.remark) {
        this.seen = true;
        this.currRemark = item.remark;
      }
    },
    leave: function () {
      this.seen = false;
      this.currRemark = "";
    },
    updateXY: function (event) {
      this.x = event.pageX;
      this.y = event.pageY;
      this.positionStyle = { top: this.y + 20 + 'px', left: this.x + 20 + 'px' };
    },
  },
}