<template>
  <div class="common_param">
    <div class="content">
      <p class="text">链接上传时限设置</p>
      <div class="time_limit">
        <div class="left">
          <p>仅支持</p>
          <p class="num" v-if="!editFlag">{{ timeLimit }}</p>
          <input type="text" v-model="timeLimitModal" v-else />
          <p>个月内上传的资料进行反馈</p>
        </div>
        <p class="edit" @click="edit">{{ editFlag ? "确定" : "编辑" }}</p>
      </div>
    </div>
    <!-- <div class="button">
      <div class="current_button" @click="submit" style="margin: 0">保存</div>
    </div> -->
    <TipModal
      :tipFlag="tipModalFlag"
      :tipText="tipModalText"
      @close_tip_modal="closeTipModal"
    />
  </div>
</template>

<script>
import TipModal from "../../components/TipModal";
export default {
  components: {
    TipModal,
  },
  data() {
    return {
      timeLimitModal: 0,
      timeLimit: 0,
      recordNum: 0,
      editFlag: false,
      dictList: [],
      dictId: "",
      tipModalFlag: false,
      tipModalText: ''
    };
  },
  methods: {
    submit: function () {
      let timeLimitModal = +this.timeLimitModal;
      if(this.recordNum == timeLimitModal) {
        return
      }
      if (timeLimitModal <= 0) {
        alert("请填写大于零的整数");
      } else if (Math.ceil(timeLimitModal) !== timeLimitModal) {
        alert("请填写大于零的整数");
      } else {
        this.updataDict(timeLimitModal).then(() => {
          this.getDateList();
          this.tipModalFlag = true,
          this.tipModalText = '修改成功!'
        });
      }
    },
    edit: function () {
      if (this.editFlag) {
        this.submit();
      } else {
        this.timeLimitModal = this.timeLimit;
      }
      this.editFlag = !this.editFlag;
    },
    closeTipModal: function () {
      this.tipModalFlag = false;
    },
    // 获取内容分类、媒体平台、常用参数接口的标识，再调接口时需要用到
    selectSysDataDictList: function () {
      return new Promise((resolve, reject) => {
        this.$http({
          method: "post",
          url: "/sys/dataDict/selectSysDataDictList",
          data: {},
        })
          .then((res) => {
            if (res.data && res.data.code === 200) {
              this.dictList = res.data.data;
              resolve();
            } else {
              console.log(res);
              reject();
            }
          })
          .catch((err) => {
            console.log(err);
            reject();
          });
      });
    },
    // 获取列表数据   接口
    getDateList: function () {
      this.$http({
        method: "post",
        url: "/sys/dataDict/selectSysDataDictPage",
        data: {
          dictCode: this.dictList[0]["dictCode"],
          parentId: this.dictList[0]["id"],
        },
      })
        .then((res) => {
          if (res.data && res.data.code === 200) {
            this.dictId = res.data.data[0]["id"];
            this.timeLimit = res.data.data[0]["dictName"];
            this.recordNum = this.timeLimit;
          } else {
            console.log(res);
          }
        })
        .catch((err) => {
          console.log(err);
        });
    },
    // 编辑  接口
    updataDict: function (newName) {
      return new Promise((resolve, reject) => {
        this.$http({
          url: "/sys/dataDict/updateSysDataDictInfo",
          method: "post",
          data: {
            dictName: newName,
            id: this.dictId,
            parentId: this.dictList[0]["id"],
            dictCode: this.dictList[0]["dictCode"],
          },
        })
          .then((res) => {
            if (res.data && res.data.code === 200) {
              resolve();
            } else {
              alert("编辑失败，请重试");
              console.log(res);
            }
          })
          .catch((err) => {
            alert("编辑失败，请重试");
            reject(err);
          });
      });
    },
    // 新增  接口
    addList: function (name) {
      return new Promise((resolve, reject) => {
        this.$http({
          url: "/sys/dataDict/addSysDataDictInfo",
          method: "post",
          data: {
            dictName: name,
            parentId: this.dictList[0]["id"],
            dictCode: this.dictList[0]["dictCode"],
          },
        })
          .then((res) => {
            if (res.data && res.data.code === 200) {
              resolve();
            } else {
              alert("新增失败，请重试1");
              console.log(res);
            }
          })
          .catch((err) => {
            alert("新增失败，请重试2");
            reject(err);
          });
      });
    },
  },
  created() {
    this.selectSysDataDictList()
      .then(() => {
        this.getDateList();
      })
      .catch((err) => {
        console.log(err);
      });
  },
};
</script>

<style scoped lang="less">
.common_param {
  margin-top: 10px;
  .content {
    padding: 0 10px;
    border-bottom: 1px solid #ccc;
    .text {
      font-size: 20px;
      margin-top: 10px;
      height: 30px;
      line-height: 30px;
    }
    .time_limit {
      display: flex;
      justify-content: space-between;
      margin-top: 30px;
      padding-left: 100px;
      padding-bottom: 30px;
      .left {
        display: flex;
        p {
          height: 28px;
          line-height: 28px;
          font-size: 16px;
        }
        .num {
          width: 200px;
          text-align: center;
        }
        input {
          width: 180px;
          border: 1px solid #ccc;
          color: #555;
          padding-left: 20px;
          font-size: 16px;
        }
      }
      .edit {
        height: 28px;
        line-height: 28px;
        color: #0056a0;
        font-size: 16px;
        &:hover {
          cursor: pointer;
        }
      }
    }
  }
  .button {
    display: flex;
    justify-content: center;
    align-items: center;
    margin-top: 50px;
  }
}
</style>
