dy-admin-manager/src/views/setQuestions/index.vue

<template>
  <div class='m-container'>
    <h2>
      <div class="squrt"></div>问卷管理
    </h2>
    <div class="m-core">
        <el-button type="primary" @click="onQuestionOperation('create')"
           v-permission="'organization/add'"
           class='newBand'>添加问卷</el-button>
        <save-form :inline="true"
               @submit="search"
               @reset="onReSet"
               ref="searchForm"
               :model="searchForm">
        <el-form-item prop="search">
            <el-input
                type="text"
                clearable
                v-model="searchForm.search"
                placeholder="问卷编号或编号"
            ></el-input>
        </el-form-item>
        <el-form-item prop="status">
          <el-select v-model="searchForm.status"
                     filterable
                     placeholder="请选择收费类型"
                     clearable>
            <el-option label="启用" :value="1"></el-option>
            <el-option label="停用" :value="0"></el-option>
          </el-select>
        </el-form-item>

        <el-form-item>
          <el-button type="danger" native-type="submit">搜索</el-button>
          <el-button native-type="reset" type="primary">重置</el-button>
        </el-form-item>
      </save-form>
      <!-- 列表 -->
      <div class="tableWrap">
        <el-table :data='tableList'
                  :header-cell-style="{background:'#EDEEF0',color:'#444'}">
          <el-table-column align='center'
                           prop="id"
                           label="问卷编号">
          </el-table-column>
          <el-table-column align='center'
                           prop="name"
                           label="问卷名称">
          </el-table-column>
          <el-table-column align='center'
                           prop="areaName"
                           label="状态">
          </el-table-column>
          <el-table-column align='center'
                           label="操作">
            <template slot-scope="scope">
              <el-button @click="onQuestionOperation('update', scope.row)"
                         v-permission="'organization/update'"
                         type="text">修改</el-button>
            </template>
          </el-table-column>
        </el-table>
        <pagination sync :total.sync="pageInfo.total"
                    :page.sync="pageInfo.page"
                    :limit.sync="pageInfo.limit"
                    :page-sizes="pageInfo.page_size"
                    @pagination="getList" />
      </div>
    </div>

  </div>
</template>
<script>
import pagination from '@/components/Pagination/index'
import { branchQueryPage, areaQueryChild, branchAdd, branchUpdate, getParentArea } from '@/api/specialSetting'
export default {
  name: 'branchSetting',
  components: { pagination },
  data () {
    return {
        searchForm: {
            search: null,
            status: null
        },
        tableList: [],
        pageInfo: {
            // 分页规则
            limit: 10, // 限制显示条数
            page: 1, // 当前页
            total: 0, // 总条数
            page_size: [10, 20, 40, 50] // 选择限制显示条数
        },
        organId: null,
    }
  },
  mounted () {
    this.getList()
  },
  methods: {
    getList () {
      branchQueryPage({
        rows: this.pageInfo.limit,
        page: this.pageInfo.page
      }).then(res => {
        if (res.code == 200 && res.data) {
          this.tableList = res.data.rows
          this.pageInfo.total = res.data.total
        }
      })
    },
    onQuestionOperation(type) {
        let str = '问卷'
        str = (type == 'create' ? '添加' : '修改') + str
        this.$router.push({
            path: '/operateManager/questionOperation',
            query: {
                type
            }
        }, (router) => {
            router.meta.title = str;
        })
    },
    search() {
      this.pageInfo.page = 1;
      this.getList();
    },
    onReSet() {
      this.$refs['searchForm'].resetFields();
      this.search();
    },

  }
}
</script>
<style lang="scss" scoped>
/deep/.el-button--primary {
  background: #14928a;
  border-color: #14928a;
  color: #fff;
  &:hover,
  &:active,
  &:focus {
    background: #14928a;
    border-color: #14928a;
    color: #fff;
  }
}
/deep/.el-date-editor.el-input {
  width: 100% !important;
}
/deep/.el-select {
  width: 98% !important;
}
</style>