소스 검색

Merge branch 'ctt_dev_new' into dev

dev
chutingting 1 년 전
부모
커밋
f66338a09b
13개의 변경된 파일1433개의 추가작업 그리고 4개의 파일을 삭제
  1. +13
    -0
      src/apis/home.js
  2. +147
    -0
      src/apis/userManage.js
  3. +15
    -1
      src/layout/index.vue
  4. +56
    -0
      src/router/index.ts
  5. +4
    -1
      src/types/components.d.ts
  6. +87
    -0
      src/views/userManage/personMould.vue
  7. +189
    -0
      src/views/userManage/rechargeList.vue
  8. +222
    -0
      src/views/userManage/userList.vue
  9. +161
    -0
      src/views/userManage/userMouldList.vue
  10. +160
    -0
      src/views/userManage/userVoiceList.vue
  11. +262
    -0
      src/views/userManage/videoList.vue
  12. +87
    -0
      src/views/userManage/voiceMould.vue
  13. +30
    -2
      src/views/video/index.vue

+ 13
- 0
src/apis/home.js 파일 보기

@@ -68,3 +68,16 @@ export function videoListApi(pageNum, pageSize) {
})
}

/**
* @description: 已消耗总时长
* @param
* @return:
*/
export function currentVideoToalApi(pageNum) {
let api = localStorage.getItem("isAdmin") === '0' ? '/serviceInfo/currentVideoToal' : '/serviceInfo/privateDeployAdminCurrentVideoTotal'
return request({
url: `${api}`,
method: 'get',
})
}


+ 147
- 0
src/apis/userManage.js 파일 보기

@@ -0,0 +1,147 @@
import request from "@/utils/request.js";

/**
* @description 用户列表
* @param {*} (pageNum,pageSize)
* @returns data
*/
export function userListApi(params) {
return request({
url: `/wxCUserBasicInfo/list`,
method: 'get',
params
})
}
// 绑定定制模板
export function personMouldListApi(pageNum, pageSize) {
return request({
url: `/personMould/alList?onlyCustomizedQuery=1&pageNum=${pageNum}&pageSize=${pageSize}`,
method: 'get'
})
}
// 绑定定制模板-已关联模版
export function userPersonMouldIdListApi(cUserId) {
return request({
url: `/personMould/userPersonMouldIdList?cUserId=${cUserId}`,
method: 'get'
})
}

// 绑定定制模板-关联模版
export function associatedUserMouldsApi(data) {
return request({
url: `/personMould/associatedUserMoulds`,
method: 'post',
data
})
}
// 绑定定制声纹
export function voiceMouldListApi(pageNum, pageSize) {
return request({
url: `/voiceMould/alList?onlyCustomizedQuery=1&pageNum=${pageNum}&pageSize=${pageSize}`,
method: 'get'
})
}
// 绑定定制声纹-已关联模版
export function userVoiceIdListApi(cUserId) {
return request({
url: `/voiceMould/userVoiceIdList?cUserId=${cUserId}`,
method: 'get'
})
}

// 绑定定制声纹-关联模版
export function associatedUserVoicesApi(data) {
return request({
url: `/voiceMould/associatedUserVoices`,
method: 'post',
data
})
}

/**
* @description 用户列表查看
* @param {*}
* @returns
*/
export function userListFindByIdApi() {
return request({
url: ` /wxCUserBasicInfo/findById?id=${id}`,
method: 'get'
})
}

/**
* @description 私人定制模板列表
* @param {*} (pageNum,pageSize)
* @returns data
*/
export function userMouldListApi(params) {
return request({
url: `/personMould/userMouldList`,
method: 'get',
params
})
}
/**
* @description 私人定制声纹列表
* @param {*} (pageNum,pageSize)
* @returns data
*/
export function userVoiceListAPi(params) {
return request({
url: `/voiceMould/userVoiceList`,
method: 'get',
params
})
}

/**
* @description 充值列表
* @param {*} (pageNum,pageSize)
* @returns data
*/
export function rechargeListApi(params) {
return request({
url: `/productOrder/paiedOrders`,
method: 'get',
params
})
}

/**
* @description 充值列表
* @param {*} (pageNum,pageSize)
* @returns data
*/
export function videoListApi(params) {
return request({
url: `/userVideo/list`,
method: 'get',
params
})
}

/**
* @description 充值列表-查看
* @param {*}
* @returns
*/
export function videoListFindByIdApi(id) {
return request({
url: `/userVideo/findById?id=${id}`,
method: 'get'
})
}

/**
* @description 充值列表-删除
* @param {*}
* @returns
*/
export function videoListDelApi(id) {
return request({
url: `/userVideo/del?id=${id}`,
method: 'get'
})
}

+ 15
- 1
src/layout/index.vue 파일 보기

@@ -45,6 +45,20 @@
<span>视频制作统计</span>
</el-menu-item>
</template>
<!-- v-if="isAdmin === '1'" -->
<el-sub-menu index="7" v-if="isAdmin == '1'" >
<template #title>
<el-icon><i-ep-edit /></el-icon>
<span>用户管理</span>
</template>
<el-menu-item-group>
<el-menu-item index="7-1" @click="router.push('/userManage')">用户列表</el-menu-item>
<el-menu-item index="7-2" @click="router.push('/userMouldList')">私人定制模板列表</el-menu-item>
<el-menu-item index="7-3" @click="router.push('/userVoiceList')">私人定制声纹列表</el-menu-item>
<el-menu-item index="7-4" @click="router.push('/rechargeList')">充值列表</el-menu-item>
<el-menu-item index="7-5" @click="router.push('/videoList')">视频列表</el-menu-item>
</el-menu-item-group>
</el-sub-menu>
</el-menu>
</div>
</div>
@@ -227,7 +241,7 @@ const showChildrenRouter = ref("");
.myRouter {
position: relative;
height: calc(100% - 80px);
padding: 130px 20px 0;
padding: 50px 20px 0;
color: #fff;
width: 230px;
// color: #868593;


+ 56
- 0
src/router/index.ts 파일 보기

@@ -222,6 +222,62 @@ export const constantRoutes: RouteRecordRaw[] = [
name: "ruleListMangage.title",
},
},
{
path: "/userManage",
component: () => import("@/views/userManage/userList.vue"),
name: "userManage",
meta: {
title: "userManage",
icon: "homepage",
affix: true,
name: "ruleListMangage.title",
},
},
{
path: "/userMouldList",
component: () => import("@/views/userManage/userMouldList.vue"),
name: "userMouldList",
meta: {
title: "userMouldList",
icon: "homepage",
affix: true,
name: "ruleListMangage.title",
},
},
{
path: "/userVoiceList",
component: () => import("@/views/userManage/userVoiceList.vue"),
name: "userVoiceList",
meta: {
title: "userVoiceList",
icon: "homepage",
affix: true,
name: "ruleListMangage.title",
},
},

{
path: "/rechargeList",
component: () => import("@/views/userManage/rechargeList.vue"),
name: "rechargeList",
meta: {
title: "rechargeList",
icon: "homepage",
affix: true,
name: "ruleListMangage.title",
},
},
{
path: "/videoList",
component: () => import("@/views/userManage/videoList.vue"),
name: "videoList",
meta: {
title: "videoList",
icon: "homepage",
affix: true,
name: "ruleListMangage.title",
},
},
],
}
];


+ 4
- 1
src/types/components.d.ts 파일 보기

@@ -8,15 +8,16 @@ export {}
declare module '@vue/runtime-core' {
export interface GlobalComponents {
Breadcrumb: typeof import('./../components/Breadcrumb/index.vue')['default']
copy: typeof import('./../components/EditPosition copy.vue')['default']
CutImg: typeof import('./../components/cutImg.vue')['default']
CutImg1: typeof import('./../components/cutImg1.vue')['default']
EditPosition: typeof import('./../components/EditPosition.vue')['default']
'EditPosition copy': typeof import('./../components/EditPosition copy.vue')['default']
ElAlert: typeof import('element-plus/es')['ElAlert']
ElButton: typeof import('element-plus/es')['ElButton']
ElCard: typeof import('element-plus/es')['ElCard']
ElCheckbox: typeof import('element-plus/es')['ElCheckbox']
ElCheckboxGroup: typeof import('element-plus/es')['ElCheckboxGroup']
ElDatePicker: typeof import('element-plus/es')['ElDatePicker']
ElDialog: typeof import('element-plus/es')['ElDialog']
ElDropdown: typeof import('element-plus/es')['ElDropdown']
ElDropdownItem: typeof import('element-plus/es')['ElDropdownItem']
@@ -28,11 +29,13 @@ declare module '@vue/runtime-core' {
ElInputNumber: typeof import('element-plus/es')['ElInputNumber']
ElMenu: typeof import('element-plus/es')['ElMenu']
ElMenuItem: typeof import('element-plus/es')['ElMenuItem']
ElMenuItemGroup: typeof import('element-plus/es')['ElMenuItemGroup']
ElOption: typeof import('element-plus/es')['ElOption']
ElPagination: typeof import('element-plus/es')['ElPagination']
ElRadio: typeof import('element-plus/es')['ElRadio']
ElRadioGroup: typeof import('element-plus/es')['ElRadioGroup']
ElSelect: typeof import('element-plus/es')['ElSelect']
ElSubMenu: typeof import('element-plus/es')['ElSubMenu']
ElSwitch: typeof import('element-plus/es')['ElSwitch']
ElTable: typeof import('element-plus/es')['ElTable']
ElTableColumn: typeof import('element-plus/es')['ElTableColumn']


+ 87
- 0
src/views/userManage/personMould.vue 파일 보기

@@ -0,0 +1,87 @@
<template>
<div>
<el-checkbox-group v-model="checkboxGroup" size="small" class="checkbox">
<el-checkbox v-for="(item, index) in tableData" :key="index" :label="item.id" border>
<img :src="item.coverImg" width="50" />
<p>{{ item.title }}</p>
</el-checkbox>
</el-checkbox-group>
<div style="margin-top: 20px">
<el-button @click="handleClose"
>取消</el-button
>
<el-button type="primary" @click="addModel()">确认关联</el-button>
</div>
</div>
</template>

<script setup>
import { ref } from 'vue'
import { personMouldListApi, userPersonMouldIdListApi, associatedUserMouldsApi } from '@/apis/userManage.js'
import dayjs from "dayjs";

const emit = defineEmits(["close"]);
const props = defineProps({
serviceId: {
required: true,
}
});

const getDate = (val) => {
return dayjs(val).format("YYYY-MM-DD");
};

const checkboxGroup = ref([])
const total = ref(0);
const tableData = ref([]);

const modelAllListFunc = async () => {
try {
const res = await personMouldListApi(1, 10000);
const modelIds = await userPersonMouldIdListApi(props.serviceId);
tableData.value = res.data.list;
total.value = res.data.total * 1;
setTimeout(()=> {
if(modelIds.data && modelIds.data.length > 0) {
modelIds.data.forEach((item) => {
checkboxGroup.value.push(item)
})
}
}, 500)

} catch (error) {
console.log(error, "err");
}
};

const addModel = async () => {
const data = {
mouldIds: checkboxGroup.value,
cUserId: props.serviceId
}
const res = await associatedUserMouldsApi(data);
if(res.code === 200) {
ElMessage.success("关联成功!");
handleClose()
}
};

function handleClose() {
emit("close");
}
onMounted(() => {
modelAllListFunc(1, 10);
});
</script>

<style lang="scss" scoped>
.checkbox {
max-height: 500px;
overflow: auto;
:deep .el-checkbox.el-checkbox--small {
width: 110px;
height:110px;
margin-bottom: 10px;
}
}
</style>

+ 189
- 0
src/views/userManage/rechargeList.vue 파일 보기

@@ -0,0 +1,189 @@
<template>
<div class="page justify-around">
<div class="addbtn">
<el-form :inline="true" :model="formInline" class="demo-form-inline">
<el-form-item label="手机号">
<el-input v-model="formInline.phone" placeholder="请输入手机号" clearable />
</el-form-item>
<el-form-item label="商品名">
<el-input v-model="formInline.mouldSmIdLike" placeholder="请输入模版号" clearable />
</el-form-item>
<el-form-item label="充值时间段">
<el-date-picker
v-model="formInline.time"
type="daterange"
range-separator="To"
start-placeholder="Start date"
end-placeholder="End date"
/>
</el-form-item>
<el-form-item>
<el-button type="primary" @click="getListData"><el-icon><i-ep-plus /></el-icon> 查询</el-button>
</el-form-item>
</el-form>
</div>
<el-table
:data="tableData"
style="width: 100%; height: 90%"
size="large"
align="center"
border
>
<el-table-column
prop="name"
label="订单号"
align="center"
/>
<el-table-column
prop="address"
label="商品名称"
align="center"
/>
<el-table-column
prop="address"
label="支付方式"
align="center"
/>
<el-table-column
prop="address"
label="支付金额"
align="center"
/>
<el-table-column
prop="address"
label="手机号"
align="center"
/>
<el-table-column
prop="createDate"
label="创建时间"
align="center"
>
<template #default="scope">
{{ getDate(scope.row.createDate) }}
</template>
</el-table-column>
</el-table>
<!-- 登录账号 -->
<div class="pagination">
<el-pagination
v-model:current-page="pageNum"
v-model:page-size="pageSize"
:page-sizes="[10, 50, 100]"
:small="false"
:disabled="false"
:background="true"
layout="total, sizes, prev, pager, next, jumper"
:total="total"
@size-change="handleSizeChange"
@current-change="handleCurrentChange"
/>
</div>
</div>
</template>
<!-- videoType==1为竖,==2为横 -->
<script setup>
//#region 导入
import { rechargeListApi } from '@/apis/userManage.js'
import { useI18n } from "vue-i18n";
import dayjs from "dayjs";
import { useRoute, useRouter } from "vue-router";
const route = useRoute();
const router = useRouter();
const { locale } = useI18n();
const lanChange = ref(locale);
const tableData = ref([]);
const pageNum = ref(1);
const pageSize = ref(10);
const total = ref(0);
const getDate = (val) => {
return dayjs(val).format("YYYY-MM-DD");
};
const handleSizeChange = (val) => {
pageSize.value = val;
getListData(pageNum.value, pageSize.value);
};
const handleCurrentChange = (val) => {
pageNum.value = val;
getListData(pageNum.value, pageSize.value);
};
const formInline = ref({
phone: '',
productTitle: '',
time: ''
})
const getListData = async (PageNum, PageSize) => {
try {
let data = {
PageNum: PageNum || 1,
PageSize: PageSize || 10,
phone: formInline.phone,
projectType: 2,
productTitle: formInline.productTitle,
startDate: formInline.time ? formInline.time[0] : '',
endDate: formInline.time ? formInline.time[1] : '',
}
const res = await rechargeListApi(data);
tableData.value = res.data.list;
total.value = res.data.total * 1;
} catch (error) {
console.log(error, "err");
}
};
onMounted(() => {
getListData(1, 10);
});
</script>
<style lang="scss" scoped>
.page {
height: calc(100vh - 80px);
// height: calc(100vh - 80px);
background-color: #ffffff;
border-radius: 30px 0 0 0;
overflow: hidden;
padding: 10vh;
.addbtn {
margin-bottom: 2vh;
}
.formData {
padding: 5vh 3vh;
}
.pagination {
position: fixed;
left: 55%;
bottom: 8vh;
transform: translateX(-50%);
border-radius: 5px;
padding: 10px 20px;
z-index: 99;
transition: all 0.3s;
cursor: pointer;
&:hover {
background-color: #b8b8b873;
}
}
}
</style>

+ 222
- 0
src/views/userManage/userList.vue 파일 보기

@@ -0,0 +1,222 @@
<template>
<div class="page justify-around">
<div class="addbtn">
<el-form :inline="true" :model="formInline" class="demo-form-inline">
<el-form-item label="手机号">
<el-input v-model="formInline.phone" placeholder="请输入手机号" clearable />
</el-form-item>
<el-form-item>
<el-button type="primary" @click="dialogVisible = true"><el-icon><i-ep-plus /></el-icon> 新增</el-button>
</el-form-item>
</el-form>
</div>
<el-table
:data="tableData"
style="width: 100%; height: 90%"
size="large"
align="center"
border
>
<el-table-column
prop="name"
label="用户ID"
align="center"
/>
<el-table-column
prop="address"
label="手机号"
align="center"
/>
<el-table-column
prop="createDate"
label="注册时间"
align="center"
>
<template #default="scope">
{{ getDate(scope.row.createDate) }}
</template>
</el-table-column>

<el-table-column
prop="poins"
label="当前币值"
align="center"
/>
<el-table-column
fixed="right"
:label="$t('keyMangage.operations')"
width="400"
align="center"
>
<template #default="scope">
<el-button link type="primary" size="small" @click="showDetail(scope.row.id)">查看</el-button>
<el-button link type="primary" size="small" @click="rechargeDetail(scope.row)">查看充值记录</el-button>
<el-button link type="primary" size="small" @click="videoDetail(scope.row)"> 查看视频列表</el-button>
</template>
</el-table-column>
</el-table>
<!-- 登录账号 -->
<div class="pagination">
<el-pagination
v-model:current-page="pageNum"
v-model:page-size="pageSize"
:page-sizes="[10, 50, 100]"
:small="false"
:disabled="false"
:background="true"
layout="total, sizes, prev, pager, next, jumper"
:total="total"
@size-change="handleSizeChange"
@current-change="handleCurrentChange"
/>
</div>
<el-dialog v-model="detailDialogVisible" v-if="detailDialogVisible" title="查看详情" width="60%" :before-close="handleClose" >
<el-form :model="form" label-width="120px">
<el-form-item label="用户ID">
<el-input v-model="form.name" />
</el-form-item>
<el-form-item label="手机号">
<el-input v-model="form.phone" />
</el-form-item>
<el-form-item>
<el-button type="primary" @click="onSubmit">Create</el-button>
<el-button>Cancel</el-button>
</el-form-item>
</el-form>
</el-dialog>
</div>
</template>
<!-- videoType==1为竖,==2为横 -->
<script setup>
//#region 导入

import { userListApi, userListFindByIdApi } from '@/apis/userManage.js'
import { useI18n } from "vue-i18n";
import dayjs from "dayjs";
import { useRoute, useRouter } from "vue-router";
const route = useRoute();
const router = useRouter();
const { locale } = useI18n();
const lanChange = ref(locale);
const tableData = ref([]);
const dialogVisible = ref(false);
const rechargeDetail = (item) => {
router.push({
path: "/rechargeList",
query: {
phone: item.phone
},
});
};
const videoDetail = (item) => {
router.push({
path: "/videoList",
query: {
phone: item.phone
},
});
};
const pageNum = ref(1);
const pageSize = ref(10);
const total = ref(0);
const getDate = (val) => {
return dayjs(val).format("YYYY-MM-DD");
};
const handleSizeChange = (val) => {
pageSize.value = val;
getListData(pageNum.value, pageSize.value);
};
const handleCurrentChange = (val) => {
pageNum.value = val;
getListData(pageNum.value, pageSize.value);
};

const formInline = ref({
phone: ''
})
const getListData = async (PageNum, PageSize) => {
try {
let data = {
PageNum: PageNum,
PageSize: PageSize,
phone: formInline.phone
}
const res = await userListApi(data);
console.log(res, "res");
tableData.value = res.data.list;
total.value = res.data.total * 1;
} catch (error) {
console.log(error, "err");
}
};

const form = ref({
name: '',
phone: ''
})
const detailDialogVisible = ref(false)
function showDetail(id) {
userListFindByIdApi(id).then(res => {
detailDialogVisible.value = true
form.value = res.data
})
}
function handleClose() {
detailDialogVisible.value = false
}
onMounted(() => {
getListData(1, 10);
});
</script>
<style lang="scss" scoped>
.page {
height: calc(100vh - 80px);
// height: calc(100vh - 80px);
background-color: #ffffff;
border-radius: 30px 0 0 0;
overflow: hidden;
padding: 10vh;
.addbtn {
margin-bottom: 2vh;
}
.formData {
padding: 5vh 3vh;
}
.pagination {
position: fixed;
left: 55%;
bottom: 8vh;
transform: translateX(-50%);
border-radius: 5px;
padding: 10px 20px;
z-index: 99;
transition: all 0.3s;
cursor: pointer;
&:hover {
background-color: #b8b8b873;
}
}
}
</style>

+ 161
- 0
src/views/userManage/userMouldList.vue 파일 보기

@@ -0,0 +1,161 @@
<template>
<div class="page justify-around">
<div class="addbtn">
<el-form :inline="true" :model="formInline" class="demo-form-inline">
<el-form-item label="手机号">
<el-input v-model="formInline.phone" placeholder="请输入手机号" clearable />
</el-form-item>
<el-form-item label="模版号">
<el-input v-model="formInline.mouldSmIdLike" placeholder="请输入模版号" clearable />
</el-form-item>
<el-form-item>
<el-button type="primary" @click="getListData"><el-icon><i-ep-plus /></el-icon> 查询</el-button>
</el-form-item>
</el-form>
</div>
<el-table
:data="tableData"
style="width: 100%; height: 90%"
size="large"
align="center"
border
>
<el-table-column
prop="name"
label="模板信息"
align="center"
/>
<el-table-column
prop="address"
label="手机号"
align="center"
/>
<el-table-column
prop="createDate"
label="注册时间"
align="center"
>
<template #default="scope">
{{ getDate(scope.row.createDate) }}
</template>
</el-table-column>
</el-table>
<!-- 登录账号 -->
<div class="pagination">
<el-pagination
v-model:current-page="pageNum"
v-model:page-size="pageSize"
:page-sizes="[10, 50, 100]"
:small="false"
:disabled="false"
:background="true"
layout="total, sizes, prev, pager, next, jumper"
:total="total"
@size-change="handleSizeChange"
@current-change="handleCurrentChange"
/>
</div>
</div>
</template>
<!-- videoType==1为竖,==2为横 -->
<script setup>
//#region 导入

import { userMouldListApi } from '@/apis/userManage.js'
import { useI18n } from "vue-i18n";
import dayjs from "dayjs";
import { useRoute, useRouter } from "vue-router";
const route = useRoute();
const router = useRouter();
const { locale } = useI18n();
const lanChange = ref(locale);
const tableData = ref([]);
const pageNum = ref(1);
const pageSize = ref(10);
const total = ref(0);
const getDate = (val) => {
return dayjs(val).format("YYYY-MM-DD");
};
const handleSizeChange = (val) => {
pageSize.value = val;
getListData(pageNum.value, pageSize.value);
};
const handleCurrentChange = (val) => {
pageNum.value = val;
getListData(pageNum.value, pageSize.value);
};

const formInline = ref({
phone: '',
mouldSmIdLike: ''
})
const getListData = async (PageNum, PageSize) => {
try {
let data = {
PageNum: PageNum || 1,
PageSize: PageSize || 10,
phone: formInline.phone,
mouldSmIdLike: formInline.mouldSmIdLike
}
const res = await userMouldListApi(data);
console.log(res, "res");
tableData.value = res.data.list;
total.value = res.data.total * 1;
} catch (error) {
console.log(error, "err");
}
};

onMounted(() => {
getListData(1, 10);
});
</script>
<style lang="scss" scoped>
.page {
height: calc(100vh - 80px);
// height: calc(100vh - 80px);
background-color: #ffffff;
border-radius: 30px 0 0 0;
overflow: hidden;
padding: 10vh;
.addbtn {
margin-bottom: 2vh;
}
.formData {
padding: 5vh 3vh;
}
.pagination {
position: fixed;
left: 55%;
bottom: 8vh;
transform: translateX(-50%);
border-radius: 5px;
padding: 10px 20px;
z-index: 99;
transition: all 0.3s;
cursor: pointer;
&:hover {
background-color: #b8b8b873;
}
}
}
</style>

+ 160
- 0
src/views/userManage/userVoiceList.vue 파일 보기

@@ -0,0 +1,160 @@
<template>
<div class="page justify-around">
<div class="addbtn">
<el-form :inline="true" :model="formInline" class="demo-form-inline">
<el-form-item label="手机号">
<el-input v-model="formInline.phone" placeholder="请输入手机号" clearable />
</el-form-item>
<el-form-item label="模版号">
<el-input v-model="formInline.mouldSmIdLike" placeholder="请输入模版号" clearable />
</el-form-item>
<el-form-item>
<el-button type="primary" @click="getListData"><el-icon><i-ep-plus /></el-icon> 查询</el-button>
</el-form-item>
</el-form>
</div>

<el-table
:data="tableData"
style="width: 100%; height: 90%"
size="large"
align="center"
border
>
<el-table-column
prop="name"
label="声纹信息"
align="center"
/>

<el-table-column
prop="address"
label="手机号"
align="center"
/>

<el-table-column
prop="createDate"
label="注册时间"
align="center"
>
<template #default="scope">
{{ getDate(scope.row.createDate) }}
</template>
</el-table-column>
</el-table>
<!-- 登录账号 -->
<div class="pagination">
<el-pagination
v-model:current-page="pageNum"
v-model:page-size="pageSize"
:page-sizes="[10, 50, 100]"
:small="false"
:disabled="false"
:background="true"
layout="total, sizes, prev, pager, next, jumper"
:total="total"
@size-change="handleSizeChange"
@current-change="handleCurrentChange"
/>
</div>
</div>
</template>

<!-- videoType==1为竖,==2为横 -->
<script setup>
//#region 导入

import { userVoiceListAPi } from '@/apis/userManage.js'

import { useI18n } from "vue-i18n";

import dayjs from "dayjs";

import { useRoute, useRouter } from "vue-router";

const route = useRoute();
const router = useRouter();
const { locale } = useI18n();
const lanChange = ref(locale);

const tableData = ref([]);
const pageNum = ref(1);
const pageSize = ref(10);
const total = ref(0);

const getDate = (val) => {
return dayjs(val).format("YYYY-MM-DD");
};

const handleSizeChange = (val) => {
pageSize.value = val;
getListData(pageNum.value, pageSize.value);
};

const handleCurrentChange = (val) => {
pageNum.value = val;
getListData(pageNum.value, pageSize.value);
};

const formInline = ref({
phone: '',
mouldSmIdLike: ''
})

const getListData = async (PageNum, PageSize) => {
try {
let data = {
PageNum: PageNum || 1,
PageSize: PageSize || 10,
phone: formInline.phone,
mouldSmIdLike: formInline.mouldSmIdLike
}
const res = await userVoiceListAPi(data);
console.log(res, "res");
tableData.value = res.data.list;
total.value = res.data.total * 1;
} catch (error) {
console.log(error, "err");
}
};


onMounted(() => {
getListData(1, 10);
});
</script>

<style lang="scss" scoped>
.page {
height: calc(100vh - 80px);
// height: calc(100vh - 80px);
background-color: #ffffff;
border-radius: 30px 0 0 0;
overflow: hidden;
padding: 10vh;
.addbtn {
margin-bottom: 2vh;
}
.formData {
padding: 5vh 3vh;
}

.pagination {
position: fixed;
left: 55%;
bottom: 8vh;
transform: translateX(-50%);
border-radius: 5px;
padding: 10px 20px;
z-index: 99;
transition: all 0.3s;
cursor: pointer;
&:hover {
background-color: #b8b8b873;
}
}
}
</style>

+ 262
- 0
src/views/userManage/videoList.vue 파일 보기

@@ -0,0 +1,262 @@
<template>
<div class="page justify-around">
<div class="addbtn">
<el-form :inline="true" :model="formInline" class="demo-form-inline">
<el-form-item label="手机号">
<el-input v-model="formInline.phone" placeholder="请输入手机号" clearable />
</el-form-item>
<el-form-item label="文本">
<el-input v-model="formInline.paperwork" placeholder="请输入模版号" clearable />
</el-form-item>
<el-form-item label="类型">
<el-select
v-model="formInline.videoType"
placeholder="请选择类型"
clearable
>
<el-option label="竖版" value="1" />
<el-option label="横板" value="2" />
</el-select>
</el-form-item>
<el-form-item label="状态">
<el-select
v-model="formInline.isDel"
placeholder="请选择状态"
clearable
>
<el-option label="未删除" value="0" />
<el-option label="已删除" value="1" />
</el-select>
</el-form-item>
<el-form-item label="创建时间段">
<el-date-picker
v-model="formInline.time"
type="daterange"
range-separator="To"
start-placeholder="Start date"
end-placeholder="End date"
/>
</el-form-item>
<el-form-item>
<el-button type="primary" @click="getListData"><el-icon><i-ep-plus /></el-icon> 查询</el-button>
</el-form-item>
</el-form>
</div>
<el-table
:data="tableData"
style="width: 100%; height: 90%"
size="large"
align="center"
border
>
<el-table-column
prop="name"
label="类型"
align="center"
/>
<el-table-column
prop="paperwork"
label="文本内容"
align="center"
/>
<el-table-column
prop="address"
label="状态"
align="center"
/>
<el-table-column
prop="title"
label="视频标题"
align="center"
/>
<el-table-column
prop="coverImg"
label="封面图"
align="center"
/>
<el-table-column
prop="videoPlayUrl"
label="视频地址"
align="center"
/>
<el-table-column
prop="videoTime"
label="视频时长"
align="center"
>
<template #default="scope">
{{ getDate(scope.row.videoTime) }}
</template>
</el-table-column>
<el-table-column
prop="videoSize"
label="视频大小"
align="center"
/>
<el-table-column
prop="videoMsg"
label="视频生成信息"
align="center"
/>
<el-table-column
prop="costPoints"
label="消耗金币"
align="center"
/>
<el-table-column
prop="costPointsDetail"
label="消耗金币明细"
align="center"
/>
<el-table-column
prop="createDate"
label="创建时间"
align="center"
>
<template #default="scope">
{{ getDate(scope.row.createDate) }}
</template>
</el-table-column>

<el-table-column
fixed="right"
:label="$t('keyMangage.operations')"
width="400"
align="center"
>
<template #default="scope">
<el-button link type="primary" size="small" @click="showDetail(scope.row.id)">查看</el-button>
<el-button link type="primary" size="small" @click="confirmDel(scope.row.id)">删除</el-button>
</template>
</el-table-column>
</el-table>
<!-- 登录账号 -->
<div class="pagination">
<el-pagination
v-model:current-page="pageNum"
v-model:page-size="pageSize"
:page-sizes="[10, 50, 100]"
:small="false"
:disabled="false"
:background="true"
layout="total, sizes, prev, pager, next, jumper"
:total="total"
@size-change="handleSizeChange"
@current-change="handleCurrentChange"
/>
</div>
</div>
</template>
<script setup>
//#region 导入
import { videoListApi, videoListFindByIdApi, videoListDelApi } from '@/apis/userManage.js'
import { useI18n } from "vue-i18n";
import dayjs from "dayjs";
import { useRoute, useRouter } from "vue-router";
const route = useRoute();
const router = useRouter();
const { locale } = useI18n();
const lanChange = ref(locale);
const tableData = ref([]);
const pageNum = ref(1);
const pageSize = ref(10);
const total = ref(0);
const getDate = (val) => {
return dayjs(val).format("YYYY-MM-DD HH:mm:ss");
};
const handleSizeChange = (val) => {
pageSize.value = val;
getListData(pageNum.value, pageSize.value);
};
const handleCurrentChange = (val) => {
pageNum.value = val;
getListData(pageNum.value, pageSize.value);
};
const formInline = ref({
phone: '',
productTitle: '',
time: ''
})
const getListData = async (PageNum, PageSize) => {
try {
let data = {
PageNum: PageNum || 1,
PageSize: PageSize || 10,
phone: formInline.phone,
projectType: 2,
productTitle: formInline.productTitle,
startDate: formInline.time ? formInline.time[0] : '',
endDate: formInline.time ? formInline.time[1] : '',
id: route.query.id || ''
}
const res = await videoListApi(data);
tableData.value = res.data.list;
total.value = res.data.total * 1;
} catch (error) {
console.log(error, "err");
}
};
function confirmDel(id) {
ElMessageBox.confirm('你确定要删除吗?').then(() => {
videoListDelApi(id).then(res => {
debugger
})
done()
}).catch(() => {
// catch error
})
}
onMounted(() => {
getListData(1, 10);
});
</script>
<style lang="scss" scoped>
.page {
height: calc(100vh - 80px);
// height: calc(100vh - 80px);
background-color: #ffffff;
border-radius: 30px 0 0 0;
overflow: hidden;
padding: 10vh;
.addbtn {
margin-bottom: 2vh;
}
.formData {
padding: 5vh 3vh;
}
.pagination {
position: fixed;
left: 55%;
bottom: 8vh;
transform: translateX(-50%);
border-radius: 5px;
padding: 10px 20px;
z-index: 99;
transition: all 0.3s;
cursor: pointer;
&:hover {
background-color: #b8b8b873;
}
}
}
</style>

+ 87
- 0
src/views/userManage/voiceMould.vue 파일 보기

@@ -0,0 +1,87 @@
<template>
<div>
<el-checkbox-group v-model="checkboxGroup" size="small" class="checkbox">
<el-checkbox v-for="(item, index) in tableData" :key="index" :label="item.id" border>
<img :src="item.coverImg" width="50" />
<p>{{ item.title }}</p>
</el-checkbox>
</el-checkbox-group>
<div style="margin-top: 20px">
<el-button @click="handleClose"
>取消</el-button
>
<el-button type="primary" @click="addModel()">确认关联</el-button>
</div>
</div>
</template>

<script setup>
import { ref } from 'vue'
import { voiceMouldListApi, userVoiceIdListApi, associatedUserVoicesApi } from '@/apis/userManage.js'
import dayjs from "dayjs";

const emit = defineEmits(["close"]);
const props = defineProps({
serviceId: {
required: true,
}
});

const getDate = (val) => {
return dayjs(val).format("YYYY-MM-DD");
};

const checkboxGroup = ref([])
const total = ref(0);
const tableData = ref([]);

const modelAllListFunc = async () => {
try {
const res = await voiceMouldListApi(1, 10000);
const modelIds = await userVoiceIdListApi(props.serviceId);
tableData.value = res.data.list;
total.value = res.data.total * 1;
setTimeout(()=> {
if(modelIds.data && modelIds.data.length > 0) {
modelIds.data.forEach((item) => {
checkboxGroup.value.push(item)
})
}
}, 500)

} catch (error) {
console.log(error, "err");
}
};

const addModel = async () => {
const data = {
mouldIds: checkboxGroup.value,
cUserId: props.serviceId
}
const res = await associatedUserVoicesApi(data);
if(res.code === 200) {
ElMessage.success("关联成功!");
handleClose()
}
};

function handleClose() {
emit("close");
}
onMounted(() => {
modelAllListFunc(1, 10);
});
</script>

<style lang="scss" scoped>
.checkbox {
max-height: 500px;
overflow: auto;
:deep .el-checkbox.el-checkbox--small {
width: 110px;
height:110px;
margin-bottom: 10px;
}
}
</style>

+ 30
- 2
src/views/video/index.vue 파일 보기

@@ -1,6 +1,6 @@
<template>
<div class="page justify-around">
<el-alert :title="`已消耗总时长:${crrentVideoToal}`" type="success" :closable="false" />
<el-table
:data="tableData"
style="width: 100%; height: 90%"
@@ -36,6 +36,17 @@
{{ getDate(scope.row.createTime) }}
</template>
</el-table-column>

<el-table-column
fixed="right"
:label="$t('keyMangage.operations')"
width="400"
align="center"
>
<template #default="scope">
<el-button link type="primary" size="small" @click="showDetail(scope.row.id)">查看视频详情</el-button>
</template>
</el-table-column>
</el-table>
<div class="pagination">
@@ -58,7 +69,7 @@
<!-- videoType==1为竖,==2为横 -->
<script setup>
//#region 导入
import { videoListApi } from '@/apis/home.js'
import { videoListApi,currentVideoToalApi } from '@/apis/home.js'
import { useI18n } from "vue-i18n";
@@ -78,6 +89,16 @@
const getDate = (val) => {
return dayjs(Number(val)).format("YYYY-MM-DD HH:mm:ss");
};

// 跳转视频列表
const showDetail = (id) => {
router.push({
path: "/videoList",
query: {
id,
},
});
};
const handleSizeChange = (val) => {
pageSize.value = val;
@@ -109,7 +130,14 @@
},
});
}
const crrentVideoToal = ref('')
function getCrrentVideoToal() {
currentVideoToalApi().then(res => {
// TODO
})
}
onMounted(() => {
getCrrentVideoToal()
getBusinessListFunc(1, 10);
});
</script>


불러오는 중...
취소
저장