<template>
  <div class="otherCommon">
    <div class="setWater">
      <h4>termid 转换</h4>
      <div class="waterForm">
        <div class="cmdidBox">
          <h5>装置编号</h5>
          <el-input
            type="textarea"
            :rows="16"
            placeholder="请输入装置编号"
            v-model="cmdidtextarea"
          >
          </el-input>
        </div>
        <div class="leftWaterBox">
          <h5>新装置编号</h5>
          <el-input
            type="textarea"
            :rows="16"
            placeholder="请输入左侧水印"
            v-model="newCmdidText"
          >
          </el-input>
        </div>
      </div>
      <el-button type="primary" @click="handleSure">确 定</el-button>
      <el-button type="primary" @click="copyShare">复 制</el-button>
      <el-button class="mlspan" type="text"
        ><i>{{ issueCommands.length }}</i
        >条命令</el-button
      >
      <div class="commandsBox" id="copy-content">
        <div class="aaa" v-for="item in issueCommands" v-html="item"></div>
      </div>
    </div>
    <!-- 上位机转换 -->
    <div class="setWater">
      <h4>上位机转换</h4>
      <div class="waterForm">
        <div class="cmdidBox">
          <h5>装置编号</h5>
          <el-input
            type="textarea"
            :rows="16"
            placeholder="请输入装置编号"
            v-model="cmdidCmatextarea"
          >
          </el-input>
        </div>
      </div>
      <el-button type="primary" @click="handleSureCma">确 定</el-button>
      <el-button type="primary" @click="copyCmaShare">复 制</el-button>
      <el-button class="mlspan" type="text"
        ><i>{{ cmaissueCommands.length }}</i
        >条命令</el-button
      >
      <div class="commandsBox" id="copy-content2">
        <div class="aaa" v-for="item in cmaissueCommands" v-html="item"></div>
      </div>
    </div>
  </div>
</template>
<script>
export default {
  name: "otherCommon",
  data() {
    return {
      cmdidtextarea: "", //输入的值
      cmdidArr: [],
      newCmdidText: "", //输入的值
      newCmdidArr: [],
      issueCommands: [], //打印出来下发命令

      cmdidCmatextarea: "",
      cmdidCmaArr: [],
      cmaissueCommands: [], //打印出来下发命令
    };
  },
  created() {},
  methods: {
    handleSure() {
      if (this.cmdidtextarea !== "") {
        this.cmdidArr = [...this.cmdidtextarea.trim().split("\n")]; //装置编号
      } else {
        this.$message({
          showClose: true,
          message: "请输入装置编号",
          type: "warning",
        });
        return;
      }
      if (this.newCmdidText !== "") {
        this.newCmdidArr = [...this.newCmdidText.trim().split("\n")]; //左侧水印
      } else {
        this.$message({
          showClose: true,
          message: "请输入新装置编号",
          type: "warning",
        });
        return;
      }
      console.log(this.cmdidArr);
      console.log(this.newCmdidArr);
      this.issueCommands = [];
      this.getnewID();
    },
    getnewID() {
      //.\bin\xympadmn.exe --server=61.169.135.150 --port=6891 --act=termid --cmdid=XYIGA10C241000036 --rf=1 --newcmdid=12M10010107183656

      for (let i = 0; i < this.cmdidArr.length; i++) {
        var command =
          ".\\bin\\xympadmn.exe --server=61.169.135.150 --port=6891 --act=termid --cmdid=" +
          this.cmdidArr[i] +
          " --rf=1" +
          " --newcmdid=" +
          this.newCmdidArr[i];

        this.issueCommands.push(command); //把命令push
      }
      console.log(this.issueCommands);
    },
    copyShare() {
      let div = document.getElementById("copy-content");
      let range = "";
      if (document.body.createTextRange) {
        //兼容ie
        range = document.body.createTextRange();
        range.moveToElementText(div);
        range.select();
      } else if (window.getSelection) {
        // 兼容非IE，比如Firefox/chrome
        let selection = window.getSelection();
        range = document.createRange();
        range.selectNodeContents(div);
        selection.removeAllRanges();
        selection.addRange(range);
      }
      document.execCommand("Copy"); // 执行浏览器复制命令
      console.log("已复制好，可贴粘");
    },

    //cma信息批量

    handleSureCma() {
      if (this.cmdidCmatextarea !== "") {
        this.cmdidCmaArr = [...this.cmdidCmatextarea.trim().split("\n")]; //装置编号
      } else {
        this.$message({
          showClose: true,
          message: "请输入装置编号",
          type: "warning",
        });
        return;
      }
      console.log(this.cmdidCmaArr);
      this.cmaissueCommands = [];
      this.getnewCma();
    },
    getnewCma() {
      //.\bin\xympadmn.exe --server=61.169.135.150 --port=6891 --act=termid --cmdid=XYIGA10C241000036 --rf=1 --newcmdid=12M10010107183656
      //.\bin\xympadmn.exe --server=61.169.135.150 --port=6891 --act=cma --cmdid=12M10010107183755 --ip=220.248.250.22 --cmaport=18096 --domain=
      for (let i = 0; i < this.cmdidCmaArr.length; i++) {
        var command =
          ".\\bin\\xympadmn.exe --server=61.169.135.150 --port=6891 --act=cma --cmdid=" +
          this.cmdidCmaArr[i] +
          " --ip=220.248.250.22 --cmaport=18096 --domain=";

        this.cmaissueCommands.push(command); //把命令push
      }
      console.log(this.cmaissueCommands);
    },
    copyCmaShare() {
      let div = document.getElementById("copy-content2");
      let range = "";
      if (document.body.createTextRange) {
        //兼容ie
        range = document.body.createTextRange();
        range.moveToElementText(div);
        range.select();
      } else if (window.getSelection) {
        // 兼容非IE，比如Firefox/chrome
        let selection = window.getSelection();
        range = document.createRange();
        range.selectNodeContents(div);
        selection.removeAllRanges();
        selection.addRange(range);
      }
      document.execCommand("Copy"); // 执行浏览器复制命令
      console.log("已复制好，可贴粘");
    },
  },
};
</script>
<style lang="less">
.otherCommon {
  width: calc(100% - 24px);
  height: calc(100% - 24px);
  padding: 12px 12px;
  background: #fff;
  display: flex;
  justify-content: space-between;
  .setWater {
    width: 48%;
    border: 1px solid #dddddd;
    height: calc(100% - 24px);
    padding: 12px;
    border-radius: 4px;

    .waterForm {
      width: 100%;
      height: 50%;
      margin-top: 16px;
      // background: #fcc;
      display: flex;
      .channelBox {
        width: 150px;
        border: 1px solid #dddddd;
        padding: 12px;
        border-radius: 4px;
        margin-right: 8px;
        .groupCheck {
          display: flex;
          flex-direction: column;
          margin-top: 12px;
          .el-checkbox {
            height: 32px;
            line-height: 32px;
          }
        }
      }
      .cmdidBox {
        width: 250px;
        border: 1px solid #dddddd;
        padding: 12px;
        border-radius: 4px;
        margin-right: 8px;
        .el-textarea {
          margin-top: 2px;
        }
      }
      .leftWaterBox {
        margin-right: 8px;
      }
      .leftWaterBox,
      .rghtWaterBox {
        flex: 1;
        border: 1px solid #dddddd;
        padding: 12px;
        border-radius: 4px;
        .el-textarea {
          margin-top: 2px;
        }
      }
    }
    .el-button {
      margin-top: 4px;
    }
    .commandsBox {
      width: auto;
      height: calc(50% - 106px);
      margin-top: 8px;
      border: 1px solid #fcc;
      overflow: auto;
      padding: 8px;
      border-radius: 4px;
    }
    .mlspan {
      //   margin-left: 24px;
      //   height: 32px;
      //   line-height: 32px;
      //   margin-top: 4px;
      //   display: inline-block;
      font-size: 14px;
      color: #000;
      cursor: default;
      i {
        color: #169e8c;
        font-weight: bold;
        font-style: normal;
      }
    }
  }
}
</style>
