<template>
  <div class="testdiv">
    <div class="divborder newSearchDiv">
      <!-- 搜索条件--程序号 -->
      <div class="filter">
        <label>程序号：</label>
        <Input class="searchInput" v-model="programNo" />
      </div>
      <!-- 搜索条件--产品名称 -->
      <div class="filter">
        <label>产品名称：</label>
        <Select v-model="productName" clearable filterable class="searchSelect">
          <Option v-for="v in productList" :value="v.name" :key="v.id"
            >{{ v.name }}({{ v.code }})</Option
          >
        </Select>
      </div>
      <!-- 搜索条件--审核状态 -->
      <div class="filter">
        <label>审核状态：</label>
        <Select v-model="auditStatus" clearable class="searchSelect">
          <Option :value="1">待审核</Option>
          <Option :value="2">已审核</Option>
          <Option :value="3">被拒绝</Option>
        </Select>
      </div>
      <!-- 按钮组 -->
      <div class="searchBtn">
        <!-- 查询 -->
        <Button
          type="primary"
          class="twoWord"
          icon="ios-search"
          @click="search()"
        >
          查询
        </Button>
        <!-- 创建 -->
        <Button
          type="success"
          class="twoWord"
          icon="md-add-circle"
          @click="add()"
        >
          创建
        </Button>
        <!-- 修改 -->
        <Button
          type="warning"
          class="twoWord"
          icon="ios-create-outline"
          @click="edit()"
        >
          修改
        </Button>
        <!-- 删除 -->
        <Button
          type="error"
          class="twoWord intervalRight"
          icon="md-close-circle"
          @click="del()"
        >
          删除
        </Button>
        <!-- 编辑 -->
        <Button
          type="primary"
          class="twoWord"
          icon="md-create"
          @click="editProgram()"
        >
          编辑
        </Button>
        <!-- 下载 -->
        <Button
          type="primary"
          class="twoWord"
          icon="md-download"
          @click="download()"
        >
          下载
        </Button>
        <!-- 版本记录 -->
        <Button
          type="primary"
          class="fourWord"
          icon="md-recording"
          @click="getHistory()"
        >
          版本记录
        </Button>
      </div>
    </div>
    <div class="divborder newTableDiv">
      <!-- 表格 -->
      <Table
        highlight-row
        class="tableClass"
        :data="tableData"
        :columns="tableColumns"
        @on-current-change="handleRowChange"
      >
      </Table>
      <!-- 分页器 -->
      <div class="pageDiv">
        <div class="pageDirection">
          <Page
            :total="total"
            :current.sync="page"
            :page-size="pagesize"
            show-elevator
            show-sizer
            show-total
            @on-change="handlePage"
            @on-page-size-change="handlePageSize"
            :page-size-opts="[10, 20, 30, 40, 100]"
          >
          </Page>
        </div>
      </div>
    </div>
    <!-- 创建弹框 -->
    <Modal class="newModalClass echo_wrap" v-model="addModal" :width="700">
      <p slot="header">
        <span>程序创建</span>
      </p>
      <div class="modal_body">
        <div class="echo_row">
          <div class="filter">
            <label>主程序号：</label>
            <Input class="searchInput" v-model="addObj.mainProgramNo" />
          </div>
          <div class="filter">
            <label>主程序文件：</label>
            <Input
              v-if="addObj.mainProgramName"
              class="searchInput"
              icon="md-close-circle"
              :value="addObj.mainProgramName"
              @on-click="clearProgram('main')"
            />
            <Upload
              v-else
              class="upload"
              :action="action"
              :headers="headers"
              :show-upload-list="false"
              :format="fileFormat"
              :on-format-error="handleFormatError"
              :on-success="
                (r, f) => {
                  handleSuccess(r, f, 'main');
                }
              "
              :on-error="handleError"
            >
              <Button icon="ios-cloud-upload-outline">程序上传</Button>
            </Upload>
          </div>
          <span class="groupBtn" @click="addGroup()">+</span>
        </div>
        <div class="echo_row" v-for="(v, i) in addObj.childProgram" :key="i">
          <div class="filter">
            <label>子程序号：</label>
            <Input class="searchInput" v-model="v.no" />
          </div>
          <div class="filter">
            <label>子程序文件：</label>
            <Input
              v-if="v.name"
              class="searchInput"
              icon="md-close-circle"
              :value="v.name"
              @on-click="clearProgram(i)"
            />
            <Upload
              v-else
              class="upload"
              :action="action"
              :headers="headers"
              :show-upload-list="false"
              :format="fileFormat"
              :on-format-error="handleFormatError"
              :on-success="
                (r, f) => {
                  handleSuccess(r, f, i);
                }
              "
              :on-error="handleError"
            >
              <Button icon="ios-cloud-upload-outline">程序上传</Button>
            </Upload>
          </div>
          <span class="groupBtn" @click="delGroup(i)">-</span>
        </div>
        <div class="echo_row">
          <div class="filter">
            <label>产品名称：</label>
            <Select
              v-model="addObj.productName"
              clearable
              filterable
              class="searchSelect"
            >
              <Option v-for="v in productList" :value="v.name" :key="v.id">{{
                v.name
              }}</Option>
            </Select>
          </div>
          <div class="filter">
            <label>工序名称：</label>
            <Select
              v-model="addObj.routeName"
              clearable
              filterable
              class="searchSelect"
            >
              <Option value="工序A">工序A</Option>
              <Option value="工序B">工序B</Option>
              <Option value="工序C">工序C</Option>
            </Select>
          </div>
        </div>
        <div class="echo_row">
          <div class="filter">
            <label>审核人员：</label>
            <Select
              v-model="addObj.checkBy"
              clearable
              filterable
              class="searchSelect"
            >
              <Option v-for="v in userList" :value="v.name" :key="v.name">{{
                v.name
              }}</Option>
            </Select>
          </div>
          <div class="filter">
            <label>备注：</label>
            <Input class="searchInput" v-model="addObj.remark" />
          </div>
        </div>
      </div>
      <div slot="footer">
        <Button size="large" @click="addModal = false">取消</Button>
        <Button size="large" type="primary">确认</Button>
      </div>
    </Modal>
    <!-- 修改弹框 -->
    <Modal class="newModalClass echo_wrap" v-model="editModal" :width="700">
      <p slot="header">
        <span>程序修改</span>
      </p>
      <div class="modal_body">
        <div class="echo_row">
          <div class="filter">
            <label>主程序号：</label>
            <Input class="searchInput" v-model="editObj.mainProgramNo" />
          </div>
          <div class="filter">
            <label>主程序文件：</label>
            <Input
              v-if="editObj.mainProgramName"
              class="searchInput"
              icon="md-close-circle"
              :value="editObj.mainProgramName"
              @on-click="clearProgram('main')"
            />
            <Upload
              v-else
              class="upload"
              :action="action"
              :headers="headers"
              :show-upload-list="false"
              :format="fileFormat"
              :on-format-error="handleFormatError"
              :on-success="
                (r, f) => {
                  handleSuccess(r, f, 'main');
                }
              "
              :on-error="handleError"
            >
              <Button icon="ios-cloud-upload-outline">程序上传</Button>
            </Upload>
          </div>
          <span class="groupBtn" @click="addGroup()">+</span>
        </div>
        <div class="echo_row" v-for="(v, i) in editObj.childProgram" :key="i">
          <div class="filter">
            <label>子程序号：</label>
            <Input class="searchInput" v-model="v.no" />
          </div>
          <div class="filter">
            <label>子程序文件：</label>
            <Input
              v-if="v.name"
              class="searchInput"
              icon="md-close-circle"
              :value="v.name"
              @on-click="clearProgram(i)"
            />
            <Upload
              v-else
              class="upload"
              :action="action"
              :headers="headers"
              :show-upload-list="false"
              :format="fileFormat"
              :on-format-error="handleFormatError"
              :on-success="
                (r, f) => {
                  handleSuccess(r, f, i);
                }
              "
              :on-error="handleError"
            >
              <Button icon="ios-cloud-upload-outline">程序上传</Button>
            </Upload>
          </div>
          <span class="groupBtn" @click="delGroup(i)">-</span>
        </div>
        <div class="echo_row">
          <div class="filter">
            <label>产品名称：</label>
            <Select
              v-model="editObj.productName"
              clearable
              filterable
              class="searchSelect"
            >
              <Option v-for="v in productList" :value="v.name" :key="v.id">{{
                v.name
              }}</Option>
            </Select>
          </div>
          <div class="filter">
            <label>工序名称：</label>
            <Select
              v-model="editObj.routeName"
              clearable
              filterable
              class="searchSelect"
            >
              <Option value="工序A">工序A</Option>
              <Option value="工序B">工序B</Option>
              <Option value="工序C">工序C</Option>
            </Select>
          </div>
        </div>
        <div class="echo_row">
          <div class="filter">
            <label>审核人员：</label>
            <Select
              v-model="editObj.checkBy"
              clearable
              filterable
              class="searchSelect"
            >
              <Option v-for="v in userList" :value="v.name" :key="v.name">{{
                v.name
              }}</Option>
            </Select>
          </div>
          <div class="filter">
            <label>备注：</label>
            <Input class="searchInput" v-model="editObj.remark" />
          </div>
        </div>
      </div>
      <div slot="footer">
        <Button size="large" @click="editModal = false">取消</Button>
        <Button size="large" type="primary">确认</Button>
      </div>
    </Modal>
    <!-- 编辑弹框 -->
    <Modal class="newModalClass echo_wrap" v-model="contentModal" :width="700">
      <p slot="header">
        <span>编辑内容</span>
      </p>
      <div class="modal_body">
        <textarea class="echo_textarea" v-model="programContent"></textarea>
      </div>
      <div slot="footer">
        <Button size="large" @click="contentModal = false">取消</Button>
        <Button size="large" type="primary" @click="confirmEditContent()">
          确定
        </Button>
      </div>
    </Modal>
    <!-- 版本记录弹框 -->
    <Modal
      class="newModalClass echo_wrap versionModal"
      v-model="historyModal"
      :width="1000"
      footer-hide
    >
      <p slot="header">
        <span>版本记录</span>
      </p>
      <div class="modal_body">
        <div class="echo_row">
          <div class="filter">
            <label>产品名称：</label>
            <Input class="searchInput" value="UPS支架00012" readonly />
          </div>
          <div class="filter">
            <label>程序号：</label>
            <Input class="searchInput" value="O0002" readonly />
          </div>
        </div>
        <div class="echo_row">
          <Table
            class="tableClass"
            :data="historyData"
            :columns="historyColumns"
          >
          </Table>
        </div>
      </div>
    </Modal>
    <!-- 程序预览弹框 -->
    <Modal
      class="newModalClass echo_wrap"
      v-model="previewModal"
      :width="900"
      footer-hide
    >
      <p slot="header">
        <span> 程序预览 </span>
      </p>
      <div class="modal_body">
        <Tabs value="0" type="card">
          <TabPane label="主程序（O0054）" name="0">
            <textarea class="echo_textarea" :value="programContent"></textarea>
          </TabPane>
          <TabPane label="主程序（O0054）" name="1">
            <textarea class="echo_textarea" :value="programContent"></textarea>
          </TabPane>
          <TabPane label="主程序（O0054）" name="2">
            <textarea class="echo_textarea" :value="programContent"></textarea>
          </TabPane>
          <TabPane label="主程序（O0054）" name="3">
            <textarea class="echo_textarea" :value="programContent"></textarea>
          </TabPane>
        </Tabs>
      </div>
    </Modal>
  </div>
</template>

<script>
export default {
  data() {
    return {
      // 搜索条件--程序号
      programNo: "",
      // 搜索条件--产品名称
      productName: "",
      // 产品下拉列表
      productList: [],
      // 审核人员下拉列表
      userList: [],
      // 搜索条件--审核状态
      auditStatus: "",
      // 页码，页距，总计
      page: 1,
      pagesize: 10,
      total: 0,
      // 表格数据
      tableData: [],
      // 当前选中行
      row: {},
      // 表格列字段
      tableColumns: [
        {
          type: "sort",
          title: "序号",
          render: (h, params) => {
            return h(
              "span",
              params.index + (this.page - 1) * this.pagesize + 1
            );
          },
          width: 75,
          align: "center",
        },
        {
          title: "操作",
          width: 80,
          align: "center",
          render: (h, params) => {
            const _this = this;
            return h(
              "div",
              {
                style: {
                  textAlign: "center",
                  color: "#2D8CF0",
                  cursor: "pointer",
                },
                on: {
                  click: () => {
                    console.log(params.row);
                    _this.previewModal = true;
                  },
                },
              },
              "预览"
            );
          },
        },
        {
          title: "主程序号",
          key: "program_code",
        },
        {
          title: "产品名称",
          key: "productname",
        },
        {
          title: "产品图纸号",
          key: "code",
        },
        {
          title: "工序名称",
          key: "",
        },
        {
          title: "主程序文件名",
          key: "file_name",
          width: 120,
          align: "center",
        },
        {
          title: "创建人",
          key: "createname",
          width: 85,
          align: "center",
        },
        {
          title: "创建时间",
          key: "createtime",
          width: 150,
          align: "center",
        },
        {
          title: "创建备注",
          key: "create_remark",
          width: 90,
          align: "center",
        },
        {
          title: "审核人",
          key: "checkname",
          width: 85,
          align: "center",
        },
        {
          title: "审核时间",
          key: "checktime",
          width: 150,
          align: "center",
        },
        {
          title: "审核结果",
          key: "checkinfo",
          width: 90,
          align: "center",
        },
        {
          title: "审核备注",
          key: "check_remark",
          width: 90,
          align: "center",
        },
        {
          title: "子程序个数",
          key: "",
        },
        {
          title: "版本号",
          key: "program_version",
        },
        {
          title: "状态",
          align: "center",
          width: 90,
          render: (h, params) => {
            let bg, text;
            let status = params.row.checkstatus;
            switch (status) {
              case 1:
                text = "待审核";
                bg = "#FFFF00";
                break;
              case 2:
                text = "已审核";
                bg = "#00FF00";
                break;
              case 3:
                text = "被拒绝";
                bg = "#FF0000";
                break;
            }
            return h("div", {
              domProps: {
                innerHTML: text,
              },
              style: {
                backgroundColor: bg,
                width: "100%",
                height: "36px",
                lineHeight: "36px",
                textAlign: "center",
              },
            });
          },
        },
      ],
      // 创建对象
      addObj: {
        mainProgramNo: "",
        mainProgramPath: "",
        mainProgramName: "",
        mainProgramSize: 0,
        childProgram: [
          {
            no: "",
            path: "",
            name: "",
            size: 0,
          },
        ],
        productName: "",
        routeName: "",
        checkBy: "",
        remark: "",
      },
      // 创建弹框是否弹出
      addModal: false,
      // 修改对象
      editObj: {
        mainProgramNo: "",
        mainProgramPath: "",
        mainProgramName: "",
        mainProgramSize: 0,
        childProgram: [
          {
            no: "",
            path: "",
            name: "",
            size: 0,
          },
        ],
        productName: "",
        routeName: "",
        checkBy: "",
        remark: "",
      },
      // 修改弹框是否弹出
      editModal: false,
      // 操作类型 1 创建 2 修改
      type: 0,
      // 程序内容
      programContent: "",
      // 编辑内容弹框是否弹出
      contentModal: false,
      // 版本记录弹框是否弹出
      historyModal: false,
      // 版本记录表格数据
      historyData: [],
      // 版本记录表格列字段
      historyColumns: [
        {
          type: "sort",
          title: "序号",
          render: (h, params) => {
            return h(
              "span",
              params.index + 1 + (this.page - 1) * this.pagesize
            );
          },
        },
        {
          title: "文件名称",
          key: "fileName",
        },
        {
          title: "上传/更新时间",
          width: 150,
          align: "center",
          render: (h, params) => {
            return h("div", {
              domProps: {
                innerHTML: params.row.updateTime,
              },
              style: {
                textAlign: "center",
              },
            });
          },
        },
        {
          title: "上传人",
          key: "updateBy",
        },
        {
          title: "审核人",
          key: "checkBy",
        },
        {
          title: "生效版本",
          width: 85,
          align: "center",
          render: (h, params) => {
            let isActive = params.row.isActive;
            return h("Radio", {
              props: {
                value: isActive,
                disabled: !isActive,
              },
              style: {
                textAlign: "center",
              },
            });
          },
        },
        {
          title: "版本号",
          key: "version",
        },
        {
          title: "操作",
          width: 85,
          align: "center",
          render: (h, params) => {
            const _this = this;
            return h(
              "div",
              {
                style: {
                  textAlign: "center",
                  color: "#3333FF",
                  cursor: "pointer",
                },
                on: {
                  click: () => {
                    console.log(params.row);
                    _this.historyModal = false;
                  },
                },
              },
              "下载"
            );
          },
        },
      ],
      // 预览弹框是否弹出
      previewModal: false,
    };
  },
  computed: {
    // 文件上传地址
    action() {
      const _this = this;
      let url = _this.axios.publicPath + "dnc/DncPgCreate/Upload";
      return url;
    },
    // 文件上传请求头
    headers() {
      return {
        token: localStorage.getItem("token"),
        timestamp: localStorage.getItem("timestamp"),
        nonce: localStorage.getItem("nonce"),
        sign: localStorage.getItem("sign"),
      };
    },
    // 文件上传允许的格式
    fileFormat() {
      return ["txt", "eia", "mpf", "min", "spf", "cnc", "nc", "prg", "zip"];
    },
  },
  mounted() {
    // 格式化表格样式
    this.tableColumns = this.$time.initTableTitle(this.tableColumns);
    this.historyColumns = this.$time.initTableTitle(this.historyColumns);
    // 获取产品下拉列表
    this.getProductList();
    // 获取审核人员下拉列表
    this.getUserList();
    // 初始化查询
    this.search();
  },
  methods: {
    // 获取产品下拉列表
    getProductList() {
      const _this = this;
      _this.axios
        .request({
          url: "/config/ProjectProduct/GetProductsByCode?code=&name=&count=50",
          method: "get",
        })
        .then((res) => {
          let result = res.data;
          if (result.ret == 1) {
            let data = result.data;
            _this.productList = [];
            if (data && Array.isArray(data) && data.length) {
              _this.productList = data;
            }
          } else {
            _this.$Message.error(_this.$t(result.msg));
          }
        });
    },
    // 查询
    search() {
      const _this = this;
      let { programNo, productName, auditStatus, page, pagesize } = this;
      let params = {
        programcode: programNo,
        product_name: productName,
        checkstatus: auditStatus ? auditStatus : 0,
        page,
        pagesize,
      };
      _this.axios
        .request({
          url: "/dnc/DncPgCreate/GetProgramLists",
          params,
          method: "get",
        })
        .then((res) => {
          let result = res.data;
          if (result.ret == 1) {
            _this.total = result.total;
            _this.tableData = [];
            let data = result.data;
            if (data && Array.isArray(data) && data.length) {
              _this.tableData = data;
            }
          } else {
            _this.$Message.error(_this.$t(result.msg));
          }
        });
    },
    // 监听表格当前选中行
    handleRowChange(cur) {
      this.row = cur;
    },
    // 监听页码变化
    handlePage(v) {
      this.page = v;
      this.search();
    },
    // 监听页距变化
    handlePageSize(v) {
      this.pagesize = v;
      this.search();
    },
    // 监听文件上传格式错误钩子
    handleFormatError(file) {
      this.$Message.error(this.$t(888822));
    },
    // 监听文件上传成功钩子
    handleSuccess(res, file, params) {
      const _this = this;
      let { type } = this;
      if (res.ret == 1) {
        this.$Message.success(this.$t(888823));
        let data = res.data;
        if (params == "main") {
          if (type == 1) {
            _this.$set(_this.addObj, "mainProgramPath", data.file_url);
            _this.$set(_this.addObj, "mainProgramName", data.name);
            _this.$set(_this.addObj, "mainProgramSize", data.size);
          } else if (type == 2) {
            _this.$set(_this.editObj, "mainProgramPath", data.file_url);
            _this.$set(_this.editObj, "mainProgramName", data.name);
            _this.$set(_this.editObj, "mainProgramSize", data.size);
          }
        } else {
          if (type == 1) {
            _this.$set(
              _this.addObj.childProgram[params],
              "path",
              data.file_url
            );
            _this.$set(_this.addObj.childProgram[params], "name", data.name);
            _this.$set(_this.addObj.childProgram[params], "size", data.size);
          } else if (type == 2) {
            _this.$set(
              _this.editObj.childProgram[params],
              "path",
              data.file_url
            );
            _this.$set(_this.editObj.childProgram[params], "name", data.name);
            _this.$set(_this.editObj.childProgram[params], "size", data.size);
          }
        }
      } else {
        this.$Message.error(this.$t(res.msg));
      }
    },
    // 监听文件上传失败钩子
    handleError() {
      this.$Message.error(this.$t(888824));
    },
    // 清除上传文件
    clearProgram(params) {
      const _this = this;
      let { type } = this;
      if (params == "main") {
        if (type == 1) {
          _this.addObj.mainProgramName = "";
          _this.addObj.mainProgramPath = "";
          _this.addObj.mainProgramSize = 0;
        } else if (type == 2) {
          _this.editObj.mainProgramName = "";
          _this.editObj.mainProgramPath = "";
          _this.editObj.mainProgramSize = 0;
        }
      } else {
        if (type == 1) {
          _this.addObj.childProgram[params].name = "";
          _this.addObj.childProgram[params].path = "";
          _this.addObj.childProgram[params].size = 0;
        } else if (type == 2) {
          _this.editObj.childProgram[params].name = "";
          _this.editObj.childProgram[params].path = "";
          _this.editObj.childProgram[params].size = 0;
        }
      }
    },
    // 添加一组子程序
    addGroup() {
      const _this = this;
      let { type } = this;
      if (type == 1) {
        _this.addObj.childProgram.push({
          no: "",
          name: "",
          path: "",
          size: 0,
        });
      } else if (type == 2) {
        _this.editObj.childProgram.push({
          no: "",
          name: "",
          path: "",
          size: 0,
        });
      }
    },
    // 删除一组子程序
    delGroup(i) {
      const _this = this;
      let { type } = this;
      if (type == 1) {
        _this.addObj.childProgram.splice(i, 1);
      } else if (type == 2) {
        _this.editObj.childProgram.splice(i, 1);
      }
    },
    // 点击创建
    add() {
      // 清空上次输入数据
      this.addObj = {
        mainProgramNo: "",
        mainProgramPath: "",
        mainProgramName: "",
        mainProgramSize: 0,
        childProgram: [
          {
            no: "",
            path: "",
            name: "",
            size: 0,
          },
        ],
        productName: "",
        routeName: "",
        checkBy: "",
        remark: "",
      };
      this.type = 1;
      // 弹框弹出
      this.addModal = true;
    },
    // 获取审核人员下拉列表
    getUserList() {
      const _this = this;
      _this.axios
        .request({
          url: "/dnc/DncPgCreate/GetCheckUsers",
          method: "get",
        })
        .then((res) => {
          let result = res.data;
          if (result.ret == 1) {
            let data = result.data;
            _this.userList = [];
            if (data && Array.isArray(data) && data.length) {
              _this.userList = data;
            }
          } else {
            _this.$Message.error(_this.$t(result.msg));
          }
        });
    },
    // 点击修改
    edit() {
      const _this = this;
      let { row } = this;
      if (JSON.stringify(row) == "{}") {
        _this.$Message.error(_this.$t(1043));
        return false;
      }
      // TODO 获取数据然后赋值给 editObj
      _this.editObj = {
        mainProgramNo: "",
        mainProgramPath: "",
        mainProgramName: "",
        mainProgramSize: 0,
        childProgram: [
          {
            no: "",
            path: "",
            name: "",
            size: 0,
          },
        ],
        productName: "",
        routeName: "",
        checkBy: "",
        remark: "",
      };
      this.type = 2;
      // 弹框弹出
      _this.editModal = true;
    },
    // 点击删除
    del() {
      const _this = this;
      let { row, $t } = this;
      if (JSON.stringify(row) == "{}") {
        _this.$Message.error($t(1043));
        return false;
      }

      let data = {
        programid: [row.id],
      };

      _this.$Modal.confirm({
        title: $t(1018),
        content: "",
        width: 290,
        closable: true,
        okText: $t(1004),
        onOk: () => {
          _this.axios
            .request({
              url: "/dnc/DncPgCreate/DelProgram",
              data,
              method: "post",
            })
            .then((res) => {
              let result = res.data;
              if (result.ret == 1) {
                _this.$Message.success($t(result.msg));
                _this.search();
              } else {
                _this.$Message.error($t(result.msg));
              }
            });
        },
      });
    },
    // 点击编辑
    editProgram() {
      const _this = this;
      let { row, $t } = this;
      if (JSON.stringify(row) == "{}") {
        _this.$Message.error($t(1043));
        return false;
      }

      let params = {
        file_url: row.file_url,
      };

      _this.axios
        .request({
          url: "/dnc/DncPgCreate/getContent",
          params,
          method: "get",
        })
        .then((res) => {
          let result = res.data;
          if (result.ret == 1) {
            // 清空一下
            _this.programContent = "";
            let data = result.data;
            if (data.content) {
              _this.programContent = data.content;
            }
            // 弹框弹出
            _this.contentModal = true;
          } else {
            _this.$Message.error($t(result.msg));
          }
        });
    },
    // 确认修改程序内容
    confirmEditContent() {
      const _this = this;
      let { row, programContent } = this;
      let data = {
        id: row.id,
        content: programContent,
      };
      _this.axios
        .request({
          url: "/dnc/DncPgCreate/UpdateProgramContent",
          data,
          method: "post",
        })
        .then((res) => {
          let result = res.data;
          if (result.ret == 1) {
            _this.$Message.success(_this.$t(result.msg));
            _this.programContent = "";
            _this.contentModal = false;
            _this.search();
          } else {
            _this.$Message.error(_this.$t(result.msg));
          }
        });
    },
    // 下载方法
    funDownload(content, filename) {
      // 创建隐藏的可下载链接
      var eleLink = document.createElement("a");
      eleLink.download = filename;
      eleLink.style.display = "none";
      // 字符内容转变成blob地址
      var blob = new Blob([content]);
      eleLink.href = URL.createObjectURL(blob);
      // 触发点击
      document.body.appendChild(eleLink);
      eleLink.click();
      // 然后移除
      document.body.removeChild(eleLink);
    },
    // 点击下载
    download() {
      const _this = this;
      let { row, $t } = this;
      if (JSON.stringify(row) == "{}") {
        _this.$Message.error($t(1043));
        return false;
      }
      if (!row.file_url) {
        _this.$Message.error($t(9000147));
        return false;
      }
      let params = {
        file_url: row.file_url,
        filename: row.file_name,
      };
      let arr = row.file_name.split(".");
      let type = arr[arr.length - 1];

      if (type == "zip") {
        _this.axios
          .request({
            url: "/dnc/DncPgCreate/GetContentDownload",
            params,
            method: "get",
          })
          .then((res) => {
            let result = res.data;
            if (result.ret == 1) {
              window.location.href = _this.axios.publicPath + result.data;
            } else {
              _this.$Message.error($t(result.msg));
            }
          });
      } else {
        _this.axios
          .request({
            url: "/dnc/DncPgCreate/getContent",
            params,
            method: "get",
          })
          .then((res) => {
            let result = res.data;
            if (result.ret == 1) {
              let data = result.data;
              let content = data.content;
              content = content.replace(/\n/g, "\r\n");
              _this.funDownload(content, row.file_name);
            } else {
              _this.$Message.error($t(result.msg));
            }
            return false;
          });
      }
    },
    // 点击版本记录
    getHistory() {
      const _this = this;
      let { row, $t } = this;
      if (JSON.stringify(row) == "{}") {
        _this.$Message.error($t(1043));
        return false;
      }
      _this.historyData = [
        {
          fileName: "O0987.NC",
          updateTime: "2019-02-28 13:48",
          updateBy: "张三",
          checkBy: "李四",
          isActive: true,
          version: "V3",
          fileUrl: "",
        },
        {
          fileName: "O0987.NC",
          updateTime: "2019-02-20 13:44",
          updateBy: "张三",
          checkBy: "李四",
          isActive: false,
          version: "V2",
          fileUrl: "",
        },
        {
          fileName: "O0987.NC",
          updateTime: "2019-02-02 14:45",
          updateBy: "张三",
          checkBy: "李四",
          isActive: false,
          version: "V1",
          fileUrl: "",
        },
      ];
      _this.historyModal = true;
    },
  },
};
</script>

<style lang="less" scoped>
.echo_textarea::-webkit-scrollbar {
  width: auto;
}
.echo_textarea {
  font-size: 14px;
  white-space: nowrap;
  overflow: scroll;
  resize: none;
  width: 100%;
  height: 444px;
}
.groupBtn {
  width: 32px;
  height: 32px;
  background: rgb(87, 163, 243);
  color: rgb(255, 255, 255);
  display: inline-block;
  vertical-align: top;
  font-size: 20px;
  text-align: center;
  border-radius: 3px;
  margin-left: 5px;
  width: 30px;
  height: 30px;
  background: #57a3f3;
  color: #fff;
  cursor: pointer;
}
.upload {
  display: inline-block;
}
.expand-row {
  margin-bottom: 16px;
}
.demo-spin-icon-load {
  animation: ani-demo-spin 1s linear infinite;
}
.ivu-input-word-count {
  text-align: center;
  position: absolute;
  right: 7px;
  bottom: 2px;
  padding-left: 7px;
  background: #fff;
  z-index: 1;
  display: inline-flex;
  color: #808695;
  font-size: 12px;
}
</style>
