|
|
@@ -0,0 +1,1871 @@
|
|
|
+<script setup>
|
|
|
+import { computed, getCurrentInstance, onMounted, ref } from 'vue'
|
|
|
+import { Field, Loading, Overlay, Popover, Popup, Swipe, SwipeItem } from 'vant'
|
|
|
+import qs from 'qs'
|
|
|
+import AppEmpty from '@/ui/empty/index.vue'
|
|
|
+import {
|
|
|
+ ajaxActionLike,
|
|
|
+ ajaxDelTask,
|
|
|
+ ajaxGetHistoryDetail,
|
|
|
+ ajaxGetHistoryList,
|
|
|
+ ajaxGetMoreList,
|
|
|
+ ajaxGetPromptTypes,
|
|
|
+ ajaxNewTask,
|
|
|
+ ajaxSetMessage,
|
|
|
+ getAccountInfo
|
|
|
+} from '@/api/modules'
|
|
|
+import ProjectCell from '@/ui/project-cell/index.vue'
|
|
|
+import {
|
|
|
+ dateFormatter,
|
|
|
+ formatMoney,
|
|
|
+ getRandomString,
|
|
|
+ openAppOrWxPage,
|
|
|
+ openLinkOfOther
|
|
|
+} from '@/utils'
|
|
|
+import { LINKS } from '@/data'
|
|
|
+
|
|
|
+const that = getCurrentInstance().proxy
|
|
|
+
|
|
|
+const rightAction = ref({
|
|
|
+ show: false,
|
|
|
+ actions: [
|
|
|
+ { text: '新对话', className: 'highlight-text' },
|
|
|
+ { text: '历史对话' }
|
|
|
+ ]
|
|
|
+})
|
|
|
+
|
|
|
+function doBack() {
|
|
|
+ trickClick(`退出页面`)
|
|
|
+ that.$router.back()
|
|
|
+}
|
|
|
+
|
|
|
+function onSelectRightAction(action) {
|
|
|
+ console.log('action', action)
|
|
|
+ trickClick(action)
|
|
|
+ if (action.text === '新对话') {
|
|
|
+ doNewQuestion()
|
|
|
+ } else {
|
|
|
+ doAjaxGetHistoryList()
|
|
|
+ historyModel.value.show = true
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+const historyModel = ref({
|
|
|
+ show: false,
|
|
|
+ loading: false,
|
|
|
+ list: []
|
|
|
+})
|
|
|
+
|
|
|
+const historyListLabel = computed(() => {
|
|
|
+ const periods = ['今天', '过去7天', '过去30天', '更早']
|
|
|
+ return periods.filter((period) =>
|
|
|
+ Array.isArray(historyModel.value.list[period])
|
|
|
+ )
|
|
|
+})
|
|
|
+
|
|
|
+const moreListModel = ref({
|
|
|
+ show: false,
|
|
|
+ loading: false,
|
|
|
+ selectId: '',
|
|
|
+ list: []
|
|
|
+})
|
|
|
+
|
|
|
+function doNewQuestion() {
|
|
|
+ trickClick(`新对话`)
|
|
|
+ historyModel.value.show = false
|
|
|
+ clearAskState()
|
|
|
+ doSelectQuestionType(promptModel.value.typeList[0])
|
|
|
+}
|
|
|
+
|
|
|
+function trickClick(name, opts = {}) {
|
|
|
+ console.log(`ai-${name}`, opts)
|
|
|
+ try {
|
|
|
+ window.__EasyJTrack.addTrack(name, {
|
|
|
+ breaker_name: name,
|
|
|
+ product_name: 'AI搜索',
|
|
|
+ breaker_id: 'ai-search',
|
|
|
+ desc: JSON.stringify(opts),
|
|
|
+ date: Date()
|
|
|
+ })
|
|
|
+ } catch (e) {
|
|
|
+ console.log(e)
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+async function goHistory(item) {
|
|
|
+ trickClick(`点击历史记录-${item.id}-${item.question}`, item.id)
|
|
|
+ historyModel.value.show = false
|
|
|
+ console.log('item', item)
|
|
|
+ return ajaxGetHistoryDetail({
|
|
|
+ sid: item.id
|
|
|
+ }).then((res) => {
|
|
|
+ clearAskState()
|
|
|
+ questionModel.value.nowId = item.id
|
|
|
+
|
|
|
+ if (Array.isArray(res.data)) {
|
|
|
+ res.data.forEach((v) => {
|
|
|
+ // 回显问题
|
|
|
+ doSendMessageOfUser(v.question)
|
|
|
+ // 回显答复
|
|
|
+ v.answer.id = v.id
|
|
|
+
|
|
|
+ const askItem = Object.assign(
|
|
|
+ {
|
|
|
+ message: v.question,
|
|
|
+ id: v.id,
|
|
|
+ list: [],
|
|
|
+ like: v.like || 0,
|
|
|
+ state: 0
|
|
|
+ },
|
|
|
+ formatAskAnswer(v.answer)
|
|
|
+ )
|
|
|
+
|
|
|
+ askModel.value.list.push({
|
|
|
+ ...askItem,
|
|
|
+ _data: v.answer
|
|
|
+ })
|
|
|
+ })
|
|
|
+ that.$nextTick(() => {
|
|
|
+ scrollToBottom()
|
|
|
+ })
|
|
|
+ }
|
|
|
+ })
|
|
|
+}
|
|
|
+
|
|
|
+const promptModel = ref({
|
|
|
+ show: true,
|
|
|
+ current: 0,
|
|
|
+ type: '',
|
|
|
+ typeList: [
|
|
|
+ // {
|
|
|
+ // text: '看标讯',
|
|
|
+ // key: 'bx',
|
|
|
+ // icon: 'icon-wenjian',
|
|
|
+ // disabled: false,
|
|
|
+ // toast: ''
|
|
|
+ // }
|
|
|
+ ],
|
|
|
+ list: [
|
|
|
+ // {
|
|
|
+ // text: '111我是 [XXX公司] 的 [采销员]，我想看 [华北地区] 最近一个月与 [光刻胶] 相关的标讯。'
|
|
|
+ // }
|
|
|
+ ]
|
|
|
+})
|
|
|
+
|
|
|
+function onChangePrompt(index) {
|
|
|
+ trickClick(`切换提示词`)
|
|
|
+ promptModel.value.current = index
|
|
|
+}
|
|
|
+
|
|
|
+const promptEle = ref(null)
|
|
|
+function doChangePrompt(val) {
|
|
|
+ trickClick(`切换提示词`)
|
|
|
+ if (val) {
|
|
|
+ promptEle.value.next()
|
|
|
+ } else {
|
|
|
+ promptEle.value.prev()
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+function doSelectPrompt(item) {
|
|
|
+ changeInputHeight()
|
|
|
+
|
|
|
+ questionModel.value.input = item.text
|
|
|
+ promptModel.value.show = false
|
|
|
+ promptModel.value.type = ''
|
|
|
+
|
|
|
+ triggerFocus()
|
|
|
+
|
|
|
+ that.$nextTick(() => {
|
|
|
+ getQuestionInputHeight()
|
|
|
+ })
|
|
|
+
|
|
|
+ trickClick('选中提示词', {
|
|
|
+ text: item.text
|
|
|
+ })
|
|
|
+}
|
|
|
+
|
|
|
+const questionModel = ref({
|
|
|
+ nowId: '',
|
|
|
+ input: '',
|
|
|
+ inputTheme: 'scale',
|
|
|
+ style: {},
|
|
|
+ iconShow: false
|
|
|
+})
|
|
|
+
|
|
|
+const questionInputEl = ref(null)
|
|
|
+
|
|
|
+function getQuestionInputHeight() {
|
|
|
+ console.log('cccc height')
|
|
|
+ const result = {
|
|
|
+ height: '100%'
|
|
|
+ }
|
|
|
+ let canShow = false
|
|
|
+
|
|
|
+ if (questionInputEl?.value && questionModel.value.inputTheme === 'scale') {
|
|
|
+ const el = questionInputEl.value.$el.querySelector('textarea')
|
|
|
+ if (el.clientHeight > 72) {
|
|
|
+ result.height = `${el.clientHeight}px !important`
|
|
|
+ }
|
|
|
+ canShow = el.scrollHeight > 60
|
|
|
+ }
|
|
|
+ const nowKey = `${Date.now()}_${questionModel.value.input.length}`
|
|
|
+ questionModel.value.style = {
|
|
|
+ height: result.height,
|
|
|
+ 'data-up': nowKey
|
|
|
+ }
|
|
|
+ questionModel.value.iconShow = canShow
|
|
|
+}
|
|
|
+
|
|
|
+function changeInputHeight() {
|
|
|
+ if (questionInputEl.value) {
|
|
|
+ questionInputEl.value.$el.querySelector('textarea').style.height = '24px'
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+onMounted(() => {
|
|
|
+ that.$nextTick(() => {
|
|
|
+ changeInputHeight()
|
|
|
+ })
|
|
|
+})
|
|
|
+
|
|
|
+const questionModelOptions = computed(() => {
|
|
|
+ if (questionModel.value.inputTheme === 'full') {
|
|
|
+ return {}
|
|
|
+ }
|
|
|
+ return {
|
|
|
+ row: 1,
|
|
|
+ autosize: {
|
|
|
+ maxHeight: 96,
|
|
|
+ minHeight: 24
|
|
|
+ }
|
|
|
+ }
|
|
|
+})
|
|
|
+
|
|
|
+function formatTypeofItemKey(params, type, spare = '-') {
|
|
|
+ let formatFn = () => spare
|
|
|
+ switch (type) {
|
|
|
+ case 'money': {
|
|
|
+ formatFn = (params) => formatMoney(Number(params))
|
|
|
+ break
|
|
|
+ }
|
|
|
+ case 'money-table': {
|
|
|
+ formatFn = (params) =>
|
|
|
+ formatMoney(Number(params), { type: 'number', level: 1 })
|
|
|
+ break
|
|
|
+ }
|
|
|
+ case 'date': {
|
|
|
+ formatFn = (params) => dateFormatter(Number(params) * 1000)
|
|
|
+ break
|
|
|
+ }
|
|
|
+ case 'date-ms': {
|
|
|
+ formatFn = (params) => dateFormatter(Number(params) * 1000, 'yyyy-MM-dd')
|
|
|
+ break
|
|
|
+ }
|
|
|
+ }
|
|
|
+ if (params) {
|
|
|
+ return typeof params === 'string' ? params : formatFn(params)
|
|
|
+ }
|
|
|
+ return spare
|
|
|
+}
|
|
|
+
|
|
|
+function preSortItem(item, splitKeys) {
|
|
|
+ console.log('cee', item)
|
|
|
+ if (!item) return {}
|
|
|
+ const { area, city, collect, projectInfo } = item
|
|
|
+ item.id = item.infoId
|
|
|
+ item.star = !!collect
|
|
|
+ item.splitKeys = splitKeys
|
|
|
+ // 参标参数
|
|
|
+ item.isCB = {
|
|
|
+ id: '',
|
|
|
+ value: 0
|
|
|
+ }
|
|
|
+ // 是否有附件
|
|
|
+ item.isFile = item?.fileExists || false
|
|
|
+ item.leftTopBadgeText = item.site === '剑鱼信息发布平台' ? '业主委托项目' : ''
|
|
|
+ // 拟建项目独有参数
|
|
|
+ if (projectInfo) {
|
|
|
+ Object.assign(item, projectInfo)
|
|
|
+ }
|
|
|
+ const region = city || area
|
|
|
+ const buyerClass =
|
|
|
+ item?.buyerClass && item?.buyerClass !== '其它'
|
|
|
+ ? item?.buyerClass
|
|
|
+ : undefined
|
|
|
+
|
|
|
+ // 标签
|
|
|
+ item.tagList = [
|
|
|
+ region || '',
|
|
|
+ buyerClass,
|
|
|
+ item.industry,
|
|
|
+ item?.type || item?.subtype,
|
|
|
+ // 有中标金额取中标金额，没有取预算，预算没有置空
|
|
|
+ formatTypeofItemKey(item?.bidamount || item?.budget, 'money', '')
|
|
|
+ ].filter((v) => v)
|
|
|
+
|
|
|
+ item.dateTime = item.publishtime ? item.publishtime * 1000 : ''
|
|
|
+
|
|
|
+ // 整理企业画像数据
|
|
|
+ let winnerList = Array.isArray(item.winnerInfo) ? item.winnerInfo : []
|
|
|
+ winnerList = winnerList.map((w) => {
|
|
|
+ return {
|
|
|
+ text: w.winner,
|
|
|
+ id: w.winnerId
|
|
|
+ }
|
|
|
+ })
|
|
|
+
|
|
|
+ item.vKid = `${item.id}--${getRandomString(8).toLowerCase()}`
|
|
|
+
|
|
|
+ // 详细列表数据
|
|
|
+ item.detailList = [
|
|
|
+ {
|
|
|
+ label: '采购单位',
|
|
|
+ splitter: '：',
|
|
|
+ text: Array.isArray(item.buyer) ? item.buyer.join(',') : item.buyer || '',
|
|
|
+ highlightText: true,
|
|
|
+ detailTextSlot: 'buyerText'
|
|
|
+ },
|
|
|
+ {
|
|
|
+ label: '预算金额',
|
|
|
+ splitter: '：',
|
|
|
+ text: formatTypeofItemKey(item?.budget, 'money', '')
|
|
|
+ },
|
|
|
+ {
|
|
|
+ label: '代理机构',
|
|
|
+ splitter: '：',
|
|
|
+ text: item.agency || ''
|
|
|
+ },
|
|
|
+ {
|
|
|
+ label: '中标单位',
|
|
|
+ splitter: '：',
|
|
|
+ text: Array.isArray(item.winnerInfo)
|
|
|
+ ? item.winnerInfo.map((w) => w.winner).join(',')
|
|
|
+ : '',
|
|
|
+ detailTextSlot: 'winnerText',
|
|
|
+ children: winnerList
|
|
|
+ },
|
|
|
+ {
|
|
|
+ label: '中标金额',
|
|
|
+ splitter: '：',
|
|
|
+ text: formatTypeofItemKey(item?.bidamount, 'money', '')
|
|
|
+ },
|
|
|
+ {
|
|
|
+ label: '报名截止日期',
|
|
|
+ splitter: '：',
|
|
|
+ text: item.signEndTime
|
|
|
+ ? dateFormatter(item.signEndTime * 1000, 'yyyy-MM-dd')
|
|
|
+ : ''
|
|
|
+ },
|
|
|
+ {
|
|
|
+ label: '投标截止日期',
|
|
|
+ splitter: '：',
|
|
|
+ text: item.bidEndTime
|
|
|
+ ? dateFormatter(item.bidEndTime * 1000, 'yyyy-MM-dd')
|
|
|
+ : ''
|
|
|
+ },
|
|
|
+ {
|
|
|
+ label: '开标日期',
|
|
|
+ splitter: '：',
|
|
|
+ text: formatTypeofItemKey(item.bidOpenTime, 'date-ms', '')
|
|
|
+ }
|
|
|
+ ]
|
|
|
+
|
|
|
+ return item
|
|
|
+}
|
|
|
+function formatCellItem(v, splitKeys) {
|
|
|
+ return preSortItem(v, splitKeys)
|
|
|
+}
|
|
|
+
|
|
|
+function formatAskAnswer(res) {
|
|
|
+ let resultState = 1
|
|
|
+ const askItem = {
|
|
|
+ list: [],
|
|
|
+ state: 0
|
|
|
+ }
|
|
|
+ // 接口成功
|
|
|
+ if (res.status === 1) {
|
|
|
+ if (res.count === 0) {
|
|
|
+ resultState = 2
|
|
|
+ } else {
|
|
|
+ resultState = 3
|
|
|
+ askItem.list = (res.list || []).map((v) => {
|
|
|
+ return formatCellItem(v, res.highlight || [])
|
|
|
+ })
|
|
|
+ if (res.id) {
|
|
|
+ askItem.id = res.id
|
|
|
+ }
|
|
|
+ askItem.count = res.count
|
|
|
+ }
|
|
|
+ } else {
|
|
|
+ resultState = 1
|
|
|
+ }
|
|
|
+
|
|
|
+ askItem.state = resultState
|
|
|
+ return askItem
|
|
|
+}
|
|
|
+
|
|
|
+async function doAjaxSendMessage(question, type = '') {
|
|
|
+ const trimQuestion = question.trim()
|
|
|
+ doSendMessageOfUser(trimQuestion)
|
|
|
+
|
|
|
+ let askItem = {
|
|
|
+ message: trimQuestion,
|
|
|
+ id: '',
|
|
|
+ like: 0,
|
|
|
+ list: [],
|
|
|
+ state: 0
|
|
|
+ }
|
|
|
+
|
|
|
+ askItem.fId = doSendMessageOfCustom(askItem)
|
|
|
+
|
|
|
+ await ajaxSetMessage({
|
|
|
+ sid: questionModel.value.nowId,
|
|
|
+ question: trimQuestion,
|
|
|
+ item: promptModel.value.type || '1',
|
|
|
+ type
|
|
|
+ })
|
|
|
+ .then((res) => {
|
|
|
+ console.log('x', res)
|
|
|
+ askItem = Object.assign(askItem, formatAskAnswer(res))
|
|
|
+ })
|
|
|
+ .catch((e) => {
|
|
|
+ console.log('e', e)
|
|
|
+ askItem.state = 1
|
|
|
+ })
|
|
|
+
|
|
|
+ changeMessageItem(askItem.fId, askItem)
|
|
|
+ setTimeout(() => {
|
|
|
+ scrollToBottom()
|
|
|
+ }, 200)
|
|
|
+}
|
|
|
+
|
|
|
+async function doSubmitMessage() {
|
|
|
+ if (!questionModel.value.nowId) {
|
|
|
+ await ajaxNewTask()
|
|
|
+ .then((res) => {
|
|
|
+ console.log('xxx', res)
|
|
|
+ if (res.data) {
|
|
|
+ questionModel.value.nowId = res.data
|
|
|
+ } else {
|
|
|
+ that.$toast('会话创建失败，请稍后再试')
|
|
|
+ }
|
|
|
+ })
|
|
|
+ .catch(() => {
|
|
|
+ that.$toast('会话创建失败，请稍后再试')
|
|
|
+ })
|
|
|
+ }
|
|
|
+ const question = questionModel.value.input
|
|
|
+ trickClick(`提交问题`, { text: question })
|
|
|
+ doAjaxSendMessage(question)
|
|
|
+}
|
|
|
+
|
|
|
+function clearAskState() {
|
|
|
+ // 清除会话
|
|
|
+ askModel.value.list = []
|
|
|
+ // 清除输入状态
|
|
|
+ questionModel.value.nowId = ''
|
|
|
+ questionModel.value.input = ''
|
|
|
+ questionModel.value.inputTheme = 'scale'
|
|
|
+ // 清除选中 prompt
|
|
|
+ promptModel.value.type = ''
|
|
|
+ promptModel.value.show = false
|
|
|
+ that.$nextTick(() => {
|
|
|
+ changeInputHeight()
|
|
|
+ getQuestionInputHeight()
|
|
|
+ })
|
|
|
+}
|
|
|
+
|
|
|
+function doSendMessageOfUser(message) {
|
|
|
+ askModel.value.list.push({
|
|
|
+ user: true,
|
|
|
+ message
|
|
|
+ })
|
|
|
+ questionModel.value.input = ''
|
|
|
+ questionModel.value.inputTheme = 'scale'
|
|
|
+
|
|
|
+ that.$nextTick(() => {
|
|
|
+ changeInputHeight()
|
|
|
+ getQuestionInputHeight()
|
|
|
+ scrollToBottom()
|
|
|
+ })
|
|
|
+}
|
|
|
+function doSendMessageOfCustom(data) {
|
|
|
+ const { message, state, list, count } = data
|
|
|
+ const findId = `f_${Date.now()}_${Math.random()}`
|
|
|
+ askModel.value.list.push({
|
|
|
+ fId: findId,
|
|
|
+ user: false,
|
|
|
+ state,
|
|
|
+ list,
|
|
|
+ count,
|
|
|
+ message,
|
|
|
+ _data: data
|
|
|
+ })
|
|
|
+ return findId
|
|
|
+}
|
|
|
+
|
|
|
+function scrollToBottom() {
|
|
|
+ that.$nextTick(() => {
|
|
|
+ contentBottomEl.value.scrollIntoView({ behavior: 'smooth' })
|
|
|
+ })
|
|
|
+}
|
|
|
+
|
|
|
+function changeMessageItem(id, data) {
|
|
|
+ const arr = askModel.value.list
|
|
|
+ // 使用 for 循环倒序查找
|
|
|
+ for (let i = askModel.value.list.length - 1; i >= 0; i--) {
|
|
|
+ const item = askModel.value.list[i]
|
|
|
+ if (item.fId === id) {
|
|
|
+ that.$set(askModel.value.list, i, { ...item, ...data })
|
|
|
+ console.log(`Item with id ${id} updated.`)
|
|
|
+ return
|
|
|
+ }
|
|
|
+ }
|
|
|
+ // 如果没有找到匹配的项，输出提示信息
|
|
|
+ console.log(`No item found with id ${id}.`)
|
|
|
+}
|
|
|
+
|
|
|
+function doClickInputIcon(type) {
|
|
|
+ console.log('t', type)
|
|
|
+ trickClick('发送', {
|
|
|
+ type
|
|
|
+ })
|
|
|
+ switch (type) {
|
|
|
+ case 'full': {
|
|
|
+ questionModel.value.inputTheme = 'full'
|
|
|
+ break
|
|
|
+ }
|
|
|
+ case 'scale': {
|
|
|
+ questionModel.value.inputTheme = 'scale'
|
|
|
+ break
|
|
|
+ }
|
|
|
+ case 'submit': {
|
|
|
+ if (questionModel.value.input !== '') {
|
|
|
+ questionModel.value.inputTheme = 'scale'
|
|
|
+ promptModel.value.show = false
|
|
|
+
|
|
|
+ doSubmitMessage()
|
|
|
+ }
|
|
|
+
|
|
|
+ break
|
|
|
+ }
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+function doSelectQuestionType(item) {
|
|
|
+ if (item.key === promptModel.value.type) {
|
|
|
+ promptModel.value.type = ''
|
|
|
+ promptModel.value.list = []
|
|
|
+ promptModel.value.show = false
|
|
|
+ return
|
|
|
+ }
|
|
|
+ if (item.disabled) {
|
|
|
+ that.$toast({
|
|
|
+ message: item.toast,
|
|
|
+ className: 'one-toast'
|
|
|
+ })
|
|
|
+ } else {
|
|
|
+ promptModel.value.current = 0
|
|
|
+ promptModel.value.type = item.key
|
|
|
+ promptModel.value.list = item.options
|
|
|
+ promptModel.value.show = true
|
|
|
+ fixSwipeResize()
|
|
|
+ }
|
|
|
+
|
|
|
+ trickClick('选择提问类型', {
|
|
|
+ text: item.text
|
|
|
+ })
|
|
|
+}
|
|
|
+
|
|
|
+function fixSwipeResize () {
|
|
|
+ that.$nextTick(() => {
|
|
|
+ if (promptEle.value) {
|
|
|
+ promptEle.value.resize()
|
|
|
+ }
|
|
|
+ })
|
|
|
+}
|
|
|
+
|
|
|
+const askStateMap = {
|
|
|
+ 0: '搜索中...',
|
|
|
+ 1: '服务器繁忙，请稍后再试',
|
|
|
+ 2: '很抱歉，我没能搜索到您想要的信息，您可以调整描述，',
|
|
|
+ 3: '搜索完毕'
|
|
|
+}
|
|
|
+
|
|
|
+const askModel = ref({
|
|
|
+ list: [
|
|
|
+ // {
|
|
|
+ // user: true,
|
|
|
+ // message: '我想看最近一个月与光刻胶相关的信息'
|
|
|
+ // },
|
|
|
+ // {
|
|
|
+ // user: false,
|
|
|
+ // state: 2
|
|
|
+ // }
|
|
|
+ ]
|
|
|
+})
|
|
|
+
|
|
|
+function resetQuestion(item) {
|
|
|
+ changeInputHeight()
|
|
|
+ questionModel.value.input = item.message
|
|
|
+ triggerFocus()
|
|
|
+ that.$nextTick(() => {
|
|
|
+ getQuestionInputHeight()
|
|
|
+ })
|
|
|
+
|
|
|
+ trickClick('重新提问', {
|
|
|
+ id: item.id,
|
|
|
+ message: item.message
|
|
|
+ })
|
|
|
+}
|
|
|
+
|
|
|
+function doAjaxGetHistoryList() {
|
|
|
+ ajaxGetHistoryList().then((res) => {
|
|
|
+ if (res?.data?.list) {
|
|
|
+ historyModel.value.list = res.data.list
|
|
|
+ }
|
|
|
+ })
|
|
|
+}
|
|
|
+
|
|
|
+function goToDetail(item) {
|
|
|
+ savePageState()
|
|
|
+ const query = {}
|
|
|
+ if (item.splitKeys) {
|
|
|
+ query.keywords = item.splitKeys.join(' ')
|
|
|
+ }
|
|
|
+ trickClick('点击跳转详情页', {
|
|
|
+ title: item.title,
|
|
|
+ id: item.id
|
|
|
+ })
|
|
|
+ openAppOrWxPage({
|
|
|
+ wx: `${LINKS.标讯详情页前缀.wx + item.id}.html?${qs.stringify(query)}`,
|
|
|
+ app: `${LINKS.标讯详情页前缀.app + item.id}.html?${qs.stringify(query)}`,
|
|
|
+ h5: `${LINKS.标讯详情页前缀.h5 + item.id}.html?${qs.stringify(query)}`
|
|
|
+ })
|
|
|
+}
|
|
|
+
|
|
|
+function doCollection(item, index) {
|
|
|
+ savePageState()
|
|
|
+ that.$keep.action({
|
|
|
+ status: item.star,
|
|
|
+ id: item.id,
|
|
|
+ complete: ({ type, message }) => {
|
|
|
+ if (type) {
|
|
|
+ item.star = !item.star
|
|
|
+ that.$forceUpdate()
|
|
|
+ }
|
|
|
+ }
|
|
|
+ })
|
|
|
+ trickClick('点击标讯收藏', {
|
|
|
+ title: item.title,
|
|
|
+ id: item.id
|
|
|
+ })
|
|
|
+}
|
|
|
+
|
|
|
+function doLookMoreList(item) {
|
|
|
+ console.log('xx', item)
|
|
|
+ moreListModel.value.show = true
|
|
|
+ moreListModel.value.loading = true
|
|
|
+ moreListModel.value.selectId = item.id
|
|
|
+ ajaxGetMoreList({
|
|
|
+ chatId: item.id
|
|
|
+ })
|
|
|
+ .then((res) => {
|
|
|
+ if (res.data) {
|
|
|
+ moreListModel.value.list = (res.data || []).map((v) => {
|
|
|
+ return formatCellItem(v, res.highlight || item._data?.highlight || [])
|
|
|
+ })
|
|
|
+ }
|
|
|
+ moreListModel.value.loading = false
|
|
|
+ })
|
|
|
+ .catch(() => {
|
|
|
+ moreListModel.value.loading = false
|
|
|
+ })
|
|
|
+ trickClick('查看更多', {
|
|
|
+ message: item.message,
|
|
|
+ id: item.id
|
|
|
+ })
|
|
|
+}
|
|
|
+function doCellAction(item, type) {
|
|
|
+ console.log(item)
|
|
|
+ if (type === 'reload') {
|
|
|
+ doAjaxSendMessage(item.message, type)
|
|
|
+ trickClick('cell-action-刷新', {
|
|
|
+ message: item.message,
|
|
|
+ id: item.id
|
|
|
+ })
|
|
|
+ } else {
|
|
|
+ item.like = Number(!item.like)
|
|
|
+ ajaxActionLike({
|
|
|
+ cid: item.id,
|
|
|
+ val: item.like
|
|
|
+ }).then((res) => {
|
|
|
+ // that.$toast('感谢')
|
|
|
+ })
|
|
|
+ trickClick('cell-action-点赞', {
|
|
|
+ message: item.message,
|
|
|
+ id: item.id
|
|
|
+ })
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+const moreLike = computed(() => {
|
|
|
+ const item = askModel.value.list.find(
|
|
|
+ (v) => v.id === moreListModel.value.selectId
|
|
|
+ )
|
|
|
+ console.log(item)
|
|
|
+ return item || {}
|
|
|
+})
|
|
|
+
|
|
|
+function doMoreLike() {
|
|
|
+ doCellAction(moreLike.value, 'zan')
|
|
|
+}
|
|
|
+
|
|
|
+const pageUserInfo = ref({})
|
|
|
+const needLogin = ref(false)
|
|
|
+const needBindPhone = ref(false)
|
|
|
+// 获取用户信息
|
|
|
+async function getUserInfo() {
|
|
|
+ try {
|
|
|
+ const { error_code: code, data = {}, error } = await getAccountInfo()
|
|
|
+ if (error === '需要登录！') {
|
|
|
+ needLogin.value = true
|
|
|
+ }
|
|
|
+ if (code === 0) {
|
|
|
+ pageUserInfo.value = data
|
|
|
+ const { phone } = pageUserInfo.value
|
|
|
+ needBindPhone.value = !phone
|
|
|
+ console.log('o', phone)
|
|
|
+ }
|
|
|
+ return data
|
|
|
+ } catch (error) {
|
|
|
+ return {}
|
|
|
+ }
|
|
|
+}
|
|
|
+// 绑定手机号
|
|
|
+function checkBindPhone() {
|
|
|
+ if (needLogin.value) {
|
|
|
+ return openLinkOfOther(LINKS.APP登录页.app, {
|
|
|
+ query: {
|
|
|
+ to: 'back'
|
|
|
+ }
|
|
|
+ })
|
|
|
+ }
|
|
|
+ if (needBindPhone.value) {
|
|
|
+ const query = {
|
|
|
+ mode: 'mergeBind'
|
|
|
+ }
|
|
|
+ return openAppOrWxPage(LINKS.绑定手机号, { query })
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+function doDelTask(item) {
|
|
|
+ trickClick('删除对话记录', { id: item.id })
|
|
|
+ console.log('item', item)
|
|
|
+ that.$dialog
|
|
|
+ .confirm({
|
|
|
+ message: '是否要删除该对话记录？',
|
|
|
+ confirmButtonColor: '#ee0a24'
|
|
|
+ })
|
|
|
+ .then(() => {
|
|
|
+ ajaxDelTask({ sid: item.id }).then((res) => {
|
|
|
+ if (res.data) {
|
|
|
+ that.$toast('删除成功')
|
|
|
+ doAjaxGetHistoryList()
|
|
|
+ if (item.id === questionModel.value.nowId) {
|
|
|
+ doNewQuestion()
|
|
|
+ }
|
|
|
+ }
|
|
|
+ })
|
|
|
+ })
|
|
|
+ .catch(() => {})
|
|
|
+}
|
|
|
+
|
|
|
+const cacheToLocalStorage = (key, state) => {
|
|
|
+ localStorage.setItem(key, JSON.stringify(state.value))
|
|
|
+}
|
|
|
+
|
|
|
+// 函数：通用读取函数，支持自定义 key
|
|
|
+const loadFromLocalStorage = (key, state) => {
|
|
|
+ const cachedData = localStorage.getItem(key)
|
|
|
+ if (cachedData) {
|
|
|
+ Object.assign(state.value, JSON.parse(cachedData))
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+const contentEl = ref(null)
|
|
|
+const contentBottomEl = ref(null)
|
|
|
+const moreContentEl = ref(null)
|
|
|
+
|
|
|
+function getSetScrollTop(top) {
|
|
|
+ if (contentEl.value) {
|
|
|
+ if (top) {
|
|
|
+ contentEl.value.scrollTo(0, top)
|
|
|
+ } else {
|
|
|
+ return contentEl.value.scrollTop
|
|
|
+ }
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+function getSetMoreScrollTop(top) {
|
|
|
+ if (moreContentEl.value) {
|
|
|
+ if (top) {
|
|
|
+ moreContentEl.value.scrollTo(0, top)
|
|
|
+ } else {
|
|
|
+ return moreContentEl.value.scrollTop
|
|
|
+ }
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+function savePageState() {
|
|
|
+ localStorage.setItem('ai-search-cache', 'use')
|
|
|
+ localStorage.setItem('ai-search-height', getSetScrollTop())
|
|
|
+ localStorage.setItem('ai-search-more-height', getSetMoreScrollTop())
|
|
|
+ cacheToLocalStorage('ai-search-historyModel', historyModel)
|
|
|
+ cacheToLocalStorage('ai-search-moreListModel', moreListModel)
|
|
|
+ cacheToLocalStorage('ai-search-promptModel', promptModel)
|
|
|
+ cacheToLocalStorage('ai-search-questionModel', questionModel)
|
|
|
+ cacheToLocalStorage('ai-search-askModel', askModel)
|
|
|
+}
|
|
|
+function echoPageState() {
|
|
|
+ loadFromLocalStorage('ai-search-historyModel', historyModel)
|
|
|
+ loadFromLocalStorage('ai-search-moreListModel', moreListModel)
|
|
|
+ loadFromLocalStorage('ai-search-promptModel', promptModel)
|
|
|
+ loadFromLocalStorage('ai-search-questionModel', questionModel)
|
|
|
+ loadFromLocalStorage('ai-search-askModel', askModel)
|
|
|
+ // 重置
|
|
|
+ localStorage.removeItem('ai-search-historyModel')
|
|
|
+ localStorage.removeItem('ai-search-moreListModel')
|
|
|
+ localStorage.removeItem('ai-search-promptModel')
|
|
|
+ localStorage.removeItem('ai-search-questionModel')
|
|
|
+ localStorage.removeItem('ai-search-askModel')
|
|
|
+ localStorage.removeItem('ai-search-cache')
|
|
|
+
|
|
|
+ if (moreListModel.value.show) {
|
|
|
+ const top = localStorage.getItem('ai-search-more-height')
|
|
|
+ console.log('moretop', top)
|
|
|
+ if (top) {
|
|
|
+ that.$nextTick(() => {
|
|
|
+ getSetMoreScrollTop(top)
|
|
|
+ })
|
|
|
+ }
|
|
|
+ localStorage.removeItem('ai-search-more-height')
|
|
|
+ }
|
|
|
+
|
|
|
+ if (questionModel.value.nowId) {
|
|
|
+ goHistory({
|
|
|
+ id: questionModel.value.nowId
|
|
|
+ }).then(() => {
|
|
|
+ const top = localStorage.getItem('ai-search-height')
|
|
|
+ if (top) {
|
|
|
+ that.$nextTick(() => {
|
|
|
+ getSetScrollTop(top)
|
|
|
+ })
|
|
|
+ }
|
|
|
+ localStorage.removeItem('ai-search-height')
|
|
|
+ })
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+function triggerFocus () {
|
|
|
+ questionInputEl.value.focus()
|
|
|
+ that.$nextTick(() => {
|
|
|
+ questionInputEl.value.focus()
|
|
|
+ })
|
|
|
+}
|
|
|
+
|
|
|
+// 初始化事件
|
|
|
+function init() {
|
|
|
+ if (localStorage.getItem('ai-search-cache') === 'use') {
|
|
|
+ echoPageState()
|
|
|
+ } else {
|
|
|
+ ajaxGetPromptTypes().then((res) => {
|
|
|
+ console.log('x', res)
|
|
|
+ if (res?.data) {
|
|
|
+ promptModel.value.typeList = res.data.map((v) => {
|
|
|
+ return {
|
|
|
+ text: v.goodsName,
|
|
|
+ key: v.goodsType,
|
|
|
+ options: (v.problem || []).map((s) => ({ text: s })),
|
|
|
+ icon: 'icon-wenjian',
|
|
|
+ disabled: !v.isUsed,
|
|
|
+ toast: '剑鱼正在冒着火星子搭建，敬请期待！'
|
|
|
+ }
|
|
|
+ })
|
|
|
+ doSelectQuestionType(promptModel.value.typeList[0])
|
|
|
+ }
|
|
|
+ })
|
|
|
+ doAjaxGetHistoryList()
|
|
|
+ }
|
|
|
+ getUserInfo()
|
|
|
+}
|
|
|
+
|
|
|
+init()
|
|
|
+</script>
|
|
|
+
|
|
|
+<template>
|
|
|
+ <div class="ai-search--page j-container">
|
|
|
+ <div
|
|
|
+ class="j-header ai-search--header flex flex-(items-center justify-between)"
|
|
|
+ :class="{ 'app-header-fill': $envs.inApp }"
|
|
|
+ >
|
|
|
+ <div class="flex flex-(items-center justify-between)">
|
|
|
+ <span class="back-icon" @click="doBack">
|
|
|
+ <i class="iconfont icon-back" />
|
|
|
+ </span>
|
|
|
+ <div class="flex flex-(items-center justify-between) header-left">
|
|
|
+ <img class="main-logo-img" src="@/assets/image/public/logo_new.png" />
|
|
|
+ <div class="main-logo">
|
|
|
+ <span class="main-text">剑鱼标讯</span>
|
|
|
+ <br />
|
|
|
+ <span>jianyu360.cn</span>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <Popover
|
|
|
+ v-model="rightAction.show"
|
|
|
+ placement="bottom-end"
|
|
|
+ :offset="[-16, 12]"
|
|
|
+ trigger="click"
|
|
|
+ :actions="rightAction.actions"
|
|
|
+ @select="onSelectRightAction"
|
|
|
+ >
|
|
|
+ <template #reference>
|
|
|
+ <span class="right-icon">
|
|
|
+ <i class="iconfont icon-gengduo-shuxiang" />
|
|
|
+ </span>
|
|
|
+ </template>
|
|
|
+ </Popover>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <div class="ai-search--content j-main" ref="contentEl">
|
|
|
+ <div
|
|
|
+ v-if="needBindPhone || needLogin"
|
|
|
+ class="bind-phone-popup"
|
|
|
+ @click="checkBindPhone"
|
|
|
+ />
|
|
|
+ <div v-if="askModel.list.length === 0" class="ai-search--empty">
|
|
|
+ <AppEmpty state="ai-logo">
|
|
|
+ 我是剑鱼标讯ＡI助手想找什么
|
|
|
+ <br />
|
|
|
+ 请开始问我吧!
|
|
|
+ </AppEmpty>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <div v-else class="ask-container">
|
|
|
+ <div
|
|
|
+ v-for="(item, index) in askModel.list"
|
|
|
+ :key="index"
|
|
|
+ class="ask-item"
|
|
|
+ :class="{ 'is-user': item.user }"
|
|
|
+ >
|
|
|
+ <div v-if="item.user" class="ask-item--default">
|
|
|
+ {{ item.message }}
|
|
|
+ </div>
|
|
|
+ <div v-else class="ask-item--custom flex flex-(col)">
|
|
|
+ <div class="flex flex-(items-center)">
|
|
|
+ <div class="ask-logo">
|
|
|
+ <img src="@/assets/image/ai-search/logo-head.png" alt="ai" />
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <div v-if="item.state === 0" class="flex flex-(items-center)">
|
|
|
+ {{ askStateMap[item.state] }}
|
|
|
+ <Loading style="margin-left: 8px" color="#2abed1" size="14px" />
|
|
|
+ </div>
|
|
|
+ <div v-if="item.state === 1">
|
|
|
+ {{ askStateMap[item.state] }}
|
|
|
+ </div>
|
|
|
+ <div v-if="item.state === 2">
|
|
|
+ <span>{{ askStateMap[item.state] }}</span>
|
|
|
+ <span class="highlight-text" @click="resetQuestion(item)"
|
|
|
+ >重新提问</span
|
|
|
+ >
|
|
|
+ </div>
|
|
|
+ <div v-if="item.state === 3">
|
|
|
+ {{ askStateMap[item.state] }}
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <div v-if="item.state === 3">
|
|
|
+ <div class="cell-list-container">
|
|
|
+ <div class="cell-list-tip">以下是我为您整理的数据样例</div>
|
|
|
+ <div
|
|
|
+ v-for="(cell, index) in item.list"
|
|
|
+ :key="index"
|
|
|
+ class="cell-list-item"
|
|
|
+ >
|
|
|
+ <ProjectCell
|
|
|
+ :key="cell.vKid"
|
|
|
+ v-visited:content="cell.id"
|
|
|
+ :class="cell.className"
|
|
|
+ card-type="detailed"
|
|
|
+ time-fmt="yyyy-MM-dd"
|
|
|
+ :detail-list="cell.detailList"
|
|
|
+ :title="cell.title"
|
|
|
+ :detail="cell.detail || null"
|
|
|
+ :filetext_search="cell.filetext_search"
|
|
|
+ :fs_keys="cell.fs_word"
|
|
|
+ :time="cell.dateTime"
|
|
|
+ :is-file="cell.isFile"
|
|
|
+ :keys="cell.splitKeys"
|
|
|
+ :left-top-badge-text="cell.leftTopBadgeText"
|
|
|
+ :tags="cell.tagList"
|
|
|
+ @click="goToDetail(cell)"
|
|
|
+ >
|
|
|
+ <template slot="icon">
|
|
|
+ <div @click.stop="doCollection(cell, index)">
|
|
|
+ <span
|
|
|
+ class="j-icon"
|
|
|
+ :class="{
|
|
|
+ 'icon-star-fill': cell.star,
|
|
|
+ 'icon-star-streak': !cell.star
|
|
|
+ }"
|
|
|
+ />
|
|
|
+ <span> {{ cell.star ? '已收藏' : '收藏' }}</span>
|
|
|
+ </div>
|
|
|
+ </template>
|
|
|
+ </ProjectCell>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div class="cell-list-more" @click="doLookMoreList(item)">
|
|
|
+ 已为您搜索到
|
|
|
+ <span class="highlight-text">{{ item.count }}</span>
|
|
|
+ 条，查看全部结果
|
|
|
+ <i class="iconfont icon-youbian" />
|
|
|
+ </div>
|
|
|
+ <div class="cell-list-actions flex flex-(items-center)">
|
|
|
+ <div
|
|
|
+ class="cell-action-icon mini-tip-container"
|
|
|
+ :class="{ 'is-active': item.like == 1 }"
|
|
|
+ @click="doCellAction(item, 'zan')"
|
|
|
+ >
|
|
|
+ <img
|
|
|
+ v-show="item.like == 0"
|
|
|
+ src="@/assets/image/ai-search/like.png"
|
|
|
+ alt="like"
|
|
|
+ />
|
|
|
+ <img
|
|
|
+ v-show="item.like == 1"
|
|
|
+ src="@/assets/image/ai-search/like-active.png"
|
|
|
+ alt="like-active"
|
|
|
+ />
|
|
|
+ <div class="tip-popver">感谢您的认可！</div>
|
|
|
+ </div>
|
|
|
+ <div
|
|
|
+ class="cell-action-icon"
|
|
|
+ @click="doCellAction(item, 'reload')"
|
|
|
+ >
|
|
|
+ <i class="iconfont icon-kecheng_shuaxin" />
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div ref="contentBottomEl"></div>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <Overlay
|
|
|
+ :z-index="2"
|
|
|
+ :duration="0"
|
|
|
+ :show="questionModel.inputTheme === 'full'"
|
|
|
+ @click="doClickInputIcon('scale')"
|
|
|
+ />
|
|
|
+ <div
|
|
|
+ class="question-input-container"
|
|
|
+ :class="{
|
|
|
+ [questionModel.inputTheme]: true,
|
|
|
+ 'in-ask': questionModel.nowId
|
|
|
+ }"
|
|
|
+ >
|
|
|
+ <div
|
|
|
+ v-show="
|
|
|
+ questionModel.inputTheme === 'scale' &&
|
|
|
+ promptModel.list.length > 0 &&
|
|
|
+ promptModel.show
|
|
|
+ "
|
|
|
+ class="question-prompt-container"
|
|
|
+ >
|
|
|
+ <Swipe
|
|
|
+ ref="promptEle"
|
|
|
+ :show-indicators="false"
|
|
|
+ :loop="false"
|
|
|
+ @change="onChangePrompt"
|
|
|
+ >
|
|
|
+ <SwipeItem v-for="(item, index) in promptModel.list" :key="index">
|
|
|
+ <div class="question-prompt-item">
|
|
|
+ <div
|
|
|
+ class="custom-indicator flex flex-(items-center justify-between)"
|
|
|
+ >
|
|
|
+ <span class="prompt-tip-text">您可以参照示例进行提问：</span>
|
|
|
+ <div
|
|
|
+ class="prompt-arrow flex flex-(items-center justify-between)"
|
|
|
+ >
|
|
|
+ <span
|
|
|
+ class="prompt-arrow-icon"
|
|
|
+ :class="{ active: index > 0 }"
|
|
|
+ @click="doChangePrompt(false)"
|
|
|
+ >
|
|
|
+ <i class="iconfont icon-up" />
|
|
|
+ </span>
|
|
|
+ <div>
|
|
|
+ {{ promptModel.current + 1 }} /
|
|
|
+ {{ promptModel.list.length }}
|
|
|
+ </div>
|
|
|
+ <span
|
|
|
+ class="prompt-arrow-icon"
|
|
|
+ :class="{ active: index < promptModel.list.length - 1 }"
|
|
|
+ @click="doChangePrompt(true)"
|
|
|
+ >
|
|
|
+ <i class="iconfont icon-down" />
|
|
|
+ </span>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div @click="doSelectPrompt(item)">
|
|
|
+ {{ item.text }}
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </SwipeItem>
|
|
|
+ </Swipe>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <div
|
|
|
+ v-show="questionModel.inputTheme === 'scale'"
|
|
|
+ class="question-type-container flex flex-(row items-center)"
|
|
|
+ >
|
|
|
+ <div
|
|
|
+ v-for="(item, index) in promptModel.typeList"
|
|
|
+ :key="index"
|
|
|
+ class="question-type-item"
|
|
|
+ :class="{
|
|
|
+ 'is-disable': item.disabled,
|
|
|
+ 'is-active': promptModel.type === item.key
|
|
|
+ }"
|
|
|
+ @click="doSelectQuestionType(item)"
|
|
|
+ >
|
|
|
+ <i class="iconfont" :class="item.icon" />
|
|
|
+ <span>{{ item.text }}</span>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <div class="question-input-item">
|
|
|
+ <Field
|
|
|
+ ref="questionInputEl"
|
|
|
+ v-model="questionModel.input"
|
|
|
+ center
|
|
|
+ v-bind="questionModelOptions"
|
|
|
+ type="textarea"
|
|
|
+ placeholder="发消息..."
|
|
|
+ @input="getQuestionInputHeight"
|
|
|
+ @change="getQuestionInputHeight"
|
|
|
+ >
|
|
|
+ <template #button>
|
|
|
+ <div
|
|
|
+ class="input-icon-container flex flex-(col items-center justify-between)"
|
|
|
+ :style="
|
|
|
+ questionModel.inputTheme === 'scale'
|
|
|
+ ? questionModel.style
|
|
|
+ : {}
|
|
|
+ "
|
|
|
+ >
|
|
|
+ <div
|
|
|
+ v-if="
|
|
|
+ questionModel.inputTheme === 'scale' &&
|
|
|
+ questionModel.iconShow
|
|
|
+ "
|
|
|
+ class="input-icon"
|
|
|
+ :style="{ 'margin-bottom': '8px' }"
|
|
|
+ @click="doClickInputIcon('full')"
|
|
|
+ >
|
|
|
+ <img
|
|
|
+ class="full-icon"
|
|
|
+ src="@/assets/image/ai-search/scale.png"
|
|
|
+ alt="submit"
|
|
|
+ />
|
|
|
+ </div>
|
|
|
+ <div
|
|
|
+ v-if="questionModel.inputTheme === 'full'"
|
|
|
+ class="input-icon"
|
|
|
+ @click="doClickInputIcon('scale')"
|
|
|
+ >
|
|
|
+ <img
|
|
|
+ class="scale-icon"
|
|
|
+ src="@/assets/image/ai-search/disscale.png"
|
|
|
+ alt="submit"
|
|
|
+ />
|
|
|
+ </div>
|
|
|
+ <div
|
|
|
+ class="input-icon"
|
|
|
+ :class="{ 'is-disabled': questionModel.input === '' }"
|
|
|
+ @click="doClickInputIcon('submit')"
|
|
|
+ >
|
|
|
+ <img
|
|
|
+ class="submit-icon"
|
|
|
+ src="@/assets/image/icon/icon-submit.png"
|
|
|
+ alt="submit"
|
|
|
+ />
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </template>
|
|
|
+ </Field>
|
|
|
+ </div>
|
|
|
+ <div class="safe-area-inside-bottom"></div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <Popup
|
|
|
+ v-model="moreListModel.show"
|
|
|
+ overlay-class="ai-search--history-overlay"
|
|
|
+ class="ai-search--more-popup"
|
|
|
+ :class="{ 'app-header-fill': $envs.inApp }"
|
|
|
+ position="right"
|
|
|
+ >
|
|
|
+ <div class="j-container">
|
|
|
+ <div
|
|
|
+ class="j-header more-list-header flex flex-(item-center justify-between)"
|
|
|
+ >
|
|
|
+ <div class="flex flex-(item-center)">
|
|
|
+ <div class="more-header-icon" @click="moreListModel.show = false">
|
|
|
+ <i class="iconfont icon-close_heidi" style="color: #c0c4cc" />
|
|
|
+ </div>
|
|
|
+ <div class="flex flex-(items-center)">
|
|
|
+ <img src="@/assets/image/ai-search/logo-head.png" alt="ai" />
|
|
|
+ <span class="tip-text">为您搜索到的结果</span>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div
|
|
|
+ class="more-header-icon mini-tip-container"
|
|
|
+ :class="{ 'is-active': moreLike.like == 1 }"
|
|
|
+ @click="doMoreLike"
|
|
|
+ >
|
|
|
+ <img
|
|
|
+ v-show="moreLike.like == 0"
|
|
|
+ src="@/assets/image/ai-search/like.png"
|
|
|
+ alt="like"
|
|
|
+ />
|
|
|
+ <img
|
|
|
+ v-show="moreLike.like == 1"
|
|
|
+ src="@/assets/image/ai-search/like-active.png"
|
|
|
+ alt="like-active"
|
|
|
+ />
|
|
|
+ <div class="tip-popver in-right">感谢您的认可！</div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div class="j-main more-list-container" ref="moreContentEl">
|
|
|
+ <div class="cell-list-container">
|
|
|
+ <div
|
|
|
+ v-for="(cell, index) in moreListModel.list"
|
|
|
+ :key="index"
|
|
|
+ class="cell-list-item"
|
|
|
+ >
|
|
|
+ <ProjectCell
|
|
|
+ :key="cell.vKid"
|
|
|
+ v-visited:content="cell.id"
|
|
|
+ :class="cell.className"
|
|
|
+ card-type="detailed"
|
|
|
+ time-fmt="yyyy-MM-dd"
|
|
|
+ :detail-list="cell.detailList"
|
|
|
+ :title="cell.title"
|
|
|
+ :detail="cell.detail || null"
|
|
|
+ :filetext_search="cell.filetext_search"
|
|
|
+ :fs_keys="cell.fs_word"
|
|
|
+ :time="cell.dateTime"
|
|
|
+ :is-file="cell.isFile"
|
|
|
+ :keys="cell.splitKeys"
|
|
|
+ :left-top-badge-text="cell.leftTopBadgeText"
|
|
|
+ :tags="cell.tagList"
|
|
|
+ @click="goToDetail(cell)"
|
|
|
+ >
|
|
|
+ <template slot="icon">
|
|
|
+ <div @click.stop="doCollection(cell, index)">
|
|
|
+ <span
|
|
|
+ class="j-icon"
|
|
|
+ :class="{
|
|
|
+ 'icon-star-fill': cell.star,
|
|
|
+ 'icon-star-streak': !cell.star
|
|
|
+ }"
|
|
|
+ />
|
|
|
+ <span> {{ cell.star ? '已收藏' : '收藏' }}</span>
|
|
|
+ </div>
|
|
|
+ </template>
|
|
|
+ </ProjectCell>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </Popup>
|
|
|
+
|
|
|
+ <Popup
|
|
|
+ v-model="historyModel.show"
|
|
|
+ overlay-class="ai-search--history-overlay"
|
|
|
+ class="ai-search--history-popup"
|
|
|
+ :class="{ 'app-header-fill': $envs.inApp }"
|
|
|
+ position="right"
|
|
|
+ >
|
|
|
+ <div class="j-container">
|
|
|
+ <div
|
|
|
+ class="j-header history-list-header flex flex-(items-center justify-between)"
|
|
|
+ >
|
|
|
+ <span>历史对话</span>
|
|
|
+ <div class="item-del-icon" @click="historyModel.show = false">
|
|
|
+ <i class="iconfont icon-delete_gray" />
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div class="j-main">
|
|
|
+ <div
|
|
|
+ v-if="historyListLabel.length > 0"
|
|
|
+ class="history-list-container"
|
|
|
+ >
|
|
|
+ <div
|
|
|
+ v-for="(label, index) in historyListLabel"
|
|
|
+ :key="index"
|
|
|
+ class="history-item-container"
|
|
|
+ >
|
|
|
+ <div class="history-list--time">
|
|
|
+ {{ label }}
|
|
|
+ </div>
|
|
|
+ <div
|
|
|
+ v-for="(item, iIndex) in historyModel.list[label]"
|
|
|
+ :key="iIndex"
|
|
|
+ class="history-list--item"
|
|
|
+ @click="goHistory(item)"
|
|
|
+ >
|
|
|
+ <div class="flex flex-(items-center justify-between)">
|
|
|
+ {{ item.question }}
|
|
|
+ <div class="item-del-icon" @click="doDelTask(item)">
|
|
|
+ <i class="iconfont icon-dataDelete" />
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div
|
|
|
+ v-else
|
|
|
+ class="history-empty-container flex flex-(col items-center justify-center)"
|
|
|
+ >
|
|
|
+ <div class="flex flex-(col items-center align-center)">
|
|
|
+ <AppEmpty state="back"> 您还没有和我聊天呢，现在开始吧 </AppEmpty>
|
|
|
+ <div class="new-question-button" @click="doNewQuestion">
|
|
|
+ 开启对话
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </Popup>
|
|
|
+ </div>
|
|
|
+</template>
|
|
|
+
|
|
|
+<style>
|
|
|
+.one-toast {
|
|
|
+ white-space: nowrap;
|
|
|
+}
|
|
|
+</style>
|
|
|
+<style lang="scss" scoped>
|
|
|
+.ai-search-- {
|
|
|
+ //
|
|
|
+ &page {
|
|
|
+ ::v-deep {
|
|
|
+ }
|
|
|
+
|
|
|
+ .bind-phone-popup {
|
|
|
+ width: 100%;
|
|
|
+ height: 100%;
|
|
|
+ position: absolute;
|
|
|
+ top: 0;
|
|
|
+ left: 0;
|
|
|
+ z-index: 6;
|
|
|
+ }
|
|
|
+
|
|
|
+ .new-question-button {
|
|
|
+ width: 160px;
|
|
|
+ height: 48px;
|
|
|
+ line-height: 48px;
|
|
|
+ border-radius: 8px;
|
|
|
+ background: linear-gradient(101.8deg, #2abed1 0%, #0a6cff 100%);
|
|
|
+ font-weight: 400;
|
|
|
+ font-size: 20px;
|
|
|
+ letter-spacing: 0px;
|
|
|
+ text-align: center;
|
|
|
+ color: #fff;
|
|
|
+ }
|
|
|
+
|
|
|
+ .mini-tip-container {
|
|
|
+ position: relative;
|
|
|
+
|
|
|
+ @keyframes showAndHide {
|
|
|
+ 0% {
|
|
|
+ opacity: 1;
|
|
|
+ }
|
|
|
+ 100% {
|
|
|
+ opacity: 0;
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ &.is-active {
|
|
|
+ .tip-popver {
|
|
|
+ display: inline-block;
|
|
|
+ opacity: 1;
|
|
|
+ transition: opacity 1.5s;
|
|
|
+ animation: showAndHide 2.2s forwards;
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ .tip-popver {
|
|
|
+ display: none;
|
|
|
+ opacity: 0;
|
|
|
+ transition: opacity 0s;
|
|
|
+ position: absolute;
|
|
|
+ top: -20px;
|
|
|
+ left: 30px;
|
|
|
+ border: 1px solid rgba(42, 190, 209, 0.12);
|
|
|
+ box-shadow: 0px 4px 12px 0px rgba(29, 29, 29, 0.1);
|
|
|
+ font-weight: 400;
|
|
|
+ font-size: 14px;
|
|
|
+ line-height: 20px;
|
|
|
+ color: rgba(95, 94, 100, 1);
|
|
|
+ padding: 6px 12px;
|
|
|
+ word-break: keep-all;
|
|
|
+ border-radius: 8px;
|
|
|
+ background: linear-gradient(
|
|
|
+ 167.96deg,
|
|
|
+ #ffffff 0%,
|
|
|
+ #edfeff 45.31%,
|
|
|
+ rgba(237, 254, 255, 0) 100%
|
|
|
+ );
|
|
|
+ &.in-right {
|
|
|
+ left: -240%;
|
|
|
+ top: 20px;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ .cell-list-more {
|
|
|
+ background: rgba(245, 246, 247, 1);
|
|
|
+ border-radius: 8px;
|
|
|
+ padding: 6px 12px;
|
|
|
+ margin: 12px 0;
|
|
|
+ }
|
|
|
+ .cell-list-actions {
|
|
|
+ .cell-action-icon {
|
|
|
+ margin-right: 2px;
|
|
|
+ width: 40px;
|
|
|
+ height: 40px;
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ justify-content: center;
|
|
|
+
|
|
|
+ img {
|
|
|
+ width: 20px;
|
|
|
+ }
|
|
|
+ i {
|
|
|
+ display: inline-block;
|
|
|
+ font-size: 18px;
|
|
|
+ line-height: 18px;
|
|
|
+ color: #5f5e64;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ .cell-list-container {
|
|
|
+ background: rgba(245, 246, 247, 1);
|
|
|
+ border-radius: 16px;
|
|
|
+ padding: 12px 6px;
|
|
|
+ margin-top: 12px;
|
|
|
+
|
|
|
+ .cell-list-tip {
|
|
|
+ color: #5f5e64;
|
|
|
+ font-size: 14px;
|
|
|
+ line-height: 24px;
|
|
|
+ margin-bottom: 8px;
|
|
|
+ margin-left: 10px;
|
|
|
+ }
|
|
|
+
|
|
|
+ .cell-list-item {
|
|
|
+ & + .cell-list-item {
|
|
|
+ margin-top: 8px;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ .ask-container {
|
|
|
+ background-color: #fff;
|
|
|
+ padding-bottom: 220px;
|
|
|
+ .ask-item {
|
|
|
+ font-weight: 400;
|
|
|
+ font-size: 14px;
|
|
|
+ line-height: 24px;
|
|
|
+ width: 100%;
|
|
|
+ display: flex;
|
|
|
+ margin-top: 12px;
|
|
|
+
|
|
|
+ &.is-user {
|
|
|
+ justify-content: end;
|
|
|
+ }
|
|
|
+
|
|
|
+ &--default {
|
|
|
+ color: #fff;
|
|
|
+ background-color: #2abed1;
|
|
|
+ border-radius: 16px;
|
|
|
+ border-bottom-right-radius: 0;
|
|
|
+ margin: 0 16px;
|
|
|
+ padding: 12px 16px;
|
|
|
+ width: auto;
|
|
|
+ }
|
|
|
+ &--custom {
|
|
|
+ text-align: left;
|
|
|
+ margin-left: 16px;
|
|
|
+ padding-right: 16px;
|
|
|
+ color: #9b9ca3;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .ask-logo {
|
|
|
+ width: 40px;
|
|
|
+ margin-right: 8px;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ &header {
|
|
|
+ background-color: #fff;
|
|
|
+ padding-top: 6px;
|
|
|
+ padding-bottom: 6px;
|
|
|
+
|
|
|
+ &.app-header-fill {
|
|
|
+ padding-top: $app-header-padding-top;
|
|
|
+ padding-bottom: unset;
|
|
|
+ }
|
|
|
+
|
|
|
+ &--left {
|
|
|
+ }
|
|
|
+
|
|
|
+ .main-logo {
|
|
|
+ color: rgba(155, 156, 163, 1);
|
|
|
+ font-size: 12px;
|
|
|
+ .main-text {
|
|
|
+ display: inline-block;
|
|
|
+ color: rgba(95, 94, 100, 1);
|
|
|
+ font-size: 16px;
|
|
|
+ line-height: 16px;
|
|
|
+ margin-bottom: 4px;
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ .main-logo-img {
|
|
|
+ width: 32px;
|
|
|
+ height: 32px;
|
|
|
+ margin-right: 8px;
|
|
|
+ }
|
|
|
+
|
|
|
+ .back-icon {
|
|
|
+ padding: 10px 12px;
|
|
|
+ margin-right: 24px;
|
|
|
+ i {
|
|
|
+ font-size: 24px;
|
|
|
+ color: #5f5e64;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .right-icon {
|
|
|
+ padding: 10px 12px;
|
|
|
+ i {
|
|
|
+ display: inline-block;
|
|
|
+ font-size: 24px;
|
|
|
+ color: rgba(39, 38, 54, 1);
|
|
|
+ transform: rotate(90deg);
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ &content {
|
|
|
+ height: 100vh;
|
|
|
+ background-color: #fff;
|
|
|
+
|
|
|
+ .question-input-container {
|
|
|
+ position: fixed;
|
|
|
+ background-color: #fff;
|
|
|
+ bottom: 0;
|
|
|
+ width: 100%;
|
|
|
+ z-index: 3;
|
|
|
+
|
|
|
+ .question-input-item {
|
|
|
+ margin: 16px;
|
|
|
+ border-radius: 8px;
|
|
|
+ box-shadow: 0px 4px 12px 0px rgba(29, 29, 29, 0.1);
|
|
|
+ border: 1px solid rgba(0, 0, 0, 0.05);
|
|
|
+ }
|
|
|
+
|
|
|
+ &.full {
|
|
|
+ bottom: 0;
|
|
|
+ height: 38vh;
|
|
|
+ border-top-left-radius: 8px;
|
|
|
+ border-top-right-radius: 8px;
|
|
|
+ background: url('@/assets/image/ai-search/bg.png') right no-repeat;
|
|
|
+ background-size: 100% 100%;
|
|
|
+ background-color: #fff;
|
|
|
+ .question-input-item {
|
|
|
+ box-shadow: unset;
|
|
|
+ border: unset;
|
|
|
+ margin: 0;
|
|
|
+ }
|
|
|
+ .van-field {
|
|
|
+ padding: 24px;
|
|
|
+ padding-right: 0;
|
|
|
+ background: transparent;
|
|
|
+ }
|
|
|
+ .input-icon {
|
|
|
+ padding-right: 24px;
|
|
|
+ }
|
|
|
+ ::v-deep {
|
|
|
+ .van-field__body,
|
|
|
+ .van-field__button,
|
|
|
+ .van-field__control {
|
|
|
+ height: 100% !important;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ &.scale {
|
|
|
+ }
|
|
|
+ &.in-ask {
|
|
|
+ padding-top: 12px;
|
|
|
+ border-top: 1px solid rgba(0, 0, 0, 0.05);
|
|
|
+ }
|
|
|
+
|
|
|
+ ::v-deep {
|
|
|
+ .question-input-item,
|
|
|
+ .van-field__value,
|
|
|
+ .van-field__button,
|
|
|
+ .input-icon-container,
|
|
|
+ .van-field {
|
|
|
+ height: 100% !important;
|
|
|
+ }
|
|
|
+
|
|
|
+ .van-field {
|
|
|
+ border-radius: 8px;
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ .input-icon {
|
|
|
+ &.is-disabled {
|
|
|
+ opacity: 0.55;
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ .input-icon-container {
|
|
|
+ }
|
|
|
+ .input-icon img {
|
|
|
+ width: 24px;
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ .question-type-container {
|
|
|
+ flex-wrap: nowrap;
|
|
|
+ width: 100%;
|
|
|
+ overflow: auto;
|
|
|
+ padding: 0 16px;
|
|
|
+
|
|
|
+ &::-webkit-scrollbar {
|
|
|
+ /* 隐藏滚动条 - Chrome 和 Safari */
|
|
|
+ display: none;
|
|
|
+ }
|
|
|
+
|
|
|
+ .question-type-item {
|
|
|
+ flex-shrink: 0;
|
|
|
+ border: 1px solid rgba(0, 0, 0, 0.1);
|
|
|
+ background-color: #fff;
|
|
|
+ color: #5f5e64;
|
|
|
+ height: 28px;
|
|
|
+ border-radius: 8px;
|
|
|
+ border-width: 1px;
|
|
|
+ padding-top: 4px;
|
|
|
+ padding-right: 12px;
|
|
|
+ padding-bottom: 4px;
|
|
|
+ padding-left: 12px;
|
|
|
+ margin-right: 8px;
|
|
|
+ font-size: 14px;
|
|
|
+ line-height: 20px;
|
|
|
+ display: flex;
|
|
|
+ flex-direction: row;
|
|
|
+ align-items: center;
|
|
|
+
|
|
|
+ i {
|
|
|
+ font-size: 20px;
|
|
|
+ margin-right: 2px;
|
|
|
+ }
|
|
|
+
|
|
|
+ &.is-active {
|
|
|
+ border-color: rgba(135, 223, 234, 1);
|
|
|
+ background-color: rgba(42, 190, 209, 0.08);
|
|
|
+ color: #2abed1;
|
|
|
+ }
|
|
|
+
|
|
|
+ &.is-disable {
|
|
|
+ border-color: rgba(0, 0, 0, 0.1);
|
|
|
+ background-color: rgba(255, 255, 255);
|
|
|
+ opacity: 0.3;
|
|
|
+ color: #5f5e64;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ .question-prompt-container {
|
|
|
+ .question-prompt-item {
|
|
|
+ min-height: 100px;
|
|
|
+ border-radius: 8px;
|
|
|
+ border: 1px solid var(--brand-2-abed-112, rgba(42, 190, 209, 0.12));
|
|
|
+ box-shadow: 0px 4px 12px 0px rgba(29, 29, 29, 0.1);
|
|
|
+ background: linear-gradient(
|
|
|
+ 167.96deg,
|
|
|
+ #ffffff 0%,
|
|
|
+ #edfeff 45.31%,
|
|
|
+ rgba(237, 254, 255, 0) 100%
|
|
|
+ );
|
|
|
+ font-size: 16px;
|
|
|
+ line-height: 24px;
|
|
|
+ padding: 12px;
|
|
|
+ margin: 16px;
|
|
|
+ color: rgba(23, 24, 38, 1);
|
|
|
+ }
|
|
|
+
|
|
|
+ .prompt-arrow {
|
|
|
+ .prompt-arrow-icon {
|
|
|
+ color: #c0c4cc;
|
|
|
+ &.active {
|
|
|
+ color: rgba(42, 190, 209, 1);
|
|
|
+ }
|
|
|
+ .icon-up {
|
|
|
+ display: inline-block;
|
|
|
+ transform: rotate(-90deg);
|
|
|
+ }
|
|
|
+ .icon-down {
|
|
|
+ display: inline-block;
|
|
|
+ transform: rotate(-90deg);
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ .custom-indicator {
|
|
|
+ font-size: 14px;
|
|
|
+ margin-bottom: 8px;
|
|
|
+ line-height: 20px;
|
|
|
+ color: rgba(95, 94, 100, 1);
|
|
|
+ }
|
|
|
+
|
|
|
+ ::v-deep {
|
|
|
+ .van-swipe__track {
|
|
|
+ align-items: end;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ &empty {
|
|
|
+ margin-top: 69px;
|
|
|
+ }
|
|
|
+
|
|
|
+ &history-overlay {
|
|
|
+ background-color: rgba(0, 0, 0, 0.5);
|
|
|
+ }
|
|
|
+ &history-popup {
|
|
|
+ height: 100%;
|
|
|
+ width: 280px;
|
|
|
+ background: url('@/assets/image/ai-search/bg.png') right no-repeat;
|
|
|
+ background-size: 100% 100%;
|
|
|
+ background-color: #fff;
|
|
|
+
|
|
|
+ &.app-header-fill {
|
|
|
+ padding-top: $app-header-padding-top;
|
|
|
+ }
|
|
|
+
|
|
|
+ .history-list-header {
|
|
|
+ font-weight: 500;
|
|
|
+ font-size: 20px;
|
|
|
+ line-height: 24px;
|
|
|
+ color: rgba(23, 24, 38, 1);
|
|
|
+ padding: 24px;
|
|
|
+ padding-bottom: 0;
|
|
|
+ margin-bottom: 8px;
|
|
|
+
|
|
|
+ .item-del-icon i {
|
|
|
+ font-size: 22px;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .item-del-icon {
|
|
|
+ padding: 4px;
|
|
|
+ margin-left: 12px;
|
|
|
+ i {
|
|
|
+ font-size: 18px;
|
|
|
+ color: #c8c9cc;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .history-empty-container {
|
|
|
+ height: 100%;
|
|
|
+ margin-top: -80px;
|
|
|
+ }
|
|
|
+ .history-list-container {
|
|
|
+ padding: 12px;
|
|
|
+ padding-bottom: 40px;
|
|
|
+ .history-item-container {
|
|
|
+ margin-bottom: 12px;
|
|
|
+ }
|
|
|
+ .history-list--time {
|
|
|
+ color: rgba(155, 156, 163, 1);
|
|
|
+ font-size: 14px;
|
|
|
+ line-height: 24px;
|
|
|
+ margin-left: 12px;
|
|
|
+ }
|
|
|
+
|
|
|
+ .history-list--item {
|
|
|
+ margin-top: 8px;
|
|
|
+ font-size: 14px;
|
|
|
+ line-height: 20px;
|
|
|
+ color: #171826;
|
|
|
+ padding: 10px 12px;
|
|
|
+ background: linear-gradient(
|
|
|
+ 167.96deg,
|
|
|
+ #ffffff 0%,
|
|
|
+ #edfeff 45.31%,
|
|
|
+ rgba(237, 254, 255, 0) 100%
|
|
|
+ );
|
|
|
+ border: 0.5px solid rgba(0, 0, 0, 0.1);
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ &more-popup {
|
|
|
+ width: 100vw;
|
|
|
+ height: 100vh;
|
|
|
+ background-color: #fff;
|
|
|
+
|
|
|
+ &.app-header-fill {
|
|
|
+ padding-top: $app-header-padding-top;
|
|
|
+ }
|
|
|
+
|
|
|
+ .more-list-container {
|
|
|
+ background: rgba(245, 246, 247, 1);
|
|
|
+ .cell-list-container {
|
|
|
+ border-radius: unset;
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ .more-list-header {
|
|
|
+ padding: 4px 10px;
|
|
|
+ .tip-text {
|
|
|
+ color: rgba(155, 156, 163, 1);
|
|
|
+ font-size: 14px;
|
|
|
+ line-height: 24px;
|
|
|
+ }
|
|
|
+
|
|
|
+ img {
|
|
|
+ width: 40px;
|
|
|
+ margin-right: 8px;
|
|
|
+ }
|
|
|
+ .more-header-icon {
|
|
|
+ padding: 10px;
|
|
|
+ img {
|
|
|
+ width: 22px;
|
|
|
+ }
|
|
|
+ i {
|
|
|
+ font-size: 20px;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+}
|
|
|
+</style>
|
