|
|
<template>
|
|
|
<div class="g_p_10 g_position_rela">
|
|
|
<div class="g_bg_f g_p_10 g_radius_8">
|
|
|
<u-line-progress class="g_position_abso" v-if="ailoading" style="position: fixed; width: 100%; top: -2px; left: 0px; z-index: 99999" active-color="#3578f6" :percent="defaultPercent" :round="false" height="8" :show-percent="false" inactiveColor="#f5f5f5"></u-line-progress>
|
|
|
<gao-ChatSSEClient ref="sseTest" @onOpen="openCore" @onError="errorCore" @onMessage="messageCore" @onFinish="finishCore" />
|
|
|
<div class="g_pb_8" v-if="currentImg" @click="currentImg = ''">
|
|
|
<img :src="currentImg" class="g_w_48 g_h_48 g_radius_8" alt />
|
|
|
</div>
|
|
|
<textarea class data-type="desp" v-model="aitext" placeholder="粘贴工友信息, 用AI识别 " placeholder-style="color:#999" :maxlength="-1" :style="{ width: '100%', 'min-height': true ? '104px' : '104px' }"></textarea>
|
|
|
<div class>
|
|
|
<view class="g_flex_row_end flex_center">
|
|
|
<view class="iconfont icon-jia1 g_c_9 g_mr_8 g_fs_20 g_position_rela biggerSize" @click="chooseImgShow = true"></view>
|
|
|
<view class="g_mr_8 g_w_72 g_fw_600">
|
|
|
<g-button size="small_auto" type="none" height="24" :fontSize="12" @clickBtn="getClipboard" :btnText="(aitext ? '清空' : '粘贴') + '内容'"></g-button>
|
|
|
</view>
|
|
|
<view class="g_w_72 g_fw_600">
|
|
|
<g-button size="small_auto" gradual="linear-gradient(-130deg, #5c6cf7, #9963f9)" icon="icon-aitubiao" type="gradual" height="24" :fontSize="12" btnText="AI识别" @clickBtn="getCoze"></g-button>
|
|
|
</view>
|
|
|
</view>
|
|
|
</div>
|
|
|
</div>
|
|
|
<u-popup v-model="chooseImgShow" mode="bottom" z-index="999999" border-radius="12" :closeable="false" :mask-close-able="true" @close="chooseImgShow = false">
|
|
|
<div class="g_text_c g_bg_f_5 g_fs_17">
|
|
|
<div class="g_bg_f">
|
|
|
<div class="g_c_3">
|
|
|
<div class="g_p_16 g_border_e_t" @click="uploadPhoto('camera')">拍照</div>
|
|
|
<div class="g_p_16 g_border_e_t" @click="uploadPhotoByChat">从会话上传</div>
|
|
|
<div class="g_p_16 g_border_e_t" @click="uploadPhoto('album')">从相册选择</div>
|
|
|
</div>
|
|
|
</div>
|
|
|
<div class="g_p_16 g_mt_10 g_bg_f" style="padding-bottom: calc(constant(safe-area-inset-bottom) + 16px); padding-bottom: calc(env(safe-area-inset-bottom) + 16px)" @click="chooseImgShow = false">取消</div>
|
|
|
</div>
|
|
|
</u-popup>
|
|
|
</div>
|
|
|
</template>
|
|
|
|
|
|
<script>
|
|
|
export default {
|
|
|
data() {
|
|
|
return {
|
|
|
aitext: "",
|
|
|
timer: null,
|
|
|
timer1: null,
|
|
|
defaultPercent: 0,
|
|
|
ailoading: false,
|
|
|
aiConfig: {
|
|
|
token: "",
|
|
|
id: "",
|
|
|
},
|
|
|
chooseImgShow: false,
|
|
|
currentImg: "",
|
|
|
};
|
|
|
},
|
|
|
created() {
|
|
|
this.getAiToken();
|
|
|
},
|
|
|
|
|
|
methods: {
|
|
|
openCore(respons) {
|
|
|
console.log("open sse：", respons);
|
|
|
},
|
|
|
errorCore(err) {
|
|
|
console.log("error sse：", err);
|
|
|
},
|
|
|
messageCore(msg) {
|
|
|
let that = this;
|
|
|
console.log("message sse：", msg);
|
|
|
if (msg.event == "Done") {
|
|
|
clearInterval(that.timer);
|
|
|
that.ailoading = false;
|
|
|
} else if (msg.event == "Message") {
|
|
|
let info = JSON.parse(msg.data);
|
|
|
if (info.node_type == "End") {
|
|
|
this.setInfo(info);
|
|
|
}
|
|
|
}
|
|
|
},
|
|
|
getAiToken() {
|
|
|
let that = this;
|
|
|
that.G.Get("/yishoudan/common/structure/getConfig", {}, (res) => {
|
|
|
console.log("res", res);
|
|
|
that.aiConfig = {
|
|
|
token: res.token,
|
|
|
id: res.workflowId,
|
|
|
};
|
|
|
});
|
|
|
},
|
|
|
uploadPhoto($sourceType) {
|
|
|
let that = this;
|
|
|
console.log("$sourceType", $sourceType);
|
|
|
uni.chooseImage({
|
|
|
count: 1, //默认9
|
|
|
sizeType: ["original"], //可以指定是原图还是压缩图，默认二者都有
|
|
|
sourceType: [$sourceType], //album 从相册选图，camera 使用相机
|
|
|
success: function (res) {
|
|
|
console.log("选取文件数据：", res);
|
|
|
that.uploadCozeFile(res.tempFilePaths[0]);
|
|
|
},
|
|
|
});
|
|
|
},
|
|
|
uploadCozeFile(tempFilePath) {
|
|
|
let that = this;
|
|
|
that.chooseImgShow = false;
|
|
|
that.currentImg = tempFilePath;
|
|
|
uni.uploadFile({
|
|
|
url: "https://api.coze.cn/v1/files/upload",
|
|
|
method: "POST",
|
|
|
filePath: tempFilePath,
|
|
|
name: "file",
|
|
|
header: {
|
|
|
Authorization: "Bearer " + that.aiConfig.token,
|
|
|
"Content-Type": "multipart/form-data",
|
|
|
},
|
|
|
formData: {},
|
|
|
success: function (res) {
|
|
|
console.log("文件", res);
|
|
|
let data = JSON.parse(res.data);
|
|
|
that.appCoze(data.data.id);
|
|
|
},
|
|
|
fail: function (err) {
|
|
|
console.log(err);
|
|
|
},
|
|
|
});
|
|
|
},
|
|
|
uploadPhotoByChat() {
|
|
|
let that = this;
|
|
|
uni.chooseMessageFile({
|
|
|
count: 1,
|
|
|
type: "image",
|
|
|
success(res) {
|
|
|
console.log("resresresresresres", res);
|
|
|
if (res.errMsg == "chooseMessageFile:ok") {
|
|
|
console.log("res", res);
|
|
|
that.uploadCozeFile(res.tempFiles[0].path);
|
|
|
}
|
|
|
},
|
|
|
});
|
|
|
},
|
|
|
getClipboard() {
|
|
|
let that = this;
|
|
|
if (this.aitext) {
|
|
|
this.aitext = "";
|
|
|
} else {
|
|
|
uni.getClipboardData({
|
|
|
success(res) {
|
|
|
console.log(res);
|
|
|
if (res.data) {
|
|
|
that.aitext = res.data;
|
|
|
} else {
|
|
|
uni.showToast({
|
|
|
title: "请先复制内容",
|
|
|
icon: "none",
|
|
|
});
|
|
|
}
|
|
|
},
|
|
|
fail() {
|
|
|
uni.showToast({
|
|
|
title: "读取剪切板失败",
|
|
|
icon: "none",
|
|
|
});
|
|
|
},
|
|
|
});
|
|
|
}
|
|
|
},
|
|
|
setInfo(parsed) {
|
|
|
let that = this;
|
|
|
const finalData = JSON.parse(parsed.content);
|
|
|
if (finalData) {
|
|
|
console.log("解析后的用户信息:", finalData);
|
|
|
let info = {
|
|
|
idCard: finalData.idcard,
|
|
|
address: finalData.address,
|
|
|
name: finalData.username,
|
|
|
nation: finalData.nation,
|
|
|
userName: finalData.username,
|
|
|
sex: finalData.sex ? (finalData.sex == "男" ? 1 : 2) : "",
|
|
|
age: finalData.age,
|
|
|
tel: finalData.tel,
|
|
|
};
|
|
|
// uni.$emit('getTownsman', { info })
|
|
|
that.$emit("outputInfo", info);
|
|
|
// 将解析后的信息填充到表单中
|
|
|
that.ailoading = false;
|
|
|
} else {
|
|
|
that.ailoading = false;
|
|
|
}
|
|
|
clearInterval(that.timer);
|
|
|
},
|
|
|
getCoze() {
|
|
|
let that = this;
|
|
|
if (!that.aitext) {
|
|
|
uni.showToast({
|
|
|
title: "请粘贴内容",
|
|
|
icon: "none",
|
|
|
});
|
|
|
return false;
|
|
|
}
|
|
|
|
|
|
this.appCoze();
|
|
|
},
|
|
|
appCoze(_id) {
|
|
|
let that = this;
|
|
|
let parameters = {};
|
|
|
// 重置内容
|
|
|
that.ailoading = true;
|
|
|
that.defaultPercent = 3;
|
|
|
|
|
|
that.timer = setInterval(() => {
|
|
|
that.defaultPercent = that.defaultPercent < 15 ? (that.defaultPercent = 15) : that.defaultPercent + 3;
|
|
|
// console.log('12313123123123123')
|
|
|
if (that.defaultPercent >= 99) {
|
|
|
clearInterval(that.timer);
|
|
|
}
|
|
|
}, 150);
|
|
|
that.timer1 = setTimeout(() => {
|
|
|
console.log("5687678678678678678");
|
|
|
that.ailoading = false;
|
|
|
clearInterval(that.timer);
|
|
|
// setLoading()
|
|
|
}, 30000);
|
|
|
if (_id) {
|
|
|
parameters = {
|
|
|
img: {
|
|
|
file_id: _id,
|
|
|
},
|
|
|
};
|
|
|
} else {
|
|
|
parameters = {
|
|
|
txt: that.aitext,
|
|
|
};
|
|
|
}
|
|
|
this.$refs.sseTest.startChat({
|
|
|
/**
|
|
|
* 将它换成你的地址
|
|
|
* 注意：
|
|
|
* 如果使用 sse-server.js 要在手机端使用的话，请确保你的手机和电脑处在一个局域网下并且是正常的ip地址
|
|
|
*/
|
|
|
url: "https://api.coze.cn/v1/workflow/stream_run",
|
|
|
// 请求头
|
|
|
headers: {
|
|
|
// that.aiConfig.token
|
|
|
Authorization: "Bearer " + that.aiConfig.token,
|
|
|
"Content-Type": "application/json",
|
|
|
},
|
|
|
// 默认为 post
|
|
|
method: "post",
|
|
|
body: {
|
|
|
parameters,
|
|
|
// workflow_id: that.aiConfig.id,
|
|
|
workflow_id: "7520814905613664310",
|
|
|
// workflow_id: '7492238568816656410',
|
|
|
},
|
|
|
});
|
|
|
},
|
|
|
ressetAitext() {
|
|
|
this.aitext = "";
|
|
|
},
|
|
|
},
|
|
|
};
|
|
|
</script>
|
|
|
|
|
|
<style></style>
|