提交

src/config/page.json

@@ -31,5 +31,8 @@
     },
     "authorization1":{
         "title": "新型全媒体授权登录"
+    },
+    "chatGptChat":{
+        "title": "智能对话"
     }
 }

src/view/chatGptChat/index.js

@@ -0,0 +1,55 @@
+import App from './index.vue';
+import '@/assets/js/common';
+import { createApp } from 'vue';
+import { getUser } from '@/utils/tool.js';
+import { getPageParameters, environment } from '../../config/pageConfig';
+// 判断环境
+environment();
+window.$originData = getPageParameters();
+document.title = window.$originData.orginParames.title || '';
+// 分享
+window.weixin_Share_Init(
+  window.$originData.orginParames.title,
+  '',
+  'https://cxzx.smcic.net/topic/highSpeed/img/logo3.png',
+  'https://cxzx.smcic.net/topic/activity/chatGptChat.html?' + Date.now()
+);
+
+// var SL = new window.SmcicLogger('shanshipin', 'c6124d95');
+// SL.Util.SetUrl('https://collect.smcic.net:8443/');
+// SL.Systematic.Init({
+//   appid: 'c6124d95',
+//   channel: 'shanshipin',
+//   model: '',
+//   os: '',
+//   os_version: '',
+//   carrier: '',
+//   network_type: '',
+//   ip: '',
+//   app_name: '',
+//   app_version: '',
+//   build_version: '',
+//   platform_type: '',
+// });
+// SL.Content.CommodityDetail({
+//   commodity_detail_source: '活动',
+//   commodity_id: '',
+//   commodity_name: document.title,
+//   publisher_name: '',
+//   publisher_id: '',
+//   review_count: 0,
+//   comment_count: 0,
+//   collect_count: 0,
+//   share_count: 0,
+//   like_count: 0,
+//   tag: [],
+// });
+
+!window.$shanshipin || !window.$shanshipin.Phone
+  ? getUser(() => createApp(App).mount('#app'))
+  : createApp(App).mount('#app');
+
+window.setUserSession = () => {
+  console.log('登录');
+  getUser(() => createApp(App).mount('#app'));
+};

src/view/chatGptChat/index.vue

@@ -0,0 +1,92 @@
+<template>
+  <div class="chatGptChat">
+    <div class="chat">
+      <van-image width="35px" height="35px" fit="contain" :src="robot" />
+      <div class="cahtText">你好！</div>
+    </div>
+    <div class="chat chatRight">
+      <div class="cahtText">
+        你好！
+      </div>
+      <van-image width="35px" height="35px" fit="contain" :src="user" />
+    </div>
+    <van-field
+      v-model="inputText"
+      rows="1"
+      maxlength="300"
+      autosize
+      placeholder="请输入您的问题"
+      type="textarea"
+    >
+      <template #button>
+        <van-button size="small" type="success" @click="saveText">
+          发送
+        </van-button>
+      </template>
+    </van-field>
+  </div>
+</template>
+<script setup>
+import robot from '../../assets/img/chat/robot_2.png';
+import user from '../../assets/img/chat/user.png';
+import { ref } from 'vue';
+// import { onMounted, reactive } from "vue";
+// import { isIpad, isIpod, isIphone } from "../../utils/isTerminal";
+/**
+ * window.$originData.orginParames.title 页面标题
+ * window.$originData.orginParames.parameters 固定参数值
+ * window.$originData.urlParames url参数
+ */
+console.log(window.$originData);
+const inputText = ref('');
+function saveText() {
+  console.log(inputText.value);
+}
+</script>
+<style lang="scss">
+.chatGptChat {
+  box-sizing: border-box;
+  font-weight: 500;
+  width: 100vw;
+  height: 100vh;
+  padding: 1em;
+  position: relative;
+  padding-bottom: 55px;
+  background-color: #dddddd;
+  .van-field {
+    background-color: #eee;
+    position: absolute;
+    bottom: 0;
+    left: 0;
+    .van-field__control {
+      background-color: #ffffff;
+      padding: .4em;
+    }
+  }
+
+  .chat {
+    padding: 0.2em 0;
+    width: 100%;
+    .cahtText {
+      text-align: left;
+      border-radius: 5px;
+      background-color: #ffffff;
+      padding: 0.5em 0.2em;
+      display: inline-block;
+      max-width: calc(100% - 40px);
+      vertical-align: middle;
+    }
+    .van-image {
+      vertical-align: top;
+    }
+
+    .cahtText:not(:last-child),
+    .van-image:not(:last-child) {
+      margin-right: 5px;
+    }
+  }
+  .chatRight {
+    text-align: right;
+  }
+}
+</style>