<template>
  <div class="content-main">
    <el-form
      ref="searchForm"
      :inline="true"
      :model="searchForm"
      class="search-bm-boder"
      label-position="left"
    >
      <el-row>
        <el-form-item label="编号:" prop="gdbh">
          <el-input
            v-model="searchForm.gdbh"
            clearable
            placeholder="请输入编号"
          ></el-input>
        </el-form-item>
        <el-form-item label="类型:" prop="workOrderType">
          <el-select
            v-model="searchForm.workOrderType"
            style="width: 170px"
            clearable
            placeholder="请选择类型"
          >
            <el-option
              v-for="item in workOrderTypeOptions"
              :key="item.dictCode"
              :label="item.dictName"
              :value="item.dictCode"
            ></el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="问题情况描述:" prop="problemDesc">
          <el-input
            v-model="searchForm.problemDesc"
            clearable
            placeholder="请输入问题情况描述"
          ></el-input>
        </el-form-item>
        <!-- <el-form-item label="系统名称:" prop="webSysName">
          <el-select
            v-model="searchForm.webSysName"
            style="width: 170px"
            clearable
            placeholder="请选择系统名称"
            >
            <el-option
              v-for="item in systemNameOptions"
              :key="item.name"
              :label="item.name"
              :value="item.name"
            ></el-option>
          </el-select>
        </el-form-item> -->
        <el-form-item label="状态:" prop="shzt">
          <el-select
            v-model="searchForm.shzt"
            style="width: 170px"
            clearable
            placeholder="请选择状态"
          >
            <el-option
              v-for="item in shztOptions"
              :key="item.code"
              :label="item.name"
              :value="item.code"
            ></el-option>
          </el-select>
        </el-form-item>
        <el-form-item>
          <div class="search-button">
            <span class="search-line"></span>
            <el-button
              type="primary"
              size="small"
              class="iconfont iconchaxun"
              @click="searchInfo"
              >查询</el-button
            >
            <el-button
              type="primary"
              @click="resetInfo('searchForm')"
              size="small"
              class="iconfont iconzhongzhi"
            >
              重置</el-button
            >
          </div>
        </el-form-item>
      </el-row>
    </el-form>
    <el-row class="addBtnBg">
      <el-button
        type="primary"
        class="iconfont iconxinzeng"
        size="mini"
        @click="addclick"
        >创建运维申请表</el-button
      >
    </el-row>
    <el-row>
      <el-table
        :data="tableData"
        stripe
        border
        fit
        id="out-table"
        highlight-current-row
        style="width: 100%"
      >
        <el-table-column align="center" label="序号" width="70">
          <template slot-scope="scope">
            <span>{{ scope.$index + 1 }}</span>
          </template>
        </el-table-column>
        <el-table-column
          align="center"
          prop="gdbh"
          show-overflow-tooltip
          width="140"
          label="编号"
        ></el-table-column>
        <el-table-column
          align="center"
          prop="workOrderTypeName"
          label="类型"
          width="80"
          show-overflow-tooltip
        ></el-table-column>
        <el-table-column
          align="center"
          prop="problemDesc"
          label="问题情况描述"
          min-width="260"
          show-overflow-tooltip
        ></el-table-column>
        <!-- <el-table-column
          align="center"
          prop="webSysName"
          label="系统名称"
          show-overflow-tooltip
        >
        </el-table-column> -->
        <el-table-column
          align="center"
          prop="shztmc"
          label="状态"
          width="140"
          show-overflow-tooltip
        ></el-table-column>
        <el-table-column
          align="center"
          prop="verifySealDate"
          label="提交时间"
          width="110"
          show-overflow-tooltip
        ></el-table-column>
        <el-table-column
          align="center"
          prop="acceptDate"
          label="受理时间"
          width="110"
          show-overflow-tooltip
        ></el-table-column>
        <el-table-column
          align="center"
          prop="solveDate"
          width="110"
          label="解决时间"
          show-overflow-tooltip
        ></el-table-column>
        <el-table-column fixed="right" align="center" label="操作" width="150">
          <template slot-scope="scope">
            <el-tooltip
              class="item"
              effect="light"
              content="查看"
              placement="top"
            >
              <el-button
                @click="handleClick(scope.row, 0)"
                type="primary"
                size="small"
                class="operate_show_btn iconfont iconchakan2"
              ></el-button>
            </el-tooltip>
            <el-tooltip
              class="item"
              effect="light"
              content="编辑"
              placement="top"
              v-if="buttonNameList.indexOf('编辑') > -1"
            >
              <el-button
                @click="handleClick(scope.row, 1)"
                type="primary"
                class="operate_edit_btn iconfont iconxiugai1"
                v-show="scope.row.shzt == '91000001'"
                size="small"
              ></el-button>
            </el-tooltip>
            <el-tooltip
              class="item"
              effect="light"
              content="审核"
              placement="top"
              v-if="buttonNameList.indexOf('审核') > -1"
            >
              <el-button
                @click="handleClick(scope.row, 'sh')"
                type="primary"
                class="operate_edit_btn iconfont iconshenhe"
                v-show="
                  scope.row.shzt == '91000010' || scope.row.shzt == '91000011'
                "
                size="small"
              ></el-button>
            </el-tooltip>
            <el-tooltip
              class="item"
              effect="light"
              content="盖章"
              placement="top"
              v-if="buttonNameList.indexOf('盖章') > -1"
            >
              <el-button
                @click="handleClick(scope.row)"
                type="primary"
                class="operate_edit_btn iconfont icongaizhang"
                v-show="scope.row.shzt == '91000020'"
                size="small"
              ></el-button>
            </el-tooltip>
            <el-tooltip
              class="item"
              effect="light"
              content="确认"
              placement="top"
              v-if="buttonNameList.indexOf('确认') > -1"
            >
              <el-button
                @click="handleClick(scope.row, 'qr')"
                type="primary"
                class="operate_edit_btn iconfont iconqueren"
                v-show="
                  scope.row.shzt == '91000050' || scope.row.shzt == '91000052'
                "
                size="small"
              ></el-button>
            </el-tooltip>
            <el-tooltip
              class="item"
              effect="light"
              content="追加问题"
              placement="top"
              v-if="buttonNameList.indexOf('追加问题') > -1"
            >
              <el-button
                @click="handleClick(scope.row, 'zj')"
                type="primary"
                class="operate_edit_btn iconfont iconxinzeng"
                v-show="
                  scope.row.shzt == '91000040' ||
                  scope.row.shzt == '91000030' ||
                  scope.row.shzt == '91000042'
                "
                size="small"
              ></el-button>
            </el-tooltip>
            <el-tooltip
              class="item"
              effect="light"
              content="删除"
              placement="top"
              v-if="buttonNameList.indexOf('删除') > -1"
            >
              <el-button
                @click="deleteRow(scope.row)"
                type="primary"
                v-show="scope.row.shzt == '91000001'"
                size="small"
                class="operate_delete_btn iconfont iconshanchu"
              ></el-button>
            </el-tooltip>
          </template>
        </el-table-column>
      </el-table>
    </el-row>
    <el-row>
      <el-pagination
        @size-change="handleSizeChange"
        @current-change="handleCurrentChange"
        :current-page.sync="pageForm.pageNum"
        :page-sizes="[10, 20, 30, 40]"
        :page-size="pageForm.pageSize"
        layout="total, sizes, prev, pager, next, jumper"
        :total="pageForm.total"
      ></el-pagination>
    </el-row>
  </div>
</template>

<script>
import { authorityControl } from "@/api/login/login";
import {
  selectPageByEntity,
  findYWRYPDictCode,
  removeList,
} from "@/api/operationServices/operationOrder/index.js";
export default {
  data() {
    return {
      buttonNameList: [],
      searchForm: {
        gdbh: "",
        workOrderType: "",
        problemDesc: "",
        // webSysName:'',
        shzt: "",
      },
      workOrderTypeOptions: [],
      systemNameOptions: [
        {
          code: "1",
          name: "天津智能出入库系统",
        },
        {
          code: "2",
          name: "天津市企业服务平台",
        },
        {
          code: "3",
          name: "天津智能粮库业务平台",
        },
        {
          code: "4",
          name: "市级综合粮食管理和服务平台",
        },
      ], //系统名称list
      shztOptions: [
        {
          code: "91000010",
          name: "待审核",
        },
        {
          code: "91000020",
          name: "待盖章",
        },
        {
          code: "91000030",
          name: "待受理",
        },
        {
          code: "91000040",
          name: "办理中",
        },
        {
          code: "91000050",
          name: "待申请确认",
        },
        {
          code: "91000060",
          name: "待信息中心确认",
        },
        {
          code: "91000070",
          name: "已完成",
        },
        {
          code: "91000011",
          name: "盖章驳回",
        },
        {
          code: "91000001",
          name: "审核驳回",
        },
        {
          code: "91000042",
          name: "继续办理",
        },
        {
          code: "91000052",
          name: "待申请人再次确认",
        },
      ],
      pageForm: {
        pageNum: 1,
        pageSize: 10,
        total: 0,
      },
      tableData: [],
    };
  },
  created() {
    this.getButtonList(
      sessionStorage.getItem("resourceCode"),
      sessionStorage.getItem("userCode")
    );
    findYWRYPDictCode("YWDLX").then((res) => {
      if (res.infoCode == 200) {
        this.workOrderTypeOptions = res.data;
      } else {
        this.$message.error(res.msg);
      }
    });
    this.getList("start");
  },
  methods: {
    //获取按钮权限
    getButtonList(menuCode, userCode) {
      let codeData = {
        resourceCode: menuCode,
        userId: userCode,
      };
      authorityControl(codeData).then((res) => {
        let buttonNameList = [];
        res.data.forEach((item) => {
          this.buttonNameList.push(item.resourceName);
        });
      });
    },
    getList(type) {
      if (type != "start") {
        //非初始化调用：查询、分页
        sessionStorage.setItem("searchData", JSON.stringify(this.searchForm));
        sessionStorage.setItem("pageForm", JSON.stringify(this.pageForm));
      } else {
        //初始化分两种情况，详情页等返回后的初始化，以及第一次进入此菜单的初始化
        if (JSON.parse(sessionStorage.getItem("searchData"))) {
          //详情页返回后，将对应查询条件和分页的字段赋值，页面回显参数
          this.searchForm = JSON.parse(sessionStorage.getItem("searchData"));
          this.pageForm = JSON.parse(sessionStorage.getItem("pageForm"));
        } else {
          //第一次进去此菜单时，保存上方默认的data
          sessionStorage.setItem("searchData", JSON.stringify(this.searchForm));
          sessionStorage.setItem("pageForm", JSON.stringify(this.pageForm));
        }
      }
      let data = {
        gdbh: this.searchForm.gdbh,
        workOrderType: this.searchForm.workOrderType,
        problemDesc: this.searchForm.problemDesc,
        // webSysName:this.searchForm.webSysName,
        shzt: this.searchForm.shzt,
        pageSize: this.pageForm.pageSize,
        pageNum: this.pageForm.pageNum,
        pageType: 1,
      };
      selectPageByEntity(data).then((res) => {
        if (res.infoCode == 200) {
          this.pageForm.total = res.data.total;

          res.data.items.forEach((item) => {
            this.shztOptions.forEach((i) => {
              if (item.shzt == i.code) {
                item.shztmc = i.name;
              }
            });
          });
          this.tableData = res.data.items;
        } else {
          this.$message.error(res.msg);
        }
      });
    },
    //查询
    searchInfo() {
      this.pageForm.pageNum = 1;
      this.getList();
    },

    //重置
    resetInfo(searchForm) {
      this.$refs[searchForm].resetFields();
      this.pageForm.pageNum = 1;
      this.getList();
    },
    //查看
    handleClick(row, type) {
      this.$router.push({
        name: "operationOrderDetail",
        query: {
          shzt: row.shzt,
          fid: row.fid,
          type: type == "0" ? "CK" : type == "zj" ? "zj" : type,
        },
      });
    },
    //新增运维单
    addclick() {
      this.$router.push({
        name: "operationOrderDetail",
        query: {
          shzt: "add",
        },
      });
    },
    handleSizeChange(val) {
      this.pageForm.pageSize = val;
      this.getList();
    },
    handleCurrentChange(val) {
      this.pageForm.pageNum = val;
      this.getList();
    },
    deleteRow(row) {
      let data = {
        fid: row.fid,
      };
      this.$confirm("是否确认删除？", "提示", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning",
      }).then(() => {
        removeList(data)
          .then((response) => {
            if (response.infoCode == 200) {
              this.getList();
              this.$message({
                showClose: true,
                message: "删除成功！",
                type: "success",
              });
            }
          })
          .catch(function (error) {
            console.log(error);
          });
      });
    },
  },
  beforeCreate() {},
  mounted() {},
};
</script>

<style lang="scss" scoped>
.line {
  border-bottom: 1px solid #000;
}
.iconfont {
  color: white;
}
.title {
  margin-bottom: 20px;
  text-align: center;
  font-size: 16px;
}

.text {
  text-align: center;
}

.iconfont {
  font-size: 13px;
}
.addTable {
  text-align: right;
  margin-right: 50px;
}

.addTable span {
  font-size: 20px;
  font-weight: bold;
  color: #4588db;
  cursor: pointer;
}
</style>
<style>
</style>
