| 123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294 |
- <!DOCTYPE html>
- <html lang="en">
- <head>
- <meta charset="UTF-8">
- <meta http-equiv="X-UA-Compatible" content="IE=edge">
- <meta name="viewport"
- content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no, viewport-fit=cover" />
- <title>智能总结</title>
- <!--引入 element-ui 的样式,-->
- <link rel="stylesheet"
- href="https://wl-1306604067.cos.ap-guangzhou.myqcloud.com/production/ct/103548289110001/1742018383195/element-ui.css">
- <!-- 必须先引入vue, 后使用element-ui -->
- <script
- src="https://wl-1306604067.cos.ap-guangzhou.myqcloud.com/production/ct/103548289110001/1742017957144/vue.js"></script>
- <!-- 引入element 的组件库-->
- <script
- src="https://wl-1306604067.cos.ap-guangzhou.myqcloud.com/production/ct/103548289110001/1742017747738/element-ui.js"></script>
- <script src="https://res.wx.qq.com/open/js/jweixin-1.6.0.js"></script>
- <script src="https://open.work.weixin.qq.com/wwopen/js/jwxwork-1.0.0.js"></script>
- <!-- <script src="js/vconsole.min.js"></script>
- <script>
- var vConsole = new window.VConsole();
- </script> -->
- </head>
- <style>
- body {
- margin: 0;
- padding: 0;
- }
- .box {
- width: 100vw;
- height: auto;
- box-sizing: border-box;
- background: linear-gradient(180deg, #FAFCFF 0%, #FAFAFA 100%);
- }
- .page6 {
- width: 100vw;
- height: 100vh;
- padding: 15px;
- box-sizing: border-box;
- }
- .ai_title {
- display: flex;
- align-items: center;
- font-weight: 500;
- font-size: 16px;
- color: #222222;
- padding-bottom: 10px;
- }
- .title_point {
- width: 4px;
- height: 4px;
- background: #1677FF;
- border-radius: 2px;
- margin-right: 5px;
- }
- .sum_content {
- font-weight: 400;
- font-size: 14px;
- line-height: 28px;
- background: #FFFFFF;
- color: #222222;
- padding: 15px;
- border-radius: 10px;
- margin-bottom: 15px;
- }
- .day_title {
- font-weight: 500;
- font-size: 14px;
- color: #1677FF;
- line-height: 28px;
- }
- .mater_title {
- font-weight: 500;
- font-size: 14px;
- color: #222222;
- line-height: 28px;
- }
- .mater_link {
- width: 100%;
- background: #FAFAFA;
- padding: 10px;
- border-radius: 10px;
- display: flex;
- align-items: center;
- box-sizing: border-box;
- }
- .mater_link img {
- width: 47px;
- height: 47px;
- border-radius: 5px;
- margin-right: 10px;
- }
- .link_content {
- display: flex;
- flex-direction: column;
- }
- .link_title {
- font-weight: 500;
- font-size: 14px;
- color: #222222;
- line-height: 20px;
- padding-bottom: 10px;
- }
- .link_des {
- font-weight: 400;
- font-size: 12px;
- color: #999999;
- line-height: 12px;
- }
- .model_img {
- width: 100%;
- height: auto;
- }
- .send_btn {
- background: #1677FF;
- border-radius: 10px;
- font-weight: 500;
- font-size: 16px;
- color: #FFFFFF;
- text-align: center;
- padding: 12px 0;
- line-height: 22px;
- margin-top: 15px;
- }
- .ok_btn {
- background: #CCCCCC;
- border-radius: 10px;
- font-weight: 500;
- font-size: 16px;
- color: #FFFFFF;
- text-align: center;
- padding: 12px 0;
- line-height: 22px;
- margin-top: 15px;
- }
- </style>
- <body>
- <div id="box" class="box">
- <div class="page6">
- <div class="ai_title">
- <span class="title_point"></span>
- <span>AI总结:</span>
- </div>
- <div class="sum_content">
- {{summarytData.summary}}
- </div>
- <div class="ai_title">
- <span class="title_point"></span>
- <span>AI跟进建议:</span>
- </div>
- <div class="sum_content" v-for="(item, index) in summarytData.suggestList" :key="index">
- <div class="day_title">第{{item.day}}天:{{item.title}}</div>
- <div class="mater_title">参考话术:</div>
- <div>{{item.contentText}}</div>
- <div class="mater_title" v-if="item.model">推荐内容:</div>
- <div class="mater_link" v-if="item.model && item.model.matterType === 5">
- <img :src="item.model.imgUrl" alt="">
- <div class="link_content">
- <div class="link_title">{{item.model.linkTitle}}</div>
- <div class="link_des">{{item.model.linkDescription}}</div>
- </div>
- </div>
- <div v-if="item.model && item.model.matterType === 1">
- <img class="model_img" :src="item.model.imgUrl" alt="">
- </div>
- <div :class="item.status ? 'ok_btn' : 'send_btn'" @click="handleSend(item.status, index)">{{item.status ? '已完成' : '一键发送'}}</div>
- </div>
- </div>
- </div>
- </body>
- <script>
- new Vue({
- el: '#box',
- data() {
- return {
- httpUrl: '',
- bId: null,
- env: '',
- memberId: null,
- summarytData: {},
- }
- },
- created() {
- this.bId = this.getQueryParam('bId')
- this.env = this.getQueryParam('env')
- if (!this.env || this.env === 'prod') {
- this.httpUrl = 'https://wlapi.wefanbot.com'
- } else {
- this.httpUrl = 'http://test.wefanbot.com:18993'
- }
- if (this.getQueryParam('memberId')) {
- // 已授权
- this.memberId = this.getQueryParam('memberId')
- this.getAiSummary()
- } else {
- // 授权
- this.getAuth()
- }
- // this.memberId = "woU17nDAAAfzP9lzjd-G8iwCiveKR8GA"
- // this.getAiSummary()
- },
- methods: {
- getAuth() {
- fetch(this.httpUrl + `/p/insuite/p/getRedirectUri?env=${this.env}&bId=${this.bId}`)
- .then(res => {
- return res.json()
- }).then(result => {
- let { data, code, msg } = result
- if (code === 1) {
- window.location.replace(data)
- } else {
- this.$message({
- message: msg,
- type: 'warning'
- })
- }
- })
- },
- getAiSummary() {
- fetch(this.httpUrl + '/scrm/v1/wxcp-chat-tool/p/aiSummary', {
- method: 'post',
- body: JSON.stringify({
- bid: this.bId,
- memberId: this.memberId,
- }),
- headers: {
- 'Content-Type': 'application/json'
- }
- }).then(res => {
- return res.json()
- }).then(result => {
- let { data, code, msg } = result
- if (code === 1) {
- this.summarytData = data
- if (this.summarytData.suggestList && this.summarytData.suggestList.length > 0) {
- this.summarytData.suggestList.forEach(item => {
- this.$set(item,'status', false)
- })
- }
- } else {
- this.$message({
- message: msg,
- type: 'warning'
- })
- }
- })
- },
- handleSend(status, index) {
- if (status) {
- return
- }
- this.summarytData.suggestList.forEach((item, i) => {
- if (index === i) {
- this.$set(item, 'status', true)
- this.$message({
- message: '发送成功',
- type: 'success'
- })
- }
- })
- },
- // 截取url中的数据
- getQueryParam(paramName) {
- // 获取当前URL的查询字符串部分
- const queryString = window.location.search;
- // 创建一个URLSearchParams对象
- const urlParams = new URLSearchParams(queryString);
- // 返回指定参数的值,如果不存在则返回null
- return urlParams.get(paramName);
- },
- }
- })
- </script>
- </html>
|