Browse Source

feat: 🚀 commit

pull/1/head
姜鑫 3 years ago
parent
commit
e31a067acf
  1. 4
      .drone.yml
  2. 4
      .tpl
  3. 2
      public/static/offline/JSON/GetDevCoordinateByIP.json
  4. 4
      public/static/offline/JSON/getConfig.json
  5. 18
      src/App.vue
  6. 47
      src/components/ScrollList/ScrollList.vue
  7. 34
      src/components/ScrollListItem/ScrollListItem.vue
  8. 6
      src/components/WeatherAndTime/WeatherAndTime.vue
  9. 33
      src/composables/useAutoBack.ts
  10. 2
      src/enums/index.ts
  11. 2
      src/http/http.ts
  12. 7
      src/types/customer.d.ts

4
.drone.yml

@ -68,7 +68,7 @@ steps:
- mv $zip_name ../ - mv $zip_name ../
# svn目录定义 开头和结尾不能有/,且不能出现中文乱码,复制地址时建议只复制02项目定制后的目录,会影响到变量取值 # svn目录定义 开头和结尾不能有/,且不能出现中文乱码,复制地址时建议只复制02项目定制后的目录,会影响到变量取值
- svndir="2022研发/Prd007_智能导视/02项目定制/BJ006北京京西大悦城/导视前端"
- svndir="2022研发/Prd007_智能导视/02项目定制/XT001永旺集团/前端导视"
# - svn_reponame=${svndir%%/*} # - svn_reponame=${svndir%%/*}
# - svn_path=${svndir##*/} # - svn_path=${svndir##*/}
# - echo 仓库内部子路径取值 $svn_path # - echo 仓库内部子路径取值 $svn_path
@ -104,7 +104,7 @@ steps:
image: lddsb/drone-dingtalk-message image: lddsb/drone-dingtalk-message
failure: ignore failure: ignore
settings: settings:
token: 'your dingTalk robot token'
token: 3f3b35d1e5bb3590550b81680d555f884200a5d13be679be19d15aa5ff7f0e0e
type: markdown type: markdown
message_color: true message_color: true
message_pic: true message_pic: true

4
.tpl

@ -1,9 +1,9 @@
<font color=[TPL_STATUS_COLOR] size="3"> <font color=[TPL_STATUS_COLOR] size="3">
项目svn地址:http://svn.1000my.com/svn/2022研发/Prd007_智能导视/02项目定制/
项目svn地址:http://svn.1000my.com/svn/2022研发/Prd007_智能导视/02项目定制/XT001永旺集团/前端导视
</font> </font>
<font color=[TPL_STATUS_COLOR] size="3"> <font color=[TPL_STATUS_COLOR] size="3">
项目git地址:https://git.1000my.com/
项目git地址:https://git.1000my.com/project_yongwangyun/YongWang_Customer.git
</font> </font>
<font color=[TPL_STATUS_COLOR] size="3"> <font color=[TPL_STATUS_COLOR] size="3">

2
public/static/offline/JSON/GetDevCoordinateByIP.json

@ -8,7 +8,7 @@
"xaxis": "93", "xaxis": "93",
"yaxis": "93", "yaxis": "93",
"angle": "0", "angle": "0",
"mallCode": "79b73dae-5d30-4f2f-ad07-d6bc648fb6dfhh",
"mallCode": "6686390f-1331-4275-81b7-0561545957d1",
"buildingCode": "79b73dae-5d30-4f2f-ad07-d6bc648fb66e", "buildingCode": "79b73dae-5d30-4f2f-ad07-d6bc648fb66e",
"buildingName": "A", "buildingName": "A",
"buildingOrder": 0, "buildingOrder": 0,

4
public/static/offline/JSON/getConfig.json

@ -1,8 +1,8 @@
{ {
"code": "200", "code": "200",
"data": { "data": {
"smallUrl": "http://121.199.30.36:8012/daoshi",
"bigUrl": "http://121.199.30.36:8012/mall",
"smallUrl": "http://192.168.1.130:8012/daoshi",
"bigUrl": "http://192.168.1.130:8012/Mall",
"baseUrl": "/static/offline" "baseUrl": "/static/offline"
}, },
"msg": "" "msg": ""

18
src/App.vue

@ -1,10 +1,26 @@
<template> <template>
<WeatherAndTime /> <WeatherAndTime />
<ScrollList />
<ScrollList ref="scrollList" />
</template> </template>
<script setup lang="ts"> <script setup lang="ts">
import { onMounted, onBeforeUnmount, ref } from 'vue'
import { useAutoBack } from '@/composables/useAutoBack'
import WeatherAndTime from '@/components/WeatherAndTime/WeatherAndTime.vue' import WeatherAndTime from '@/components/WeatherAndTime/WeatherAndTime.vue'
import ScrollList from '@/components/ScrollList/ScrollList.vue' import ScrollList from '@/components/ScrollList/ScrollList.vue'
const scrollList = ref<InstanceType<typeof ScrollList> | null>(null)
const { checkHandleScreen } = useAutoBack(_checkHandleScreen)
function _checkHandleScreen() {
scrollList.value?.scrollTop?.scrollTo(0, 0)
}
onMounted(() => {
window.addEventListener('touchend', checkHandleScreen)
})
onBeforeUnmount(() => {
window.removeEventListener('touchend', checkHandleScreen)
})
</script> </script>
<style> <style>

47
src/components/ScrollList/ScrollList.vue

@ -1,10 +1,19 @@
<template> <template>
<div class="relative rounded-[10px] bg-[#E9E9E9] mx-10 h-[936px]"> <div class="relative rounded-[10px] bg-[#E9E9E9] mx-10 h-[936px]">
<ScrollView pull-up class="relative w-[1840px]" :list="[]" scroll-x @scroll-end="scrollEnd">
<div class="inline-grid grid-rows-[repeat(2,430px)] grid-flow-col gap-4 px-6 whitespace-nowrap pt-[30px] pb-3">
<ScrollListItem v-for="item of customerList" :key="item.addTime" />
<ScrollView
ref="scrollTop"
pull-up
:scroll-top="false"
class="relative w-[1840px]"
:list="customerList"
scroll-x
@scroll-end="scrollEnd"
>
<div class="inline-grid grid-rows-[repeat(2,430px)] grid-flow-col gap-4 pl-6 pr-10 whitespace-nowrap pt-[30px] pb-3">
<ScrollListItem v-for="item of customerList" :key="item.addTime" :customer="item" />
<div class="flex-center row-span-2" :class="[isFirst ? 'col-end-[56]' : '']"> <div class="flex-center row-span-2" :class="[isFirst ? 'col-end-[56]' : '']">
<Loading v-if="!loaded" />
<Loading v-if="loading" />
<div v-if="loaded && customerList.length >= total && customerList.length" class="text-24 text-zinc-900 tb">没有更多数据</div>
</div> </div>
</div> </div>
<img <img
@ -13,7 +22,7 @@
src="../../assets/images/nodata.svg" src="../../assets/images/nodata.svg"
alt="" alt=""
/> />
<div class="absolute left-1/2 -translate-x-1/2 bottom-5 flex flex-col items-center">
<div v-if="customerList.length > 4" class="absolute left-1/2 -translate-x-1/2 bottom-5 flex flex-col items-center">
<img src="../../assets/images/hand.png" class="fadeInRight mb-[6px]" alt="" /> <img src="../../assets/images/hand.png" class="fadeInRight mb-[6px]" alt="" />
<p class="text-14 text-[#666]">左右滑动查看更多</p> <p class="text-14 text-[#666]">左右滑动查看更多</p>
</div> </div>
@ -35,17 +44,23 @@ const { config, device } = toRefs(store)
const customerList = ref<Customer[]>([]) const customerList = ref<Customer[]>([])
const pageIndex = ref(1) const pageIndex = ref(1)
const loading = ref(false)
const loaded = ref(false) const loaded = ref(false)
const isFirst = ref(true) const isFirst = ref(true)
const total = ref(0)
function scrollEnd() { function scrollEnd() {
console.log('scrollEnd')
pageIndex.value++
_getCustomerList()
} }
onMounted(_getCustomerList) onMounted(_getCustomerList)
function _getCustomerList() { function _getCustomerList() {
loaded.value = false
if (loading.value || loaded.value) {
return
}
loading.value = true
const params = { const params = {
pageIndex: pageIndex.value, pageIndex: pageIndex.value,
pageSize: 10, pageSize: 10,
@ -55,16 +70,30 @@ function _getCustomerList() {
.then(({ code, data }) => { .then(({ code, data }) => {
if (code === HTTP_CODE.ERR_OK) { if (code === HTTP_CODE.ERR_OK) {
customerList.value.push(...data.list) customerList.value.push(...data.list)
total.value = data.allCount
} }
}) })
.finally(() => { .finally(() => {
// isFirst.value = false
loaded.value = true
isFirst.value = false
loading.value = false
if (customerList.value.length >= total.value) {
loaded.value = true
}
}) })
} }
const scrollTop = ref()
defineExpose({
scrollTop
})
</script> </script>
<style> <style>
.tb {
writing-mode: tb;
letter-spacing: 6px;
}
.fadeInRight { .fadeInRight {
animation: fade-in-right 1s infinite; animation: fade-in-right 1s infinite;
} }

34
src/components/ScrollListItem/ScrollListItem.vue

@ -1,7 +1,9 @@
<template> <template>
<div class="flex flex-wrap pt-6 pl-6 pr-[6px] space-x-8 relative w-[720px] rounded-xl bg-white shadow-[3px_3px_0_0_rgba(0,0,0,0.10)]"> <div class="flex flex-wrap pt-6 pl-6 pr-[6px] space-x-8 relative w-[720px] rounded-xl bg-white shadow-[3px_3px_0_0_rgba(0,0,0,0.10)]">
<div class="flex-1 justify-between"> <div class="flex-1 justify-between">
<div class="text-justify text-[#808080] text-12 font-normal leading-[18px] mb-2">{{ customer.addTime }}</div>
<div class="text-justify text-[#808080] text-12 font-normal leading-[18px] mb-2">
{{ formatDate(customer.addTime) }}
</div>
<ScrollView class="relative h-[356px]" scrollbar :list="[]"> <ScrollView class="relative h-[356px]" scrollbar :list="[]">
<div class="text-justify text-[#C70082] text-16 font-normal leading-normal whitespace-normal pr-[14px]"> <div class="text-justify text-[#C70082] text-16 font-normal leading-normal whitespace-normal pr-[14px]">
Q:{{ customer.suggestionContent }} Q:{{ customer.suggestionContent }}
@ -9,11 +11,24 @@
</ScrollView> </ScrollView>
</div> </div>
<div class="flex-1"> <div class="flex-1">
<div class="text-justify text-[#808080] text-12 font-normal leading-[18px] mb-2">{{ customer.updateTime }}</div>
<div class="text-justify text-[#808080] text-12 font-normal leading-[18px] mb-2">
{{ formatDate(customer.updateTime) }}
</div>
<ScrollView class="relative h-[356px]" scrollbar observe-image :list="[]"> <ScrollView class="relative h-[356px]" scrollbar observe-image :list="[]">
<div class="text-justify text-[##333333] text-16 font-normal leading-normal whitespace-normal pr-[14px]"> <div class="text-justify text-[##333333] text-16 font-normal leading-normal whitespace-normal pr-[14px]">
A: A:
<div v-html="customer.replyContent"></div>
<div>
{{ customer.replyContent }}
<template v-if="customer.fileList?.length">
<img
v-for="item of customer.fileList"
:key="item.fileName"
:src="config.smallUrl + item.filePath"
class="block w-full"
alt=""
/>
</template>
</div>
</div> </div>
</ScrollView> </ScrollView>
</div> </div>
@ -21,15 +36,24 @@
</template> </template>
<script setup lang="ts"> <script setup lang="ts">
import { toRefs } from 'vue'
import { useRootStore } from '@/store/root'
import ScrollView from '@/base/ScrollView/ScrollView.vue' import ScrollView from '@/base/ScrollView/ScrollView.vue'
type Props = { type Props = {
customer: Customer customer: Customer
} }
withDefault(defineProps<Props>(), {
customer: {} as Customer
withDefaults(defineProps<Props>(), {
customer: () => ({} as Customer)
}) })
const store = useRootStore()
const { config } = toRefs(store)
function formatDate(date: string) {
return new Date(date).toLocaleString().replace(/\//g, '-').substring(0, 16)
}
</script> </script>
<style> <style>

6
src/components/WeatherAndTime/WeatherAndTime.vue

@ -1,11 +1,13 @@
<template> <template>
<div class="flex justify-between items-center py-7 px-10"> <div class="flex justify-between items-center py-7 px-10">
<img src="../../assets/images/logo.png" class="w-16 h-16" alt="" />
<div class="flex-1">
<img src="../../assets/images/logo.png" class="w-16 h-16" alt="" />
</div>
<div class="flex items-center space-x-4"> <div class="flex items-center space-x-4">
<img src="../../assets/images/heart.png" class="w-10 h-10" alt="" /> <img src="../../assets/images/heart.png" class="w-10 h-10" alt="" />
<p class="text-36 text-white font-bold">顾客心声</p> <p class="text-36 text-white font-bold">顾客心声</p>
</div> </div>
<div class="flex items-center">
<div class="flex-1 flex items-center justify-end">
<div class="w-9 h-9 mr-2"> <div class="w-9 h-9 mr-2">
<Icon :type="icon.type" color="#fff" /> <Icon :type="icon.type" color="#fff" />
</div> </div>

33
src/composables/useAutoBack.ts

@ -0,0 +1,33 @@
import { ref } from 'vue'
export const useAutoBack = (callback: () => void) => {
const MIN_TIME = 0
const CHECK_TIME = 1000
const TO_INDEX_TIME = 10
const toIndexTime = ref(TO_INDEX_TIME) //回首页的时间
const toIndexInterval = ref()
function sleepToIndex() {
return new Promise<void>(resolve => {
toIndexInterval.value = setInterval(() => {
toIndexTime.value--
if (toIndexTime.value <= MIN_TIME) {
clearInterval(toIndexInterval.value)
resolve()
}
}, CHECK_TIME)
})
}
async function checkHandleScreen() {
toIndexTime.value = TO_INDEX_TIME
clearInterval(toIndexInterval.value)
await sleepToIndex()
callback()
}
return {
checkHandleScreen
}
}

2
src/enums/index.ts

@ -19,7 +19,7 @@ export enum FEATURED {
} }
export enum HTTP_CODE { export enum HTTP_CODE {
ERR_OK = 200, //数据请求成功(可用于语音状态码)
ERR_OK = '200', //数据请求成功(可用于语音状态码)
ERR_DATA_NULL = 500, //语音无查询信息 ERR_DATA_NULL = 500, //语音无查询信息
ERR_OVER = 100, //语音播报完毕 ERR_OVER = 100, //语音播报完毕
ERR_NULL = '401', //未识别到语音 ERR_NULL = '401', //未识别到语音

2
src/http/http.ts

@ -96,7 +96,7 @@ const _request = new Request({
export type Response<T> = { export type Response<T> = {
msg: string msg: string
data: T data: T
code: number
code: number | string
} }
export const request = <T = any>(config: RequestConfig<Response<T>>) => _request.request(config) export const request = <T = any>(config: RequestConfig<Response<T>>) => _request.request(config)

7
src/types/customer.d.ts

@ -1,6 +1,13 @@
interface Customer { interface Customer {
suggestionContent: string suggestionContent: string
replyContent: string replyContent: string
fileList: {
extCode: string
fileCode: string
fileName: string
filePath: string
type: string
}[]
addTime: string addTime: string
updateTime: string updateTime: string
} }

Loading…
Cancel
Save