BST_bigScreen/src/views/BasicSettings/OverStandardPrice/list.vue

<template>
  <div>
    <FullPage title='超标价格方案'
              :list='list'
              @init='init'
              :loading='loading'
              @searchData='searchData'
              @changePage='changePage'
              @changeSize='changeSize'
              :tableColums='tableColums'
              :tableData='tableData'
              :page_index='page_index'
              :total='total'>
      <div slot='titleButton'>
      <Button @click="exportData()" type="primary" style="margin-right: 10px">批量导出</Button>
        <Button @click="handleSet('',-1,1)"
                type='primary'
                style="margin-right:10px;">新增方案</Button>
      </div>
      <template slot='set'
                slot-scope='{row,index}'>    
        <div class="table-set">
          <a style="margin:0 5px"
             @click="handleSet(row,index,2)">编辑</a>
          <a style="margin:0 5px"
             @click="handleSet(row,index,3)">查看</a>
          <a style="margin:0 5px"
             @click="handleSet(row,index,4)">删除</a>
        </div>
      </template>
    </FullPage>
  </div>
</template>

<script>
// 这里可以导入其他文件（比如：组件，工具js，第三方插件js，json文件，图片文件等等）
// 例如：import 《组件名称》 from '《组件路径》';

export default {
  name: 'OverStandardPriceList',
  components: {

  },
  props: {},
  // import引入的组件需要注入到对象中才能使用
  data () {
    // 这里存放数据
    return {
      list: [
        { title: '方案名称', name: 'Input', value: '', serverName: 'title', placeholder: '请输入方案名称' },
      ],
      loading: false,
      tableData: [],
      page_index: 1,
      total: 0,
      page_size: 10,
      proxyObj: {},
      tableColums: [
        { title: '序号', type: 'index', key: '', align: 'center', width: 80 },
        { title: '方案名称', key: 'title', align: 'center', tooltip: true, minWidth: 140 },
        { title: '操作', key: '', align: 'center', slot: 'set', width: 200 },
      ],
      tableData: [],
    }
  },
  // 生命周期 - 创建完成（可以访问当前this实例）
  created () {

  },
  // 生命周期 - 挂载完成（可以访问DOM元素）
  mounted () {

  },
  methods: {
    async exportData(){
            const res = await this.axios('/api/overdraft_export')
           if(res.code == 200){
                let url = `${this.$store.state.ip}/api/storage/${res.data.file}`
                location.href = url
            }
        },
    init (row) {
      this.proxyObj = row
      this.axios.get('/api/overdraft_list', {
        params: {
          page_index: this.page_index,
          page_size: this.page_size,
          ...row
        }
      }).then(res => {
        console.log(res)
        if (res.code == 200) {
          this.total = res.data.total
          this.tableData = res.data.data
        }
      }).catch(err => { console.error(err); })
    },
    searchData (row) {
      this.proxyObj = row
      this.page_index = 1;
      this.init(this.proxyObj)
    },
    handleSet (row, index, type) {
      // 1新增 2编辑 3查看 4删除
      switch (type) {
        case 1:
        case 2:
        case 3:
          this.$router.push({
            path: '/cms/BasicSettings/OverStandardPrice/detail',
            query: {
              type,
              id: row.id,
            }
          })
          break;
        case 4:
          this.$Modal.confirm({
            title: '确认删除？',
            content: '此操作无法恢复，请确认！',
            onOk: () => {
              this.axios({
                method: 'post',
                url: '/api/overdraft_del',
                data: {
                  id: row.id
                }
              }).then((res) => {
                this.$Message.success(res.msg)
                this.init(this.proxyObj)
              }).catch((err) => { });
            },
            onCancel: () => { }
          })
          break;
        default:
          break;
      }
    },
    changePage (e) {
      this.page_index = e;
      this.init(this.proxyObj)
    },
    changeSize (e) {
      this.page_size = e;
      this.init(this.proxyObj)
    },
  },
  // 监听属性 类似于data概念
  computed: {},
  // 监控data中的数据变化
  watch: {},
  beforeCreate () { }, // 生命周期 - 创建之前
  beforeMount () { }, // 生命周期 - 挂载之前
  beforeUpdate () { }, // 生命周期 - 更新之前
  updated () { }, // 生命周期 - 更新之后
  beforeDestroy () { }, // 生命周期 - 销毁之前
  destroyed () { }, // 生命周期 - 销毁完成
  activated () { }, // 如果页面有keep-alive缓存功能，这个函数会触发
}
</script>

<style lang='scss' scoped>
</style>