cbjsxt-front-master/src/views/EntDeclaration/auditTaskProcessing/index.vue

<template>
  <div class="audit-project-manage">
    <!-- 页面标题 -->
    <h2>成本监审任务</h2>

    <!-- 搜索区域 -->
    <div class="search-container">
      <el-form :inline="true" :model="searchForm" class="demo-form-inline">
        <el-form-item label="年度：">
          <el-date-picker
            v-model="searchForm.year"
            type="year"
            placeholder="选择年"
            format="yyyy"
            value-format="yyyy"
          ></el-date-picker>
        </el-form-item>
        <el-form-item label="监审项目名称：">
          <el-input
            v-model="searchForm.projectName"
            placeholder="请输入监审项目名称"
            clearable
          />
        </el-form-item>
        <!-- <el-form-item label="立项来源：">
          <el-select v-model="searchForm.projectSource" placeholder="请选择立项来源">
            <el-option label="年度计划内" value="1"></el-option>
            <el-option label="年度计划外" value="2"></el-option>
          </el-select>
        </el-form-item> -->
        <!-- <el-form-item label="监审形式：">
          <el-select
            v-model="searchForm.auditType"
            placeholder="请选择监审形式"
            style="width: 100%"
            clearable
          >
            <el-option
              v-for="item in dictData['auditType']"
              :key="item.key"
              :label="item.name"
              :value="item.key"
            ></el-option>
          </el-select> -->
        <!-- <el-input v-model="searchForm.auditType" placeholder="请输入监审形式" clearable /> -->
        <!-- </el-form-item> -->
        <!-- <el-form-item label="立项地区：">
          <el-input v-model="searchForm.areaName" placeholder="请输入立项地区" clearable />
        </el-form-item> -->
        <!-- <el-form-item label="监审主体：">
          <el-input v-model="searchForm.auditBody" placeholder="请输入监审主体" clearable />
        </el-form-item> -->
        <!-- <el-form-item label="状态：">
          <el-select v-model="searchForm.status" placeholder="请选择状态">
            <el-option label="提交材料" value="tjcl"></el-option>
            <el-option label="材料初审" value="ccls"></el-option>
            <el-option label="实地审核" value="sdsh"></el-option>
            <el-option label="意见告知" value="yigz"></el-option>
            <el-option label="意见反馈" value="yjfk"></el-option>
            <el-option label="集体审议" value="jtsy"></el-option>
            <el-option label="出具报告" value="cjbg"></el-option>
            <el-option label="归档" value="gd"></el-option>
          </el-select>
        </el-form-item> -->
        <el-form-item>
          <el-button type="primary" @click="handleSearch">查询</el-button>
        </el-form-item>
      </el-form>
    </div>

    <!-- 数据表格 -->
    <el-table
      v-loading="loading"
      :data="projectList"
      border
      style="width: 100%"
    >
      <el-table-column
        prop="serialNumber"
        label="序号"
        width="60"
        align="center"
      >
        <template slot-scope="scope">
          <span>
            {{ scope.$index + 1 }}
          </span>
        </template>
      </el-table-column>
      <el-table-column
        prop="projectYear"
        label="立项年度"
        width="100"
        align="center"
      >
        <template slot-scope="scope">
          <span>{{ scope.row.projectYear }}年</span>
        </template>
      </el-table-column>
      <el-table-column
        prop="areaName"
        label="立项地区"
        width="100"
        align="center"
      />
      <el-table-column
        prop="projectName"
        label="成本监审项目名称"
        align="center"
        show-overflow-tooltip
      >
        <template slot-scope="scope">
          <a href="#" class="link-text" @click.prevent="handleView(scope.row)">
            {{ scope.row.projectName }}
          </a>
        </template>
      </el-table-column>
      <el-table-column
        prop="auditPeriod"
        label="监审期间"
        align="center"
        show-overflow-tooltip
      />
      <el-table-column
        prop="sourceType"
        label="立项来源"
        align="center"
        show-overflow-tooltip
      >
        <!-- <template slot-scope="scope">
            {{ getDictName('projectProposal', scope.row.sourceType) }}
          </template> -->
      </el-table-column>
      <el-table-column
        prop="auditType"
        label="监审形式"
        width="120"
        align="center"
      >
        <!-- <template slot-scope="scope">
            {{ getDictName('auditType', scope.row.auditType) }}
          </template> -->
      </el-table-column>
      <el-table-column
        prop="orgName"
        label="监审主体"
        align="center"
        show-overflow-tooltip
      />
      <el-table-column
        prop="status"
        label="状态"
        align="center"
        show-overflow-tooltip
      >
        <template slot-scope="scope">
          <div v-if="scope.row.status === 'tjcl'">提交材料</div>
          <div v-if="scope.row.status === 'ccls'">材料初审</div>
          <div v-if="scope.row.status === 'sdsh'">实地审核</div>
          <div v-if="scope.row.status === 'yigz'">意见告知</div>
          <div v-if="scope.row.status === 'yjfk'">意见反馈</div>
          <div v-if="scope.row.status === 'jtsy'">集体审议</div>
          <div v-if="scope.row.status === 'cjbg'">出具报告</div>
          <div v-if="scope.row.status === 'gd'">归档</div>
        </template>
      </el-table-column>

      <el-table-column label="操作" width="180" align="center">
        <template slot-scope="scope">
          <!-- 文字按钮样式 -->
          <el-button size="mini" type="text" @click="handleEdit(scope.row)">
            填报任务
          </el-button>
          <el-button size="mini" type="text" @click="handleMessage(scope.row)">
            消息通知
          </el-button>
          <!-- <el-button
            size="mini"
            type="text"
            @click="handleEstablish(scope.row)"
          >
            立项
          </el-button> -->
        </template>
      </el-table-column>
    </el-table>

    <!-- 分页 -->
    <div class="pagination-container">
      <el-pagination
        :current-page="currentPage"
        :page-sizes="[10, 20, 50, 100]"
        :page-size="pageSize"
        layout="total, sizes, prev, pager, next, jumper"
        :total="total"
        @size-change="handleSizeChange"
        @current-change="handleCurrentChange"
      ></el-pagination>
    </div>
  </div>
</template>

<script>
  import { Message, MessageBox } from 'element-ui'
  import { getTaskHandlingList } from '@/api/auditTaskProcessing'
  import { dictMixin } from '@/mixins/useDict'

  export default {
    name: 'AuditTaskProcessingView',
    mixins: [dictMixin],
    data() {
      return {
        dictData: {
          auditType: [], //监审形式
          projectProposal: [], //立项来源
        },
        loading: false,
        // 搜索表单
        searchForm: {
          pageNum: 1,
          pageSize: 10,
          year: '',
          projectName: '',
          projectSource: '',
          auditForm: '',
          auditType: '',
          areaName: '',
          auditBody: '',
          status: '',
        },
        // 项目列表
        projectList: [
          // {
          //   id: 1,
          //   serialNumber: 1,
          //   planYear: '2025',
          //   auditRegion: '山西省',
          //   projectName: '省内油气管道运输成本监审',
          //   auditorData: '2022年--2024年',
          //   projectSource: '年度计划内',
          //   auditForm: '定期监审',
          //   auditBody: '山西省发改委—成本调查监审局',
          //   status: 'tjcl',
          // },
          // {
          //   id: 2,
          //   serialNumber: 2,
          //   planYear: '2025',
          //   auditRegion: '山西省',
          //   projectName: '省内油气管道运输成本监审',
          //   auditorData: '2019年--2021年',
          //   projectSource: '年度计划内',
          //   auditForm: '定期监审',
          //   auditBody: '山西省发改委—成本调查监审局',
          //   status: 'jtsy',
          // },
          // {
          //   id: 3,
          //   serialNumber: 3,
          //   planYear: '2025',
          //   auditRegion: '山西省',
          //   projectName: '省内油气管道运输成本监审',
          //   auditorData: '2016年--2018年',
          //   projectSource: '年度计划内',
          //   auditForm: '定期监审',
          //   auditBody: '山西省发改委—成本调查监审局',
          //   status: 'yigz',
          // },
          // {
          //   id: 4,
          //   serialNumber: 4,
          //   planYear: '2025',
          //   auditRegion: '山西省',
          //   projectName: '省内油气管道运输成本监审',
          //   auditorData: '2013年--2015年',
          //   projectSource: '年度计划内',
          //   auditForm: '定期监审',
          //   auditBody: '山西省发改委—成本调查监审局',
          //   status: 'gd',
          // },
        ],
        // 分页信息
        currentPage: 1,
        pageSize: 10,
        total: 3,
      }
    },
    mounted() {
      this.handleSearch()
    },
    methods: {
      // 处理搜索
      handleSearch() {
        this.currentPage = 1
        this.searchForm.pageNum = 1
        this.getTaskHandlingPage()
      },

      // 处理查看
      handleView(row) {
        // this.dialogTitle = '查看项目'
        // this.isView = true
        // this.currentProject = { ...row }
        // this.dialogVisible = true
        this.$router.push({
          path: '/dataManagement/EntDeclaration/auditTaskManagementProjectInfo',
        })
      },

      handleEstablishDialogClose() {},
      // 处理分页大小变化
      handleSizeChange(val) {
        this.pageSize = val
        this.searchForm.pageSize = val
        this.searchForm.pageNum = 1
        this.currentPage = 1
        this.getTaskHandlingPage()
      },
      // 处理当前页变化
      handleCurrentChange(val) {
        this.currentPage = val
        this.searchForm.pageNum = val
        this.getTaskHandlingPage()
      },
      // 填报任务
      handleEdit(row) {
        console.log(row)
        this.$router.push({
          path: '/dataManagement/EntDeclaration/auditTaskManagementProjectInfo',
          query: {
            info: row,
          },
        })
      },
      // 消息通知
      handleMessage(row) {
        console.log(row)
        this.$router.push({
          path: '/dataManagement/EntDeclaration/auditTaskManagementProjectInfo',
          query: {
            info: row,
            formType: 'messageNotice',
          },
        })
      },
      // 任务办理列表
      getTaskHandlingPage() {
        this.loading = true
        getTaskHandlingList(this.searchForm)
          .then((res) => {
            console.log('任务办理列表', res)
            this.projectList = res.value.value.records
            this.total = res.value.value.total
            this.loading = false
          })
          .catch((err) => {
            console.log(err)
            this.loading = false
          })
      },
    },
  }
</script>

<style scoped>
  .audit-project-manage {
    padding: 20px;
  }

  h2 {
    margin-bottom: 20px;
    font-size: 18px;
    color: #303133;
  }

  .search-container {
    margin-bottom: 20px;
    padding: 10px;
    background-color: #f5f7fa;
    border-radius: 4px;
  }

  .demo-form-inline {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
  }

  .link-text {
    color: #409eff;
    cursor: pointer;
  }

  .pagination-container {
    margin-top: 20px;
    text-align: right;
  }

  /* 对话框样式 */
  .dialog-content h3 {
    margin-bottom: 20px;
    font-size: 16px;
    color: #303133;
  }
</style>