wt_project_web_bak/src/views/task/component/task.vue

<template>
  <avue-crud
      :option="option"
      :data="data"
      ref="crud"
      v-model="form"
      :before-open="beforeOpen"
      @row-del="rowDel"
      @row-save="rowSave"
      @row-update="rowUpdate"
      @on-load="onLoad">
    <template #menu-left="{}">
      <el-button-group>
        <el-button type='primary' :plain='query.type !== "0" ' @click='changeQueryType("0")'>待完成</el-button>
        <el-button type='primary' :plain='query.type !== "1" ' @click='changeQueryType("1")'>已完成</el-button>
        <el-button type='primary' :plain='query.type !== "" ' @click='changeQueryType("")'>全部</el-button>
      </el-button-group>
    </template>
    <template #menu="{row}">
      <el-button type='primary' text icon='Position' @click='changeQueryType("0")'>提交</el-button>
    </template>
  </avue-crud>
</template>

<script>
export default {
  name: 'my-task',
  data () {
    return {
      query: {
        type: '0'
      },
      page: {
        pageSize: 10,
        currentPage: 1,
        total: 10
      },
      data: [],
      form: {},
      option: {
        align: 'center',
        menuAlign: 'center',
        menuWidth: 380,
        size: 'mini',
        addBtn: false,
        viewBtn: true,
        editBtn: false,
        delBtn: false,
        refreshBtn: false,
        columnBtn: false,
        labelWidth: 140,
        border: true,
        column: [
          {
            label: '任务名称',
            prop: 'title'
          },
          {
            label: '任务要求',
            prop: 'remark'
          },
          {
            label: '所属项目',
            prop: 'projectName'
          },
          {
            label: '下发人',
            prop: 'dispatcherUserName'
          },
          {
            label: '下发时间',
            prop: 'createTime'
          },
          {
            label: '任务状态',
            prop: 'isCompleted',
            type: 'select',
            dicData: [
              {
                label: '待完成',
                value: 0
              },
              {
                label: '已完成',
                value: 1
              }
            ]
          }
        ]
      }
    }
  },
  methods: {
    onLoad () {
      this.loading = true
      this.page.current = this.page.currentPage
      this.page.size = this.page.pageSize
      this.$api.task.taskList(Object.assign(this.page, this.query)).then(res => {
        this.loading = false
        if (res.code === 200) {
          this.data = res.data.records
          this.page.total = res.data.total
        }
      })
    },
    beforeOpen (done, type) {
      if (type === 'view') {
        this.$router.push({ path: '/task/detail', query: { id: this.form.id, taskId: this.form.taskId } })
      } else {
        done()
      }
    },
    currentChange (currentPage) {
      this.page.currentPage = currentPage
    },
    sizeChange (pageSize) {
      this.page.size = pageSize
    },
    refreshChange () {
      this.onLoad()
    },
    rowDel (row) {
      this.$confirm('确定彻底删除所选择的文件?', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      })
        .then(() => {
          this.$api.recycle.recycleRemove({ ids: row.id }).then(res => {
            if (res.code === 200) {
              this.$message.success(res.msg)
              this.onLoad()
            } else {
              this.$message.error(res.msg)
            }
          })
        })
    },
    changeQueryType (type) {
      this.query.type = type
      this.onLoad()
    }

  }
}
</script>

<style scoped>

</style>