初版

src/api/advertiser/index.ts

@@ -0,0 +1,25 @@
+import http from '@/api/http';
+/**
+ * 添加投手-列表
+ */
+export function advertiserListAdvertiser(params: object) {
+  return http.get('/channel/advertiser/listAdvertiser', params);
+}
+/**
+ * 添加投手-投手详情
+ */
+export function advertiserGetAdvertiser(params: object) {
+  return http.get('/channel/advertiser/getAdvertiser', params);
+}
+/**
+ * 添加投手-更新
+ */
+export function advertiserUpdateAdvertiser(params: object) {
+  return http.post('/channel/advertiser/updateAdvertiser', params);
+}
+/**
+ * 添加投手-添加
+ */
+export function advertiserAdd(params: object) {
+  return http.post('/channel/advertiser/add', params);
+}

src/layout/components/header/index.vue

@@ -19,7 +19,7 @@
         <div class="hidden w-3/5 sm:flex">
 
           <!-- 菜单切换 -->
-          <MenuSelect />
+          <!-- <MenuSelect /> -->
           <!-- 搜索 -->
           <MenuSearch />
           <!-- 多语言 -->

src/router/modules/video.ts

@@ -0,0 +1,20 @@
+import { RouteRecordRaw } from 'vue-router';
+// eslint-disable-next-line @typescript-eslint/ban-ts-comment
+// @ts-ignore
+const router: RouteRecordRaw[] = [
+  {
+    path: '/video',
+    component: () => import('@/layout/index.vue'),
+    meta: { title: '视频库管理', icon: 'user' },
+    children: [
+      {
+        path: 'applet',
+        name: 'applet-account',
+        meta: { title: '视频库管理', icon: 'home' },
+        component: () => import('@/views/videoManage/index.vue')
+      }
+    ]
+  }
+];
+
+export default router;

src/views/appletManage/applet/form/create.vue

@@ -1,37 +1,41 @@
 <template>
-  <el-form :model="formData" label-width="100px" ref="ruleForm" :rules="rules" v-loading="loading" class="pr-4">
+  <el-form :model="formData" label-width="120px" ref="ruleForm" :rules="rules" v-loading="loading" class="pr-4">
     <div class="flex flex-row justify-between">
       <div class="w-full">
-        <el-form-item label="登录账号" prop="email">
-          <el-input v-model="formData.email" placeholder="请填写登录账号" />
+        <el-form-item label="小程序名称" prop="email">
+          <el-input v-model="formData.email" placeholder="请输入小程序名称" />
         </el-form-item>
-        <el-form-item label="用户名" prop="username">
-          <el-input v-model="formData.username" placeholder="请填写用户名" />
+        <el-form-item label="所属公司" prop="username">
+          <el-input v-model="formData.username" placeholder="请输入所属公司" />
         </el-form-item>
-        <el-form-item label="密码" prop="password">
+        <el-form-item label="对应剧场名称" v-if="!props.primary" prop="password">
           <el-input v-model="formData.password" clearable type="password" autocomplete="new-password" size="large"
-            placeholder="密码" show-password :prefix-icon="Lock" class="h-12 text-base" />
+            placeholder="请输入对应剧场名称" show-password class="h-12 text-base" />
         </el-form-item>
-        <el-form-item label="确认密码" prop="password_confirmation">
-          <el-input v-model="formData.password_confirmation" clearable type="password" autocomplete="new-password"
-            size="large" placeholder="确认密码" show-password :prefix-icon="Lock" class="h-12 text-base" />
-        </el-form-item>
-        <el-form-item label="绑定小程序" prop="applet">
-          <el-select v-model="formData.applet" remote filterable :remote-method="remoteMethod" clearable
-            placeholder="选择CP方">
+        <el-form-item label="类型" prop="miniProgramIds">
+          <el-select class="w-full" v-model="formData.miniProgramIds" remote filterable multiple
+            :remote-method="remoteMethod" clearable placeholder="选择类型">
             <el-option v-for="item in cpList" :key="item.cp_id" :label="item.cp_name" :value="item.cp_name" />
           </el-select>
         </el-form-item>
-        <el-form-item label="状态" prop="username">
-          <el-switch v-model="formData.delivery" />
+        <el-form-item label="APP ID" v-if="!props.primary" prop="repassword">
+          <el-input v-model="formData.repassword" clearable type="password" autocomplete="new-password" size="large"
+            placeholder="请输入APP ID" show-password class="h-12 text-base" />
+        </el-form-item>
+        <el-form-item label="APP 密钥" v-if="!props.primary" prop="repassword">
+          <el-input v-model="formData.repassword" clearable type="password" autocomplete="new-password" size="large"
+            placeholder="请输入APP 密钥" show-password class="h-12 text-base" />
+        </el-form-item>
+        <el-form-item label="状态" prop="status">
+          <el-switch v-model="formData.status" :active-value="1" :inactive-value="2" />
         </el-form-item>
-        <el-form-item label="备注" prop="username">
-          <el-input v-model="formData.username" placeholder="请填写备注" type="textarea" />
+        <el-form-item label="备注" prop="remark">
+          <el-input v-model="formData.remark" placeholder="请填写备注" type="textarea" />
         </el-form-item>
       </div>
     </div>
     <div class="flex justify-end">
-      <el-button type="primary" @click="submitForm(form)">{{ $t('system.confirm') }}</el-button>
+      <el-button type="primary" @click="submitForm(ruleForm)">{{ $t('system.confirm') }}</el-button>
     </div>
   </el-form>
 </template>
@@ -40,16 +44,14 @@
 import { useCreate } from '@/hook/curd/useCreate';
 import { useShow } from '@/hook/curd/useShow';
 import { cpManageCpList, cpOptions } from '@/api/cp/index'
+import { advertiserGetAdvertiser, advertiserAdd, advertiserUpdateAdvertiser } from '@/api/advertiser/index'
 import type { FormInstance, FormRules } from 'element-plus'
 const ruleForm = ref<FormInstance>()
-
 import { onMounted, ref } from 'vue';
-import http from '@/support/http';
 const props = defineProps({
   primary: String | Number,
-  api: String,
 });
-
+const formData = ref({ status: 2, miniProgramIds: [] })
 //自定义校验规则
 const validatePasswordConfirmation = (
   rule: any,
@@ -65,11 +67,11 @@ const validatePasswordConfirmation = (
   }
 };
 const rules = reactive({
-  applet: [{ required: true, message: '请选择小程序' }],
+  miniProgramIds: [{ required: true, message: '请选择小程序' }],
   email: [
     {
       required: true,
-      message: '请输入邮箱',
+      message: '请输入登录账号',
       trigger: 'blur'
     },
     {
@@ -78,10 +80,17 @@ const rules = reactive({
       trigger: 'blur'
     }
   ],
-  code: [
+  remark: [
+    {
+      required: true,
+      message: '请输入备注',
+      trigger: 'blur'
+    }
+  ],
+  username: [
     {
       required: true,
-      message: '请输入验证码',
+      message: '请输入用户名',
       trigger: 'blur'
     }
   ],
@@ -97,7 +106,7 @@ const rules = reactive({
         '必须包含大小写字母和数字的组合，可以使用特殊字符，长度在6-20之间'
     }
   ],
-  password_confirmation: [
+  repassword: [
     {
       required: true,
       message: '请再次输入密码',
@@ -106,9 +115,7 @@ const rules = reactive({
     { validator: validatePasswordConfirmation, trigger: 'blur' }
   ]
 });
-
-
-
+const loading = ref(false)
 
 const remoteMethod = (query: string) => {
   if (query) {
@@ -134,24 +141,39 @@ const passwordRules = [
     message: '必须包含大小写字母和数字的组合，可以使用特殊字符，长度在6-20之间'
   }
 ];
-
-if (props.primary) {
-  passwordRules.shift();
+const submitForm = (formEl: FormInstance | undefined) => {
+  console.log(formData.value, 'formData.valueformData.value');
+  if (!formEl) return;
+  formEl
+    .validate(valid => {
+      if (valid) {
+        let api;
+        if (props.primary) {
+          api = advertiserUpdateAdvertiser
+        } else {
+          api = advertiserAdd
+        }
+        api({ ...formData.value }).then(res => {
+          console.log(res);
+          ElMessage.success(res.message)
+          emit('close')
+        })
+      } else {
+        loading.value = false;
+      }
+    })
+    .then(() => { });
 }
 
-const { formData, form, loading, submitForm, close } = useCreate(
-  props.api,
-  props.primary
-);
-
 if (props.primary) {
-  useShow(props.api, props.primary, formData);
+  advertiserGetAdvertiser({ id: props.primary }).then(res => {
+    console.log(res, 'props.primary');
+    formData.value = res.data
+  })
 }
 
 const emit = defineEmits(['close']);
-close(() => emit('close'));
 const cpList = ref();
-
 onMounted(() => {
   initCpOtion({})
 });

src/views/appletManage/applet/form/depotsTransfer.vue

@@ -1,19 +1,21 @@
 <template>
-  <el-form :model="form" label-width="80px" ref="ruleForm" :rules="rules" v-loading="loading" class="pr-4">
+  <el-form :model="form" label-width="130px" ref="ruleForm" :rules="rules" v-loading="loading" class="pr-4">
     <div class="flex flex-row justify-between">
       <div class="w-full">
-        <el-form-item label="登录账号" prop="email">
+        <el-form-item label="小程序名称" prop="email">
           <el-input v-model="form.email" placeholder="请填写登录账号" />
         </el-form-item>
         <el-form-item label="状态" prop="username">
           <el-switch v-model="form.delivery" />
         </el-form-item>
-        <el-form-item label="备注" prop="username">
-          <el-transfer v-model="form.depotsValue" :props="{
-            key: 'channel_id',
-            label: 'remark',
-          }" :titles="['未分配', '已分配']" filterable @right-check-change="transferChange" :filter-method="filterMethod"
-            filter-placeholder="搜索" :data="dataObj" />
+        <el-form-item label="分配至投手公司" prop="username">
+          <div>
+            <el-transfer v-model="form.depotsValue" :props="{
+              key: 'channel_id',
+              label: 'remark',
+            }" :titles="['未分配', '已分配']" filterable @right-check-change="transferChange" :filter-method="filterMethod"
+              filter-placeholder="搜索" :data="dataObj" />
+          </div>
         </el-form-item>
       </div>
     </div>
@@ -29,6 +31,36 @@ import { bookDistribute, bookDistributeSave } from '@/api/bookManage/index';
 const props = defineProps({
   primary: Object,
 });
+const loading = ref(false)
+const rules = reactive({
+  miniProgramIds: [{ required: true, message: '请选择小程序' }],
+  email: [
+    {
+      required: true,
+      message: '请输入登录账号',
+      trigger: 'blur'
+    },
+    {
+      type: 'email',
+      message: '邮箱格式不正确',
+      trigger: 'blur'
+    }
+  ],
+  remark: [
+    {
+      required: true,
+      message: '请输入备注',
+      trigger: 'blur'
+    }
+  ],
+  username: [
+    {
+      required: true,
+      message: '请输入用户名',
+      trigger: 'blur'
+    }
+  ],
+});
 const form = ref({})
 const dataObj = ref([])
 const channels = ref([])

src/views/appletManage/applet/index.vue

@@ -43,7 +43,7 @@
       </Dialog>
 
       <Dialog v-model="visible" :title="title" destroy-on-close>
-        <Create @close="close(reset)" :primary="id" :api="api" :has-roles="hasRoles" />
+        <Create @close="close(reset)" :primary="id" :api="api" />
       </Dialog>
     </div>
   </div>

src/views/user/caster/create.vue

@@ -8,48 +8,47 @@
         <el-form-item label="用户名" prop="username">
           <el-input v-model="formData.username" placeholder="请填写用户名" />
         </el-form-item>
-        <el-form-item label="密码" prop="password">
+        <el-form-item label="密码" v-if="!props.primary" prop="password">
           <el-input v-model="formData.password" clearable type="password" autocomplete="new-password" size="large"
             placeholder="密码" show-password :prefix-icon="Lock" class="h-12 text-base" />
         </el-form-item>
-        <el-form-item label="确认密码" prop="password_confirmation">
-          <el-input v-model="formData.password_confirmation" clearable type="password" autocomplete="new-password"
-            size="large" placeholder="确认密码" show-password :prefix-icon="Lock" class="h-12 text-base" />
+        <el-form-item label="确认密码" v-if="!props.primary" prop="repassword">
+          <el-input v-model="formData.repassword" clearable type="password" autocomplete="new-password" size="large"
+            placeholder="确认密码" show-password :prefix-icon="Lock" class="h-12 text-base" />
         </el-form-item>
-        <el-form-item label="绑定小程序" prop="applet">
-          <el-select v-model="formData.applet" remote filterable :remote-method="remoteMethod" clearable
-            placeholder="选择CP方">
+        <el-form-item label="绑定小程序" prop="miniProgramIds">
+          <el-select class="w-full" v-model="formData.miniProgramIds" remote filterable multiple
+            :remote-method="remoteMethod" clearable placeholder="选择小程序">
             <el-option v-for="item in cpList" :key="item.cp_id" :label="item.cp_name" :value="item.cp_name" />
           </el-select>
         </el-form-item>
-        <el-form-item label="状态" prop="username">
-          <el-switch v-model="formData.delivery" />
+        <el-form-item label="状态" prop="status">
+          <el-switch v-model="formData.status" :active-value="1" :inactive-value="2" />
         </el-form-item>
-        <el-form-item label="备注" prop="username">
-          <el-input v-model="formData.username" placeholder="请填写备注" type="textarea" />
+        <el-form-item label="备注" prop="remark">
+          <el-input v-model="formData.remark" placeholder="请填写备注" type="textarea" />
         </el-form-item>
       </div>
     </div>
     <div class="flex justify-end">
-      <el-button type="primary" @click="submitForm(form)">{{ $t('system.confirm') }}</el-button>
+      <el-button type="primary" @click="submitForm(ruleForm)">{{ $t('system.confirm') }}</el-button>
     </div>
   </el-form>
 </template>
 
 <script lang="ts" setup>
+import { Lock, Message, Key } from '@element-plus/icons-vue'
 import { useCreate } from '@/hook/curd/useCreate';
 import { useShow } from '@/hook/curd/useShow';
 import { cpManageCpList, cpOptions } from '@/api/cp/index'
+import { advertiserGetAdvertiser, advertiserAdd, advertiserUpdateAdvertiser } from '@/api/advertiser/index'
 import type { FormInstance, FormRules } from 'element-plus'
 const ruleForm = ref<FormInstance>()
-
 import { onMounted, ref } from 'vue';
-import http from '@/support/http';
 const props = defineProps({
   primary: String | Number,
-  api: String,
 });
-
+const formData = ref({ status: 2, miniProgramIds: [] })
 //自定义校验规则
 const validatePasswordConfirmation = (
   rule: any,
@@ -65,11 +64,11 @@ const validatePasswordConfirmation = (
   }
 };
 const rules = reactive({
-  applet: [{ required: true, message: '请选择小程序' }],
+  miniProgramIds: [{ required: true, message: '请选择小程序' }],
   email: [
     {
       required: true,
-      message: '请输入邮箱',
+      message: '请输入登录账号',
       trigger: 'blur'
     },
     {
@@ -78,10 +77,17 @@ const rules = reactive({
       trigger: 'blur'
     }
   ],
-  code: [
+  remark: [
+    {
+      required: true,
+      message: '请输入备注',
+      trigger: 'blur'
+    }
+  ],
+  username: [
     {
       required: true,
-      message: '请输入验证码',
+      message: '请输入用户名',
       trigger: 'blur'
     }
   ],
@@ -97,7 +103,7 @@ const rules = reactive({
         '必须包含大小写字母和数字的组合，可以使用特殊字符，长度在6-20之间'
     }
   ],
-  password_confirmation: [
+  repassword: [
     {
       required: true,
       message: '请再次输入密码',
@@ -106,9 +112,7 @@ const rules = reactive({
     { validator: validatePasswordConfirmation, trigger: 'blur' }
   ]
 });
-
-
-
+const loading = ref(false)
 
 const remoteMethod = (query: string) => {
   if (query) {
@@ -134,24 +138,39 @@ const passwordRules = [
     message: '必须包含大小写字母和数字的组合，可以使用特殊字符，长度在6-20之间'
   }
 ];
-
-if (props.primary) {
-  passwordRules.shift();
+const submitForm = (formEl: FormInstance | undefined) => {
+  console.log(formData.value, 'formData.valueformData.value');
+  if (!formEl) return;
+  formEl
+    .validate(valid => {
+      if (valid) {
+        let api;
+        if (props.primary) {
+          api = advertiserUpdateAdvertiser
+        } else {
+          api = advertiserAdd
+        }
+        api({ ...formData.value }).then(res => {
+          console.log(res);
+          ElMessage.success(res.message)
+          emit('close')
+        })
+      } else {
+        loading.value = false;
+      }
+    })
+    .then(() => { });
 }
 
-const { formData, form, loading, submitForm, close } = useCreate(
-  props.api,
-  props.primary
-);
-
 if (props.primary) {
-  useShow(props.api, props.primary, formData);
+  advertiserGetAdvertiser({ id: props.primary }).then(res => {
+    console.log(res, 'props.primary');
+    formData.value = res.data
+  })
 }
 
 const emit = defineEmits(['close']);
-close(() => emit('close'));
 const cpList = ref();
-
 onMounted(() => {
   initCpOtion({})
 });

src/views/user/caster/index.vue

@@ -1,7 +1,6 @@
 <template>
   <div class="flex flex-col justify-between w-full sm:flex-row">
-    <!-- <Department v-model="query.department_id" @searchDepartmentUsers="search" v-if="hasRoles" class="dark:bg-regal-dark" /> -->
-    <div :class="hasRoles ? 'w-full ml-0 sm:ml-2 mt-2 sm:mt-0' : 'w-full'">
+    <div class="w-full">
       <Search :search="search" :reset="reset">
         <template v-slot:body>
           <el-form-item label="账号">
@@ -11,7 +10,7 @@
             <el-input v-model="query.username" clearable />
           </el-form-item>
           <el-form-item label="小程序">
-            <el-select v-model="query.applet" filterable clearable placeholder="选择小程序">
+            <el-select v-model="query.miniProgramId" filterable clearable placeholder="选择小程序">
               <el-option v-for="item in applet" :key="item.id" :label="item.name" :value="item.value" />
             </el-select>
           </el-form-item>
@@ -20,13 +19,28 @@
       <div class="table-default">
         <Operate :show="open" />
         <el-table :data="tableData" class="mt-3" v-loading="loading">
-          <el-table-column prop="username" label="ID" />
-          <el-table-column prop="username" label="账号" />
+          <el-table-column prop="id" label="ID" />
+          <el-table-column prop="email" label="账号">
+            <template #default="scope">
+              <el-tooltip placement="top" v-if="scope.row.remark">
+                <template #content> {{ scope.row.remark }}<br /> </template>
+                <span>{{ scope.row.email }}</span>
+              </el-tooltip>
+              <span v-else>{{ scope.row.email }}</span>
+            </template>
+          </el-table-column>
           <el-table-column prop="username" label="用户名" />
-          <el-table-column prop="username" label="已绑定小程序" />
+          <el-table-column prop="miniProgramIds" label="已绑定小程序">
+            <template #default="scope">
+              <div v-for="applet in scope.row.miniPrograms" :key="applet.id" class="flex items-center h-8">
+                <span class="mr-3 text-sm font-medium">{{ applet.name }}</span>
+                <el-image style="width: 20px; height: 20px" class="mt-1" :src="applet.type_logo" fit="contain" />
+              </div>
+            </template>
+          </el-table-column>
           <el-table-column prop="status" label="状态">
             <template #default="scope">
-              <Status v-model="scope.row.status" :id="scope.row.id" :api="api" />
+              <Status v-model="scope.row.status" :id="scope.row.id" :api="statusapi" />
             </template>
           </el-table-column>
           <el-table-column prop="created_at" label="创建时间" />
@@ -41,7 +55,7 @@
       </div>
 
       <Dialog v-model="visible" :title="title" destroy-on-close>
-        <Create @close="close(reset)" :primary="id" :api="api" :has-roles="hasRoles" />
+        <Create @close="close(reset)" :primary="id" />
       </Dialog>
     </div>
   </div>
@@ -51,31 +65,17 @@
 import { computed, onMounted, ref } from 'vue';
 import Create from './create.vue';
 import { useGetList } from '@/hook/curd/useGetList';
-import { useDestroy } from '@/hook/curd/useDestroy';
 import { useOpen } from '@/hook/curd/useOpen';
-import Department from './components/department.vue';
-import { useUserStore } from '@/stores/modules/user';
-import { isUndefined } from '@/support/helper';
 
-const userStore = useUserStore();
+const statusapi = 'users';
 const applet = ref([{ id: 1, name: '微信', value: 'wx' }, { id: 2, name: '抖音', value: 'dy' }])
-
-const api = 'users';
-
+const api = 'channel/advertiser/listAdvertiser';
 const { data, query, search, reset, loading } = useGetList(api);
-const { destroy, deleted } = useDestroy();
 const { open, close, title, visible, id } = useOpen();
 
 const tableData = computed(() => data.value?.data);
 
-const roles = ref<Array<Object>>();
-const hasRoles = ref<boolean>(false);
-
 onMounted(() => {
   search();
-
-  deleted(reset);
-
-  hasRoles.value = !isUndefined(userStore.getRoles);
 });
 </script>