<template>
    <el-table :data="items">
        <el-table-column label="KEY" prop="key"></el-table-column>
        <el-table-column label="名称" prop="description">
        </el-table-column>
         <el-table-column label="内容类型" prop="editType" :formatter="formatEditType">
        </el-table-column>
        <el-table-column label="操作">
            <template slot-scope="scope">
                <el-button type="text" size="small" @click="goEdit(scope.row)">编辑</el-button>
                <template v-if="scope.row.editType == 1">
                   <a :href="serverPath + 'info/preview/' + scope.row.key" target="_blank">
                    <el-button type="text" size="small">预览</el-button>
                  </a>
                </template>
                <el-button type="text" size="small" @click="release(scope.row)">发布</el-button>
            </template>
        </el-table-column>
    </el-table>
</template>
<script>
export default {
  data: function() {
    return {
      items: [{id: 2,key: 'contact_us',editType: 1,description: '联系我们'}],
      serverPath: process.env.SERVER_PATH
    }
  },
  methods: {
    formatEditType: function(row){
      if (row.editType == 1){
        return '富文本';
      }else if (row.editType == 2){
        return "文本";
      }
    },
    goEdit: function(row) {
      if (row.editType == 1){
        this.$router.push({ path: '/editSysConfig', query: { key: row.key } })
      }else if (row.editType == 2){
        this.$router.push({ path: '/editShopConfigType2', query: { key: row.key } })
      }else{
        this.$message({
            message: '未知类型',
            type: 'warning'
          })
      }
      
    },
    release: function(row) {
      this.$confirm('您确定要发布配置信息吗 , 是否继续?', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      }).then(() => {
        this.$http.releaseSysConfig({ key: row.key }, this).then(res => {
          this.$message({
            message: '操作成功',
            type: 'success'
          })
        })
      })
    }
  },
  mounted: function() {
    // this.$http.getAllSysConfig({}, this).then(res => {
    //   if (res.code === 0) {
    //     this.items = res.obj
    //   }
    // })
  }
}
</script>

<style scoped>
.online {
  color: #67c23a;
}
.offline {
  color: #f56c6c;
}
</style>

