<template>
  <div>
    <el-row style="margin:20px 0px">
      <el-col :xl="12" :lg="12" :md="12" :sm="12" :xs="24">
        <el-form
          :model="FixedAssetsAddDTO"
          :rules="rules"
          ref="ruleForm"
          label-width="100px"
          class="demo-ruleForm"
        >
          <el-form-item label="资产编号" prop="fixedCode">
            <el-input v-model="FixedAssetsAddDTO.fixedCode" laceholder="请输入资产编号"></el-input>
          </el-form-item>
          <el-form-item label="资产名称" prop="fixedName">
            <el-input v-model="FixedAssetsAddDTO.fixedName" laceholder="请输入资产名称"></el-input>
          </el-form-item>
          <el-form-item label="资产金额" prop="fixedMoney">
            <el-input v-model="FixedAssetsAddDTO.fixedMoney" laceholder="请输入资产金额"></el-input>
          </el-form-item>
          <el-form-item label="资产地址" prop="fixedAddress">
            <el-input v-model="FixedAssetsAddDTO.fixedAddress" laceholder="请输入资产地址"></el-input>
          </el-form-item>
          <el-form-item label="提交时间">
            <div class="datatime">
              <span class="nowDate">{{nowDate}}</span>
            </div>
          </el-form-item>
          <el-form-item label="登记详情">
            <el-input
              type="textarea"
              :rows="2"
              placeholder="请输入登记信息"
              v-model="FixedAssetsAddDTO.fixedDetails"
            ></el-input>
          </el-form-item>
          <el-form-item label="登记备注">
            <el-input v-model="FixedAssetsAddDTO.registerRemarks" laceholder="请输入登记备注"></el-input>
          </el-form-item>
          <el-form-item label="资产负责人" style="width:500px;">
            <div>
              <el-select
                v-model="user.userId"
                :multiple="false"
                filterable
                remote
                reserve-keyword
                placeholder="请输入关键词"
                :remote-method="remoteMethod"
                :loading="loading"
                :disabled="falesId"
              >
                <el-option
                  v-for="item in options"
                  :key="item.userId"
                  :label="item.userName"
                  :value="item.userId"
                ></el-option>
              </el-select>
              <el-button
                style="width:110px;margin:0px 10px"
                type="primary"
                @click="grtselect()"
              >{{name}}</el-button>
            </div>
          </el-form-item>
          <el-form-item style="margin-top:60px">
            <el-button type="success" @click="submitForm()">立即创建</el-button>
            <el-button type="info" @click="resetForm()">重置</el-button>
            <el-button @click="back()">返回</el-button>
          </el-form-item>
        </el-form>
      </el-col>
    </el-row>
  </div>
</template>

<script>
import { insert } from "@/api/assets";
import { secletAllStaff } from "@/api/user";
import user from "../../store/modules/user";
export default {
  data() {
    return {
      falesId: true,
      FixedAssetsAddDTO: {
        companyId: null,
        fixedAddress: null, //资产地址
        fixedCode: null, //资产编号（不重复）
        fixedController: null, //选择资产负责人
        fixedDetails: null, //登记详情
        fixedMoney: null, //资产金额
        fixedName: null, //资产名称
        fixedState: 0, //默认为0
        registerRemarks: null, //登记备注
        registerTime: null, //登记时间
        userId: null
      }, //添加资产
      user: {
        companyId: null,
        userName: null,
        userId: null
      },
      options: [],
      list: [],
      loading: false,
      rules: {
        fixedName: [
          { required: true, message: "请输入活动名称", trigger: "change" }
        ],
        fixedCode: [
          { required: true, message: "请收入资产编号", trigger: "change" }
        ],
        fixedAddress: [
          {
            required: true,
            message: "请输入资产地址",
            trigger: "change"
          }
        ],
        fixedMoney: [
          { required: true, message: "请输入资产金额", trigger: "change" },
          {
            pattern: /(^([-]?)[1-9]([0-9]+)?(\.[0-9]{1,6})?$)|(^([-]?)(0){1}$)|(^([-]?)[0-9]\.[0-9]([0-9])?$)/,
            message: "输入资产金额不合法",
            trigger: "change"
          }
        ]
      },
      //计时器
      nowDate: null, //存放年月日变量时分秒变量
      timer: "", //定义一个定时器的变量
      currentTime: new Date(), // 获取当前时间
      name:"选择负责人",
    };
  },
  created() {
    this.FixedAssetsAddDTO.companyId = this.$store.getters.companyId;
    this.FixedAssetsAddDTO.userId = this.$store.getters.urId;
    this.timer = setInterval(this.getTime, 1000);
    this.ggb();
  },
  methods: {
    //下拉框的搜索
    ggb() {
      this.user.companyId = this.$store.getters.companyId;
      secletAllStaff(this.user)
        .then(res => {
          if (res.code == 20000) {
            this.list = res.data;
          }
        })
        .catch(error => {
          this.$message.error("没有当前负责人");
        });
    },
    //输入关键字出名字
    remoteMethod(query) {
      if (query !== "") {
        this.loading = true;
        setTimeout(() => {
          this.loading = false;
          this.options = this.list.filter(item => {
            return (
              item.userName.toLowerCase().indexOf(query.toLowerCase()) > -1
            );
          });
        }, 200);
      } else {
        this.options = [];
      }
    },
    //负责人添加
    grtselect() {
      if (this.falesId == true) {
        this.falesId = false;
        this.name="确定负责人"
      } else {
        if (this.options.length > 0) {
          this.FixedAssetsAddDTO.fixedController = this.user.userId;
          this.falesId = true;
          this.name="修改负责人"
          console.log(this.FixedAssetsAddDTO.fixedController);
        } else {
          this.$message.error("没有负责人哦亲");
        }
      }
    },
    //计时器
    getTime() {
      const date = new Date();
      const year = date.getFullYear();
      const month = date.getMonth() + 1;
      const day = date.getDate();
      const hour = date.getHours();
      const minute = date.getMinutes();
      const second = date.getSeconds();
      const str = "";
      if (this.hour > 12) {
        this.hour -= 12;
        this.str = " PM";
      } else {
        this.str = " AM";
      }
      this.month = check(month);
      this.day = check(day);
      this.hour = check(hour);
      this.minute = check(minute);
      this.second = check(second);
      function check(i) {
        const num = i < 10 ? "0" + i : i;
        return num;
      }
      this.nowDate =
        year +
        "年" +
        this.month +
        "月" +
        this.day +
        "日" +
        this.hour +
        ":" +
        this.minute +
        ":" +
        this.second;
    },
    //时间处理
    timestampToTime() {
      var date = this.currentTime;
      var Y = date.getFullYear() + "-";
      var M =
        (date.getMonth() + 1 < 10
          ? "0" + (date.getMonth() + 1)
          : date.getMonth() + 1) + "-";
      var D =
        (date.getDate() < 10 ? "0" + date.getDate() : date.getDate()) + " ";
      var h =
        (date.getHours() < 10 ? "0" + date.getHours() : date.getHours()) + ":";
      var m =
        (date.getMinutes() < 10 ? "0" + date.getMinutes() : date.getMinutes()) +
        ":";
      var s =
        date.getSeconds() < 10 ? "0" + date.getSeconds() : date.getSeconds();
      this.FixedAssetsAddDTO.registerTime = Y + M + D + h + m + s;
    },
    //提交
    submitForm() {
      this.timestampToTime();
      console.log(this.FixedAssetsAddDTO);
      this.$refs.ruleForm.validate(valid => {
        if (valid) {
          insert(this.FixedAssetsAddDTO)
            .then(res => {
              if (res.success) {
                this.$message({
                  showClose: true,
                  message: "提交资产成功",
                  type: "success"
                });
                this.$router.push("/assetslist");
              } else {
                this.$message.error(res.msg);
              }
            })
            .catch(error => {
              this.$message.error(error.msg);
            });
        }
      });
    },
    // 返回
    back() {
      this.$router.push("/assetslist");
    },
    //重置
    resetForm() {
      this.FixedAssetsAddDTO = {
        fixedAddress: null, //资产地址
        fixedCode: null, //资产编号（不重复）
        fixedController: null, //选择资产负责人
        fixedDetails: null, //登记详情
        fixedMoney: null, //资产金额
        fixedName: null, //资产名称
        fixedState: 0, //默认为0
        registerRemarks: null, //登记备注
        registerTime: null //登记时间
      };
    }
  },
  beforeDestroy() {
    if (this.timer) {
      clearInterval(this.timer); // 在Vue实例销毁前，清除定时器
    }
  }
};
</script>

<style>
.nowDate {
  font-size: 20px;
  font-family: "Lucida Console", "Courier New", monospace;
}
.nowTime {
  font-size: 20px;
  font-weight: 500px;
  font-family: "Lucida Console", "Courier New", monospace;
}
.datatime {
  width: 300px;
}
</style>