<template>
  <div>
    <!--编辑catalog标签弹窗  -->
    <el-dialog title="编辑标签<cms:catalog>" class="dialog" :visible="isShowModal" @update:visible="closeHandler">
      <el-form :model="form" :label-position="labelPosition" label-width="100px">
        <el-form-item label="栏目id：">
          <el-input v-model="form.columnId"></el-input>
        </el-form-item>
        <el-form-item label="栏目名称：">
          <el-input v-model="form.columnName"></el-input>
        </el-form-item>
        <el-form-item label="栏目类型：">
          <el-select v-model="form.columnType">
            <el-option label="文章" value="artical"></el-option>
            <el-option label="图片" value="image"></el-option>
            <el-option label="文件" value="document"></el-option>
            <el-option label="音频" value="audio"></el-option>
            <el-option label="视频" value="video"></el-option>
            <el-option label="专题" value="subject"></el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="栏目层级：">
          <el-select v-model="form.columnHierarchy">
            <el-option label="所有栏目" value="allSub"></el-option>
            <el-option label="子栏目" value="sub"></el-option>
            <el-option label="平级栏目" value="curSub"></el-option>
            <el-option label="当前目录及子栏目" value="curCatalogSub"></el-option>
          </el-select>
        </el-form-item>
      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button type="primary" @click="confirmClickHandler">确 定</el-button>
      </div>
    </el-dialog>
  </div>
</template>

<script>
export default {
  data() {
    return {
      dataLoading: true, // 数据加载
      labelPosition: 'right', // 表单标签右对齐
      form: {
        // <cms:catalog>
        columnId: '', // 栏目id
        columnName: '', // 栏目名称
        columnType: 'artical', // 栏目类型
        columnHierarchy: '' // 栏目层级
      }
    }
  },
  props: {
    'isShowModal': {
      type: Boolean,
      required: true
    }
  },
  methods: {
    // 关闭弹窗
    closeHandler(val) {
      this.$emit('close', val)
    },

    // 编辑include标签确认按钮
    confirmClickHandler() {
      this.isShowModal = false // 隐藏弹窗
      this.update()
    },

    // 初始化批量添加include标签弹出框数据
    includeTableData() {
      //  let res = await axios.get('/ui/templates' {params: {condition}})
      // this.templatesData = data.data
      // this.dataLoading = false
    },

    // 数据更新
    update() {
      // let ids = [];
      // this.selectedRows.forEach(function (row) {
      //   ids.push(row.id);
      // });
      // let res = await axios.put(`/ui/templates/${ids.join()}`)
      // console.log(res)
      this.$notify({
        title: '成功',
        message: `操作成功`,
        type: 'success',
        duration: 2000
      })
    }
  },
  created() {
    this.includeTableData()
  }
}
</script>

<style>

</style>
