boss/pages/main/index/jishuquan.vue

<template>
  <div>
    <el-radio-group v-model="tab" size="small" @change="getList">
      <el-radio-button label="topic">文章管理</el-radio-button>
      <el-radio-button label="video">视频管理</el-radio-button>
      <el-radio-button label="ad">活动直播管理</el-radio-button>
      <el-radio-button label="kol">KOL管理</el-radio-button>
    </el-radio-group>
    <br/>
    <template v-if="tab==='ad'">
      <div>
        <el-button type="success" style="margin-top: 20px;" @click="showAdEdit(null)">添加活动</el-button>
      </div>
      <div class="content" v-if="ads">
        <el-table :data="ads" height="100%" border style="width: 100%">
          <el-table-column prop="title" label="活动标题"></el-table-column>
          <el-table-column prop="position_name" label="位置"></el-table-column>
          <el-table-column label="基本数据">
            <template slot-scope="ad" v-if="tab==='ad'">
              <el-tag type="success">浏览{{ad.row.view_count}}</el-tag>
            </template>
          </el-table-column>
          <el-table-column prop="status_name" label="状态"></el-table-column>
          <el-table-column prop="created_at" label="创建时间"></el-table-column>
          <el-table-column label="操作" width="300px;">
            <template slot-scope="ad" v-if="tab==='ad'">
              <el-button type="primary" @click="showAdEdit(ad.row)">
                编辑
                <i class="el-icon-edit el-icon--right"></i>
              </el-button>
              <el-button type="danger" @click="deleteAd(ad.row.id)">
                删除
                <i class="el-icon-delete el-icon--right"></i>
              </el-button>
            </template>
          </el-table-column>
        </el-table>
      </div>
      <el-pagination
        class="order-footer"
        background
        layout="prev, pager, next"
        :page-size="20"
        :total="total"
        @current-change="handleCurrentChange"
      />
    </template>
    <template v-if="tab==='topic'">
      <div  style="margin-top: 15px;">
        <div style="float: left;width: 200px;margin-right: 15px;">
          <el-input v-model="title" placeholder="请输入文章标题" @keyup.enter.native="getList"></el-input>
        </div>
        <div style="float: left;width: 200px;margin-right: 15px;">
          <el-select v-model="labelTab" clearable placeholder="筛选运营标签">
            <el-option
              v-for="item in labelOptions"
              :key="item.value"
              :label="item.label"
              :value="item.value">
            </el-option>
          </el-select>
        </div>
        <div style="float: left;width: 200px;margin-right: 15px;">
          <el-select v-model="is_show" clearable placeholder="筛选状态">
            <el-option
              v-for="item in showOptions"
              :key="item.value"
              :label="item.label"
              :value="item.value">
            </el-option>
          </el-select>
        </div>
        <div style="float: left;width: 200px;margin-right: 15px;">
          <el-button type="primary" @click="getList">搜索</el-button>
        </div>

        <div style="clear: both;"></div>
      </div>

      <div class="content" v-if="topics">
        <el-table :data="topics" height="100%" border style="width: 100%">
          <el-table-column :className="`clickable`" prop="title" label="文章标题">
            <template slot-scope="scope">
              <span @click="goTopic(scope.row)">{{scope.row.title}}</span>
            </template>
          </el-table-column>
          <el-table-column :className="`clickable`" prop="nickname" label="作者">
            <template slot-scope="scope">
              <span @click="goRooterUser(scope.row)">{{scope.row.nickname}}</span>
            </template>
          </el-table-column>
          <el-table-column prop="created_at" label="发布时间"></el-table-column>
          <el-table-column label="基本数据" width="280px">
            <template slot-scope="topic" v-if="tab==='topic'">
              <el-tag type="success">浏览{{topic.row.view_count}}</el-tag>
              <el-tag type="info">点赞{{topic.row.like_count}}</el-tag>
              <el-tag type="warning">收藏{{topic.row.favorite_count}}</el-tag>
              <el-tag type="danger">评论{{topic.row.reply_count}}</el-tag>
            </template>
          </el-table-column>
          <el-table-column label="内容标签" width="180px">
            <template slot-scope="topic">
              <span  v-for="item in topic.row.tags">
                <el-tag type="info">{{item.name}}</el-tag>
              </span>

              <el-link icon="el-icon-edit" style="float: right;" @click="editContentTag(topic.row)"></el-link>
            </template>
          </el-table-column>
          <el-table-column label="运营标签" width="240px">
            <template slot-scope="label" v-if="tab==='topic'">
              <el-tag type="info" v-if="label.row.is_top==1" class="custom-label">置顶</el-tag>
              <el-tag type="info" v-if="label.row.is_must_see==1" class="custom-label">进站必看</el-tag>
              <el-tag type="info" v-if="label.row.is_hot==1" class="custom-label">热门</el-tag>
              <el-tag type="info" v-if="label.row.is_good==1" class="custom-label">优质</el-tag>
              <el-tag type="info" v-if="label.row.is_new==1" class="custom-label">最新</el-tag>
              <el-tag type="info" v-if="label.row.is_ad==1" class="custom-label">广告</el-tag>

              <el-link icon="el-icon-edit" style="float: right;" @click="editOperateTag(label.row)"></el-link>
            </template>
          </el-table-column>
          <el-table-column label="状态" width="100px">
            <template slot-scope="label" v-if="tab==='topic'">
              <span v-if="label.row.is_show==1" >显示中</span>
              <span v-else-if="label.row.is_show==0 && label.row.risk_type=='ad'">[命中风控]<br/>&nbsp;&nbsp;&nbsp;&nbsp;广告</span>
              <span v-else >已下架</span>
            </template>
          </el-table-column>

          <el-table-column label="操作" width="130px" v-if="tab==='topic'">
            <template slot-scope="topic" v-if="tab==='topic'">
              <el-link type="warning" icon="el-icon-download" v-if="topic.row.is_show == 1" @click="stopShow(topic.row.id, topic.row.is_show)">下架</el-link>
              <el-link type="success" icon="el-icon-upload2" v-else @click="stopShow(topic.row.id, topic.row.is_show)">上架</el-link>

              <el-link type="danger" icon="el-icon-delete" @click="delTopic(topic.row.id)">删除</el-link>
            </template>
          </el-table-column>
        </el-table>
        <el-dialog title="内容标签管理" :visible.sync="contentTagManege">
          <el-form ref="form" :model="form" label-width="100px">
            <SelectFilterable :selectData="contentTagData"/>
            <div style="float: right;margin-top: 15px;">
              <el-button type="primary" @click="addContentTag">提交</el-button>
            </div>
            <div style="clear: both;"></div>
          </el-form>
        </el-dialog>

        <el-dialog title="运营标签管理" :visible.sync="operateTagManege">
          <el-form ref="form" :model="form" label-width="100px">
            <SelectFilterable :selectData="operateTagOptions"/>
            <div style="float: right;margin-top: 15px;">
              <el-button type="primary" @click="addOperateTag">提交</el-button>
            </div>
            <div style="clear: both;"></div>
          </el-form>
        </el-dialog>

      </div>
      <el-pagination
        class="order-footer"
        background
        layout="prev, pager, next"
        :page-size="20"
        :total="total"
        @current-change="handleCurrentChange"
      />
    </template>
    <template v-if="tab==='video'">
      <div class="content" v-if="videos">
        <el-table :data="videos" height="100%" border style="width: 100%">
          <el-table-column prop="title" :className="`clickable`" label="视频简介">
            <template slot-scope="scope">
              <span @click="goVideo(scope.row)">{{scope.row.title}}</span>
            </template>
          </el-table-column>
          <el-table-column prop="nickname" :className="`clickable`" label="作者">
            <template slot-scope="scope">
              <span @click="goRooterUser(scope.row)">{{scope.row.nickname}}</span>
            </template>
          </el-table-column>
          <el-table-column prop="nickname" label="视频类型">
            <template slot-scope="scope">
              <span>{{scope.row.video_type}}</span>
            </template>
          </el-table-column>
          <el-table-column prop="nickname" label="视频时长">
            <template slot-scope="scope">
              <span>{{scope.row.duration}}</span>
            </template>
          </el-table-column>
          <el-table-column prop="nickname" label="视频价格">
            <template slot-scope="scope">
              <span>{{scope.row.price}}</span>
            </template>
          </el-table-column>

          <el-table-column prop="created_at" label="发布时间"></el-table-column>
          <el-table-column label="基本数据" width="410px">
            <template slot-scope="video" v-if="tab==='video'">
              <el-tag >购买人数：{{video.row.sell_num}}</el-tag>
              <el-tag type="success">浏览：{{video.row.view_count}}</el-tag>
              <el-tag type="info">点赞：{{video.row.like_count}}</el-tag>
              <el-tag type="warning">收藏：{{video.row.favorite_count}}</el-tag>
              <el-tag type="danger">评论：{{video.row.reply_count}}</el-tag>
            </template>
          </el-table-column>
          <el-table-column prop="status_name" label="状态"></el-table-column>
          <el-table-column label="操作" width="340px">
            <template slot-scope="video" v-if="tab==='video'">
              <el-button
                type="primary"
                v-if="video.row.status==1"
                @click="approveVideo(video.row.id)"
              >
                下架
                <i class="el-icon-bottom el-icon--right"></i>
              </el-button>
              <el-button
                type="primary"
                v-if="video.row.status==0"
                @click="approveVideo(video.row.id)"
              >
                上架
                <i class="el-icon-top el-icon--right"></i>
              </el-button>
              <el-button type="danger" @click="deleteVideo(video.row.id)">
                删除
                <i class="el-icon-delete el-icon--right"></i>
              </el-button>
            </template>
          </el-table-column>
        </el-table>
      </div>
      <el-pagination
        class="order-footer"
        background
        layout="prev, pager, next"
        :page-size="20"
        :total="total"
        @current-change="handleCurrentChange"
      />
    </template>
    <template v-if="tab==='kol'">
      <div style="margin:15px 0;">
        <div style="width:200px;margin:0 15px;float:left;">
          <el-input v-model="authorName" placeholder="输入作者名" @keyup.enter.native="search"></el-input>
        </div>
        <div style="width:200px;margin:0 15px;float:left;">
          <template>
            <el-select v-model="createScene" clearable placeholder="选择创建场景">
              <el-option
                v-for="item in createSceneList"
                :label="item.label"
                :value="item.value">
              </el-option>
            </el-select>
          </template>
        </div>
        <div style="width:200px;margin:0 15px;float:left;">
          <template>
            <el-select v-model="signing" clearable placeholder="选择签约状态">
              <el-option
                v-for="item in signingList"
                :label="item.label"
                :value="item.value">
              </el-option>
            </el-select>
          </template>
        </div>
        <div style="width:100px;margin:0 15px;float:left;">
          <el-button type="primary"  @click="search">搜索</el-button>
        </div>
        <div style="margin:0 15px;float:right;">
          <el-button type="success" @click="onAddAu(null)">添加KOL</el-button>
        </div>
        <div style="clear: both;"></div>
      </div>
      <div class="content" height="30%"  v-if="kols">
        <el-table :data="kols" height="100%" border style="width: 100%">
          <el-table-column prop="portrait" label="头像">
            <template slot-scope="scope">
              <img :src="scope.row.portrait" min-width="70" height="70">
            </template>
          </el-table-column>
          <el-table-column prop="name" :className="`clickable`" label="作者名">
            <template slot-scope="scope">
              <span style="color:black;">{{scope.row.name}}</span>
            </template>
          </el-table-column>
          <el-table-column prop="introduction" show-overflow-tooltip :className="`clickable`" label="简介">
            <template slot-scope="scope">
              <span style="color:black;">{{scope.row.introduction}}</span>
            </template>
          </el-table-column>

          <el-table-column prop="is_signing" label="是否签约">
            <template slot-scope="scope">
              <div v-if="scope.row.is_signing ==1">
                签约
              </div>
              <div v-else>未签约</div>

            </template>
          </el-table-column>
          <el-table-column prop="show_repost" label="开启转载说明">
            <template slot-scope="scope">
              <div v-if="scope.row.show_repost ==1">
                开启
              </div>
              <div v-else>不开启</div>
            </template>
          </el-table-column>
          <el-table-column prop="create_scene" label="创建场景">
            <template slot-scope="scope">
              <span v-if="scope.row.create_scene == 'self'">用户绑定</span>
              <span v-else>后台新增</span>
            </template>
          </el-table-column>
          <el-table-column prop="uid" label="客栈UID"></el-table-column>
          <el-table-column label="关联渠道">
            <template slot-scope="scope">
              <div v-for="item in scope.row.channle">
                {{item.code}}
              </div>
            </template>
          </el-table-column>
          <el-table-column prop="re_article_num" label="文章数"></el-table-column>
          <el-table-column prop="to_read_num" label="阅读数"></el-table-column>
          <el-table-column prop="to_praise_num" label="获赞数"></el-table-column>
          <el-table-column prop="to_follow_num" label="粉丝数"></el-table-column>
          <!--          <el-table-column label="关联领域">-->
          <!--            <template slot-scope="scope">-->
          <!--              <el-tag type="success">浏览：{{scope.row.name}}</el-tag>-->
          <!--              <el-tag type="danger">评论：</el-tag>-->
          <!--            </template>-->
          <!--          </el-table-column>-->
          <el-table-column label="操作">
            <template slot-scope="scope">
              <el-link icon="el-icon-edit" @click="onEditAu(scope.row.id)">编辑</el-link>
            </template>
          </el-table-column>
        </el-table>
      </div>
      <el-pagination
        class="order-footer"
        background
        layout="prev, pager, next"
        :page-size="20"
        :total="total"
        @current-change="handleCurrentChange"
      />
    </template>

    <el-dialog title="活动管理" :visible.sync="dialogFormVisible">
      <el-form :model="form">
        <el-form-item label="活动标题" :label-width="formLabelWidth">
          <el-input v-model="form.title" autocomplete="off"></el-input>
        </el-form-item>
        <el-form-item label="链接" :label-width="formLabelWidth">
          <el-input v-model="form.url" autocomplete="off"></el-input>
        </el-form-item>
        <el-form-item label="用户UID" :label-width="formLabelWidth">
          <el-input v-model="form.uid" autocomplete="off"></el-input>
        </el-form-item>
        <el-form-item label="话题标签" :label-width="formLabelWidth">
          <el-input v-model="form.tags" autocomplete="off"></el-input>
        </el-form-item>
        <el-form-item label="状态" :label-width="formLabelWidth">
          <el-select v-model="form.status" placeholder="请选择上架/下架">
            <el-option label="上架" value="1"></el-option>
            <el-option label="下架" value="0"></el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="类型" :label-width="formLabelWidth">
          <el-select v-model="form.type" placeholder="请选择类型">
            <el-option label="文章" value="1"></el-option>
            <el-option label="视频" value="2"></el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="广告位置" :label-width="formLabelWidth">
          <el-select v-model="form.position" placeholder="请选择位置">
            <el-option label="广告位1" value="1"></el-option>
            <el-option label="广告位2" value="2"></el-option>
          </el-select>
        </el-form-item>
      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button @click="dialogFormVisible = false">取 消</el-button>
        <el-button type="primary" @click="editAd">确 定</el-button>
      </div>
    </el-dialog>


    <el-dialog title="KOL管理" :visible.sync="kolFormVisible" :closeOnClickModal="false" :closeOnPressEscape="false">
      <el-form :model="kolform">
        <el-form-item label="头像" v-if="kolform.portrait != './'" :label-width="formLabelWidth">
          <img :src="kolform.portrait" style="width:100px;height:100px;" alt="头像">
        </el-form-item>
        <el-form-item label="作者名" :label-width="formLabelWidth">
          <el-input v-model="kolform.name" autocomplete="off"></el-input>
        </el-form-item>
        <el-form-item label="简介" :label-width="formLabelWidth">
          <el-input v-model="kolform.introduction" autocomplete="off"></el-input>
        </el-form-item>
        <el-form-item label="账号创建" :label-width="formLabelWidth" v-if="!isEdit">
          <el-radio v-model="radio" label="1" checked>自动创建新账号</el-radio>
          <el-radio v-model="radio" label="2">指定UID</el-radio>
        </el-form-item>
        <el-form-item label="客栈UID" :label-width="formLabelWidth" v-show="radio == 2 || isEdit">
          <el-input v-model="kolform.uid" autocomplete="off" :disabled="isEdit"></el-input>
        </el-form-item>
        <el-form-item label="是否签约" :label-width="formLabelWidth">
          <el-switch v-model="kolform.is_signing"></el-switch>
        </el-form-item>
        <el-form-item label="是否开启转载" :label-width="formLabelWidth">
          <el-switch v-model="kolform.show_repost"></el-switch>
        </el-form-item>
        <el-form-item label="创建场景" v-if="kolform.create_scene == 'self'" :label-width="formLabelWidth">
          <span>用户绑定</span>
        </el-form-item>
        <el-form-item label="创建场景" v-else :label-width="formLabelWidth">
          <span>后台新增</span>
        </el-form-item>
        <el-form-item :label-width="formLabelWidth">
          <template>
            <el-row :gutter="20">
              <el-col :span="6">
                <div class="grid-content bg-purple">渠道</div>
              </el-col>
              <el-col :span="6">
                <div class="grid-content bg-purple">通道ID</div>
              </el-col>
              <el-col :span="6">
                <div class="grid-content bg-purple">渠道URL</div>
              </el-col>
              <el-col :span="6">
                <div class="grid-content bg-purple">WXBIZ</div>
              </el-col>
              <!--           <el-col :span="6"><div class="grid-content bg-purple"></div></el-col>-->
            </el-row>
            <template v-for="(item,index) in channelData">
              <el-row :gutter="20" style="margin-top: 5px">
                <el-col :span="6">
                  <div class="grid-content bg-purple">
                    <el-select v-model="channelData[index].code" placeholder="请选择">
                      <el-option
                        v-for="item in options"
                        :key="item.value"
                        :label="item.label"
                        :value="item.value">
                      </el-option>
                    </el-select>
                  </div>
                </el-col>
                <el-col :span="6">
                  <div class="grid-content bg-purple">
                    <el-input v-model="item.channel_id" placeholder="请输入内容"></el-input>
                  </div>
                </el-col>
                <el-col :span="6">
                  <div class="grid-content bg-purple">
                    <el-input v-model="item.url" placeholder="请输入内容"></el-input>
                  </div>
                </el-col>
                <el-col :span="6">
                  <div class="grid-content bg-purple">
                    <el-input v-model="item.wx_biz" placeholder="填入biz, 仅限微信"></el-input>
                  </div>
                </el-col>
                <el-col :span="5">
                  <div class="grid-content bg-purple">
                    <el-button
                      @click="deleteChannleRow(index)"
                      type="text"
                      size="small" v-if="index != 0">
                      移除
                    </el-button>
                    <el-button
                      @click="addChannleRow()"
                      type="text"
                      size="small">
                      添加
                    </el-button>
                  </div>
                </el-col>
              </el-row>
            </template>

          </template>
        </el-form-item>

      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button @click="kolFormVisible = false">取 消</el-button>
        <el-button type="primary" @click="editAu">确 定</el-button>
      </div>
    </el-dialog>

    <el-dialog title="标签管理" :visible.sync="labelEditFormVisible">
      <el-form :model="form">
        <el-form-item label="当前标签" :label-width="formLabelWidth">
          <el-tag
            type="info"
            v-if="this.currentLabel.is_top===1"
            class="custom-label"
            closable
            :disable-transitions="false"
            @close="handleClose('is_top')"
          >置顶
          </el-tag>
          <el-tag
            type="info"
            v-if="this.currentLabel.is_must_see===1"
            class="custom-label"
            closable
            :disable-transitions="false"
            @close="handleClose('is_must_see')"
          >进站必看
          </el-tag>
          <el-tag
            type="info"
            v-if="this.currentLabel.is_hot===1"
            class="custom-label"
            closable
            :disable-transitions="false"
            @close="handleClose('is_hot')"
          >热门
          </el-tag>
          <el-tag
            type="info"
            v-if="this.currentLabel.is_good===1"
            class="custom-label"
            closable
            :disable-transitions="false"
            @close="handleClose('is_good')"
          >优质
          </el-tag>
          <el-tag
            type="info"
            v-if="this.currentLabel.is_new===1"
            class="custom-label"
            closable
            :disable-transitions="false"
            @close="handleClose('is_new')"
          >最新
          </el-tag>
          <el-tag
            type="info"
            v-if="this.currentLabel.is_ad===1"
            class="custom-label"
            closable
            :disable-transitions="false"
            @close="handleClose('is_ad')"
          >广告
          </el-tag>
        </el-form-item>
        <el-form-item label="添加标签" :label-width="formLabelWidth">
          <el-select v-model="addCurrentLabel" placeholder="请选择位置">
            <el-option label="暂不添加" value></el-option>
            <el-option label="置顶" value="is_top"></el-option>
            <el-option label="进站必看" value="is_must_see"></el-option>
            <el-option label="热门" value="is_hot"></el-option>
            <el-option label="优质" value="is_good"></el-option>
            <el-option label="最新" value="is_new"></el-option>
            <el-option label="广告" value="is_ad"></el-option>
          </el-select>
        </el-form-item>
      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button type="primary" @click="addLabel">添 加</el-button>
        <el-button @click="labelEditFormVisible = false;getList()">关闭</el-button>
      </div>
    </el-dialog>
  </div>
</template>

<script>
  import {
    AppMain,
    Navbar,
    Settings,
    Sidebar,
    TagsView,
    SelectFilterable,
    SelectLongRangeSearch,
  } from "../../../layouts/components/index";
  export default {
    components: {
      AppMain,
      Navbar,
      Settings,
      Sidebar,
      TagsView,
      SelectFilterable,
      SelectLongRangeSearch,
    },
    data() {
      return {
        edit_id: '',
        contentTagManege: false,
        operateTagManege: false,
        contentTagData: {
          value: '',
          options: []
        },
        operateTagOptions: {
          value: '',
          options: [{
            'label':'置顶',
            'value':'is_top'
          },{
            'label':'进站必看',
            'value':'is_must_see'
          },{
            'label':'热门',
            'value':'is_hot'
          },{
            'label':'优质',
            'value':'is_good'
          },{
            'label':'最新',
            'value':'is_new'
          },{
            'label':'广告',
            'value':'is_ad'
          },]
        },
        operateTags: [],
        labelTab: "",
        title: "",
        labelOptions: [
          {
            label: '全部',
            value: ''
          },
          {
            'label':'置顶',
            'value':'is_top'
          },{
            'label':'进站必看',
            'value':'is_must_see'
          },{
            'label':'热门',
            'value':'is_hot'
          },{
            'label':'优质',
            'value':'is_good'
          },{
            'label':'最新',
            'value':'is_new'
          },{
            'label':'广告',
            'value':'is_ad'
          },
        ],
        is_show:"",
        showOptions: [
          {
            label: '全部',
            value: ''
          },
          {
            label: '显示中',
            value: 1
          },
          {
            label:'已下架',
            value: 0
          }
        ],
        page: 1,
        size: 20,
        tab: "topic",
        total: 1,
        ads: [],
        topics: [],
        videos: [],
        kols: [],  //作者
        addCurrentLabel: "",
        form: {
          title: "",
          url: "",
          type: "1",
          tags: "",
          status: "1",
          position: "1"
        },
        kolform: {
          portrait: '',
          name: "",
          introduction: "",
          uid: "",
          is_signing: true,
          show_repost: true
        },
        options: [{
          value: 'wechat',
          label: 'wechat'
        }, {
          value: 'juejin',
          label: 'juejin'
        }, {
          value: 'zhihu',
          label: 'zhihu'
        }, {
          value: 'csdn',
          label: 'csdn'
        }],
        currentLabel: {
          is_ad: 0,
          is_new: 0,
          is_good: 0,
          is_hot: 0,
          is_must_see: 0,
          is_top: 0
        },
        radio: '1',
        currentId: 0,
        dialogFormVisible: false,
        formLabelWidth: "120px",
        labelEditFormVisible: false,
        kolFormVisible: false,     //kol
        isEdit: false,
        channelData: [
          {
            channel_id: '',
            url: '',
            code: 'wechat',
            wx_biz: ''
          }
        ],
        authorName: '',
        createScene: '',
        createSceneList: [
          {
            'label':'全部',
            'value':''
          },{
            'label':'后台新增',
            'value':'admin'
          },{
            'label':'自行绑定',
            'value':'self'
          }
        ],
        signing:'',
        signingList:[{
          'label':'全部',
          'value':''
        },{
          'label':'已签约',
          'value':'1'
        },{
          'label':'未签约',
          'value':'0'
        }
        ],

      }
    },
    mounted() {
      this.getList();
    },
    methods: {
      goTopic(topic) {
        window.open(
        this.$store.state.domainConfig.jishuinUrl + "/p/" + topic.hash_id
        );
      },
      goVideo(topic) {
        window.open(
          this.$store.state.domainConfig.jishuinUrl + "/video/" + topic.video_id
        );
      },
      goRooterUser(topic) {
        window.open(
          this.$store.state.domainConfig.siteUrl + "/rooter/user/" + topic.user_id
        );
      },
      addLabel() {
        if (this.addCurrentLabel) {
          let res = this.$post("/api/admin/jishuquan/add_label", {
            id: this.currentId,
            type: this.addCurrentLabel
          }).then(res => {
            if (res.status === 1) {
              this.currentLabel[this.addCurrentLabel] = 1;
              this.$message({
                type: "success",
                message: "添加成功!"
              });
            }
          });
        }
      },
      handleClose(type) {
        this.$confirm("此操作将永久删除该标签, 是否继续?", "提示", {
          confirmButtonText: "确定",
          cancelButtonText: "取消",
          type: "warning"
        })
          .then(() => {
            let res = this.$post("/api/admin/jishuquan/remove_label", {
              id: this.currentId,
              type: type
            }).then(res => {
              if (res.status === 1) {
                this.currentLabel[type] = 0;
                this.$message({
                  type: "success",
                  message: "删除成功!"
                });
              }
            });
          })
          .catch(() => {
            this.$message({
              type: "info",
              message: "已取消删除"
            });
          });
      },
      editLabel(topic) {
        this.currentLabel = {
          is_ad: 0,
          is_new: 0,
          is_good: 0,
          is_hot: 0,
          is_must_see: 0,
          is_top: 0
        }; //复位
        this.currentId = topic.id;
        if (Number(topic.is_ad) === 1) this.currentLabel.is_ad = 1;
        if (Number(topic.is_new) === 1) this.currentLabel.is_new = 1;
        if (Number(topic.is_hot) === 1) this.currentLabel.is_hot = 1;
        if (Number(topic.is_top) === 1) this.currentLabel.is_top = 1;
        if (Number(topic.is_good) === 1) this.currentLabel.is_good = 1;
        if (Number(topic.is_must_see) === 1) this.currentLabel.is_must_see = 1;
        this.labelEditFormVisible = true;
      },
      delTopic(id) {
        this.$confirm("此操作将永久删除该文章, 是否继续?", "提示", {
          confirmButtonText: "确定",
          cancelButtonText: "取消",
          type: "warning"
        })
          .then(() => {
            let res = this.$post("/api/admin/jishuquan/delete_topic", {
              id: id
            }).then(res => {
              if (res.status == 1) {
                this.$message({
                  type: "success",
                  message: "删除成功!"
                });
                this.getList();
              }
            });
          })
          .catch(() => {
            this.$message({
              type: "info",
              message: "已取消删除"
            });
          });
      },
      stopShow(id, is_show) {
        let tip = '下架';
        if(is_show == 0){
          tip = '上架';
        }
        this.$confirm("此操作将"+ tip +"该文章, 是否继续?", "提示", {
          confirmButtonText: "确定",
          cancelButtonText: "取消",
          type: "warning"
        })
          .then(() => {
            let res = this.$post("/api/admin/jishuquan/stop_show", {
              id: id,
              is_show: is_show
            }).then(res => {
              if (res.status == 1) {
                this.$message({
                  type: "success",
                  message: tip +"成功!"
                });
                this.getList();
              }
            });
          })
          .catch(() => {
            this.$message({
              type: "info",
              message: "已取消" + tip
            });
          });
      },
      approveVideo(id) {
        this.$confirm("更改视频状态", "提示", {
          confirmButtonText: "确定",
          cancelButtonText: "取消",
          type: "warning"
        })
          .then(() => {
            let res = this.$post("/api/admin/jishuquan/audit_video", {
              id: id
            }).then(res => {
              if (res.status == 1) {
                this.$message({
                  type: "success",
                  message: "操作成功!"
                });
                this.getList();
              }
            });
          })
          .catch(() => {
            this.$message({
              type: "info",
              message: "已取消"
            });
          });
      },
      deleteVideo(id) {
        this.$confirm("此操作将永久删除该视频, 是否继续?", "提示", {
          confirmButtonText: "确定",
          cancelButtonText: "取消",
          type: "warning"
        })
          .then(() => {
            let res = this.$post("/api/admin/jishuquan/delete_video", {
              id: id
            }).then(res => {
              if (res.status == 1) {
                this.$message({
                  type: "success",
                  message: "删除成功!"
                });
                this.getList();
              }
            });
          })
          .catch(() => {
            this.$message({
              type: "info",
              message: "已取消删除"
            });
          });
      },
      showAdEdit(item) {
        if (item != null) {
          this.form.id = item.id;
          this.form.title = item.title;
          this.form.url = item.url;
          this.form.type = item.type;
          this.form.tags = item.tags;
          this.form.status = item.status;
          this.form.position = item.position;
          this.form.uid = item.uid;
        }
        this.dialogFormVisible = true;
      },
      deleteAd(id) {
        this.$confirm("此操作将永久删除该活动, 是否继续?", "提示", {
          confirmButtonText: "确定",
          cancelButtonText: "取消",
          type: "warning"
        })
          .then(() => {
            let res = this.$post("/api/admin/jishuquan/delete_ad", {
              id: id
            }).then(res => {
              if (res.status == 1) {
                this.$message({
                  type: "success",
                  message: "删除成功!"
                });
                this.getList();
              }
            });
          })
          .catch(() => {
            this.$message({
              type: "info",
              message: "已取消删除"
            });
          });
      },
      async editAd() {
        let form = this.form;
        if (form.id) {
          let res = await this.$post("/api/admin/jishuquan/update_ad", form);
          if (res.status == 1) {
            this.$message({
              type: "success",
              message: "修改成功"
            });
          }
        } else {
          let res = this.$post("/api/admin/jishuquan/create_ad", form);
          if (res.status == 1) {
            this.$message.success("创建成功");
            this.form = {
              title: "",
              url: "",
              type: "1",
              tags: "",
              status: "1",
              position: "1"
            };
          }
        }

        this.getList();
        this.dialogFormVisible = false;
      },
      handleCurrentChange(val) {
        this.page = val;
        this.getList();
      },
      async getList() {
        const page = this.page;
        const size = this.size;
        const data = {
          page,
          size
        };
        let res;
        switch (this.tab) {
          case "ad":
            res = await this.$post("/api/admin/jishuquan/get_ads", data);
            this.ads = res.data.ads;
            this.total = res.data.total;
            break;
          case "video":
            res = await this.$post("/api/admin/jishuquan/get_videos", data);
            this.videos = res.data.videos;
            this.total = res.data.total;
            break;
          case "topic":
            if (this.labelTab) data.type = this.labelTab;
            data.is_show = this.is_show;
            if (this.title) data.title = this.title;
            res = await this.$post("/api/admin/jishuquan/get_topics", data);
            this.topics = res.data.topics;
            this.total = res.data.total;
            if(this.contentTagData.options.length == 0){
              res = await this.$post("/api/admin/jishuquan/listTags", {});
              this.contentTagData.options = [];
              if(res.status == 1){
                let op_arr = new Array();
                for(var i in res.data) {
                  op_arr.push({value:res.data[i].id, label:res.data[i].name});
                }
                this.contentTagData.options = op_arr;
              }
            }
            break;
          case "kol":
            res = await this.$post("/api/admin/author/get_aus", data);
            this.kols = res.data.aus;
            this.total = res.data.total;
            break;
        }
      },
      async contact(id) {
        const data = {
          id
        };
        let res = await this.$post("/api/admin/jishuquan/get_ads", data);
        this.$message({
          message: res.info,
          type: "success"
        });
      },
      deleteChannleRow(index) {
        this.channelData.splice(index, 1);
      },
      addChannleRow() {
        this.channelData.push({channel_id: '', url: '', code: 'wechat', wx_biz: ''})
      },
      onEditAu(id) {
        this.isEdit = true;
        let res = this.$post("/api/admin/author/get_row", {id: id})
          .then(res => {
            if (res.status == 1) {
              this.kolform = res.data;
              this.kolform.is_signing = res.data.is_signing == 1 ? true : false;
              this.kolform.show_repost = res.data.show_repost == 1 ? true : false;
              this.channelData = res.data.channel.length >= 1 ? res.data.channel : [
                {
                  channel_id: '',
                  url: '',
                  code: 'wechat',
                  wx_biz: ''
                }
              ];
              this.kolFormVisible = true;
            }
          }).catch((re) => {
            this.$message({
              type: "error",
              message: "网络连接错误"
            });
          });

      },
      onAddAu(item) {
        this.clearA();
        this.kolFormVisible = true;
      },
      async editAu() {
        let form = this.kolform;
        form.is_signing = form.is_signing ? 1 : 0;
        form.channelData = JSON.stringify(this.channelData);
        form.show_repost = form.show_repost ? 1 : 0;
        if (form.id) {
          let res = this.$post("/api/admin/author/update_au", form)
            .then(res => {
              if (res.status == 1) {
                this.$message({
                  type: "success",
                  message: "修改成功!"
                });
                this.clearA();
                this.kolFormVisible = false;
              }
            }).catch((re) => {
              this.$message({
                type: "error",
                message: "修改失败"
              });
            });
        } else {
          if (this.radio == '1') {
            form.uid = '';
          }
          form.create_scene = 'admin';
          let res = await this.$post("/api/admin/author/create_au", form)
            .then(res => {
              if (res.status == 1) {
                this.$message({
                  type: "success",
                  message: "添加成功!"
                });
                this.clearA();
                this.kolFormVisible = false;
              }
            }).catch((re) => {
              this.$message({
                type: "error",
                message: "添加失败"
              });
            });
        }

      },
      clearA() {
        this.isEdit = false;
        this.kolform = {
          portrait: './',
          name: "",
          introduction: "",
          uid: '',
          is_signing: true,
        };
        this.channelData = [{channel_id: '', url: '', code: 'wechat', wx_biz: ''}];
        this.getList();
      },
      async search(){
        let form = {
          'authorName': this.authorName,
          'createScene': this.createScene,
          'signing': this.signing,
          'page': this.page,
          'size': this.size,
        }
        let res = await this.$post("/api/admin/author/search_aus", form)
          .then(res => {
            if (res.status == 1) {
              this.kols = res.data.aus;
              this.total = res.data.total;
              this.$message({
                type: "success",
                message: "查询成功!"
              });
            }
          }).catch((re) => {
            this.$message({
              type: "error",
              message: "查询失败"
            });
          });
      },
      editContentTag(row){
        this.edit_id = row.id;
        this.contentTagManege = true;
        this.contentTagData.value = row.tags && row.tags.map(item => item.tag_id) || [];
      },
      editOperateTag(row){
        this.edit_id = row.id;
        let tags = new Array();
        if(row.is_top == 1){
          tags.push('is_top');
        }
        if(row.is_must_see == 1){
          tags.push('is_must_see');
        }
        if(row.is_hot == 1){
          tags.push('is_hot');
        }
        if(row.is_good == 1){
          tags.push('is_good');
        }
        if(row.is_new == 1){
          tags.push('is_new');
        }
        if(row.is_ad == 1){
          tags.push('is_ad');
        }

        this.operateTagOptions.value = tags;
        this.operateTagManege = true;
      },
      async addContentTag(){
        let id = this.edit_id;
        let tags = this.contentTagData.value;
        let data = {
          id: id,
          tags: tags
        };
        let res = await this.$post("/api/admin/jishuquan/updateTopicTags", data)
          .then(res => {
            if (res.status == 1) {
              this.$message({
                type: "success",
                message: "编辑成功!"
              });
              this.contentTagData.value = [];
              this.getList();
              this.contentTagManege = false;
            }
          }).catch((re) => {
            this.$message({
              type: "error",
              message: "编辑失败"
            });
          });
      },
      async addOperateTag(){
        let id = this.edit_id;
        let tags = this.operateTagOptions.value;
        let data = {
          id: id,
          is_top: 0,
          is_must_see: 0,
          is_hot: 0,
          is_good: 0,
          is_new: 0,
          is_ad: 0,

        };
        for(var j = 0; j < tags.length; j++) {
          if(tags[j] === 'is_top'){
            data.is_top = 1;
          }else if(tags[j] === 'is_must_see'){
            data.is_must_see = 1;
          }else if(tags[j] === 'is_hot'){
            data.is_hot = 1;
          }else if(tags[j] === 'is_good'){
            data.is_good = 1;
          }else if(tags[j] ==='is_new'){
            data.is_new = 1;
          }else if(tags[j] === 'is_ad'){
            data.is_ad = 1;
          }
        }
        let res = await this.$post("/api/admin/jishuquan/update_operate_tag", data)
          .then(res => {
            if (res.status == 1) {
              this.kols = res.data.aus;
              this.total = res.data.total;
              this.$message({
                type: "success",
                message: "编辑成功!"
              });
              this.getList();
              this.operateTagManege = false;
            }
          }).catch((re) => {
            this.$message({
              type: "error",
              message: "编辑失败"
            });
          });
      }

    }
  };
</script>

<style lang="scss" scoped>
  .count-list {
    padding-bottom: 10px;
    display: flex;
    align-items: center;
  }

  .count-item {
    margin-right: 20px;
    font-size: 16px;
  }

  .content {
    margin-top: 30px;
    white-space: nowrap;
    overflow-x: scroll;
    height: calc(100vh - 150px);
  }

  .btn {
    width: 80px;
  }

  .order-footer {
    margin-top: 10px;
  }

  .custom-label {
    margin-bottom: 5px;
  }
</style>