feat(装备定义):

luoyb

2021-06-03 b7b34edde936a09f7a0357e42120737651f7da6f

feat(装备定义):

 src/views/hr/equip/equipdefine/Index.vue

New file
@@ -0,0 +1,142 @@
<template>
  <div style="...">
    <el-container>
      <el-header :height="headerHeight">
        <el-row style="margin-bottom: 10px;">
          <el-col :span="15">
            <h3 class="bu-tian-jia-title">装备定义</h3>
          </el-col>
          <el-col :span="9" style="margin-top: 15px;">
            <el-input v-model="queryParams.baseKey" placeholder="请输入内容" style="width:300px" />
            <span class="search-btn" @click="vagueSearch">查询</span>
          </el-col>
        </el-row>
      </el-header>
      <el-main style="height: 85%;">
        <el-row style="margin: 10px 0 10px 0;">
          <el-col :span="24">
            <!--            <el-button type="danger" class="hr-but-all" @click="showEquipInfo(0)">新增装备</el-button>-->
            <el-button type="primary" style="background-color: #409EFF" @click="delRecords">删除装备</el-button>
          </el-col>
        </el-row>
        <el-table
          ref="equipDefineTable"
          :cell-style="{padding:'7px 0','text-align':'center'}"
          :header-cell-style="{'height':'5.3vh','background-color':'#e6e6e6','text-align':'center'}"
          stripe
          border
          style="width: 100%;color: #000;"
          @sort-change="changeSort"
        >
          <el-table-column type="selection" width="55" />
          <el-table-column label="操作" width="130">
            <template slot-scope="scope">
              <span
                style="color: #a00515;display: inline-block;width: 40%;cursor: pointer"
                @click="editRecord(scope.row)"
              >编辑</span>
            </template>
          </el-table-column>
          <el-table-column
            show-overflow-tooltip
            prop="equipName"
            label="装备名称"
            min-width="500px"
            sortable="custom"
            :sort-orders="['ascending', 'descending']"
          />
          <el-table-column show-overflow-tooltip prop="measuringUnit" label="计量单位" />
        </el-table>
        <pagination
          v-show="total>0"
          style="text-align: right;width: 98%;"
          :total="total"
          :page.sync="pagination.num"
          :limit.sync="pagination.size"
          @pagination="search"
        />
      </el-main>
    </el-container>
  </div>
</template>
<script>
import Pagination from '@/components/Pagination'

export default {
  name: 'Index',
  comments: { Pagination },
  data() {
    return {
      headerHeight: '30px',
      tableData: {},
      queryParams: {},
      total: 0,
      sort: { },
      pagination: {
        size: 10,
        num: 1
      },
      selection: []
    }
  },
  mounted() {
    this.fetch()
  },
  methods: {
    // 请求数据
    fetch(params = {}) {
      var that = this
      params.pageSize = this.pagination.size
      params.pageNum = this.pagination.num
      params.delFlag = 0
      this.$get('hr/equipDefine/list', {
        ...params
      }).then((r) => {
        const data = r.data.data
        that.total = data.total
        that.tableData = data.rows
      })
    },
    // 翻页查询
    search() {
      this.queryParams.baseKey = ''
      this.fetch({
        ...this.queryParams,
        ...this.sort
      })
    },
    // 关键词查询
    vagueSearch() {
      this.fetch({
        baseKey: this.queryParams.baseKey
      })
    },
    // 排序
    changeSort(val) {
      this.sort.field = val.prop
      this.sort.order = val.order
      this.search()
    },
    // 删除记录
    delRecords() {},
    // 编辑记录
    editRecord(row) {}
  }
}
</script>

<style lang="scss">
.search-btn {
  display: inline-block;
  width: 3.64vw;
  height: 3.2vh;
  line-height: 3.2vh;
  text-align: center;
  background-color: #a00515;
  color: #fff;
  margin-left: 1vw;
  box-sizing: border-box;
  cursor: pointer;
  vertical-align: middle;
}
</style>