spfm-market-front/src/pages/main/budget/initBudget.vue

<template>
  <div class="container">
    <fullscreen :fullscreen.sync="fullscreen" class="container-box">
      <div class="titbox">
        <h2 class="font-ui">部门预算管理</h2>
        <div>
          <i class="el-icon-refresh" @click="iconCli(1)"></i>
          <i class="el-icon-full-screen" @click="iconCli(2)"></i>
          <!--                    <i class="el-icon-folder-opened"></i>-->
          <!--                    <i class="el-icon-view"></i>-->
          <!--                    <i class="el-icon-more"></i>-->
        </div>
      </div>
      <div class="search">
        <mySearch :searchList="searchList" @searchInfo="searchInfo"></mySearch>
      </div>

      <div class="tabbox">
        <el-table
          v-loading="loading"
          height="calc(100% - 40px)"
          class="com-table"
          ref="multipleTable"
          :data="tableData"
          tooltip-effect="dark"
          size="small"
          border
          style="width: 100%"
        >
          <el-table-column
            align="center"
            prop="preTempName"
            label="预算名称"
            show-overflow-tooltip
          >
          </el-table-column>
          <el-table-column
            align="center"
            prop="sendTime"
            show-overflow-tooltip
            label="配置时间"
          >
          </el-table-column>
          <el-table-column
            align="center"
            prop="sendNo"
            show-overflow-tooltip
            label="配置工号"
          >
          </el-table-column>
          <el-table-column
            align="center"
            prop="sendName"
            show-overflow-tooltip
            label="配置姓名"
          >
          </el-table-column>
          <el-table-column
            align="center"
            prop="stsDesc"
            show-overflow-tooltip
            label="预算状态"
          >
          </el-table-column>
          <el-table-column
            width="300"
            align="center"
            prop="hotline"
            label="操作"
          >
            <template slot-scope="scope">
              <el-button
                v-if="scope.row.stsDesc == '待办'"
                size="mini"
                type="danger"
                plain
                @click="recall(scope.row)"
                >召回</el-button
              >
              <el-button
                v-if="scope.row.stsDesc == '待办'"
                size="mini"
                type="primary"
                plain
                @click="close(scope.row)"
                >归档</el-button
              ><el-button
                size="mini"
                type="success"
                plain
                @click="seeExcel(scope.row)"
                >查看模板</el-button
              >

              <el-button
                v-if="scope.row.stsDesc !== '召回'"
                size="mini"
                type="warning"
                plain
                @click="seeLog(scope.row)"
                >查看回复</el-button
              >
              <!-- <el-button
                v-if="scope.row.stsDesc !== '召回'"
                size="mini"
                type="success"
                plain
                @click="detailes(scope.row)"
                >查看预算</el-button
              > -->
            </template>
          </el-table-column>
        </el-table>
        <el-pagination
          class="pageBox"
          @current-change="currchange"
          layout="prev, pager, next"
          background
          :total="total"
        >
        </el-pagination>
      </div>
    </fullscreen>
  </div>
</template>
<script>
import mySearch from "../../../components/search";
export default {
  components: {
    mySearch,
  },
  data() {
    return {
      fullscreen: false,
      total: 0,
      pageSize: 1,
      tableData: [
        {
          name: "黑龙江公司移动成本预算简表",
          cNo: "admin",
          cName: "admin",
          time: "2021-03-10",
          status: "待办",
        },
        {
          name: "黑龙江公司移动成本预算简表",
          cNo: "admin",
          cName: "admin",
          time: "2021-03-10",
          status: "归档",
        },
        {
          name: "黑龙江公司移动成本预算简表",
          cNo: "admin",
          cName: "admin",
          time: "2021-03-10",
          status: "召回",
        },
      ],
      searchList: [
        {
          type: "input",
          tit: "预算名称",
          value: "",
          width: "100%",
          options: [],
        },
        {
          type: "sel",
          tit: "状态",
          value: "",
          width: "100%",
          options: [
            { dataCode: "0", dataName: "待办" },
            { dataCode: "1", dataName: "已归档" },
            { dataCode: "2", dataName: "召回" },
          ],
        },
      ],
      params: {
        preTempName: "",
        sts: "",
      },
      loading: false,
    };
  },
  methods: {
    detailes(val) {
      this.$router.push("/initExcelrecall?status=see&id=" + val.taskId + "");
    },
    seeExcel(val) {
      this.$router.push("/initExcelsee?status=see&id=" + val.preTempId + "");
      // this.defaultMenu("/initExcelsee?status=see", "部门预算excel");
    },
    close(val) {
      this.$confirm("预算归档, 是否确定?", "提示", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning",
      })
        .then(() => {
          this.$http({
            url: "/market/preWo/placeWo",
            method: "post",
            headers: {
              "Content-Type": "application/json",
            },
            data: { woNo: val.woNo },
          }).then((res) => {
            this.$message({
              type: "success",
              message: "归档成功",
            });
            this.getList(this.params, this.pageSize);
          });
        })
        .catch(() => {});
    },
    defaultMenu(path, name) {
      let defaults = this.$store.state.tabList.filter((item) => {
        if (item.rountPath == path) {
          return item;
        }
      });
      if (defaults.length == 1) {
        return;
      }
      let params = {
        children: "",
        name: name,
        rountPath: path,
        target: "_self",
      };
      let set = new Set([...this.$store.state.tabList, params]);
      this.$store.commit("setDefaultActive", path);
      this.$store.commit("setTabList", Array.from(set));
    },
    recall(val) {
      this.$confirm("即将召回下发的部门预算, 是否确定?", "提示", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning",
      })
        .then(() => {
          this.$http({
            url: "/market/preWo/recall ",
            method: "post",
            headers: {
              "Content-Type": "application/json",
            },
            data: { woNo: val.woNo },
          }).then((res) => {
            this.$message({
              type: "success",
              message: "召回成功",
            });
            this.getList(this.params, this.pageSize);
          });
        })
        .catch(() => {});
    },
    defaultMenu(path, name) {
      let defaults = this.$store.state.tabList.filter((item) => {
        if (item.rountPath == path) {
          return item;
        }
      });
      if (defaults.length == 1) {
        return;
      }
      let params = {
        children: "",
        name: name,
        rountPath: path,
        target: "_self",
      };
      let set = new Set([...this.$store.state.tabList, params]);
      this.$store.commit("setDefaultActive", path);
      this.$store.commit("setTabList", Array.from(set));
    },
    seeLog(val) {
      this.$router.push({
        path: "/recallAdmin",
        query: {
          id: val.woNo,
        },
      });
    },
    //搜索数据
    searchInfo(v) {
      this.params = {};
      v[0] ? (this.params.preTempName = v[0]) : "";
      v[1] ? (this.params.sendTime = v[1]) : "";
      v[2] ? (this.params.sts = v[2]) : "";
      this.getList(this.params, this.pageSize);
    },
    //获取列表
    getList(v, n) {
      this.loading = true;
      this.pageSize = n;
      this.$http({
        url: "/market/preWo/queryPage",
        method: "post",
        headers: {
          "Content-Type": "application/json",
          page: '{"pageNo":"' + n + '","pageSize":"10"}',
        },
        data: v,
      }).then((res) => {
        this.loading = false;
        this.tableData = res.data.data;
        this.total = res.data.totalRecord;
      });
    },
    //功能栏
    iconCli(v) {
      if (v === 1) {
        this.getList(this.params, this.pageSize);
      }
      if (v === 2) {
        this.fullscreen = !this.fullscreen;
      }
    },
    // 分页
    currchange(v) {
      this.pageSize = v;
      this.getList(this.params, this.pageSize);
    },
  },
  mounted() {
    this.getList(this.params, this.pageSize);
  },
};
</script>
<style scoped>
.el-upload-list {
  float: right;
}
.el-input__suffix {
  cursor: pointer;
}
.container .el-upload {
  width: auto !important;
}
</style>
<style scoped lang="scss">
.btn-default {
  display: inline;
  margin-left: 10px;
}
.titbox {
  div {
    float: right;

    i {
      font-size: 22px;
      margin-left: 20px;
      cursor: pointer;
    }
  }
}

.tabbox {
  margin-top: 15px;
}

.pageBox {
  text-align: right;
  margin-top: 10px;
}
</style>