<template>
    <div>
        <div class="flex flex-col gap-20 mt-20">
            <div class="flex-items-center">
                <div class="w-100 color-666">成片区</div>
                <div class="flex-1 color-000">
                    <span>女士内衣</span>
                    <el-button type="primary" text>修改</el-button>
                </div>
            </div>
            <div class="flex-items-center">
                <div class="w-100 color-666">视频标题</div>
                <div class="flex-1 color-000">
                    <span>0730-8835-鲁月园-复古耳环动态奢感视频.mp4</span>
                    <el-button type="primary" text>修改</el-button>
                </div>
            </div>
            <div class="flex-items-center">
                <div class="w-100 color-666">公共标签</div>
                <div class="flex-1 color-000 flex gap-10">
                    <el-tag type="success">仙侠穿越</el-tag>
                    <el-tag type="success">视频卡</el-tag>
                    <el-tag type="success">隐式陪叫</el-tag>
                    <el-button type="primary" text>+ 添加公共标签</el-button>
                </div>
            </div>
            <div class="flex-items-center">
                <div class="w-100 color-666">个人标签</div>
                <div class="flex-1 flex color-000 gap-10">
                    <el-tag type="success">仙侠穿越</el-tag>
                    <el-tag type="success">视频卡</el-tag>
                    <el-tag type="success">隐式</el-tag>
                    <el-button type="primary" text>+ 添加个人标签</el-button>
                </div>
            </div>
            <div class="flex-items-center">
                <div class="w-100 color-666">关联脚本</div>
                <div class="flex-1 color-000">
                    <el-button type="primary" text>查看脚本(1)</el-button>
                </div>
            </div>
            <div class="flex-items-center">
                <div class="w-100 color-666">视频状态</div>
                <div class="flex-1 color-000">
                    <el-tag type="warning">待审核</el-tag>
                    <el-button type="primary" text>修改</el-button>
                </div>
            </div>
            <div class="flex-items-center">
                <div class="w-100 color-666">视频备注</div>
                <div class="flex-1 color-000">
                    <el-input type="textarea" rows="2" />
                </div>
            </div>
            <div class="flex-items-center">
                <div class="w-100 color-666">附件</div>
                <div class="flex-1 color-000">
                    <el-button type="primary" text>+ 添加附件</el-button>
                </div>
            </div>
        </div>
        <div style="border-top: 1px solid #eee;" class="pt-16 mt-10">
            <el-button type="primary" plain>分享</el-button>
            <el-button type="primary" plain @click="visibleOperationRecord = true">操作记录</el-button>
            <el-button type="primary" plain>下载源码视频</el-button>
            <el-button type="primary" plain>更多</el-button>
        </div>
        <OperationRecordDialog v-model:visible="visibleOperationRecord" />
    </div>
</template>

<script setup lang="ts">
import { ref } from 'vue';
import OperationRecordDialog from './OperationRecordDialog.vue';

const visibleOperationRecord = ref(false)
</script>

<style scoped lang="scss"></style>
