<template>
  <div class="info">
    <div class="info-header">学习内容详情</div>
    <div class="info-container">
      <div class="info-wrapper">
        <el-collapse v-model="activeNames" @change="handleChange">
          <el-collapse-item title="审核意见" name="1">
            <el-form
              class="demo-form-inline"
              :inline="true"
              :model="formInline"
              label-position="top"
            >
              <el-form-item label="审核层级" class="w100">
                <span class="w50 l-float">
                  <strong>初审</strong> 2021/02/02
                </span>
                <span class="w50">
                  <strong>复审</strong> 2021/02/23
                </span>
              </el-form-item>
              <el-form-item label="审核结果" class="w50">驳回</el-form-item>
              <el-form-item
                label="驳回原因"
              >各区域为夫妻房我发给各区域为夫妻房我发给各区域为夫妻房我发给各区域为夫妻房我发给各区域为夫妻房我发给各区域为夫妻房我发给各区域为夫妻房我发给
              </el-form-item>
            </el-form>
          </el-collapse-item>
          <el-collapse-item title="展板基本信息" name="2">
            <el-form
              class="demo-form-inline"
              :inline="true"
              :model="formInline"
              label-position="top"
            >
              <el-form-item label="版权方" class="w50">xxxxxxx</el-form-item>
              <el-form-item label="创建时间" >2021/02/23</el-form-item>
              <el-form-item label="展板分类" class="w50">反腐类</el-form-item>
              <el-form-item label="上架情况" >已上架</el-form-item>
              <el-form-item label="审核情况" class="w50">已审核</el-form-item>
              <el-form-item label="展板图片" class="w50">
                <img class="imgSize" src alt />
              </el-form-item>
              <el-form-item
                label="展板简介"
              >各区域为夫妻房我发给各区域为夫妻房我发给各区域为夫妻房我发给各区域为夫妻房我发给各区域为夫妻房我发给各区域为夫妻房我发给各区域为夫妻房我发给
              </el-form-item>
            </el-form>
          </el-collapse-item>
          <el-collapse-item title="展板影音信息" name="3">
                <el-form
              class="demo-form-inline"
              :inline="true"
              :model="formInline"
              label-position="top"
            >
               <el-form-item label="展板视频" class="w100">
                <div>
                  <img class="iconImg" src alt />
                  <span>xxx.mp4</span>

                  <img class="iconImg" src alt />
                  <span>xxx.mp4</span>
                </div>
              </el-form-item>
              <el-form-item label="展板音频">
                <div>
                  <img class="iconImg" src alt />
                  <span>xxx.mp3</span>
                </div>
              </el-form-item>
              <el-form-item label="展板图片" class="w100">
                <img class="imgSize" src alt />
                <img class="imgSize" src alt />
                <img class="imgSize" src alt />
                <img class="imgSize" src alt />
              </el-form-item>
              <el-form-item label="展板文档">
                <div>
                  <img class="iconImg" src alt />
                  <span>xxx.pdf</span>
                </div>
              </el-form-item>
            </el-form>
          </el-collapse-item>
        </el-collapse>
      </div>
    </div>
    <div class="info-footer">
      <div class="btn-group">
        <!-- 确定、取消 -->
        <el-button size="mini" type="primary" class="btn_form_search" @click="close">关闭</el-button>
      </div>
    </div>
  </div>
</template>

<script>
export default {
  data() {
    return {
      tableData: [
        {
          id: "1",
          name: "1"
        },
        {
          id: "2",
          name: "2"
        },
        {
          id: "3",
          name: "3"
        }
      ],
      activeNames: ["1","2","3"],
      formInline: {
        user: "",
        region: ""
      }
    };
  },
  methods: {
    close() {
      history.go(-1);
    },
    handleChange(val) {
      console.log(val);
    },
    moveUpward(row, index) {
      if (index > 0) {
        let upData = this.tableData[index - 1];
        this.tableData.splice(index - 1, 1);
        this.tableData.splice(index, 0, upData);
      } else {
        this.$message({
          message: "已经是第一条，上移失败",
          type: "warning"
        });
      }
    },
    moveDown(row, index) {
      if (index + 1 == this.tableData.length) {
        this.$message({
          message: "已经是最后一条，下移失败",
          type: "warning"
        });
      } else {
        let downData = this.tableData[index + 1];
        this.tableData.splice(index + 1, 1);
        this.tableData.splice(index, 0, downData);
      }
    }
  }
};
</script>

<style lang="less">
</style>