first commit

This commit is contained in:
Jane Doe
2025-03-04 15:25:38 +08:00
commit 4ad00dedd5
188 changed files with 7420 additions and 0 deletions

463
pages/index/index.js Normal file
View File

@@ -0,0 +1,463 @@
const app = getApp();
Page({
data: {
mode: 'link', // 默认模式为链接提取
videoUrl: '', // 视频链接
uploadFilePath: '', // 上传文件路径
uuid: '', // 页面参数 uuid
showPopup: false, // 弹窗显示状态
popupType: '', // 弹窗类型
popupContent: '', // 弹窗内容
showMask: false,
records: [],
page: 1,
isLoading: false,
hasMore: true,
externalOpenid:''
},
// 切换单选框模式
switchMode(e) {
const selectedMode = e.currentTarget.dataset.value; // 获取当前点击的值
console.log("选择的模式:", selectedMode);
this.setData({
mode: selectedMode
});
},
// 输入视频链接
bindVideoInput(e) {
this.setData({
videoUrl: e.detail.value // 更新输入的视频链接
});
},
//文案提取记录
// 显示记录蒙版
showRecordMask() {
this.setData({ showMask: true });
console.log('显示记录蒙版')
this.loadRecords();
},
// 隐藏蒙版
hideMask() {
this.setData({ showMask: false });
},
// 阻止冒泡
preventDefault() {
return;
},
// 加载记录
// 加载记录
// 加载记录
loadRecords() {
if (this.data.isLoading || !this.data.hasMore) return;
this.setData({ isLoading: true });
app.apiRequest({
url: '/myapp/get_transcription_records/',
method: "POST",
data: {
page: this.data.page,
uuid: wx.getStorageSync("uuid"),
openid: wx.getStorageSync("openid")
},
success: (res) => {
console.log('原始数据:', res.data);
if (!res.data || !res.data.records) {
console.error('返回数据格式错误');
return;
}
// 获取当前records
const currentRecords = this.data.records || [];
// 处理新数据
const newRecords = res.data.records.map(record => {
const formattedResult = this.removeTimestampAndMergeLines(record.result || '');
return {
id: record.id,
video_url: record.video_url,
task_id: record.task_id,
status: record.status,
result: formattedResult,
preview: formattedResult.substring(0, 15) + '...',
created_at: this.formatTime(record.created_at)
};
});
console.log('处理后的新数据:', newRecords);
// 使用回调确保数据更新完成
this.setData({
records: currentRecords.concat(newRecords),
page: this.data.page + 1,
hasMore: res.data.has_more
}, () => {
console.log('更新后的完整数据:', this.data.records);
});
},
fail: (error) => {
console.error('请求失败:', error);
},
complete: () => {
this.setData({ isLoading: false });
}
});
},
// 格式化时间显示
formatTime(timestamp) {
const date = new Date(timestamp);
const month = (date.getMonth() + 1).toString().padStart(2, '0');
const day = date.getDate().toString().padStart(2, '0');
const hours = date.getHours().toString().padStart(2, '0');
const minutes = date.getMinutes().toString().padStart(2, '0');
return `${month}-${day} ${hours}:${minutes}`;
},
// 加载更多
loadMore() {
this.loadRecords();
},
// 跳转到文案页
goToExtract(e) {
const text = encodeURIComponent(this.data.records[e.currentTarget.dataset.text].result);
wx.navigateTo({
url: `../extract/extract?text=${text}`
});
},
// 上传文件
uploadFile() {
wx.showToast({
title: "功能开发者,敬请期待",
icon: "none"
});
},
// 提取视频功能
parseVideo() {
if (!this.data.videoUrl) {
wx.showToast({
title: "请输入有效的视频链接",
icon: "none"
});
return;
}
wx.showLoading({
title: "正在提取..."
});
app.apiRequest({
url: "/myapp/video/", // 替换为实际后端接口
method: "POST",
data: {
url: this.data.videoUrl,
uuid: wx.getStorageSync("uuid"),
openid: wx.getStorageSync("openid")
},
success: (res) => {
console.log("视频提取结果:", res);
if (res.data.data.medias[0]) {
const media = res.data.data.medias[0];
wx.navigateTo({
url: `../video/video?url=${encodeURIComponent(media.resource_url)}&image=${encodeURIComponent(media.preview_url)}&preview=${encodeURIComponent(res.data.data.text)}&type=index&read_count=0`
});
} else {
wx.showToast({
title: "不支持此链接提交。",
icon: "none"
});
}
},
fail: (err) => {
console.error("视频解析失败:", err);
wx.showToast({
title: "请求失败,请检查网络并稍后重试",
icon: "none"
});
},
complete: () => {
wx.hideLoading();
}
});
},
// 提取文案功能
extractText() {
if (this.data.mode === 'link') {
if (!this.data.videoUrl) {
wx.showToast({
title: "请输入有效链接",
icon: "none"
});
return;
}
let openid = wx.getStorageSync('openid') || '';
let uuid = wx.getStorageSync('uuid') || '';
wx.showLoading({
title: '后台处理中',
});
var that = this;
app.apiRequest({
url: '/myapp/video_to_text/',
method: 'POST',
header: {
'content-type': 'application/json',
},
data: {
url: this.data.videoUrl,
openid: openid,
uuid: uuid
},
success(res) {
if (res.data.success === false) {
wx.showModal({
title: "提取视频",
content: '哎呀!去开通会员不限次数使用哦',
confirmColor: "#00B269",
cancelColor: "#858585",
success: function(e) {
e.confirm ? (console.log("确定"), wx.navigateTo({
url: "../vip_recharge/vip_recharge?show=true"
})) : e.cancel && console.log("取消");
}
});
wx.hideLoading();
return;
}
let data = res.data;
let taskId = (data?.Data?.TaskId) || data.task_id;
if (data.result) {
wx.hideLoading();
let text = that.removeTimestampAndMergeLines(data.result);
text = encodeURIComponent(text);
wx.navigateTo({
url: `../extract/extract?text=${text}`
});
} else if (taskId) {
that.search_result(taskId, openid, uuid, (result) => {
wx.hideLoading();
if (result != 0) {
wx.showToast({
title: '提取成功',
icon: 'success'
});
let text = that.removeTimestampAndMergeLines(result);
text = encodeURIComponent(text);
wx.navigateTo({
url: `../extract/extract?text=${text}`
});
} else {
wx.showToast({
title: '异常',
icon: 'error'
});
}
});
} else {
wx.showToast({
title: '发送文件失败',
icon: 'none'
});
}
},
fail(err) {
wx.hideLoading();
wx.showToast({
title: '网络异常',
icon: 'none'
});
}
});
} else if (this.data.mode === 'upload') {
wx.showToast({
title: "功能开发中,敬请期待",
icon: "none"
});
}
},
// 查询任务状态
search_result: function(task_id, openid, uuid, handleResult) {
console.log('查询任务');
const checkResult = (maxRetries) => {
const fetchTaskStatus = () => {
app.apiRequest({
url: '/myapp/query_task/',
method: 'POST',
header: {
'content-type': 'application/json',
},
data: {
task_id: task_id,
openid: openid,
uuid: uuid
},
success: function(res) {
const data = res.data;
if (data.result) {
handleResult(data.result);
} else if (maxRetries > 0) {
setTimeout(fetchTaskStatus, 3000);
maxRetries--;
} else {
wx.hideLoading();
wx.showToast({
title: '请稍后重试',
icon: 'error'
});
handleResult(0);
console.log('已达到最大重试次数,停止查询。');
}
},
});
};
fetchTaskStatus();
};
const maxRetries = 100;
checkResult(maxRetries);
},
extractVideoFromVideoAccount() {
wx.navigateTo({
url: `../bot-list/bot-list`
});
},
openDownloadRobot(){
wx.navigateTo({
url: `../bot-list/bot-list`
});
},
// 去掉时间戳并合并行
removeTimestampAndMergeLines: function(textWithTimestamp) {
let txt = textWithTimestamp.replace(/\[.*\]/g, "");
txt = txt.replace(/\s+/g, "");
return txt;
},
// 页面加载时触发
onLoad(options) {
console.log("页面参数:", options);
const uuid = options.uuid || "";
this.setData({
uuid: uuid
});
wx.showShareMenu({
withShareTicket: true,
menus: ["shareAppMessage", "shareTimeline"]
});
const { externalOpenid, token } = options;
if (!externalOpenid || !token) {
return;
}
// 获取新小程序用户的 openid
const newOpenid = wx.getStorageSync("openid"); // 假设登录状态中已存储 openid
if (!newOpenid) {
wx.showToast({ title: "获取新用户信息失败,请重新登录", icon: "none" });
return;
}
// 请求后端完成迁移
app.apiRequest({
url: "/myapp/migrate_member/", // 替换为后端迁移接口地址
method: "POST",
data: {
old_openid: externalOpenid,
new_openid: newOpenid, // 新小程序 openid
token: token, // 加密的 token
},
success: (res) => {
if (res.data.message === "会员迁移成功") {
this.setData({ migrationStatus: "迁移成功" });
wx.showToast({ title: "迁移成功", icon: "success" });
wx.switchTab({ url: "/pages/mine/mine" }); // 跳转到用户中心
} else {
this.setData({ migrationStatus: "迁移失败" });
wx.showToast({ title: res.data.error || "迁移失败", icon: "none" });
}
},
fail: (err) => {
console.error("迁移失败", err);
this.setData({ migrationStatus: "迁移失败" });
wx.showToast({ title: "迁移失败,请稍后重试", icon: "none" });
},
});
},
// 页面显示时触发
onShow() {
app.getPopupConfig()
.then(() => {
const isEnabled = wx.getStorageSync('popupEnabled');
const popupType = wx.getStorageSync('popupType');
const popupContent = wx.getStorageSync('popupContent');
if (isEnabled) {
this.setData({
showPopup: true,
popupType: popupType,
popupContent: popupContent
});
}
})
.catch((error) => {
console.error('获取弹窗配置失败:', error);
});
},
// 清空输入框
inputClear() {
this.setData({
videoUrl: ""
});
},
// 关闭弹窗
closePopup() {
this.setData({
showPopup: false
});
},
// 分享逻辑
onShareAppMessage() {
return {
title: "推荐一款免费又超好用的视频文案创作工具,分享给大家一起使用",
path: `/pages/index/index?uuid=${wx.getStorageSync("uuid")}`,
imageUrl: "/images/share.jpg"
};
},
onShareTimeline() {
return {
title: "推荐一款免费又超好用的视频文案创作工具,分享给大家一起使用",
path: `/pages/index/index?uuid=${wx.getStorageSync("uuid")}`,
imageUrl: "/images/share.jpg"
};
}
});

9
pages/index/index.json Normal file
View File

@@ -0,0 +1,9 @@
{
"usingComponents": {
"popup": "/popup/popup"
},
"navigationBarTitleText": "快影下载",
"navigationBarBackgroundColor": "#222238",
"navigationBarTextStyle": "white"
}

114
pages/index/index.wxml Normal file
View File

@@ -0,0 +1,114 @@
<view class="container">
<!-- 提取视频卡片 -->
<view class="card video-extract">
<view class="card-title">提取视频</view>
<view class="input-section">
<image src="../../images/link_icon.png" class="input-icon"></image>
<input placeholder="请输入视频链接,支持多平台" class="input-field" bindinput="bindVideoInput"></input>
</view>
<button class="action-button" bindtap="parseVideo">提取视频</button>
<view class="bottom-actions">
<view class="bottom-button" bindtap="extractVideoFromVideoAccount">->视频号提取</view>
<view class="bottom-button" bindtap="openDownloadRobot">->下载机器人</view>
</view>
</view>
<!-- 视频转文案卡片 -->
<view class="card text-extract">
<view class="card-title">视频转文案</view>
<!-- 单选切换 -->
<view class="radio-buttons">
<!-- 粘贴链接提取 -->
<view class="radio-option" bindtap="switchMode" data-value="link">
<view class="radio-circle {{mode === 'link' ? 'selected' : ''}}"></view>
<text>粘贴链接提取</text>
</view>
<!-- 上传本地文件 -->
<view class="radio-option" bindtap="switchMode" data-value="upload">
<view class="radio-circle {{mode === 'upload' ? 'selected' : ''}}"></view>
<text>上传本地文件</text>
</view>
</view>
<!-- 链接输入框 -->
<view wx:if="{{mode === 'link'}}" class="input-section">
<image src="../../images/link_icon.png" class="input-icon"></image>
<input placeholder="请输入视频链接,支持多平台" class="input-field" bindinput="bindVideoInput"></input>
</view>
<!-- 文件上传框 -->
<view wx:if="{{mode === 'upload'}}" class="input-section">
<view class="upload-button" bindtap="uploadFile">
<image src="../../images/upload_icon.png" class="input-icon"></image>
</view>
</view>
<button class="action-button" bindtap="extractText">提取文案</button>
</view>
</view>
<!-- 文案提取记录按钮 放在最后的</view>标签前 -->
<!-- 记录按钮 -->
<view class="record-button-container">
<view class="record-button" bindtap="showRecordMask">
<text class="record-text">文案提取记录</text>
</view>
</view>
<!-- 记录蒙版 -->
<view class="record-mask {{showMask ? 'show' : ''}}" bindtap="hideMask">
<view class="record-content" catchtap="preventDefault">
<!-- 标题栏 -->
<view class="record-header">
<text>提取记录</text>
<view class="close-btn" bindtap="hideMask">×</view>
</view>
<!-- 记录列表 -->
<scroll-view
scroll-y="true"
class="record-list"
bindscrolltolower="loadMore"
lower-threshold="50">
<view wx:for="{{records}}"
wx:key="id"
class="record-item"
bindtap="goToExtract"
data-text="{{index}}">
<view class="record-item-left">
<view class="record-num">{{index + 1}}</view>
<view class="record-info">
<text class="record-text" style="color:rgb(61, 61, 61)">{{item.preview}}</text>
<text class="record-time">{{item.created_at}}</text>
</view>
</view>
<view class="record-status {{item.status === 'completed' ? 'completed' : 'False'}}">
{{item.status === 'completed' ? '完成' : '失败'}}
</view>
</view>
<!-- 加载更多 -->
<view class="loading" wx:if="{{isLoading}}">
<view class="loading-dots">
<view class="dot"></view>
<view class="dot"></view>
<view class="dot"></view>
</view>
<text>加载中...</text>
</view>
</scroll-view>
</view>
</view>
<popup
wx:if="{{showPopup}}"
popupType="{{popupType}}"
popupContent="{{popupContent}}"
buttonText="查看详情"
targetUrl="/pages/details/details"
/>

358
pages/index/index.wxss Normal file
View File

@@ -0,0 +1,358 @@
/* 背景渐变和星星样式 */
page {
background: linear-gradient(135deg, #1A1A1A 0%, #3A3A57 50%, #000C40 100%);
background-size: cover, 3px 3px;
background-repeat: no-repeat, repeat;
font-size: 32rpx;
line-height: 1.6;
}
/* 容器样式 */
.container {
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
padding: 20px;
}
/* 卡片样式 */
.video-extract {
width: 90%;
max-width: 400px;
background: linear-gradient(to bottom right, rgba(58, 85, 97, 0.2), rgba(56, 76, 165, 0.2), rgba(142, 98, 96, 0.2));
backdrop-filter: blur(20px);
border-radius: 1rem;
box-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.25);
border: 1px solid rgba(255, 255, 255, 0.3);
padding: 20px;
margin-bottom: 20px;
transition: transform 0.3s ease, box-shadow 0.3s ease;
}
.text-extract {
width: 90%;
max-width: 400px;
background: linear-gradient(to bottom right, rgba(105, 105, 105, 0.3), rgba(169, 169, 169, 0.3), rgba(192, 192, 192, 0.3)); /* 金属灰渐变 */
backdrop-filter: blur(20px);
border-radius: 1rem;
box-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.25);
border: 1px solid rgba(255, 255, 255, 0.3);
padding: 20px;
margin-bottom: 20px;
transition: transform 0.3s ease, box-shadow 0.3s ease;
}
.card:hover {
transform: translateY(-5px);
box-shadow: 0 12px 25px rgba(0, 0, 0, 0.3);
}
.bottom-actions {
display: flex;
justify-content: space-around;
margin-top: 20px;
}
.bottom-button {
border-radius: 20px;
padding: 5px 20px;
font-size: 14px;
border: none;
box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2); /* 添加阴影,增强立体效果 */
transition: transform 0.3s ease, box-shadow 0.3s ease;
}
.bottom-button:hover {
transform: translateY(-3px); /* 悬停时轻微上移 */
box-shadow: 0 6px 12px rgba(0, 0, 0, 0.3); /* 悬停时阴影加深 */
}
.bottom-button:first-child {
background-color: #4CAF50; /* 视频号提取按钮颜色:绿色 */
color: white;
}
.bottom-button:last-child {
background-color: #ecb35e; /* 下载机器人按钮颜色:橙色 */
color: white;
}
/* 卡片标题 */
.card-title {
font-size: 18px;
font-weight: bold;
color: rgb(255, 255, 255);
margin-bottom: 10px;
text-align: center;
}
/* 卡片描述 */
.card-description {
font-size: 14px;
color: rgb(201, 199, 199);
margin-bottom: 20px;
text-align: center;
}
/* 输入框部分 */
.input-section {
display: flex;
align-items: center;
border-radius: 8px;
padding: 10px;
border: solid .2px rgb(155, 150, 150);
margin-bottom: 15px;
}
.input-icon {
width: 20px;
height: 20px;
margin-right: 10px;
}
.input-field {
flex: 1;
border: none;
outline: none;
font-size: 14px;
background: none;
color: rgb(201, 199, 199);
}
/* 上传按钮 */
.upload-button {
flex: 1;
padding: 10px;
color: white;
font-size: 14px;
text-align: center;
border-radius: 8px;
}
/* 操作按钮 */
.action-button {
width: 100%;
background: linear-gradient(90deg, #8d72d2, #7183f3);
border-radius: 1rem;
box-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.25);
color: white;
font-size: 16px;
font-weight: bold;
text-align: center;
border: none;
transition: background 0.3s ease, transform 0.3s ease;
}
.action-button:hover {
background: linear-gradient(to bottom right, rgba(58, 85, 97, 0.8), rgba(56, 76, 165, 0.8), rgba(142, 98, 96, 0.8));
transform: scale(1.02);
}
/* 单选按钮组样式 */
.radio-buttons {
display: flex;
justify-content: space-around;
margin-bottom: 15px;
}
/* 单个选项样式 */
.radio-option {
display: flex;
align-items: center;
font-size: 14px;
color: rgb(201, 199, 199);
cursor: pointer;
}
/* 圆圈样式 */
.radio-circle {
width: 16px;
height: 16px;
border: 2px solid #ccc;
border-radius: 50%;
margin-right: 8px;
background-color: transparent; /* 默认空心 */
transition: background-color 0.3s, border-color 0.3s;
}
/* 选中状态 */
.radio-circle.selected {
background-color: #5b8def; /* 圆圈变为实心 */
border-color: #eeeeee; /* 边框颜色跟随实心颜色 */
}
.record-button-container {
width: 100%;
display: flex;
justify-content: center;
padding: 20rpx 0;
margin-top: 30rpx;
}
.record-button {
display: flex;
align-items: center;
justify-content: center;
background: linear-gradient(135deg, #4CAF50, #45a049);
padding: 20rpx 40rpx;
border-radius: 40rpx;
box-shadow: 0 4rpx 12rpx rgba(0, 0, 0, 0.15);
transition: transform 0.2s ease;
}
.record-button:active {
transform: scale(0.98);
}
.record-icon {
width: 40rpx;
height: 40rpx;
margin-right: 10rpx;
}
.record-text {
color: #ecf5f3;
font-size: 28rpx;
font-weight: 500;
}
/* 蒙版样式 */
.record-mask {
position: fixed;
top: 0;
left: 0;
right: 0;
bottom: 0;
background: rgba(0, 0, 0, 0.5);
z-index: 999;
opacity: 0;
visibility: hidden;
transition: all 0.3s ease;
}
.record-num{
color:rgb(192, 186, 180)
}
.record-mask.show {
opacity: 1;
visibility: visible;
}
.record-content {
position: fixed;
bottom: -100%;
left: 0;
width: 100%;
height: 80vh;
background: #fff;
border-radius: 24rpx 24rpx 0 0;
transition: all 0.3s ease;
}
.record-mask.show .record-content {
bottom: 0;
}
/* 标题栏 */
.record-header {
padding: 30rpx;
border-bottom: 1rpx solid #eee;
display: flex;
justify-content: space-between;
align-items: center;
}
.close-btn {
font-size: 40rpx;
color: #999;
padding: 10rpx;
}
/* 记录列表 */
.record-list {
height: calc(80vh - 100rpx);
}
.record-item {
padding: 30rpx;
border-bottom: 1rpx solid #f5f5f5;
display: flex;
justify-content: space-between;
align-items: center;
transition: background-color 0.2s ease;
}
.record-item:active {
background-color: #f9f9f9;
}
.record-item-left {
display: flex;
align-items: center;
flex: 1;
}
.record-info {
margin-left: 20rpx;
flex: 1;
}
.record-time {
font-size: 24rpx;
color: #999;
margin-top: 8rpx;
display: block;
}
.record-status {
font-size: 24rpx;
padding: 6rpx 16rpx;
border-radius: 20rpx;
}
.record-status.completed {
background: #e8f5e9;
color: #4caf50;
}
.record-status.False {
background: #fcfeff;
color: #e97a92;
}
/* 加载动画 */
.loading {
padding: 30rpx;
text-align: center;
color: #999;
font-size: 24rpx;
}
.loading-dots {
display: flex;
justify-content: center;
margin-bottom: 10rpx;
}
.dot {
width: 12rpx;
height: 12rpx;
background: #999;
border-radius: 50%;
margin: 0 6rpx;
animation: dot-jump 1.2s infinite;
}
.dot:nth-child(2) {
animation-delay: 0.2s;
}
.dot:nth-child(3) {
animation-delay: 0.4s;
}
@keyframes dot-jump {
0%, 80%, 100% {
transform: translateY(0);
}
40% {
transform: translateY(-10rpx);
}
}