chore(config): 初始化项目配置文件

- 添加 .editorconfig 文件统一代码风格
- 配置 .env.development 环境变量文件
- 创建 .env.example 环境变量示例文件
- 设置 .eslintignore 忽略检查规则
- 配置 .eslintrc.js 代码检查规则
- 添加 .gitignore 文件忽略版本控制
- 设置 .prettierignore 忽略格式化规则
- 新增隐私政策HTML页面文件
- 创建API密钥编辑组件基础结构

src/views/cms/video/player/index.vue

@@ -0,0 +1,131 @@
+<!-- 角色编辑弹窗 -->
+<template>
+  <a-page-header :title="getPageTitle()" @back="() => $router.go(-1)">
+    <a-card :bordered="false">
+      <div class="w-[700px]">
+        <ele-xg-player
+          :config="{
+            id: 'demoPlayer1',
+            lang: 'zh-cn',
+            fluid: true,
+            // 视频地址
+            url: form.path,
+            // 封面
+            poster: '',
+            // 开启倍速播放
+            playbackRate: [0.5, 1, 1.5, 2],
+            // 开启画中画
+            pip: true
+          }"
+          @player="onPlayer1"
+        />
+      </div>
+      <a-space direction="vertical" class="mt-5">
+        <div class="ele-text-secondary">
+          文件名称：{{ form.name }}
+        </div>
+        <div class="ele-text-secondary">
+          文件路径：{{ form.path }}
+        </div>
+        <div class="ele-text-secondary">
+          视频描述：{{ form.comments }}
+        </div>
+      </a-space>
+    </a-card>
+  </a-page-header>
+</template>
+
+<script lang="ts" setup>
+import {ref, reactive, watch, unref} from 'vue';
+import Player from 'xgplayer';
+import {useRouter} from 'vue-router';
+import {toDateString} from 'ele-admin-pro';
+import {setPageTabTitle} from '@/utils/page-tab-util';
+import {message} from 'ant-design-vue/es';
+import useFormData from '@/utils/use-form-data';
+import {FileRecord} from '@/api/system/file/model';
+import {getFile} from '@/api/system/file';
+
+const {currentRoute} = useRouter();
+import {getPageTitle} from "@/utils/common";
+
+const ROUTE_PATH = '/cms/video/player';
+
+// 视频播放器一实例
+let player1: Player;
+// 视频播放器一是否实例化完成
+const ready1 = ref(false);
+
+// 视频播放器一配置
+const config1 = reactive({
+  id: 'demoPlayer1',
+  lang: 'zh-cn',
+  fluid: true,
+  // 视频地址
+  url: 'https://file.wsdns.cn/20221126/cf17ef352db54bf28efeda268107714f.mp4',
+  // 封面
+  poster:
+    'https://file.wsdns.cn/20221125/49f0c461d61e48f28b324366a0a63a2e.jpg',
+  // 开启倍速播放
+  playbackRate: [0.5, 1, 1.5, 2],
+  // 开启画中画
+  pip: true
+});
+
+/* 播放器一渲染完成 */
+const onPlayer1 = (player: Player) => {
+  player1 = player;
+  player1.on('play', () => {
+    ready1.value = true;
+  });
+};
+// 视频信息
+const {form, assignFields} = useFormData<FileRecord>({
+  id: 0,
+  name: '',
+  url: '',
+  path: '',
+  comments: '',
+  createNickname: '',
+  createTime: ''
+});
+// 请求状态
+const loading = ref(true);
+/*  */
+const query = () => {
+  const {query} = unref(currentRoute);
+  const id = query.id;
+  if (!id || form.id === Number(id)) {
+    return;
+  }
+  loading.value = true;
+  getFile(Number(id))
+    .then((data) => {
+      loading.value = false;
+      assignFields({
+        ...data,
+        createTime: toDateString(data.createTime)
+      });
+      // 修改页签标题
+      if (unref(currentRoute).path === ROUTE_PATH) {
+        setPageTabTitle(String(data.comments));
+      }
+    })
+    .catch((e) => {
+      loading.value = false;
+      message.error(e.message);
+    });
+};
+
+watch(
+  currentRoute,
+  (route) => {
+    const {path} = unref(route);
+    if (path !== ROUTE_PATH) {
+      return;
+    }
+    query();
+  },
+  {immediate: true}
+);
+</script>