import list from '@/mixins/list'
import routerUserMenu from '@/mixins/router-user-menu'
import breadcrumbComponent from '@/components/breadcrumb.vue'
import tableComponent from '@/components/table-with-pager.vue'
import picUploaderComponent from '@/components/picuploader.vue'

import {SearchForm, TableData, TableOption, TableLabel, TableOperate, TableOperateButton} from "@/class/SearchTable";
/**
 * 列表页管理
 *
 *  version = "1.0.0";
 *  author = "徐飞";
 *  email = "xu.fei@data-u.com";
 * */
export default {
  name: 'report',
  components: { breadcrumbComponent, tableComponent, picUploaderComponent },
  mixins: [list,routerUserMenu],
  data () {
    return {
      chartTypeOptions: [],
      chartSourceOptions: [],

      // 搜索表单信息
      searchForm: new SearchForm({
        chartName: '',
        status: '',
        chartType: '',
        dataSource: '',
      }),

      // 列表数据
      tableData: new TableData(),
      // 列表设置
      tableOption:  new TableOption({
        // 默认排序
        defaultSort: {prop: 'updateTime' ,order: 'descending' },
        // 列
        tableLabel: [
          new TableLabel({prop:'chartName',title:'图表名称',width:'250',ellipsis: false}),
          new TableLabel({prop:'chartTypeValue',title:'图表类型',width:'80',ellipsis: false}),
          new TableLabel({prop:'dataSourceValue',title:'数据源',width:'80',ellipsis: false}),
          new TableLabel({prop:'updateTime',title:'修改时间',width:'150',ellipsis: false}),
          new TableLabel({prop:'updateUserName',title:'修改人',width:'80',ellipsis: false}),
          new TableLabel({prop:'statusValue',title:'状态',width:'80',ellipsis: false ,colorOption:{depend: 'status',option:{1: 'safe', 0: 'warn'}}}),
        ],
        // 操作
        tableOperate: new TableOperate({
          width:'220',
          buttons:[
            new TableOperateButton({label: '预览', methods: 'view'}),
            new TableOperateButton({label: '修改', methods: 'edit',color: 'link', show:{status: 0}}),
            new TableOperateButton({label: '启用', methods: 'continue',color: 'safe', show:{status: 0}}),
            new TableOperateButton({label: '停用', methods: 'discontinue',color: 'warn', show:{status: 1}}),
            new TableOperateButton({label: '删除', methods: 'del',color: 'warn', show:{status: 0}}),
          ]
        }),
      }),
    }
  },
  created(){
  },
  mounted () {
    // 获取客户列表
    this.init()
  },
  methods: {
    init(){
      /* 图表类型 */
      this.$api.report.listType({id:17}).then(res=>{
        if(res.code==='1'){
          this.chartTypeOptions=res.data
        }
      })
      /* 图表数据源 */
      this.$api.report.listType({id:16}).then(res=>{
        if(res.code==='1'){
          this.chartSourceOptions=res.data
        }
      })
    },
    /* 启用 */
    continue(obj){
      let params={
        id: obj.id,
        status: 1
      }
      this.$api.chart.status(params).then(res=>{
        if (res.code == 1) {
          this.$message.success(res.msg)
          this.getList()
        }
      })
    },
    /* 停用 */
    discontinue(obj){
      let params={
        id: obj.id,
        status: 0
      }
      this.$api.chart.status(params).then(res=>{
        if (res.code == 1) {
          this.$message.success(res.msg)
          this.getList()
        }
      })
    },
    /* 查看详情 */
    detail(obj){},
    // 获取列表页列表
    getList () {
      let params = this.searchForm

      this.$api.chart.list(params)
        .then(res => {
          this.tableData.setData(res)
          this.searchForm.setPage(res)
        })
    },

    // 执行删除
    delAction(obj){
      let params={id: obj.id}
      this.$api.chart.delete(params)
        .then(res => {
          if (res.code == 1) {
            this.$message.success(res.msg)
            this.getList()
          }
        })
    },
    // 删除
    del(obj){
      this.$confirm('此操作将永久删除该记录, 是否继续?', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      }).then(() => {
        this.delAction(obj)
      }).catch(() => {
        this.$message({
          type: 'info',
          message: '已取消删除'
        });
      });
    },
    // 修改
    edit(obj){
      this.go('GraphEdit',{id: obj.id})
    },
    /* 查看 */
    view(obj){
      this.go('AutomaticGraph',{id: obj.id})
    },
  //  授权
    access(obj){
      this.go('SignalGraphAccess',{id: obj.id, name: obj.reportName})
    }
  }
}
