+
设备信息
@@ -196,7 +263,8 @@
@cancel="showProduct = false" />
-
+
@@ -213,14 +281,14 @@
@cancel="showDatePicker = false" />
-
+
-
+
-
![]()
+
@@ -234,14 +302,37 @@
+
+
+
+
+ 保存
+ 查看设备数据
+
diff --git a/public/config/config.json b/public/config/config.json
index d7d7fef..d02f6e9 100644
--- a/public/config/config.json
+++ b/public/config/config.json
@@ -1,6 +1,6 @@
{
"title":"燃气物联感知平台",
- "baseUrl": "http://111.198.10.15:11643",
+ "baseUrl": "http://111.198.10.15:11646",
"securityJsCode": "56bf9671d4b3517d294caec4751889a1",
"JsKey": "40849e82b4e33f5255b17372520c954d",
"xuntengMap": "http://111.198.10.15:11643/getMap?mapPath=http://172.17.206.70:20198/_allLayer/tile",
diff --git a/src/api/index.ts b/src/api/index.ts
index 103bf3b..9da5465 100644
--- a/src/api/index.ts
+++ b/src/api/index.ts
@@ -40,6 +40,7 @@
if (userStore.isLogin && request.headers) {
request.headers.token = userStore.token
}
+ // request.headers['Accept-Encoding'] = 'gzip, deflate, br, zstd'
// 是否将 POST 请求参数进行字符串化处理
if (request.method === 'post') {
// request.data = qs.stringify(request.data, {
diff --git a/src/api/mobile/1 b/src/api/mobile/1
deleted file mode 100644
index e69de29..0000000
--- a/src/api/mobile/1
+++ /dev/null
diff --git a/src/api/mobile/info.ts b/src/api/mobile/info.ts
new file mode 100644
index 0000000..7490f50
--- /dev/null
+++ b/src/api/mobile/info.ts
@@ -0,0 +1,21 @@
+/**
+ * 信息查询
+ */
+import request from '@/api/index'
+
+// 基础列表
+export function getInfoListPage(data: any) {
+ return request({
+ url: `/system/busDevice/listPage?limit=${data.limit}&offset=${data.offset}`,
+ method: 'post',
+ data,
+ })
+}
+// 查询设备数据
+export function getDeviceData(data: any) {
+ return request({
+ url: `system/busDevice/monitorData`,
+ method: 'post',
+ data,
+ })
+}
diff --git a/src/api/mobile/operation.ts b/src/api/mobile/operation.ts
new file mode 100644
index 0000000..3bfd174
--- /dev/null
+++ b/src/api/mobile/operation.ts
@@ -0,0 +1,35 @@
+/**
+ * 设备运维
+ */
+import request from '@/api/index'
+
+// 获取设备安装信息
+export function getDeviceInstall(devCode: any) {
+ return request({
+ url: `device/busRepairLog/getDeviceByCode/${devCode}`,
+ method: 'post',
+ })
+}
+// 上传图片
+export function uploadApi(data: FormData) {
+ return request({
+ url: '/system/busDevice/fileUpload',
+ method: 'post',
+ data,
+ })
+}
+// 获取图片地址
+export function getPhotoUrl(fileName: string) {
+ return request({
+ url: `/minio/file/url?fileName=${fileName}`,
+ method: 'get',
+ })
+}
+// 新建
+export function addDeviceInstall(data: any) {
+ return request({
+ url: '/device/busRepairLog/add',
+ method: 'post',
+ data,
+ })
+}
diff --git a/src/api/mobile/record.ts b/src/api/mobile/record.ts
index 42113c8..ed622fc 100644
--- a/src/api/mobile/record.ts
+++ b/src/api/mobile/record.ts
@@ -21,3 +21,10 @@
responseType: 'blob',
})
}
+
+export function getDeviceDetail(devcode: any) {
+ return request({
+ url: `/system/busDevice/getWellByDevCode/${devcode}`,
+ method: 'post',
+ })
+}
diff --git a/src/assets/mobile/device.png b/src/assets/mobile/device.png
index 1de66a4..bf7b9f5 100644
--- a/src/assets/mobile/device.png
+++ b/src/assets/mobile/device.png
Binary files differ
diff --git a/src/assets/mobile/expand.svg b/src/assets/mobile/expand.svg
new file mode 100644
index 0000000..4f18a55
--- /dev/null
+++ b/src/assets/mobile/expand.svg
@@ -0,0 +1 @@
+
\ No newline at end of file
diff --git a/src/assets/mobile/operation.png b/src/assets/mobile/operation.png
index 235f0a1..eeb540c 100644
--- a/src/assets/mobile/operation.png
+++ b/src/assets/mobile/operation.png
Binary files differ
diff --git a/src/assets/mobile/record.png b/src/assets/mobile/record.png
index dc479ca..63a6450 100644
--- a/src/assets/mobile/record.png
+++ b/src/assets/mobile/record.png
Binary files differ
diff --git a/src/assets/mobile/retract.svg b/src/assets/mobile/retract.svg
new file mode 100644
index 0000000..69db581
--- /dev/null
+++ b/src/assets/mobile/retract.svg
@@ -0,0 +1 @@
+
\ No newline at end of file
diff --git a/src/assets/mobile/search.png b/src/assets/mobile/search.png
index cb1dd4f..eb33171 100644
--- a/src/assets/mobile/search.png
+++ b/src/assets/mobile/search.png
Binary files differ
diff --git a/src/assets/mobile/user.png b/src/assets/mobile/user.png
index 92edf2d..a306341 100644
--- a/src/assets/mobile/user.png
+++ b/src/assets/mobile/user.png
Binary files differ
diff --git a/src/store/modules/user.ts b/src/store/modules/user.ts
index cc9fc78..d59cf45 100644
--- a/src/store/modules/user.ts
+++ b/src/store/modules/user.ts
@@ -1,7 +1,7 @@
import { reject } from 'lodash-es'
import useRouteStore from './route'
import useMenuStore from './menu'
-import { doLogin, getConfig, getInfo, getUserMenus } from '@/api/system/login'
+import { doLogin, getConfig, getInfo, getUserMenus, logout } from '@/api/system/login'
import { changePwd } from '@/api/system/user'
import type { Menu } from '@/global'
import { getPrivateKey, privateStr, setPrivateKey } from '@/utils/auth'
@@ -100,22 +100,28 @@
// 注销
logout() {
return new Promise
((resolve) => {
- const routeStore = useRouteStore()
- const menuStore = useMenuStore()
- localStorage.removeItem('username')
- localStorage.removeItem('token')
- localStorage.removeItem('nameId')
- localStorage.removeItem('depId')
- this.username = ''
- this.token = ''
- this.roleList = []
- this.roleNames = []
- routeStore.removeRoutes()
- menuStore.setActived(0)
- menuStore.resetBreadcrumb()
- // 清空缓存
- indexDB.deleteAll()
- resolve()
+ logout().then(() => {
+ const routeStore = useRouteStore()
+ const menuStore = useMenuStore()
+ localStorage.removeItem('username')
+ localStorage.removeItem('token')
+ localStorage.removeItem('nameId')
+ localStorage.removeItem('depId')
+ this.username = ''
+ this.token = ''
+ this.roleList = []
+ this.roleNames = []
+ routeStore.removeRoutes()
+ menuStore.setActived(0)
+ menuStore.resetBreadcrumb()
+ // 清空缓存
+ indexDB.deleteAll()
+ resolve()
+ })
+ .catch((error) => {
+ reject(error)
+ })
+
})
},
// 获取用户信息
@@ -143,7 +149,7 @@
this.username = res.data.account
this.name = res.data.name
resolve(res.data)
- console.log(indexDB.getStatus(),window.localStorage.getItem('browser-type-bj-well'), 'indexDB加载状态')
+ console.log(indexDB.getStatus(), window.localStorage.getItem('browser-type-bj-well'), 'indexDB加载状态')
if (indexDB.getStatus() && window.localStorage.getItem('browser-type-bj-well') === 'pc') {
// 重新拉取缓存
fetchCacheDevice()
diff --git a/src/utils/keepQuery.ts b/src/utils/keepQuery.ts
index 829b4b3..3b77c80 100644
--- a/src/utils/keepQuery.ts
+++ b/src/utils/keepQuery.ts
@@ -3,7 +3,7 @@
const keepAliveStore = useKeepAliveStore()
// 操作
-const needKeep = ['detail']
+const needKeep = ['detail', 'info/result', 'operation/data']
export function keepSearchParams(to: any, componentName: string) {
if (needKeep.some((item: string) => to.includes(item))) {
keepAliveStore.add(componentName)
diff --git a/src/views/home/device/device/index.vue b/src/views/home/device/device/index.vue
index cb76ade..1aa4006 100644
--- a/src/views/home/device/device/index.vue
+++ b/src/views/home/device/device/index.vue
@@ -77,7 +77,6 @@
})
// 查询数据
const fetchData = () => {
- console.log(123)
loadingTable.value = true
getDeviceListPage(listQuery.value).then((res) => {
list.value = []
diff --git a/src/views/mobile/dashboard/index.vue b/src/views/mobile/dashboard/index.vue
index a30e120..bc20597 100644
--- a/src/views/mobile/dashboard/index.vue
+++ b/src/views/mobile/dashboard/index.vue
@@ -152,13 +152,13 @@
.menu-item {
margin-top: 1.5rem;
width: 42%;
- border: 2px solid #0d76d4;
+ border: 2px solid #7cbaf0;
background-color: rgba($color: #0b0b0f, $alpha: 1%);
border-radius: 4px;
padding: 10px;
box-shadow: 0 0 12px rgb(0 0 0 / 12%);
font-weight: 700;
- color: #333;
+ color: #5f5e5e;
.img {
width: 100%;
@@ -168,6 +168,7 @@
img {
width: 40%;
margin: 0 auto;
+ border-radius: 25%;
}
}
@@ -196,6 +197,7 @@
right: 2rem;
width: 3rem;
height: 3rem;
+ border-radius: 25%;
}
}
diff --git a/src/views/mobile/dashboard/userInfo.vue b/src/views/mobile/dashboard/userInfo.vue
index 99418cf..4fff389 100644
--- a/src/views/mobile/dashboard/userInfo.vue
+++ b/src/views/mobile/dashboard/userInfo.vue
@@ -8,6 +8,7 @@
import useRouteStore from '@/store/modules/route'
// import useUserStore from '@/store/modules/user'
import { ElMessage, ElMessageBox } from 'element-plus'
+import { showConfirmDialog } from 'vant'
const userStore = useUserStore()
const routeStore = useRouteStore()
const userInfo = useUserStore()
@@ -27,15 +28,10 @@
})
// 退出登录
const logout = () => {
- ElMessageBox.confirm(
- '确认退出登录吗?',
- '',
- {
- confirmButtonText: '确认',
- cancelButtonText: '取消',
- type: 'warning',
- }
- ).then(() => {
+ showConfirmDialog({
+ title: '确认退出登录吗?',
+ })
+ .then(() => {
routeStore.removeRoutes()
userStore.logout().then(() => {
$router.push({
@@ -43,6 +39,15 @@
})
})
})
+ // ElMessageBox.confirm(
+ // '确认退出登录吗?',
+ // '',
+ // {
+ // confirmButtonText: '确认',
+ // cancelButtonText: '取消',
+ // type: 'warning',
+ // }
+ // )
}
diff --git a/src/views/mobile/device/add.vue b/src/views/mobile/device/add.vue
index 1ad4bbd..3857e6c 100644
--- a/src/views/mobile/device/add.vue
+++ b/src/views/mobile/device/add.vue
@@ -11,6 +11,10 @@
import { showToast, showLoadingToast, closeToast, showConfirmDialog } from 'vant'
import { getWellListPage } from '@/api/home/well/well'
import { getStationListPage } from '@/api/home/station/station'
+import AMap from '@/components/map/index.vue'
+import { keepSearchParams } from '@/utils/keepQuery'
+import { uploadApi } from '@/api/mobile/operation'
+const $router = useRouter()
const deciceInfo = ref({
productId: '',
productName: '',
@@ -18,7 +22,6 @@
tagNumber: '',
watchObject: '',
installDate: '',
- photo: []
})
// 产品相关
@@ -88,8 +91,6 @@
// }
}
-// const
-
// 安装日期
const showDatePicker = ref(false)
const pickerValueInstallDate = ref([])
@@ -102,10 +103,10 @@
showDatePicker.value = false
}
// 现场照片
-// const showCamera = ref(false)
+const photo = ref([])
// 拍照
const takePictures = () => {
- if(deciceInfo.value.photo.length >= 3) {
+ if (deciceInfo.value.photo.length >= 3) {
showToast('最多上传三张照片')
return
}
@@ -118,11 +119,19 @@
// 原生上传
if (event.target.files?.length !== 0) {
const file = event.target.files[0]
- const reader = new FileReader() // 实例化FileReader
- reader.readAsDataURL(file)
+ const fd = new FormData()
+ fd.append('file', file)
+ uploadApi(fd).then(res => {
+ photo.value.push(res.data as string)
+ fileRef.value.value = ''
+ }).catch(() => {
+ fileRef.value.value = ''
+ })
+ // const reader = new FileReader() // 实例化FileReader
+ // reader.readAsDataURL(file)
// 读取成功以后执行的方法
- reader.onload = (e) => {
- deciceInfo.value.photo.push(e.target.result)
+ // reader.onload = (e) => {
+ // deciceInfo.value.photo.push(e.target.result)
// let img = new Image()
// // base64
// img.src = e.target.result
@@ -130,29 +139,30 @@
// img.onload = () => {
// imagetoCanvas(img) //Image 对象转变为一个 Canvas 类型对象,i为遍历的下标
// }
- }
+ // }
}
}
+// 图片地址
+const getPhotoUrl = computed(() => {
+ return (url: string) => {
+ return `${window.localStorage.getItem('url-bj-well')}/static/${url}`
+ }
+})
// 删除图片
const deletePhoto = (index: number) => {
- deciceInfo.value.photo.splice(index, 1)
+ photo.value.splice(index, 1)
}
// 预览图片
const previewPhoto = (index: number) => {
showImagePreview({
- images: deciceInfo.value.photo,
+ images: photo.value,
startPosition: index
})
}
-// 关闭摄像头
-// const closeCamera = () => {
-// showCamera.value = false
-// }
// 获取字典
const deviceTypeList = ref([]) // 设备类型列表
const fetchDict = () => {
getProductListPage({ offset: 1, limit: 9999 }).then(res => {
- console.log(res.data.rows, '产品列表')
productColumns.value = res.data.rows.map((item: any) => ({
text: `${item.productName}-${item.productCode}`,
value: item.id,
@@ -170,20 +180,77 @@
const select = productColumns.value.filter((item: any) => item.value === newVal) as any
const watchObject = deviceTypeList.value.filter((item: any) => item.id === select[0].deviceType)
deciceInfo.value.watchObject = watchObject[0].watchObject
-
}
else {
deciceInfo.value.tagNumber = ''
deciceInfo.value.watchObject = ''
}
})
-const empty = ref('')
+
+
+// 计算地图区域高度
+const scrollHeight = ref(0)
+const calcHeight = () => {
+ // 公共头部高度40
+ // 边距安全 30
+ // 底部按钮
+ const exportBtnHeight = document.getElementById('handler-btn')?.offsetHeight || 0
+ // 头部
+ const searchHeaderHeight = document.getElementById('info-area')?.offsetHeight || 0
+ scrollHeight.value = window.innerHeight - 40 - exportBtnHeight - searchHeaderHeight - 30
+}
+onMounted(() => {
+ calcHeight()
+})
+
+window.addEventListener('resize', () => {
+ calcHeight()
+})
+onBeforeUnmount(() => {
+ window.addEventListener('resize', () => { })
+})
+// 地图操作
+const mapRef = ref()
+// 当前状态 收起retract/展开expand
+const mapStatus = ref('expand')
+const changeStatus = () => {
+ if (mapStatus.value === 'expand') {
+ mapStatus.value = 'retract'
+ }
+ else {
+ mapStatus.value = 'expand'
+ }
+
+}
+// 重置地图到初始状态
+const resetMap = () => {
+ // mapRef.value.map.setCenter(position.value)
+ // mapRef.value.map.setZoom(17.5)
+}
+
+// 查看数据
+const deviceData = () => {
+ if (!deciceInfo.value.devcode) {
+ showToast('设备编号不能为空')
+ return
+ }
+ $router.push({
+ name: 'OperationData',
+ query: {
+ devcode: deciceInfo.value.devcode
+ }
+ })
+}
+// 页面缓存
+onBeforeRouteLeave((to: any) => {
+ keepSearchParams(to.path, 'H5DeviceAdd')
+})
-
+
设备信息
@@ -196,7 +263,8 @@
@cancel="showProduct = false" />
-
+
@@ -213,14 +281,14 @@
@cancel="showDatePicker = false" />
-
+
-
+
-
![]()
+
@@ -234,14 +302,37 @@
+
+
+
+
+ 保存
+ 查看设备数据
+
diff --git a/src/views/mobile/info/detail.vue b/src/views/mobile/info/detail.vue
index c2696dc..ef0f0fb 100644
--- a/src/views/mobile/info/detail.vue
+++ b/src/views/mobile/info/detail.vue
@@ -6,78 +6,27 @@
diff --git a/src/views/mobile/device/add.vue b/src/views/mobile/device/add.vue
index 1ad4bbd..3857e6c 100644
--- a/src/views/mobile/device/add.vue
+++ b/src/views/mobile/device/add.vue
@@ -11,6 +11,10 @@
import { showToast, showLoadingToast, closeToast, showConfirmDialog } from 'vant'
import { getWellListPage } from '@/api/home/well/well'
import { getStationListPage } from '@/api/home/station/station'
+import AMap from '@/components/map/index.vue'
+import { keepSearchParams } from '@/utils/keepQuery'
+import { uploadApi } from '@/api/mobile/operation'
+const $router = useRouter()
const deciceInfo = ref({
productId: '',
productName: '',
@@ -18,7 +22,6 @@
tagNumber: '',
watchObject: '',
installDate: '',
- photo: []
})
// 产品相关
@@ -88,8 +91,6 @@
// }
}
-// const
-
// 安装日期
const showDatePicker = ref(false)
const pickerValueInstallDate = ref
([])
@@ -102,10 +103,10 @@
showDatePicker.value = false
}
// 现场照片
-// const showCamera = ref(false)
+const photo = ref([])
// 拍照
const takePictures = () => {
- if(deciceInfo.value.photo.length >= 3) {
+ if (deciceInfo.value.photo.length >= 3) {
showToast('最多上传三张照片')
return
}
@@ -118,11 +119,19 @@
// 原生上传
if (event.target.files?.length !== 0) {
const file = event.target.files[0]
- const reader = new FileReader() // 实例化FileReader
- reader.readAsDataURL(file)
+ const fd = new FormData()
+ fd.append('file', file)
+ uploadApi(fd).then(res => {
+ photo.value.push(res.data as string)
+ fileRef.value.value = ''
+ }).catch(() => {
+ fileRef.value.value = ''
+ })
+ // const reader = new FileReader() // 实例化FileReader
+ // reader.readAsDataURL(file)
// 读取成功以后执行的方法
- reader.onload = (e) => {
- deciceInfo.value.photo.push(e.target.result)
+ // reader.onload = (e) => {
+ // deciceInfo.value.photo.push(e.target.result)
// let img = new Image()
// // base64
// img.src = e.target.result
@@ -130,29 +139,30 @@
// img.onload = () => {
// imagetoCanvas(img) //Image 对象转变为一个 Canvas 类型对象,i为遍历的下标
// }
- }
+ // }
}
}
+// 图片地址
+const getPhotoUrl = computed(() => {
+ return (url: string) => {
+ return `${window.localStorage.getItem('url-bj-well')}/static/${url}`
+ }
+})
// 删除图片
const deletePhoto = (index: number) => {
- deciceInfo.value.photo.splice(index, 1)
+ photo.value.splice(index, 1)
}
// 预览图片
const previewPhoto = (index: number) => {
showImagePreview({
- images: deciceInfo.value.photo,
+ images: photo.value,
startPosition: index
})
}
-// 关闭摄像头
-// const closeCamera = () => {
-// showCamera.value = false
-// }
// 获取字典
const deviceTypeList = ref([]) // 设备类型列表
const fetchDict = () => {
getProductListPage({ offset: 1, limit: 9999 }).then(res => {
- console.log(res.data.rows, '产品列表')
productColumns.value = res.data.rows.map((item: any) => ({
text: `${item.productName}-${item.productCode}`,
value: item.id,
@@ -170,20 +180,77 @@
const select = productColumns.value.filter((item: any) => item.value === newVal) as any
const watchObject = deviceTypeList.value.filter((item: any) => item.id === select[0].deviceType)
deciceInfo.value.watchObject = watchObject[0].watchObject
-
}
else {
deciceInfo.value.tagNumber = ''
deciceInfo.value.watchObject = ''
}
})
-const empty = ref('')
+
+
+// 计算地图区域高度
+const scrollHeight = ref(0)
+const calcHeight = () => {
+ // 公共头部高度40
+ // 边距安全 30
+ // 底部按钮
+ const exportBtnHeight = document.getElementById('handler-btn')?.offsetHeight || 0
+ // 头部
+ const searchHeaderHeight = document.getElementById('info-area')?.offsetHeight || 0
+ scrollHeight.value = window.innerHeight - 40 - exportBtnHeight - searchHeaderHeight - 30
+}
+onMounted(() => {
+ calcHeight()
+})
+
+window.addEventListener('resize', () => {
+ calcHeight()
+})
+onBeforeUnmount(() => {
+ window.addEventListener('resize', () => { })
+})
+// 地图操作
+const mapRef = ref()
+// 当前状态 收起retract/展开expand
+const mapStatus = ref('expand')
+const changeStatus = () => {
+ if (mapStatus.value === 'expand') {
+ mapStatus.value = 'retract'
+ }
+ else {
+ mapStatus.value = 'expand'
+ }
+
+}
+// 重置地图到初始状态
+const resetMap = () => {
+ // mapRef.value.map.setCenter(position.value)
+ // mapRef.value.map.setZoom(17.5)
+}
+
+// 查看数据
+const deviceData = () => {
+ if (!deciceInfo.value.devcode) {
+ showToast('设备编号不能为空')
+ return
+ }
+ $router.push({
+ name: 'OperationData',
+ query: {
+ devcode: deciceInfo.value.devcode
+ }
+ })
+}
+// 页面缓存
+onBeforeRouteLeave((to: any) => {
+ keepSearchParams(to.path, 'H5DeviceAdd')
+})
-
+
设备信息
@@ -196,7 +263,8 @@
@cancel="showProduct = false" />
-
+
@@ -213,14 +281,14 @@
@cancel="showDatePicker = false" />
-
+
-
+
-
![]()
+
@@ -234,14 +302,37 @@
+
+
+
+
+ 保存
+ 查看设备数据
+
diff --git a/src/views/mobile/info/detail.vue b/src/views/mobile/info/detail.vue
index c2696dc..ef0f0fb 100644
--- a/src/views/mobile/info/detail.vue
+++ b/src/views/mobile/info/detail.vue
@@ -6,78 +6,27 @@
@@ -93,13 +110,15 @@
查询结果
-
-
-
+
+
+ detail(event, item)">
{{ item.devcode }}
设备类型
-
{{ item.devTypeName }}
+
{{ item.typeName }}
安装位置
@@ -108,14 +127,16 @@
安装日期
@@ -123,6 +144,10 @@
+
+
+
+
@@ -164,6 +189,7 @@
.title {
display: flex;
font-size: 1.1rem;
+
// border-left: 4px solid #0d76d4;
// border-radius: 2px;
.symbol {
@@ -182,6 +208,7 @@
.result-item {
padding: 4px;
+
// box-shadow: 0px 12px 32px 4px rgba(0, 0, 0, .04), 0px 8px 20px rgba(0, 0, 0, .08);
.devcode {
font-weight: 700;
@@ -200,6 +227,15 @@
color: #888;
width: 80%;
text-align: right;
+ white-space: nowrap;
+
+ /* 确保文本在一行内显示 */
+ overflow: hidden;
+
+ /* 超出容器部分隐藏 */
+ text-overflow: ellipsis;
+
+ /* 文字溢出显示省略号 */
}
.title {
diff --git a/public/config/config.json b/public/config/config.json
index d7d7fef..d02f6e9 100644
--- a/public/config/config.json
+++ b/public/config/config.json
@@ -1,6 +1,6 @@
{
"title":"燃气物联感知平台",
- "baseUrl": "http://111.198.10.15:11643",
+ "baseUrl": "http://111.198.10.15:11646",
"securityJsCode": "56bf9671d4b3517d294caec4751889a1",
"JsKey": "40849e82b4e33f5255b17372520c954d",
"xuntengMap": "http://111.198.10.15:11643/getMap?mapPath=http://172.17.206.70:20198/_allLayer/tile",
diff --git a/src/api/index.ts b/src/api/index.ts
index 103bf3b..9da5465 100644
--- a/src/api/index.ts
+++ b/src/api/index.ts
@@ -40,6 +40,7 @@
if (userStore.isLogin && request.headers) {
request.headers.token = userStore.token
}
+ // request.headers['Accept-Encoding'] = 'gzip, deflate, br, zstd'
// 是否将 POST 请求参数进行字符串化处理
if (request.method === 'post') {
// request.data = qs.stringify(request.data, {
diff --git a/src/api/mobile/1 b/src/api/mobile/1
deleted file mode 100644
index e69de29..0000000
--- a/src/api/mobile/1
+++ /dev/null
diff --git a/src/api/mobile/info.ts b/src/api/mobile/info.ts
new file mode 100644
index 0000000..7490f50
--- /dev/null
+++ b/src/api/mobile/info.ts
@@ -0,0 +1,21 @@
+/**
+ * 信息查询
+ */
+import request from '@/api/index'
+
+// 基础列表
+export function getInfoListPage(data: any) {
+ return request({
+ url: `/system/busDevice/listPage?limit=${data.limit}&offset=${data.offset}`,
+ method: 'post',
+ data,
+ })
+}
+// 查询设备数据
+export function getDeviceData(data: any) {
+ return request({
+ url: `system/busDevice/monitorData`,
+ method: 'post',
+ data,
+ })
+}
diff --git a/src/api/mobile/operation.ts b/src/api/mobile/operation.ts
new file mode 100644
index 0000000..3bfd174
--- /dev/null
+++ b/src/api/mobile/operation.ts
@@ -0,0 +1,35 @@
+/**
+ * 设备运维
+ */
+import request from '@/api/index'
+
+// 获取设备安装信息
+export function getDeviceInstall(devCode: any) {
+ return request({
+ url: `device/busRepairLog/getDeviceByCode/${devCode}`,
+ method: 'post',
+ })
+}
+// 上传图片
+export function uploadApi(data: FormData) {
+ return request({
+ url: '/system/busDevice/fileUpload',
+ method: 'post',
+ data,
+ })
+}
+// 获取图片地址
+export function getPhotoUrl(fileName: string) {
+ return request({
+ url: `/minio/file/url?fileName=${fileName}`,
+ method: 'get',
+ })
+}
+// 新建
+export function addDeviceInstall(data: any) {
+ return request({
+ url: '/device/busRepairLog/add',
+ method: 'post',
+ data,
+ })
+}
diff --git a/src/api/mobile/record.ts b/src/api/mobile/record.ts
index 42113c8..ed622fc 100644
--- a/src/api/mobile/record.ts
+++ b/src/api/mobile/record.ts
@@ -21,3 +21,10 @@
responseType: 'blob',
})
}
+
+export function getDeviceDetail(devcode: any) {
+ return request({
+ url: `/system/busDevice/getWellByDevCode/${devcode}`,
+ method: 'post',
+ })
+}
diff --git a/src/assets/mobile/device.png b/src/assets/mobile/device.png
index 1de66a4..bf7b9f5 100644
--- a/src/assets/mobile/device.png
+++ b/src/assets/mobile/device.png
Binary files differ
diff --git a/src/assets/mobile/expand.svg b/src/assets/mobile/expand.svg
new file mode 100644
index 0000000..4f18a55
--- /dev/null
+++ b/src/assets/mobile/expand.svg
@@ -0,0 +1 @@
+
\ No newline at end of file
diff --git a/src/assets/mobile/operation.png b/src/assets/mobile/operation.png
index 235f0a1..eeb540c 100644
--- a/src/assets/mobile/operation.png
+++ b/src/assets/mobile/operation.png
Binary files differ
diff --git a/src/assets/mobile/record.png b/src/assets/mobile/record.png
index dc479ca..63a6450 100644
--- a/src/assets/mobile/record.png
+++ b/src/assets/mobile/record.png
Binary files differ
diff --git a/src/assets/mobile/retract.svg b/src/assets/mobile/retract.svg
new file mode 100644
index 0000000..69db581
--- /dev/null
+++ b/src/assets/mobile/retract.svg
@@ -0,0 +1 @@
+
\ No newline at end of file
diff --git a/src/assets/mobile/search.png b/src/assets/mobile/search.png
index cb1dd4f..eb33171 100644
--- a/src/assets/mobile/search.png
+++ b/src/assets/mobile/search.png
Binary files differ
diff --git a/src/assets/mobile/user.png b/src/assets/mobile/user.png
index 92edf2d..a306341 100644
--- a/src/assets/mobile/user.png
+++ b/src/assets/mobile/user.png
Binary files differ
diff --git a/src/store/modules/user.ts b/src/store/modules/user.ts
index cc9fc78..d59cf45 100644
--- a/src/store/modules/user.ts
+++ b/src/store/modules/user.ts
@@ -1,7 +1,7 @@
import { reject } from 'lodash-es'
import useRouteStore from './route'
import useMenuStore from './menu'
-import { doLogin, getConfig, getInfo, getUserMenus } from '@/api/system/login'
+import { doLogin, getConfig, getInfo, getUserMenus, logout } from '@/api/system/login'
import { changePwd } from '@/api/system/user'
import type { Menu } from '@/global'
import { getPrivateKey, privateStr, setPrivateKey } from '@/utils/auth'
@@ -100,22 +100,28 @@
// 注销
logout() {
return new Promise((resolve) => {
- const routeStore = useRouteStore()
- const menuStore = useMenuStore()
- localStorage.removeItem('username')
- localStorage.removeItem('token')
- localStorage.removeItem('nameId')
- localStorage.removeItem('depId')
- this.username = ''
- this.token = ''
- this.roleList = []
- this.roleNames = []
- routeStore.removeRoutes()
- menuStore.setActived(0)
- menuStore.resetBreadcrumb()
- // 清空缓存
- indexDB.deleteAll()
- resolve()
+ logout().then(() => {
+ const routeStore = useRouteStore()
+ const menuStore = useMenuStore()
+ localStorage.removeItem('username')
+ localStorage.removeItem('token')
+ localStorage.removeItem('nameId')
+ localStorage.removeItem('depId')
+ this.username = ''
+ this.token = ''
+ this.roleList = []
+ this.roleNames = []
+ routeStore.removeRoutes()
+ menuStore.setActived(0)
+ menuStore.resetBreadcrumb()
+ // 清空缓存
+ indexDB.deleteAll()
+ resolve()
+ })
+ .catch((error) => {
+ reject(error)
+ })
+
})
},
// 获取用户信息
@@ -143,7 +149,7 @@
this.username = res.data.account
this.name = res.data.name
resolve(res.data)
- console.log(indexDB.getStatus(),window.localStorage.getItem('browser-type-bj-well'), 'indexDB加载状态')
+ console.log(indexDB.getStatus(), window.localStorage.getItem('browser-type-bj-well'), 'indexDB加载状态')
if (indexDB.getStatus() && window.localStorage.getItem('browser-type-bj-well') === 'pc') {
// 重新拉取缓存
fetchCacheDevice()
diff --git a/src/utils/keepQuery.ts b/src/utils/keepQuery.ts
index 829b4b3..3b77c80 100644
--- a/src/utils/keepQuery.ts
+++ b/src/utils/keepQuery.ts
@@ -3,7 +3,7 @@
const keepAliveStore = useKeepAliveStore()
// 操作
-const needKeep = ['detail']
+const needKeep = ['detail', 'info/result', 'operation/data']
export function keepSearchParams(to: any, componentName: string) {
if (needKeep.some((item: string) => to.includes(item))) {
keepAliveStore.add(componentName)
diff --git a/src/views/home/device/device/index.vue b/src/views/home/device/device/index.vue
index cb76ade..1aa4006 100644
--- a/src/views/home/device/device/index.vue
+++ b/src/views/home/device/device/index.vue
@@ -77,7 +77,6 @@
})
// 查询数据
const fetchData = () => {
- console.log(123)
loadingTable.value = true
getDeviceListPage(listQuery.value).then((res) => {
list.value = []
diff --git a/src/views/mobile/dashboard/index.vue b/src/views/mobile/dashboard/index.vue
index a30e120..bc20597 100644
--- a/src/views/mobile/dashboard/index.vue
+++ b/src/views/mobile/dashboard/index.vue
@@ -152,13 +152,13 @@
.menu-item {
margin-top: 1.5rem;
width: 42%;
- border: 2px solid #0d76d4;
+ border: 2px solid #7cbaf0;
background-color: rgba($color: #0b0b0f, $alpha: 1%);
border-radius: 4px;
padding: 10px;
box-shadow: 0 0 12px rgb(0 0 0 / 12%);
font-weight: 700;
- color: #333;
+ color: #5f5e5e;
.img {
width: 100%;
@@ -168,6 +168,7 @@
img {
width: 40%;
margin: 0 auto;
+ border-radius: 25%;
}
}
@@ -196,6 +197,7 @@
right: 2rem;
width: 3rem;
height: 3rem;
+ border-radius: 25%;
}
}
diff --git a/src/views/mobile/dashboard/userInfo.vue b/src/views/mobile/dashboard/userInfo.vue
index 99418cf..4fff389 100644
--- a/src/views/mobile/dashboard/userInfo.vue
+++ b/src/views/mobile/dashboard/userInfo.vue
@@ -8,6 +8,7 @@
import useRouteStore from '@/store/modules/route'
// import useUserStore from '@/store/modules/user'
import { ElMessage, ElMessageBox } from 'element-plus'
+import { showConfirmDialog } from 'vant'
const userStore = useUserStore()
const routeStore = useRouteStore()
const userInfo = useUserStore()
@@ -27,15 +28,10 @@
})
// 退出登录
const logout = () => {
- ElMessageBox.confirm(
- '确认退出登录吗?',
- '',
- {
- confirmButtonText: '确认',
- cancelButtonText: '取消',
- type: 'warning',
- }
- ).then(() => {
+ showConfirmDialog({
+ title: '确认退出登录吗?',
+ })
+ .then(() => {
routeStore.removeRoutes()
userStore.logout().then(() => {
$router.push({
@@ -43,6 +39,15 @@
})
})
})
+ // ElMessageBox.confirm(
+ // '确认退出登录吗?',
+ // '',
+ // {
+ // confirmButtonText: '确认',
+ // cancelButtonText: '取消',
+ // type: 'warning',
+ // }
+ // )
}
diff --git a/src/views/mobile/device/add.vue b/src/views/mobile/device/add.vue
index 1ad4bbd..3857e6c 100644
--- a/src/views/mobile/device/add.vue
+++ b/src/views/mobile/device/add.vue
@@ -11,6 +11,10 @@
import { showToast, showLoadingToast, closeToast, showConfirmDialog } from 'vant'
import { getWellListPage } from '@/api/home/well/well'
import { getStationListPage } from '@/api/home/station/station'
+import AMap from '@/components/map/index.vue'
+import { keepSearchParams } from '@/utils/keepQuery'
+import { uploadApi } from '@/api/mobile/operation'
+const $router = useRouter()
const deciceInfo = ref({
productId: '',
productName: '',
@@ -18,7 +22,6 @@
tagNumber: '',
watchObject: '',
installDate: '',
- photo: []
})
// 产品相关
@@ -88,8 +91,6 @@
// }
}
-// const
-
// 安装日期
const showDatePicker = ref(false)
const pickerValueInstallDate = ref([])
@@ -102,10 +103,10 @@
showDatePicker.value = false
}
// 现场照片
-// const showCamera = ref(false)
+const photo = ref([])
// 拍照
const takePictures = () => {
- if(deciceInfo.value.photo.length >= 3) {
+ if (deciceInfo.value.photo.length >= 3) {
showToast('最多上传三张照片')
return
}
@@ -118,11 +119,19 @@
// 原生上传
if (event.target.files?.length !== 0) {
const file = event.target.files[0]
- const reader = new FileReader() // 实例化FileReader
- reader.readAsDataURL(file)
+ const fd = new FormData()
+ fd.append('file', file)
+ uploadApi(fd).then(res => {
+ photo.value.push(res.data as string)
+ fileRef.value.value = ''
+ }).catch(() => {
+ fileRef.value.value = ''
+ })
+ // const reader = new FileReader() // 实例化FileReader
+ // reader.readAsDataURL(file)
// 读取成功以后执行的方法
- reader.onload = (e) => {
- deciceInfo.value.photo.push(e.target.result)
+ // reader.onload = (e) => {
+ // deciceInfo.value.photo.push(e.target.result)
// let img = new Image()
// // base64
// img.src = e.target.result
@@ -130,29 +139,30 @@
// img.onload = () => {
// imagetoCanvas(img) //Image 对象转变为一个 Canvas 类型对象,i为遍历的下标
// }
- }
+ // }
}
}
+// 图片地址
+const getPhotoUrl = computed(() => {
+ return (url: string) => {
+ return `${window.localStorage.getItem('url-bj-well')}/static/${url}`
+ }
+})
// 删除图片
const deletePhoto = (index: number) => {
- deciceInfo.value.photo.splice(index, 1)
+ photo.value.splice(index, 1)
}
// 预览图片
const previewPhoto = (index: number) => {
showImagePreview({
- images: deciceInfo.value.photo,
+ images: photo.value,
startPosition: index
})
}
-// 关闭摄像头
-// const closeCamera = () => {
-// showCamera.value = false
-// }
// 获取字典
const deviceTypeList = ref([]) // 设备类型列表
const fetchDict = () => {
getProductListPage({ offset: 1, limit: 9999 }).then(res => {
- console.log(res.data.rows, '产品列表')
productColumns.value = res.data.rows.map((item: any) => ({
text: `${item.productName}-${item.productCode}`,
value: item.id,
@@ -170,20 +180,77 @@
const select = productColumns.value.filter((item: any) => item.value === newVal) as any
const watchObject = deviceTypeList.value.filter((item: any) => item.id === select[0].deviceType)
deciceInfo.value.watchObject = watchObject[0].watchObject
-
}
else {
deciceInfo.value.tagNumber = ''
deciceInfo.value.watchObject = ''
}
})
-const empty = ref('')
+
+
+// 计算地图区域高度
+const scrollHeight = ref(0)
+const calcHeight = () => {
+ // 公共头部高度40
+ // 边距安全 30
+ // 底部按钮
+ const exportBtnHeight = document.getElementById('handler-btn')?.offsetHeight || 0
+ // 头部
+ const searchHeaderHeight = document.getElementById('info-area')?.offsetHeight || 0
+ scrollHeight.value = window.innerHeight - 40 - exportBtnHeight - searchHeaderHeight - 30
+}
+onMounted(() => {
+ calcHeight()
+})
+
+window.addEventListener('resize', () => {
+ calcHeight()
+})
+onBeforeUnmount(() => {
+ window.addEventListener('resize', () => { })
+})
+// 地图操作
+const mapRef = ref()
+// 当前状态 收起retract/展开expand
+const mapStatus = ref('expand')
+const changeStatus = () => {
+ if (mapStatus.value === 'expand') {
+ mapStatus.value = 'retract'
+ }
+ else {
+ mapStatus.value = 'expand'
+ }
+
+}
+// 重置地图到初始状态
+const resetMap = () => {
+ // mapRef.value.map.setCenter(position.value)
+ // mapRef.value.map.setZoom(17.5)
+}
+
+// 查看数据
+const deviceData = () => {
+ if (!deciceInfo.value.devcode) {
+ showToast('设备编号不能为空')
+ return
+ }
+ $router.push({
+ name: 'OperationData',
+ query: {
+ devcode: deciceInfo.value.devcode
+ }
+ })
+}
+// 页面缓存
+onBeforeRouteLeave((to: any) => {
+ keepSearchParams(to.path, 'H5DeviceAdd')
+})
-
+
设备信息
@@ -196,7 +263,8 @@
@cancel="showProduct = false" />
-
+
@@ -213,14 +281,14 @@
@cancel="showDatePicker = false" />
-
+
-
+
-
![]()
+
@@ -234,14 +302,37 @@
+
+
+
+
+ 保存
+ 查看设备数据
+
diff --git a/src/views/mobile/info/detail.vue b/src/views/mobile/info/detail.vue
index c2696dc..ef0f0fb 100644
--- a/src/views/mobile/info/detail.vue
+++ b/src/views/mobile/info/detail.vue
@@ -6,78 +6,27 @@
@@ -93,13 +110,15 @@
查询结果
-
-
-
+
+
+ detail(event, item)">
{{ item.devcode }}
设备类型
-
{{ item.devTypeName }}
+
{{ item.typeName }}
安装位置
@@ -108,14 +127,16 @@
安装日期
@@ -123,6 +144,10 @@
+
+
+
+
@@ -164,6 +189,7 @@
.title {
display: flex;
font-size: 1.1rem;
+
// border-left: 4px solid #0d76d4;
// border-radius: 2px;
.symbol {
@@ -182,6 +208,7 @@
.result-item {
padding: 4px;
+
// box-shadow: 0px 12px 32px 4px rgba(0, 0, 0, .04), 0px 8px 20px rgba(0, 0, 0, .08);
.devcode {
font-weight: 700;
@@ -200,6 +227,15 @@
color: #888;
width: 80%;
text-align: right;
+ white-space: nowrap;
+
+ /* 确保文本在一行内显示 */
+ overflow: hidden;
+
+ /* 超出容器部分隐藏 */
+ text-overflow: ellipsis;
+
+ /* 文字溢出显示省略号 */
}
.title {
diff --git a/src/views/mobile/info/search.vue b/src/views/mobile/info/search.vue
index 9bf1c64..e9e28aa 100644
--- a/src/views/mobile/info/search.vue
+++ b/src/views/mobile/info/search.vue
@@ -4,21 +4,39 @@
Date: 2025-01-02
-->
@@ -27,10 +45,10 @@
-
+
-
-
+
+
@@ -60,17 +78,20 @@
font-weight: 700;
font-size: 1rem;
}
+
::v-deep(.van-cell__value) {
// font-weight: 700;
font-size: 1rem;
}
}
+
.search-btn {
width: 100%;
position: fixed;
bottom: 1vh;
display: flex;
justify-content: center;
+
::v-deep(.el-button) {
font-size: 18px;
}
diff --git a/public/config/config.json b/public/config/config.json
index d7d7fef..d02f6e9 100644
--- a/public/config/config.json
+++ b/public/config/config.json
@@ -1,6 +1,6 @@
{
"title":"燃气物联感知平台",
- "baseUrl": "http://111.198.10.15:11643",
+ "baseUrl": "http://111.198.10.15:11646",
"securityJsCode": "56bf9671d4b3517d294caec4751889a1",
"JsKey": "40849e82b4e33f5255b17372520c954d",
"xuntengMap": "http://111.198.10.15:11643/getMap?mapPath=http://172.17.206.70:20198/_allLayer/tile",
diff --git a/src/api/index.ts b/src/api/index.ts
index 103bf3b..9da5465 100644
--- a/src/api/index.ts
+++ b/src/api/index.ts
@@ -40,6 +40,7 @@
if (userStore.isLogin && request.headers) {
request.headers.token = userStore.token
}
+ // request.headers['Accept-Encoding'] = 'gzip, deflate, br, zstd'
// 是否将 POST 请求参数进行字符串化处理
if (request.method === 'post') {
// request.data = qs.stringify(request.data, {
diff --git a/src/api/mobile/1 b/src/api/mobile/1
deleted file mode 100644
index e69de29..0000000
--- a/src/api/mobile/1
+++ /dev/null
diff --git a/src/api/mobile/info.ts b/src/api/mobile/info.ts
new file mode 100644
index 0000000..7490f50
--- /dev/null
+++ b/src/api/mobile/info.ts
@@ -0,0 +1,21 @@
+/**
+ * 信息查询
+ */
+import request from '@/api/index'
+
+// 基础列表
+export function getInfoListPage(data: any) {
+ return request({
+ url: `/system/busDevice/listPage?limit=${data.limit}&offset=${data.offset}`,
+ method: 'post',
+ data,
+ })
+}
+// 查询设备数据
+export function getDeviceData(data: any) {
+ return request({
+ url: `system/busDevice/monitorData`,
+ method: 'post',
+ data,
+ })
+}
diff --git a/src/api/mobile/operation.ts b/src/api/mobile/operation.ts
new file mode 100644
index 0000000..3bfd174
--- /dev/null
+++ b/src/api/mobile/operation.ts
@@ -0,0 +1,35 @@
+/**
+ * 设备运维
+ */
+import request from '@/api/index'
+
+// 获取设备安装信息
+export function getDeviceInstall(devCode: any) {
+ return request({
+ url: `device/busRepairLog/getDeviceByCode/${devCode}`,
+ method: 'post',
+ })
+}
+// 上传图片
+export function uploadApi(data: FormData) {
+ return request({
+ url: '/system/busDevice/fileUpload',
+ method: 'post',
+ data,
+ })
+}
+// 获取图片地址
+export function getPhotoUrl(fileName: string) {
+ return request({
+ url: `/minio/file/url?fileName=${fileName}`,
+ method: 'get',
+ })
+}
+// 新建
+export function addDeviceInstall(data: any) {
+ return request({
+ url: '/device/busRepairLog/add',
+ method: 'post',
+ data,
+ })
+}
diff --git a/src/api/mobile/record.ts b/src/api/mobile/record.ts
index 42113c8..ed622fc 100644
--- a/src/api/mobile/record.ts
+++ b/src/api/mobile/record.ts
@@ -21,3 +21,10 @@
responseType: 'blob',
})
}
+
+export function getDeviceDetail(devcode: any) {
+ return request({
+ url: `/system/busDevice/getWellByDevCode/${devcode}`,
+ method: 'post',
+ })
+}
diff --git a/src/assets/mobile/device.png b/src/assets/mobile/device.png
index 1de66a4..bf7b9f5 100644
--- a/src/assets/mobile/device.png
+++ b/src/assets/mobile/device.png
Binary files differ
diff --git a/src/assets/mobile/expand.svg b/src/assets/mobile/expand.svg
new file mode 100644
index 0000000..4f18a55
--- /dev/null
+++ b/src/assets/mobile/expand.svg
@@ -0,0 +1 @@
+
\ No newline at end of file
diff --git a/src/assets/mobile/operation.png b/src/assets/mobile/operation.png
index 235f0a1..eeb540c 100644
--- a/src/assets/mobile/operation.png
+++ b/src/assets/mobile/operation.png
Binary files differ
diff --git a/src/assets/mobile/record.png b/src/assets/mobile/record.png
index dc479ca..63a6450 100644
--- a/src/assets/mobile/record.png
+++ b/src/assets/mobile/record.png
Binary files differ
diff --git a/src/assets/mobile/retract.svg b/src/assets/mobile/retract.svg
new file mode 100644
index 0000000..69db581
--- /dev/null
+++ b/src/assets/mobile/retract.svg
@@ -0,0 +1 @@
+
\ No newline at end of file
diff --git a/src/assets/mobile/search.png b/src/assets/mobile/search.png
index cb1dd4f..eb33171 100644
--- a/src/assets/mobile/search.png
+++ b/src/assets/mobile/search.png
Binary files differ
diff --git a/src/assets/mobile/user.png b/src/assets/mobile/user.png
index 92edf2d..a306341 100644
--- a/src/assets/mobile/user.png
+++ b/src/assets/mobile/user.png
Binary files differ
diff --git a/src/store/modules/user.ts b/src/store/modules/user.ts
index cc9fc78..d59cf45 100644
--- a/src/store/modules/user.ts
+++ b/src/store/modules/user.ts
@@ -1,7 +1,7 @@
import { reject } from 'lodash-es'
import useRouteStore from './route'
import useMenuStore from './menu'
-import { doLogin, getConfig, getInfo, getUserMenus } from '@/api/system/login'
+import { doLogin, getConfig, getInfo, getUserMenus, logout } from '@/api/system/login'
import { changePwd } from '@/api/system/user'
import type { Menu } from '@/global'
import { getPrivateKey, privateStr, setPrivateKey } from '@/utils/auth'
@@ -100,22 +100,28 @@
// 注销
logout() {
return new Promise((resolve) => {
- const routeStore = useRouteStore()
- const menuStore = useMenuStore()
- localStorage.removeItem('username')
- localStorage.removeItem('token')
- localStorage.removeItem('nameId')
- localStorage.removeItem('depId')
- this.username = ''
- this.token = ''
- this.roleList = []
- this.roleNames = []
- routeStore.removeRoutes()
- menuStore.setActived(0)
- menuStore.resetBreadcrumb()
- // 清空缓存
- indexDB.deleteAll()
- resolve()
+ logout().then(() => {
+ const routeStore = useRouteStore()
+ const menuStore = useMenuStore()
+ localStorage.removeItem('username')
+ localStorage.removeItem('token')
+ localStorage.removeItem('nameId')
+ localStorage.removeItem('depId')
+ this.username = ''
+ this.token = ''
+ this.roleList = []
+ this.roleNames = []
+ routeStore.removeRoutes()
+ menuStore.setActived(0)
+ menuStore.resetBreadcrumb()
+ // 清空缓存
+ indexDB.deleteAll()
+ resolve()
+ })
+ .catch((error) => {
+ reject(error)
+ })
+
})
},
// 获取用户信息
@@ -143,7 +149,7 @@
this.username = res.data.account
this.name = res.data.name
resolve(res.data)
- console.log(indexDB.getStatus(),window.localStorage.getItem('browser-type-bj-well'), 'indexDB加载状态')
+ console.log(indexDB.getStatus(), window.localStorage.getItem('browser-type-bj-well'), 'indexDB加载状态')
if (indexDB.getStatus() && window.localStorage.getItem('browser-type-bj-well') === 'pc') {
// 重新拉取缓存
fetchCacheDevice()
diff --git a/src/utils/keepQuery.ts b/src/utils/keepQuery.ts
index 829b4b3..3b77c80 100644
--- a/src/utils/keepQuery.ts
+++ b/src/utils/keepQuery.ts
@@ -3,7 +3,7 @@
const keepAliveStore = useKeepAliveStore()
// 操作
-const needKeep = ['detail']
+const needKeep = ['detail', 'info/result', 'operation/data']
export function keepSearchParams(to: any, componentName: string) {
if (needKeep.some((item: string) => to.includes(item))) {
keepAliveStore.add(componentName)
diff --git a/src/views/home/device/device/index.vue b/src/views/home/device/device/index.vue
index cb76ade..1aa4006 100644
--- a/src/views/home/device/device/index.vue
+++ b/src/views/home/device/device/index.vue
@@ -77,7 +77,6 @@
})
// 查询数据
const fetchData = () => {
- console.log(123)
loadingTable.value = true
getDeviceListPage(listQuery.value).then((res) => {
list.value = []
diff --git a/src/views/mobile/dashboard/index.vue b/src/views/mobile/dashboard/index.vue
index a30e120..bc20597 100644
--- a/src/views/mobile/dashboard/index.vue
+++ b/src/views/mobile/dashboard/index.vue
@@ -152,13 +152,13 @@
.menu-item {
margin-top: 1.5rem;
width: 42%;
- border: 2px solid #0d76d4;
+ border: 2px solid #7cbaf0;
background-color: rgba($color: #0b0b0f, $alpha: 1%);
border-radius: 4px;
padding: 10px;
box-shadow: 0 0 12px rgb(0 0 0 / 12%);
font-weight: 700;
- color: #333;
+ color: #5f5e5e;
.img {
width: 100%;
@@ -168,6 +168,7 @@
img {
width: 40%;
margin: 0 auto;
+ border-radius: 25%;
}
}
@@ -196,6 +197,7 @@
right: 2rem;
width: 3rem;
height: 3rem;
+ border-radius: 25%;
}
}
diff --git a/src/views/mobile/dashboard/userInfo.vue b/src/views/mobile/dashboard/userInfo.vue
index 99418cf..4fff389 100644
--- a/src/views/mobile/dashboard/userInfo.vue
+++ b/src/views/mobile/dashboard/userInfo.vue
@@ -8,6 +8,7 @@
import useRouteStore from '@/store/modules/route'
// import useUserStore from '@/store/modules/user'
import { ElMessage, ElMessageBox } from 'element-plus'
+import { showConfirmDialog } from 'vant'
const userStore = useUserStore()
const routeStore = useRouteStore()
const userInfo = useUserStore()
@@ -27,15 +28,10 @@
})
// 退出登录
const logout = () => {
- ElMessageBox.confirm(
- '确认退出登录吗?',
- '',
- {
- confirmButtonText: '确认',
- cancelButtonText: '取消',
- type: 'warning',
- }
- ).then(() => {
+ showConfirmDialog({
+ title: '确认退出登录吗?',
+ })
+ .then(() => {
routeStore.removeRoutes()
userStore.logout().then(() => {
$router.push({
@@ -43,6 +39,15 @@
})
})
})
+ // ElMessageBox.confirm(
+ // '确认退出登录吗?',
+ // '',
+ // {
+ // confirmButtonText: '确认',
+ // cancelButtonText: '取消',
+ // type: 'warning',
+ // }
+ // )
}
diff --git a/src/views/mobile/device/add.vue b/src/views/mobile/device/add.vue
index 1ad4bbd..3857e6c 100644
--- a/src/views/mobile/device/add.vue
+++ b/src/views/mobile/device/add.vue
@@ -11,6 +11,10 @@
import { showToast, showLoadingToast, closeToast, showConfirmDialog } from 'vant'
import { getWellListPage } from '@/api/home/well/well'
import { getStationListPage } from '@/api/home/station/station'
+import AMap from '@/components/map/index.vue'
+import { keepSearchParams } from '@/utils/keepQuery'
+import { uploadApi } from '@/api/mobile/operation'
+const $router = useRouter()
const deciceInfo = ref({
productId: '',
productName: '',
@@ -18,7 +22,6 @@
tagNumber: '',
watchObject: '',
installDate: '',
- photo: []
})
// 产品相关
@@ -88,8 +91,6 @@
// }
}
-// const
-
// 安装日期
const showDatePicker = ref(false)
const pickerValueInstallDate = ref([])
@@ -102,10 +103,10 @@
showDatePicker.value = false
}
// 现场照片
-// const showCamera = ref(false)
+const photo = ref([])
// 拍照
const takePictures = () => {
- if(deciceInfo.value.photo.length >= 3) {
+ if (deciceInfo.value.photo.length >= 3) {
showToast('最多上传三张照片')
return
}
@@ -118,11 +119,19 @@
// 原生上传
if (event.target.files?.length !== 0) {
const file = event.target.files[0]
- const reader = new FileReader() // 实例化FileReader
- reader.readAsDataURL(file)
+ const fd = new FormData()
+ fd.append('file', file)
+ uploadApi(fd).then(res => {
+ photo.value.push(res.data as string)
+ fileRef.value.value = ''
+ }).catch(() => {
+ fileRef.value.value = ''
+ })
+ // const reader = new FileReader() // 实例化FileReader
+ // reader.readAsDataURL(file)
// 读取成功以后执行的方法
- reader.onload = (e) => {
- deciceInfo.value.photo.push(e.target.result)
+ // reader.onload = (e) => {
+ // deciceInfo.value.photo.push(e.target.result)
// let img = new Image()
// // base64
// img.src = e.target.result
@@ -130,29 +139,30 @@
// img.onload = () => {
// imagetoCanvas(img) //Image 对象转变为一个 Canvas 类型对象,i为遍历的下标
// }
- }
+ // }
}
}
+// 图片地址
+const getPhotoUrl = computed(() => {
+ return (url: string) => {
+ return `${window.localStorage.getItem('url-bj-well')}/static/${url}`
+ }
+})
// 删除图片
const deletePhoto = (index: number) => {
- deciceInfo.value.photo.splice(index, 1)
+ photo.value.splice(index, 1)
}
// 预览图片
const previewPhoto = (index: number) => {
showImagePreview({
- images: deciceInfo.value.photo,
+ images: photo.value,
startPosition: index
})
}
-// 关闭摄像头
-// const closeCamera = () => {
-// showCamera.value = false
-// }
// 获取字典
const deviceTypeList = ref([]) // 设备类型列表
const fetchDict = () => {
getProductListPage({ offset: 1, limit: 9999 }).then(res => {
- console.log(res.data.rows, '产品列表')
productColumns.value = res.data.rows.map((item: any) => ({
text: `${item.productName}-${item.productCode}`,
value: item.id,
@@ -170,20 +180,77 @@
const select = productColumns.value.filter((item: any) => item.value === newVal) as any
const watchObject = deviceTypeList.value.filter((item: any) => item.id === select[0].deviceType)
deciceInfo.value.watchObject = watchObject[0].watchObject
-
}
else {
deciceInfo.value.tagNumber = ''
deciceInfo.value.watchObject = ''
}
})
-const empty = ref('')
+
+
+// 计算地图区域高度
+const scrollHeight = ref(0)
+const calcHeight = () => {
+ // 公共头部高度40
+ // 边距安全 30
+ // 底部按钮
+ const exportBtnHeight = document.getElementById('handler-btn')?.offsetHeight || 0
+ // 头部
+ const searchHeaderHeight = document.getElementById('info-area')?.offsetHeight || 0
+ scrollHeight.value = window.innerHeight - 40 - exportBtnHeight - searchHeaderHeight - 30
+}
+onMounted(() => {
+ calcHeight()
+})
+
+window.addEventListener('resize', () => {
+ calcHeight()
+})
+onBeforeUnmount(() => {
+ window.addEventListener('resize', () => { })
+})
+// 地图操作
+const mapRef = ref()
+// 当前状态 收起retract/展开expand
+const mapStatus = ref('expand')
+const changeStatus = () => {
+ if (mapStatus.value === 'expand') {
+ mapStatus.value = 'retract'
+ }
+ else {
+ mapStatus.value = 'expand'
+ }
+
+}
+// 重置地图到初始状态
+const resetMap = () => {
+ // mapRef.value.map.setCenter(position.value)
+ // mapRef.value.map.setZoom(17.5)
+}
+
+// 查看数据
+const deviceData = () => {
+ if (!deciceInfo.value.devcode) {
+ showToast('设备编号不能为空')
+ return
+ }
+ $router.push({
+ name: 'OperationData',
+ query: {
+ devcode: deciceInfo.value.devcode
+ }
+ })
+}
+// 页面缓存
+onBeforeRouteLeave((to: any) => {
+ keepSearchParams(to.path, 'H5DeviceAdd')
+})
-
+
设备信息
@@ -196,7 +263,8 @@
@cancel="showProduct = false" />
-
+
@@ -213,14 +281,14 @@
@cancel="showDatePicker = false" />
-
+
-
+
-
![]()
+
@@ -234,14 +302,37 @@
+
+
+
+
+ 保存
+ 查看设备数据
+
diff --git a/src/views/mobile/info/detail.vue b/src/views/mobile/info/detail.vue
index c2696dc..ef0f0fb 100644
--- a/src/views/mobile/info/detail.vue
+++ b/src/views/mobile/info/detail.vue
@@ -6,78 +6,27 @@
@@ -93,13 +110,15 @@
查询结果
-
-
-
+
+
+ detail(event, item)">
{{ item.devcode }}
设备类型
-
{{ item.devTypeName }}
+
{{ item.typeName }}
安装位置
@@ -108,14 +127,16 @@
安装日期
@@ -123,6 +144,10 @@
+
+
+
+
@@ -164,6 +189,7 @@
.title {
display: flex;
font-size: 1.1rem;
+
// border-left: 4px solid #0d76d4;
// border-radius: 2px;
.symbol {
@@ -182,6 +208,7 @@
.result-item {
padding: 4px;
+
// box-shadow: 0px 12px 32px 4px rgba(0, 0, 0, .04), 0px 8px 20px rgba(0, 0, 0, .08);
.devcode {
font-weight: 700;
@@ -200,6 +227,15 @@
color: #888;
width: 80%;
text-align: right;
+ white-space: nowrap;
+
+ /* 确保文本在一行内显示 */
+ overflow: hidden;
+
+ /* 超出容器部分隐藏 */
+ text-overflow: ellipsis;
+
+ /* 文字溢出显示省略号 */
}
.title {
diff --git a/src/views/mobile/info/search.vue b/src/views/mobile/info/search.vue
index 9bf1c64..e9e28aa 100644
--- a/src/views/mobile/info/search.vue
+++ b/src/views/mobile/info/search.vue
@@ -4,21 +4,39 @@
Date: 2025-01-02
-->
@@ -27,10 +45,10 @@
-
+
-
-
+
+
@@ -60,17 +78,20 @@
font-weight: 700;
font-size: 1rem;
}
+
::v-deep(.van-cell__value) {
// font-weight: 700;
font-size: 1rem;
}
}
+
.search-btn {
width: 100%;
position: fixed;
bottom: 1vh;
display: flex;
justify-content: center;
+
::v-deep(.el-button) {
font-size: 18px;
}
diff --git a/src/views/mobile/operation/data.vue b/src/views/mobile/operation/data.vue
index 719c691..a1408a1 100644
--- a/src/views/mobile/operation/data.vue
+++ b/src/views/mobile/operation/data.vue
@@ -5,104 +5,17 @@
-->
diff --git a/src/views/mobile/device/add.vue b/src/views/mobile/device/add.vue
index 1ad4bbd..3857e6c 100644
--- a/src/views/mobile/device/add.vue
+++ b/src/views/mobile/device/add.vue
@@ -11,6 +11,10 @@
import { showToast, showLoadingToast, closeToast, showConfirmDialog } from 'vant'
import { getWellListPage } from '@/api/home/well/well'
import { getStationListPage } from '@/api/home/station/station'
+import AMap from '@/components/map/index.vue'
+import { keepSearchParams } from '@/utils/keepQuery'
+import { uploadApi } from '@/api/mobile/operation'
+const $router = useRouter()
const deciceInfo = ref({
productId: '',
productName: '',
@@ -18,7 +22,6 @@
tagNumber: '',
watchObject: '',
installDate: '',
- photo: []
})
// 产品相关
@@ -88,8 +91,6 @@
// }
}
-// const
-
// 安装日期
const showDatePicker = ref(false)
const pickerValueInstallDate = ref([])
@@ -102,10 +103,10 @@
showDatePicker.value = false
}
// 现场照片
-// const showCamera = ref(false)
+const photo = ref([])
// 拍照
const takePictures = () => {
- if(deciceInfo.value.photo.length >= 3) {
+ if (deciceInfo.value.photo.length >= 3) {
showToast('最多上传三张照片')
return
}
@@ -118,11 +119,19 @@
// 原生上传
if (event.target.files?.length !== 0) {
const file = event.target.files[0]
- const reader = new FileReader() // 实例化FileReader
- reader.readAsDataURL(file)
+ const fd = new FormData()
+ fd.append('file', file)
+ uploadApi(fd).then(res => {
+ photo.value.push(res.data as string)
+ fileRef.value.value = ''
+ }).catch(() => {
+ fileRef.value.value = ''
+ })
+ // const reader = new FileReader() // 实例化FileReader
+ // reader.readAsDataURL(file)
// 读取成功以后执行的方法
- reader.onload = (e) => {
- deciceInfo.value.photo.push(e.target.result)
+ // reader.onload = (e) => {
+ // deciceInfo.value.photo.push(e.target.result)
// let img = new Image()
// // base64
// img.src = e.target.result
@@ -130,29 +139,30 @@
// img.onload = () => {
// imagetoCanvas(img) //Image 对象转变为一个 Canvas 类型对象,i为遍历的下标
// }
- }
+ // }
}
}
+// 图片地址
+const getPhotoUrl = computed(() => {
+ return (url: string) => {
+ return `${window.localStorage.getItem('url-bj-well')}/static/${url}`
+ }
+})
// 删除图片
const deletePhoto = (index: number) => {
- deciceInfo.value.photo.splice(index, 1)
+ photo.value.splice(index, 1)
}
// 预览图片
const previewPhoto = (index: number) => {
showImagePreview({
- images: deciceInfo.value.photo,
+ images: photo.value,
startPosition: index
})
}
-// 关闭摄像头
-// const closeCamera = () => {
-// showCamera.value = false
-// }
// 获取字典
const deviceTypeList = ref([]) // 设备类型列表
const fetchDict = () => {
getProductListPage({ offset: 1, limit: 9999 }).then(res => {
- console.log(res.data.rows, '产品列表')
productColumns.value = res.data.rows.map((item: any) => ({
text: `${item.productName}-${item.productCode}`,
value: item.id,
@@ -170,20 +180,77 @@
const select = productColumns.value.filter((item: any) => item.value === newVal) as any
const watchObject = deviceTypeList.value.filter((item: any) => item.id === select[0].deviceType)
deciceInfo.value.watchObject = watchObject[0].watchObject
-
}
else {
deciceInfo.value.tagNumber = ''
deciceInfo.value.watchObject = ''
}
})
-const empty = ref('')
+
+
+// 计算地图区域高度
+const scrollHeight = ref(0)
+const calcHeight = () => {
+ // 公共头部高度40
+ // 边距安全 30
+ // 底部按钮
+ const exportBtnHeight = document.getElementById('handler-btn')?.offsetHeight || 0
+ // 头部
+ const searchHeaderHeight = document.getElementById('info-area')?.offsetHeight || 0
+ scrollHeight.value = window.innerHeight - 40 - exportBtnHeight - searchHeaderHeight - 30
+}
+onMounted(() => {
+ calcHeight()
+})
+
+window.addEventListener('resize', () => {
+ calcHeight()
+})
+onBeforeUnmount(() => {
+ window.addEventListener('resize', () => { })
+})
+// 地图操作
+const mapRef = ref()
+// 当前状态 收起retract/展开expand
+const mapStatus = ref('expand')
+const changeStatus = () => {
+ if (mapStatus.value === 'expand') {
+ mapStatus.value = 'retract'
+ }
+ else {
+ mapStatus.value = 'expand'
+ }
+
+}
+// 重置地图到初始状态
+const resetMap = () => {
+ // mapRef.value.map.setCenter(position.value)
+ // mapRef.value.map.setZoom(17.5)
+}
+
+// 查看数据
+const deviceData = () => {
+ if (!deciceInfo.value.devcode) {
+ showToast('设备编号不能为空')
+ return
+ }
+ $router.push({
+ name: 'OperationData',
+ query: {
+ devcode: deciceInfo.value.devcode
+ }
+ })
+}
+// 页面缓存
+onBeforeRouteLeave((to: any) => {
+ keepSearchParams(to.path, 'H5DeviceAdd')
+})
-
+
设备信息
@@ -196,7 +263,8 @@
@cancel="showProduct = false" />
-
+
@@ -213,14 +281,14 @@
@cancel="showDatePicker = false" />
-
+
-
+
-
![]()
+
@@ -234,14 +302,37 @@
+
+
+
+
+ 保存
+ 查看设备数据
+
diff --git a/src/views/mobile/info/detail.vue b/src/views/mobile/info/detail.vue
index c2696dc..ef0f0fb 100644
--- a/src/views/mobile/info/detail.vue
+++ b/src/views/mobile/info/detail.vue
@@ -6,78 +6,27 @@
@@ -93,13 +110,15 @@
查询结果
-
-
-
+
+
+ detail(event, item)">
{{ item.devcode }}
设备类型
-
{{ item.devTypeName }}
+
{{ item.typeName }}
安装位置
@@ -108,14 +127,16 @@
安装日期
@@ -123,6 +144,10 @@
+
+
+
+
@@ -164,6 +189,7 @@
.title {
display: flex;
font-size: 1.1rem;
+
// border-left: 4px solid #0d76d4;
// border-radius: 2px;
.symbol {
@@ -182,6 +208,7 @@
.result-item {
padding: 4px;
+
// box-shadow: 0px 12px 32px 4px rgba(0, 0, 0, .04), 0px 8px 20px rgba(0, 0, 0, .08);
.devcode {
font-weight: 700;
@@ -200,6 +227,15 @@
color: #888;
width: 80%;
text-align: right;
+ white-space: nowrap;
+
+ /* 确保文本在一行内显示 */
+ overflow: hidden;
+
+ /* 超出容器部分隐藏 */
+ text-overflow: ellipsis;
+
+ /* 文字溢出显示省略号 */
}
.title {
diff --git a/src/views/mobile/info/search.vue b/src/views/mobile/info/search.vue
index 9bf1c64..e9e28aa 100644
--- a/src/views/mobile/info/search.vue
+++ b/src/views/mobile/info/search.vue
@@ -4,21 +4,39 @@
Date: 2025-01-02
-->
@@ -27,10 +45,10 @@
-
+
-
-
+
+
@@ -60,17 +78,20 @@
font-weight: 700;
font-size: 1rem;
}
+
::v-deep(.van-cell__value) {
// font-weight: 700;
font-size: 1rem;
}
}
+
.search-btn {
width: 100%;
position: fixed;
bottom: 1vh;
display: flex;
justify-content: center;
+
::v-deep(.el-button) {
font-size: 18px;
}
diff --git a/src/views/mobile/operation/data.vue b/src/views/mobile/operation/data.vue
index 719c691..a1408a1 100644
--- a/src/views/mobile/operation/data.vue
+++ b/src/views/mobile/operation/data.vue
@@ -5,104 +5,17 @@
-->
-
+
+ placeholder="选择运维类型" required @click="showRepairType = true" input-align="right"
+ :rules="[{ required: true, message: '请选择运维类型' }]" />
+ input-align="right" @blur="searchDeviceInfo" clearable :rules="[{ required: true, message: '请输入设备编号' }]" />
-
+
+ placeholder="详细位置" required input-align="right" :rules="[{ required: true, message: '请确认设备编号是否正确' }]" />
-
+
+ input-align="right" clearable :rules="[{ required: true, message: '请输入运维人员' }]" />
+ input-align="right" clearable :rules="[{ required: true, message: '请输入运维内容' }]" />
-
+
-
![]()
+
diff --git a/public/config/config.json b/public/config/config.json
index d7d7fef..d02f6e9 100644
--- a/public/config/config.json
+++ b/public/config/config.json
@@ -1,6 +1,6 @@
{
"title":"燃气物联感知平台",
- "baseUrl": "http://111.198.10.15:11643",
+ "baseUrl": "http://111.198.10.15:11646",
"securityJsCode": "56bf9671d4b3517d294caec4751889a1",
"JsKey": "40849e82b4e33f5255b17372520c954d",
"xuntengMap": "http://111.198.10.15:11643/getMap?mapPath=http://172.17.206.70:20198/_allLayer/tile",
diff --git a/src/api/index.ts b/src/api/index.ts
index 103bf3b..9da5465 100644
--- a/src/api/index.ts
+++ b/src/api/index.ts
@@ -40,6 +40,7 @@
if (userStore.isLogin && request.headers) {
request.headers.token = userStore.token
}
+ // request.headers['Accept-Encoding'] = 'gzip, deflate, br, zstd'
// 是否将 POST 请求参数进行字符串化处理
if (request.method === 'post') {
// request.data = qs.stringify(request.data, {
diff --git a/src/api/mobile/1 b/src/api/mobile/1
deleted file mode 100644
index e69de29..0000000
--- a/src/api/mobile/1
+++ /dev/null
diff --git a/src/api/mobile/info.ts b/src/api/mobile/info.ts
new file mode 100644
index 0000000..7490f50
--- /dev/null
+++ b/src/api/mobile/info.ts
@@ -0,0 +1,21 @@
+/**
+ * 信息查询
+ */
+import request from '@/api/index'
+
+// 基础列表
+export function getInfoListPage(data: any) {
+ return request({
+ url: `/system/busDevice/listPage?limit=${data.limit}&offset=${data.offset}`,
+ method: 'post',
+ data,
+ })
+}
+// 查询设备数据
+export function getDeviceData(data: any) {
+ return request({
+ url: `system/busDevice/monitorData`,
+ method: 'post',
+ data,
+ })
+}
diff --git a/src/api/mobile/operation.ts b/src/api/mobile/operation.ts
new file mode 100644
index 0000000..3bfd174
--- /dev/null
+++ b/src/api/mobile/operation.ts
@@ -0,0 +1,35 @@
+/**
+ * 设备运维
+ */
+import request from '@/api/index'
+
+// 获取设备安装信息
+export function getDeviceInstall(devCode: any) {
+ return request({
+ url: `device/busRepairLog/getDeviceByCode/${devCode}`,
+ method: 'post',
+ })
+}
+// 上传图片
+export function uploadApi(data: FormData) {
+ return request({
+ url: '/system/busDevice/fileUpload',
+ method: 'post',
+ data,
+ })
+}
+// 获取图片地址
+export function getPhotoUrl(fileName: string) {
+ return request({
+ url: `/minio/file/url?fileName=${fileName}`,
+ method: 'get',
+ })
+}
+// 新建
+export function addDeviceInstall(data: any) {
+ return request({
+ url: '/device/busRepairLog/add',
+ method: 'post',
+ data,
+ })
+}
diff --git a/src/api/mobile/record.ts b/src/api/mobile/record.ts
index 42113c8..ed622fc 100644
--- a/src/api/mobile/record.ts
+++ b/src/api/mobile/record.ts
@@ -21,3 +21,10 @@
responseType: 'blob',
})
}
+
+export function getDeviceDetail(devcode: any) {
+ return request({
+ url: `/system/busDevice/getWellByDevCode/${devcode}`,
+ method: 'post',
+ })
+}
diff --git a/src/assets/mobile/device.png b/src/assets/mobile/device.png
index 1de66a4..bf7b9f5 100644
--- a/src/assets/mobile/device.png
+++ b/src/assets/mobile/device.png
Binary files differ
diff --git a/src/assets/mobile/expand.svg b/src/assets/mobile/expand.svg
new file mode 100644
index 0000000..4f18a55
--- /dev/null
+++ b/src/assets/mobile/expand.svg
@@ -0,0 +1 @@
+
\ No newline at end of file
diff --git a/src/assets/mobile/operation.png b/src/assets/mobile/operation.png
index 235f0a1..eeb540c 100644
--- a/src/assets/mobile/operation.png
+++ b/src/assets/mobile/operation.png
Binary files differ
diff --git a/src/assets/mobile/record.png b/src/assets/mobile/record.png
index dc479ca..63a6450 100644
--- a/src/assets/mobile/record.png
+++ b/src/assets/mobile/record.png
Binary files differ
diff --git a/src/assets/mobile/retract.svg b/src/assets/mobile/retract.svg
new file mode 100644
index 0000000..69db581
--- /dev/null
+++ b/src/assets/mobile/retract.svg
@@ -0,0 +1 @@
+
\ No newline at end of file
diff --git a/src/assets/mobile/search.png b/src/assets/mobile/search.png
index cb1dd4f..eb33171 100644
--- a/src/assets/mobile/search.png
+++ b/src/assets/mobile/search.png
Binary files differ
diff --git a/src/assets/mobile/user.png b/src/assets/mobile/user.png
index 92edf2d..a306341 100644
--- a/src/assets/mobile/user.png
+++ b/src/assets/mobile/user.png
Binary files differ
diff --git a/src/store/modules/user.ts b/src/store/modules/user.ts
index cc9fc78..d59cf45 100644
--- a/src/store/modules/user.ts
+++ b/src/store/modules/user.ts
@@ -1,7 +1,7 @@
import { reject } from 'lodash-es'
import useRouteStore from './route'
import useMenuStore from './menu'
-import { doLogin, getConfig, getInfo, getUserMenus } from '@/api/system/login'
+import { doLogin, getConfig, getInfo, getUserMenus, logout } from '@/api/system/login'
import { changePwd } from '@/api/system/user'
import type { Menu } from '@/global'
import { getPrivateKey, privateStr, setPrivateKey } from '@/utils/auth'
@@ -100,22 +100,28 @@
// 注销
logout() {
return new Promise((resolve) => {
- const routeStore = useRouteStore()
- const menuStore = useMenuStore()
- localStorage.removeItem('username')
- localStorage.removeItem('token')
- localStorage.removeItem('nameId')
- localStorage.removeItem('depId')
- this.username = ''
- this.token = ''
- this.roleList = []
- this.roleNames = []
- routeStore.removeRoutes()
- menuStore.setActived(0)
- menuStore.resetBreadcrumb()
- // 清空缓存
- indexDB.deleteAll()
- resolve()
+ logout().then(() => {
+ const routeStore = useRouteStore()
+ const menuStore = useMenuStore()
+ localStorage.removeItem('username')
+ localStorage.removeItem('token')
+ localStorage.removeItem('nameId')
+ localStorage.removeItem('depId')
+ this.username = ''
+ this.token = ''
+ this.roleList = []
+ this.roleNames = []
+ routeStore.removeRoutes()
+ menuStore.setActived(0)
+ menuStore.resetBreadcrumb()
+ // 清空缓存
+ indexDB.deleteAll()
+ resolve()
+ })
+ .catch((error) => {
+ reject(error)
+ })
+
})
},
// 获取用户信息
@@ -143,7 +149,7 @@
this.username = res.data.account
this.name = res.data.name
resolve(res.data)
- console.log(indexDB.getStatus(),window.localStorage.getItem('browser-type-bj-well'), 'indexDB加载状态')
+ console.log(indexDB.getStatus(), window.localStorage.getItem('browser-type-bj-well'), 'indexDB加载状态')
if (indexDB.getStatus() && window.localStorage.getItem('browser-type-bj-well') === 'pc') {
// 重新拉取缓存
fetchCacheDevice()
diff --git a/src/utils/keepQuery.ts b/src/utils/keepQuery.ts
index 829b4b3..3b77c80 100644
--- a/src/utils/keepQuery.ts
+++ b/src/utils/keepQuery.ts
@@ -3,7 +3,7 @@
const keepAliveStore = useKeepAliveStore()
// 操作
-const needKeep = ['detail']
+const needKeep = ['detail', 'info/result', 'operation/data']
export function keepSearchParams(to: any, componentName: string) {
if (needKeep.some((item: string) => to.includes(item))) {
keepAliveStore.add(componentName)
diff --git a/src/views/home/device/device/index.vue b/src/views/home/device/device/index.vue
index cb76ade..1aa4006 100644
--- a/src/views/home/device/device/index.vue
+++ b/src/views/home/device/device/index.vue
@@ -77,7 +77,6 @@
})
// 查询数据
const fetchData = () => {
- console.log(123)
loadingTable.value = true
getDeviceListPage(listQuery.value).then((res) => {
list.value = []
diff --git a/src/views/mobile/dashboard/index.vue b/src/views/mobile/dashboard/index.vue
index a30e120..bc20597 100644
--- a/src/views/mobile/dashboard/index.vue
+++ b/src/views/mobile/dashboard/index.vue
@@ -152,13 +152,13 @@
.menu-item {
margin-top: 1.5rem;
width: 42%;
- border: 2px solid #0d76d4;
+ border: 2px solid #7cbaf0;
background-color: rgba($color: #0b0b0f, $alpha: 1%);
border-radius: 4px;
padding: 10px;
box-shadow: 0 0 12px rgb(0 0 0 / 12%);
font-weight: 700;
- color: #333;
+ color: #5f5e5e;
.img {
width: 100%;
@@ -168,6 +168,7 @@
img {
width: 40%;
margin: 0 auto;
+ border-radius: 25%;
}
}
@@ -196,6 +197,7 @@
right: 2rem;
width: 3rem;
height: 3rem;
+ border-radius: 25%;
}
}
diff --git a/src/views/mobile/dashboard/userInfo.vue b/src/views/mobile/dashboard/userInfo.vue
index 99418cf..4fff389 100644
--- a/src/views/mobile/dashboard/userInfo.vue
+++ b/src/views/mobile/dashboard/userInfo.vue
@@ -8,6 +8,7 @@
import useRouteStore from '@/store/modules/route'
// import useUserStore from '@/store/modules/user'
import { ElMessage, ElMessageBox } from 'element-plus'
+import { showConfirmDialog } from 'vant'
const userStore = useUserStore()
const routeStore = useRouteStore()
const userInfo = useUserStore()
@@ -27,15 +28,10 @@
})
// 退出登录
const logout = () => {
- ElMessageBox.confirm(
- '确认退出登录吗?',
- '',
- {
- confirmButtonText: '确认',
- cancelButtonText: '取消',
- type: 'warning',
- }
- ).then(() => {
+ showConfirmDialog({
+ title: '确认退出登录吗?',
+ })
+ .then(() => {
routeStore.removeRoutes()
userStore.logout().then(() => {
$router.push({
@@ -43,6 +39,15 @@
})
})
})
+ // ElMessageBox.confirm(
+ // '确认退出登录吗?',
+ // '',
+ // {
+ // confirmButtonText: '确认',
+ // cancelButtonText: '取消',
+ // type: 'warning',
+ // }
+ // )
}
diff --git a/src/views/mobile/device/add.vue b/src/views/mobile/device/add.vue
index 1ad4bbd..3857e6c 100644
--- a/src/views/mobile/device/add.vue
+++ b/src/views/mobile/device/add.vue
@@ -11,6 +11,10 @@
import { showToast, showLoadingToast, closeToast, showConfirmDialog } from 'vant'
import { getWellListPage } from '@/api/home/well/well'
import { getStationListPage } from '@/api/home/station/station'
+import AMap from '@/components/map/index.vue'
+import { keepSearchParams } from '@/utils/keepQuery'
+import { uploadApi } from '@/api/mobile/operation'
+const $router = useRouter()
const deciceInfo = ref({
productId: '',
productName: '',
@@ -18,7 +22,6 @@
tagNumber: '',
watchObject: '',
installDate: '',
- photo: []
})
// 产品相关
@@ -88,8 +91,6 @@
// }
}
-// const
-
// 安装日期
const showDatePicker = ref(false)
const pickerValueInstallDate = ref([])
@@ -102,10 +103,10 @@
showDatePicker.value = false
}
// 现场照片
-// const showCamera = ref(false)
+const photo = ref([])
// 拍照
const takePictures = () => {
- if(deciceInfo.value.photo.length >= 3) {
+ if (deciceInfo.value.photo.length >= 3) {
showToast('最多上传三张照片')
return
}
@@ -118,11 +119,19 @@
// 原生上传
if (event.target.files?.length !== 0) {
const file = event.target.files[0]
- const reader = new FileReader() // 实例化FileReader
- reader.readAsDataURL(file)
+ const fd = new FormData()
+ fd.append('file', file)
+ uploadApi(fd).then(res => {
+ photo.value.push(res.data as string)
+ fileRef.value.value = ''
+ }).catch(() => {
+ fileRef.value.value = ''
+ })
+ // const reader = new FileReader() // 实例化FileReader
+ // reader.readAsDataURL(file)
// 读取成功以后执行的方法
- reader.onload = (e) => {
- deciceInfo.value.photo.push(e.target.result)
+ // reader.onload = (e) => {
+ // deciceInfo.value.photo.push(e.target.result)
// let img = new Image()
// // base64
// img.src = e.target.result
@@ -130,29 +139,30 @@
// img.onload = () => {
// imagetoCanvas(img) //Image 对象转变为一个 Canvas 类型对象,i为遍历的下标
// }
- }
+ // }
}
}
+// 图片地址
+const getPhotoUrl = computed(() => {
+ return (url: string) => {
+ return `${window.localStorage.getItem('url-bj-well')}/static/${url}`
+ }
+})
// 删除图片
const deletePhoto = (index: number) => {
- deciceInfo.value.photo.splice(index, 1)
+ photo.value.splice(index, 1)
}
// 预览图片
const previewPhoto = (index: number) => {
showImagePreview({
- images: deciceInfo.value.photo,
+ images: photo.value,
startPosition: index
})
}
-// 关闭摄像头
-// const closeCamera = () => {
-// showCamera.value = false
-// }
// 获取字典
const deviceTypeList = ref([]) // 设备类型列表
const fetchDict = () => {
getProductListPage({ offset: 1, limit: 9999 }).then(res => {
- console.log(res.data.rows, '产品列表')
productColumns.value = res.data.rows.map((item: any) => ({
text: `${item.productName}-${item.productCode}`,
value: item.id,
@@ -170,20 +180,77 @@
const select = productColumns.value.filter((item: any) => item.value === newVal) as any
const watchObject = deviceTypeList.value.filter((item: any) => item.id === select[0].deviceType)
deciceInfo.value.watchObject = watchObject[0].watchObject
-
}
else {
deciceInfo.value.tagNumber = ''
deciceInfo.value.watchObject = ''
}
})
-const empty = ref('')
+
+
+// 计算地图区域高度
+const scrollHeight = ref(0)
+const calcHeight = () => {
+ // 公共头部高度40
+ // 边距安全 30
+ // 底部按钮
+ const exportBtnHeight = document.getElementById('handler-btn')?.offsetHeight || 0
+ // 头部
+ const searchHeaderHeight = document.getElementById('info-area')?.offsetHeight || 0
+ scrollHeight.value = window.innerHeight - 40 - exportBtnHeight - searchHeaderHeight - 30
+}
+onMounted(() => {
+ calcHeight()
+})
+
+window.addEventListener('resize', () => {
+ calcHeight()
+})
+onBeforeUnmount(() => {
+ window.addEventListener('resize', () => { })
+})
+// 地图操作
+const mapRef = ref()
+// 当前状态 收起retract/展开expand
+const mapStatus = ref('expand')
+const changeStatus = () => {
+ if (mapStatus.value === 'expand') {
+ mapStatus.value = 'retract'
+ }
+ else {
+ mapStatus.value = 'expand'
+ }
+
+}
+// 重置地图到初始状态
+const resetMap = () => {
+ // mapRef.value.map.setCenter(position.value)
+ // mapRef.value.map.setZoom(17.5)
+}
+
+// 查看数据
+const deviceData = () => {
+ if (!deciceInfo.value.devcode) {
+ showToast('设备编号不能为空')
+ return
+ }
+ $router.push({
+ name: 'OperationData',
+ query: {
+ devcode: deciceInfo.value.devcode
+ }
+ })
+}
+// 页面缓存
+onBeforeRouteLeave((to: any) => {
+ keepSearchParams(to.path, 'H5DeviceAdd')
+})
-
+
设备信息
@@ -196,7 +263,8 @@
@cancel="showProduct = false" />
-
+
@@ -213,14 +281,14 @@
@cancel="showDatePicker = false" />
-
+
-
+
-
![]()
+
@@ -234,14 +302,37 @@
+
+
+
+
+ 保存
+ 查看设备数据
+
diff --git a/src/views/mobile/info/detail.vue b/src/views/mobile/info/detail.vue
index c2696dc..ef0f0fb 100644
--- a/src/views/mobile/info/detail.vue
+++ b/src/views/mobile/info/detail.vue
@@ -6,78 +6,27 @@
@@ -93,13 +110,15 @@
查询结果
-
-
-
+
+
+ detail(event, item)">
{{ item.devcode }}
设备类型
-
{{ item.devTypeName }}
+
{{ item.typeName }}
安装位置
@@ -108,14 +127,16 @@
安装日期
@@ -123,6 +144,10 @@
+
+
+
+
@@ -164,6 +189,7 @@
.title {
display: flex;
font-size: 1.1rem;
+
// border-left: 4px solid #0d76d4;
// border-radius: 2px;
.symbol {
@@ -182,6 +208,7 @@
.result-item {
padding: 4px;
+
// box-shadow: 0px 12px 32px 4px rgba(0, 0, 0, .04), 0px 8px 20px rgba(0, 0, 0, .08);
.devcode {
font-weight: 700;
@@ -200,6 +227,15 @@
color: #888;
width: 80%;
text-align: right;
+ white-space: nowrap;
+
+ /* 确保文本在一行内显示 */
+ overflow: hidden;
+
+ /* 超出容器部分隐藏 */
+ text-overflow: ellipsis;
+
+ /* 文字溢出显示省略号 */
}
.title {
diff --git a/src/views/mobile/info/search.vue b/src/views/mobile/info/search.vue
index 9bf1c64..e9e28aa 100644
--- a/src/views/mobile/info/search.vue
+++ b/src/views/mobile/info/search.vue
@@ -4,21 +4,39 @@
Date: 2025-01-02
-->
@@ -27,10 +45,10 @@
-
+
-
-
+
+
@@ -60,17 +78,20 @@
font-weight: 700;
font-size: 1rem;
}
+
::v-deep(.van-cell__value) {
// font-weight: 700;
font-size: 1rem;
}
}
+
.search-btn {
width: 100%;
position: fixed;
bottom: 1vh;
display: flex;
justify-content: center;
+
::v-deep(.el-button) {
font-size: 18px;
}
diff --git a/src/views/mobile/operation/data.vue b/src/views/mobile/operation/data.vue
index 719c691..a1408a1 100644
--- a/src/views/mobile/operation/data.vue
+++ b/src/views/mobile/operation/data.vue
@@ -5,104 +5,17 @@
-->
-
+
+ placeholder="选择运维类型" required @click="showRepairType = true" input-align="right"
+ :rules="[{ required: true, message: '请选择运维类型' }]" />
+ input-align="right" @blur="searchDeviceInfo" clearable :rules="[{ required: true, message: '请输入设备编号' }]" />
-
+
+ placeholder="详细位置" required input-align="right" :rules="[{ required: true, message: '请确认设备编号是否正确' }]" />
-
+
+ input-align="right" clearable :rules="[{ required: true, message: '请输入运维人员' }]" />
+ input-align="right" clearable :rules="[{ required: true, message: '请输入运维内容' }]" />
-
+
-
![]()
+
diff --git a/src/views/mobile/operation/success.vue b/src/views/mobile/operation/success.vue
index 88d4716..e41e1b7 100644
--- a/src/views/mobile/operation/success.vue
+++ b/src/views/mobile/operation/success.vue
@@ -5,13 +5,12 @@
-->
diff --git a/src/views/mobile/device/add.vue b/src/views/mobile/device/add.vue
index 1ad4bbd..3857e6c 100644
--- a/src/views/mobile/device/add.vue
+++ b/src/views/mobile/device/add.vue
@@ -11,6 +11,10 @@
import { showToast, showLoadingToast, closeToast, showConfirmDialog } from 'vant'
import { getWellListPage } from '@/api/home/well/well'
import { getStationListPage } from '@/api/home/station/station'
+import AMap from '@/components/map/index.vue'
+import { keepSearchParams } from '@/utils/keepQuery'
+import { uploadApi } from '@/api/mobile/operation'
+const $router = useRouter()
const deciceInfo = ref({
productId: '',
productName: '',
@@ -18,7 +22,6 @@
tagNumber: '',
watchObject: '',
installDate: '',
- photo: []
})
// 产品相关
@@ -88,8 +91,6 @@
// }
}
-// const
-
// 安装日期
const showDatePicker = ref(false)
const pickerValueInstallDate = ref([])
@@ -102,10 +103,10 @@
showDatePicker.value = false
}
// 现场照片
-// const showCamera = ref(false)
+const photo = ref([])
// 拍照
const takePictures = () => {
- if(deciceInfo.value.photo.length >= 3) {
+ if (deciceInfo.value.photo.length >= 3) {
showToast('最多上传三张照片')
return
}
@@ -118,11 +119,19 @@
// 原生上传
if (event.target.files?.length !== 0) {
const file = event.target.files[0]
- const reader = new FileReader() // 实例化FileReader
- reader.readAsDataURL(file)
+ const fd = new FormData()
+ fd.append('file', file)
+ uploadApi(fd).then(res => {
+ photo.value.push(res.data as string)
+ fileRef.value.value = ''
+ }).catch(() => {
+ fileRef.value.value = ''
+ })
+ // const reader = new FileReader() // 实例化FileReader
+ // reader.readAsDataURL(file)
// 读取成功以后执行的方法
- reader.onload = (e) => {
- deciceInfo.value.photo.push(e.target.result)
+ // reader.onload = (e) => {
+ // deciceInfo.value.photo.push(e.target.result)
// let img = new Image()
// // base64
// img.src = e.target.result
@@ -130,29 +139,30 @@
// img.onload = () => {
// imagetoCanvas(img) //Image 对象转变为一个 Canvas 类型对象,i为遍历的下标
// }
- }
+ // }
}
}
+// 图片地址
+const getPhotoUrl = computed(() => {
+ return (url: string) => {
+ return `${window.localStorage.getItem('url-bj-well')}/static/${url}`
+ }
+})
// 删除图片
const deletePhoto = (index: number) => {
- deciceInfo.value.photo.splice(index, 1)
+ photo.value.splice(index, 1)
}
// 预览图片
const previewPhoto = (index: number) => {
showImagePreview({
- images: deciceInfo.value.photo,
+ images: photo.value,
startPosition: index
})
}
-// 关闭摄像头
-// const closeCamera = () => {
-// showCamera.value = false
-// }
// 获取字典
const deviceTypeList = ref([]) // 设备类型列表
const fetchDict = () => {
getProductListPage({ offset: 1, limit: 9999 }).then(res => {
- console.log(res.data.rows, '产品列表')
productColumns.value = res.data.rows.map((item: any) => ({
text: `${item.productName}-${item.productCode}`,
value: item.id,
@@ -170,20 +180,77 @@
const select = productColumns.value.filter((item: any) => item.value === newVal) as any
const watchObject = deviceTypeList.value.filter((item: any) => item.id === select[0].deviceType)
deciceInfo.value.watchObject = watchObject[0].watchObject
-
}
else {
deciceInfo.value.tagNumber = ''
deciceInfo.value.watchObject = ''
}
})
-const empty = ref('')
+
+
+// 计算地图区域高度
+const scrollHeight = ref(0)
+const calcHeight = () => {
+ // 公共头部高度40
+ // 边距安全 30
+ // 底部按钮
+ const exportBtnHeight = document.getElementById('handler-btn')?.offsetHeight || 0
+ // 头部
+ const searchHeaderHeight = document.getElementById('info-area')?.offsetHeight || 0
+ scrollHeight.value = window.innerHeight - 40 - exportBtnHeight - searchHeaderHeight - 30
+}
+onMounted(() => {
+ calcHeight()
+})
+
+window.addEventListener('resize', () => {
+ calcHeight()
+})
+onBeforeUnmount(() => {
+ window.addEventListener('resize', () => { })
+})
+// 地图操作
+const mapRef = ref()
+// 当前状态 收起retract/展开expand
+const mapStatus = ref('expand')
+const changeStatus = () => {
+ if (mapStatus.value === 'expand') {
+ mapStatus.value = 'retract'
+ }
+ else {
+ mapStatus.value = 'expand'
+ }
+
+}
+// 重置地图到初始状态
+const resetMap = () => {
+ // mapRef.value.map.setCenter(position.value)
+ // mapRef.value.map.setZoom(17.5)
+}
+
+// 查看数据
+const deviceData = () => {
+ if (!deciceInfo.value.devcode) {
+ showToast('设备编号不能为空')
+ return
+ }
+ $router.push({
+ name: 'OperationData',
+ query: {
+ devcode: deciceInfo.value.devcode
+ }
+ })
+}
+// 页面缓存
+onBeforeRouteLeave((to: any) => {
+ keepSearchParams(to.path, 'H5DeviceAdd')
+})
-
+
设备信息
@@ -196,7 +263,8 @@
@cancel="showProduct = false" />
-
+
@@ -213,14 +281,14 @@
@cancel="showDatePicker = false" />
-
+
-
+
-
![]()
+
@@ -234,14 +302,37 @@
+
+
+
+
+ 保存
+ 查看设备数据
+
diff --git a/src/views/mobile/info/detail.vue b/src/views/mobile/info/detail.vue
index c2696dc..ef0f0fb 100644
--- a/src/views/mobile/info/detail.vue
+++ b/src/views/mobile/info/detail.vue
@@ -6,78 +6,27 @@
@@ -93,13 +110,15 @@
查询结果
-
-
-
+
+
+ detail(event, item)">
{{ item.devcode }}
设备类型
-
{{ item.devTypeName }}
+
{{ item.typeName }}
安装位置
@@ -108,14 +127,16 @@
安装日期
@@ -123,6 +144,10 @@
+
+
+
+
@@ -164,6 +189,7 @@
.title {
display: flex;
font-size: 1.1rem;
+
// border-left: 4px solid #0d76d4;
// border-radius: 2px;
.symbol {
@@ -182,6 +208,7 @@
.result-item {
padding: 4px;
+
// box-shadow: 0px 12px 32px 4px rgba(0, 0, 0, .04), 0px 8px 20px rgba(0, 0, 0, .08);
.devcode {
font-weight: 700;
@@ -200,6 +227,15 @@
color: #888;
width: 80%;
text-align: right;
+ white-space: nowrap;
+
+ /* 确保文本在一行内显示 */
+ overflow: hidden;
+
+ /* 超出容器部分隐藏 */
+ text-overflow: ellipsis;
+
+ /* 文字溢出显示省略号 */
}
.title {
diff --git a/src/views/mobile/info/search.vue b/src/views/mobile/info/search.vue
index 9bf1c64..e9e28aa 100644
--- a/src/views/mobile/info/search.vue
+++ b/src/views/mobile/info/search.vue
@@ -4,21 +4,39 @@
Date: 2025-01-02
-->
@@ -27,10 +45,10 @@
-
+
-
-
+
+
@@ -60,17 +78,20 @@
font-weight: 700;
font-size: 1rem;
}
+
::v-deep(.van-cell__value) {
// font-weight: 700;
font-size: 1rem;
}
}
+
.search-btn {
width: 100%;
position: fixed;
bottom: 1vh;
display: flex;
justify-content: center;
+
::v-deep(.el-button) {
font-size: 18px;
}
diff --git a/src/views/mobile/operation/data.vue b/src/views/mobile/operation/data.vue
index 719c691..a1408a1 100644
--- a/src/views/mobile/operation/data.vue
+++ b/src/views/mobile/operation/data.vue
@@ -5,104 +5,17 @@
-->
-
+
+ placeholder="选择运维类型" required @click="showRepairType = true" input-align="right"
+ :rules="[{ required: true, message: '请选择运维类型' }]" />
+ input-align="right" @blur="searchDeviceInfo" clearable :rules="[{ required: true, message: '请输入设备编号' }]" />
-
+
+ placeholder="详细位置" required input-align="right" :rules="[{ required: true, message: '请确认设备编号是否正确' }]" />
-
+
+ input-align="right" clearable :rules="[{ required: true, message: '请输入运维人员' }]" />
+ input-align="right" clearable :rules="[{ required: true, message: '请输入运维内容' }]" />
-
+
-
![]()
+
diff --git a/src/views/mobile/operation/success.vue b/src/views/mobile/operation/success.vue
index 88d4716..e41e1b7 100644
--- a/src/views/mobile/operation/success.vue
+++ b/src/views/mobile/operation/success.vue
@@ -5,13 +5,12 @@
-->
@@ -56,7 +70,7 @@
位置名称
-
{{ detailInfo.position }}
+
{{ detailInfo.ledgerName }}
详细位置
@@ -76,6 +90,17 @@
运维内容
{{ detailInfo.repairContent }}
+
+
现场照片
+
+
![]()
+
+
+
diff --git a/public/config/config.json b/public/config/config.json
index d7d7fef..d02f6e9 100644
--- a/public/config/config.json
+++ b/public/config/config.json
@@ -1,6 +1,6 @@
{
"title":"燃气物联感知平台",
- "baseUrl": "http://111.198.10.15:11643",
+ "baseUrl": "http://111.198.10.15:11646",
"securityJsCode": "56bf9671d4b3517d294caec4751889a1",
"JsKey": "40849e82b4e33f5255b17372520c954d",
"xuntengMap": "http://111.198.10.15:11643/getMap?mapPath=http://172.17.206.70:20198/_allLayer/tile",
diff --git a/src/api/index.ts b/src/api/index.ts
index 103bf3b..9da5465 100644
--- a/src/api/index.ts
+++ b/src/api/index.ts
@@ -40,6 +40,7 @@
if (userStore.isLogin && request.headers) {
request.headers.token = userStore.token
}
+ // request.headers['Accept-Encoding'] = 'gzip, deflate, br, zstd'
// 是否将 POST 请求参数进行字符串化处理
if (request.method === 'post') {
// request.data = qs.stringify(request.data, {
diff --git a/src/api/mobile/1 b/src/api/mobile/1
deleted file mode 100644
index e69de29..0000000
--- a/src/api/mobile/1
+++ /dev/null
diff --git a/src/api/mobile/info.ts b/src/api/mobile/info.ts
new file mode 100644
index 0000000..7490f50
--- /dev/null
+++ b/src/api/mobile/info.ts
@@ -0,0 +1,21 @@
+/**
+ * 信息查询
+ */
+import request from '@/api/index'
+
+// 基础列表
+export function getInfoListPage(data: any) {
+ return request({
+ url: `/system/busDevice/listPage?limit=${data.limit}&offset=${data.offset}`,
+ method: 'post',
+ data,
+ })
+}
+// 查询设备数据
+export function getDeviceData(data: any) {
+ return request({
+ url: `system/busDevice/monitorData`,
+ method: 'post',
+ data,
+ })
+}
diff --git a/src/api/mobile/operation.ts b/src/api/mobile/operation.ts
new file mode 100644
index 0000000..3bfd174
--- /dev/null
+++ b/src/api/mobile/operation.ts
@@ -0,0 +1,35 @@
+/**
+ * 设备运维
+ */
+import request from '@/api/index'
+
+// 获取设备安装信息
+export function getDeviceInstall(devCode: any) {
+ return request({
+ url: `device/busRepairLog/getDeviceByCode/${devCode}`,
+ method: 'post',
+ })
+}
+// 上传图片
+export function uploadApi(data: FormData) {
+ return request({
+ url: '/system/busDevice/fileUpload',
+ method: 'post',
+ data,
+ })
+}
+// 获取图片地址
+export function getPhotoUrl(fileName: string) {
+ return request({
+ url: `/minio/file/url?fileName=${fileName}`,
+ method: 'get',
+ })
+}
+// 新建
+export function addDeviceInstall(data: any) {
+ return request({
+ url: '/device/busRepairLog/add',
+ method: 'post',
+ data,
+ })
+}
diff --git a/src/api/mobile/record.ts b/src/api/mobile/record.ts
index 42113c8..ed622fc 100644
--- a/src/api/mobile/record.ts
+++ b/src/api/mobile/record.ts
@@ -21,3 +21,10 @@
responseType: 'blob',
})
}
+
+export function getDeviceDetail(devcode: any) {
+ return request({
+ url: `/system/busDevice/getWellByDevCode/${devcode}`,
+ method: 'post',
+ })
+}
diff --git a/src/assets/mobile/device.png b/src/assets/mobile/device.png
index 1de66a4..bf7b9f5 100644
--- a/src/assets/mobile/device.png
+++ b/src/assets/mobile/device.png
Binary files differ
diff --git a/src/assets/mobile/expand.svg b/src/assets/mobile/expand.svg
new file mode 100644
index 0000000..4f18a55
--- /dev/null
+++ b/src/assets/mobile/expand.svg
@@ -0,0 +1 @@
+
\ No newline at end of file
diff --git a/src/assets/mobile/operation.png b/src/assets/mobile/operation.png
index 235f0a1..eeb540c 100644
--- a/src/assets/mobile/operation.png
+++ b/src/assets/mobile/operation.png
Binary files differ
diff --git a/src/assets/mobile/record.png b/src/assets/mobile/record.png
index dc479ca..63a6450 100644
--- a/src/assets/mobile/record.png
+++ b/src/assets/mobile/record.png
Binary files differ
diff --git a/src/assets/mobile/retract.svg b/src/assets/mobile/retract.svg
new file mode 100644
index 0000000..69db581
--- /dev/null
+++ b/src/assets/mobile/retract.svg
@@ -0,0 +1 @@
+
\ No newline at end of file
diff --git a/src/assets/mobile/search.png b/src/assets/mobile/search.png
index cb1dd4f..eb33171 100644
--- a/src/assets/mobile/search.png
+++ b/src/assets/mobile/search.png
Binary files differ
diff --git a/src/assets/mobile/user.png b/src/assets/mobile/user.png
index 92edf2d..a306341 100644
--- a/src/assets/mobile/user.png
+++ b/src/assets/mobile/user.png
Binary files differ
diff --git a/src/store/modules/user.ts b/src/store/modules/user.ts
index cc9fc78..d59cf45 100644
--- a/src/store/modules/user.ts
+++ b/src/store/modules/user.ts
@@ -1,7 +1,7 @@
import { reject } from 'lodash-es'
import useRouteStore from './route'
import useMenuStore from './menu'
-import { doLogin, getConfig, getInfo, getUserMenus } from '@/api/system/login'
+import { doLogin, getConfig, getInfo, getUserMenus, logout } from '@/api/system/login'
import { changePwd } from '@/api/system/user'
import type { Menu } from '@/global'
import { getPrivateKey, privateStr, setPrivateKey } from '@/utils/auth'
@@ -100,22 +100,28 @@
// 注销
logout() {
return new Promise((resolve) => {
- const routeStore = useRouteStore()
- const menuStore = useMenuStore()
- localStorage.removeItem('username')
- localStorage.removeItem('token')
- localStorage.removeItem('nameId')
- localStorage.removeItem('depId')
- this.username = ''
- this.token = ''
- this.roleList = []
- this.roleNames = []
- routeStore.removeRoutes()
- menuStore.setActived(0)
- menuStore.resetBreadcrumb()
- // 清空缓存
- indexDB.deleteAll()
- resolve()
+ logout().then(() => {
+ const routeStore = useRouteStore()
+ const menuStore = useMenuStore()
+ localStorage.removeItem('username')
+ localStorage.removeItem('token')
+ localStorage.removeItem('nameId')
+ localStorage.removeItem('depId')
+ this.username = ''
+ this.token = ''
+ this.roleList = []
+ this.roleNames = []
+ routeStore.removeRoutes()
+ menuStore.setActived(0)
+ menuStore.resetBreadcrumb()
+ // 清空缓存
+ indexDB.deleteAll()
+ resolve()
+ })
+ .catch((error) => {
+ reject(error)
+ })
+
})
},
// 获取用户信息
@@ -143,7 +149,7 @@
this.username = res.data.account
this.name = res.data.name
resolve(res.data)
- console.log(indexDB.getStatus(),window.localStorage.getItem('browser-type-bj-well'), 'indexDB加载状态')
+ console.log(indexDB.getStatus(), window.localStorage.getItem('browser-type-bj-well'), 'indexDB加载状态')
if (indexDB.getStatus() && window.localStorage.getItem('browser-type-bj-well') === 'pc') {
// 重新拉取缓存
fetchCacheDevice()
diff --git a/src/utils/keepQuery.ts b/src/utils/keepQuery.ts
index 829b4b3..3b77c80 100644
--- a/src/utils/keepQuery.ts
+++ b/src/utils/keepQuery.ts
@@ -3,7 +3,7 @@
const keepAliveStore = useKeepAliveStore()
// 操作
-const needKeep = ['detail']
+const needKeep = ['detail', 'info/result', 'operation/data']
export function keepSearchParams(to: any, componentName: string) {
if (needKeep.some((item: string) => to.includes(item))) {
keepAliveStore.add(componentName)
diff --git a/src/views/home/device/device/index.vue b/src/views/home/device/device/index.vue
index cb76ade..1aa4006 100644
--- a/src/views/home/device/device/index.vue
+++ b/src/views/home/device/device/index.vue
@@ -77,7 +77,6 @@
})
// 查询数据
const fetchData = () => {
- console.log(123)
loadingTable.value = true
getDeviceListPage(listQuery.value).then((res) => {
list.value = []
diff --git a/src/views/mobile/dashboard/index.vue b/src/views/mobile/dashboard/index.vue
index a30e120..bc20597 100644
--- a/src/views/mobile/dashboard/index.vue
+++ b/src/views/mobile/dashboard/index.vue
@@ -152,13 +152,13 @@
.menu-item {
margin-top: 1.5rem;
width: 42%;
- border: 2px solid #0d76d4;
+ border: 2px solid #7cbaf0;
background-color: rgba($color: #0b0b0f, $alpha: 1%);
border-radius: 4px;
padding: 10px;
box-shadow: 0 0 12px rgb(0 0 0 / 12%);
font-weight: 700;
- color: #333;
+ color: #5f5e5e;
.img {
width: 100%;
@@ -168,6 +168,7 @@
img {
width: 40%;
margin: 0 auto;
+ border-radius: 25%;
}
}
@@ -196,6 +197,7 @@
right: 2rem;
width: 3rem;
height: 3rem;
+ border-radius: 25%;
}
}
diff --git a/src/views/mobile/dashboard/userInfo.vue b/src/views/mobile/dashboard/userInfo.vue
index 99418cf..4fff389 100644
--- a/src/views/mobile/dashboard/userInfo.vue
+++ b/src/views/mobile/dashboard/userInfo.vue
@@ -8,6 +8,7 @@
import useRouteStore from '@/store/modules/route'
// import useUserStore from '@/store/modules/user'
import { ElMessage, ElMessageBox } from 'element-plus'
+import { showConfirmDialog } from 'vant'
const userStore = useUserStore()
const routeStore = useRouteStore()
const userInfo = useUserStore()
@@ -27,15 +28,10 @@
})
// 退出登录
const logout = () => {
- ElMessageBox.confirm(
- '确认退出登录吗?',
- '',
- {
- confirmButtonText: '确认',
- cancelButtonText: '取消',
- type: 'warning',
- }
- ).then(() => {
+ showConfirmDialog({
+ title: '确认退出登录吗?',
+ })
+ .then(() => {
routeStore.removeRoutes()
userStore.logout().then(() => {
$router.push({
@@ -43,6 +39,15 @@
})
})
})
+ // ElMessageBox.confirm(
+ // '确认退出登录吗?',
+ // '',
+ // {
+ // confirmButtonText: '确认',
+ // cancelButtonText: '取消',
+ // type: 'warning',
+ // }
+ // )
}
diff --git a/src/views/mobile/device/add.vue b/src/views/mobile/device/add.vue
index 1ad4bbd..3857e6c 100644
--- a/src/views/mobile/device/add.vue
+++ b/src/views/mobile/device/add.vue
@@ -11,6 +11,10 @@
import { showToast, showLoadingToast, closeToast, showConfirmDialog } from 'vant'
import { getWellListPage } from '@/api/home/well/well'
import { getStationListPage } from '@/api/home/station/station'
+import AMap from '@/components/map/index.vue'
+import { keepSearchParams } from '@/utils/keepQuery'
+import { uploadApi } from '@/api/mobile/operation'
+const $router = useRouter()
const deciceInfo = ref({
productId: '',
productName: '',
@@ -18,7 +22,6 @@
tagNumber: '',
watchObject: '',
installDate: '',
- photo: []
})
// 产品相关
@@ -88,8 +91,6 @@
// }
}
-// const
-
// 安装日期
const showDatePicker = ref(false)
const pickerValueInstallDate = ref([])
@@ -102,10 +103,10 @@
showDatePicker.value = false
}
// 现场照片
-// const showCamera = ref(false)
+const photo = ref([])
// 拍照
const takePictures = () => {
- if(deciceInfo.value.photo.length >= 3) {
+ if (deciceInfo.value.photo.length >= 3) {
showToast('最多上传三张照片')
return
}
@@ -118,11 +119,19 @@
// 原生上传
if (event.target.files?.length !== 0) {
const file = event.target.files[0]
- const reader = new FileReader() // 实例化FileReader
- reader.readAsDataURL(file)
+ const fd = new FormData()
+ fd.append('file', file)
+ uploadApi(fd).then(res => {
+ photo.value.push(res.data as string)
+ fileRef.value.value = ''
+ }).catch(() => {
+ fileRef.value.value = ''
+ })
+ // const reader = new FileReader() // 实例化FileReader
+ // reader.readAsDataURL(file)
// 读取成功以后执行的方法
- reader.onload = (e) => {
- deciceInfo.value.photo.push(e.target.result)
+ // reader.onload = (e) => {
+ // deciceInfo.value.photo.push(e.target.result)
// let img = new Image()
// // base64
// img.src = e.target.result
@@ -130,29 +139,30 @@
// img.onload = () => {
// imagetoCanvas(img) //Image 对象转变为一个 Canvas 类型对象,i为遍历的下标
// }
- }
+ // }
}
}
+// 图片地址
+const getPhotoUrl = computed(() => {
+ return (url: string) => {
+ return `${window.localStorage.getItem('url-bj-well')}/static/${url}`
+ }
+})
// 删除图片
const deletePhoto = (index: number) => {
- deciceInfo.value.photo.splice(index, 1)
+ photo.value.splice(index, 1)
}
// 预览图片
const previewPhoto = (index: number) => {
showImagePreview({
- images: deciceInfo.value.photo,
+ images: photo.value,
startPosition: index
})
}
-// 关闭摄像头
-// const closeCamera = () => {
-// showCamera.value = false
-// }
// 获取字典
const deviceTypeList = ref([]) // 设备类型列表
const fetchDict = () => {
getProductListPage({ offset: 1, limit: 9999 }).then(res => {
- console.log(res.data.rows, '产品列表')
productColumns.value = res.data.rows.map((item: any) => ({
text: `${item.productName}-${item.productCode}`,
value: item.id,
@@ -170,20 +180,77 @@
const select = productColumns.value.filter((item: any) => item.value === newVal) as any
const watchObject = deviceTypeList.value.filter((item: any) => item.id === select[0].deviceType)
deciceInfo.value.watchObject = watchObject[0].watchObject
-
}
else {
deciceInfo.value.tagNumber = ''
deciceInfo.value.watchObject = ''
}
})
-const empty = ref('')
+
+
+// 计算地图区域高度
+const scrollHeight = ref(0)
+const calcHeight = () => {
+ // 公共头部高度40
+ // 边距安全 30
+ // 底部按钮
+ const exportBtnHeight = document.getElementById('handler-btn')?.offsetHeight || 0
+ // 头部
+ const searchHeaderHeight = document.getElementById('info-area')?.offsetHeight || 0
+ scrollHeight.value = window.innerHeight - 40 - exportBtnHeight - searchHeaderHeight - 30
+}
+onMounted(() => {
+ calcHeight()
+})
+
+window.addEventListener('resize', () => {
+ calcHeight()
+})
+onBeforeUnmount(() => {
+ window.addEventListener('resize', () => { })
+})
+// 地图操作
+const mapRef = ref()
+// 当前状态 收起retract/展开expand
+const mapStatus = ref('expand')
+const changeStatus = () => {
+ if (mapStatus.value === 'expand') {
+ mapStatus.value = 'retract'
+ }
+ else {
+ mapStatus.value = 'expand'
+ }
+
+}
+// 重置地图到初始状态
+const resetMap = () => {
+ // mapRef.value.map.setCenter(position.value)
+ // mapRef.value.map.setZoom(17.5)
+}
+
+// 查看数据
+const deviceData = () => {
+ if (!deciceInfo.value.devcode) {
+ showToast('设备编号不能为空')
+ return
+ }
+ $router.push({
+ name: 'OperationData',
+ query: {
+ devcode: deciceInfo.value.devcode
+ }
+ })
+}
+// 页面缓存
+onBeforeRouteLeave((to: any) => {
+ keepSearchParams(to.path, 'H5DeviceAdd')
+})
-
+
设备信息
@@ -196,7 +263,8 @@
@cancel="showProduct = false" />
-
+
@@ -213,14 +281,14 @@
@cancel="showDatePicker = false" />
-
+
-
+
-
![]()
+
@@ -234,14 +302,37 @@
+
+
+
+
+ 保存
+ 查看设备数据
+
diff --git a/src/views/mobile/info/detail.vue b/src/views/mobile/info/detail.vue
index c2696dc..ef0f0fb 100644
--- a/src/views/mobile/info/detail.vue
+++ b/src/views/mobile/info/detail.vue
@@ -6,78 +6,27 @@
@@ -93,13 +110,15 @@
查询结果
-
-
-
+
+
+ detail(event, item)">
{{ item.devcode }}
设备类型
-
{{ item.devTypeName }}
+
{{ item.typeName }}
安装位置
@@ -108,14 +127,16 @@
安装日期
@@ -123,6 +144,10 @@
+
+
+
+
@@ -164,6 +189,7 @@
.title {
display: flex;
font-size: 1.1rem;
+
// border-left: 4px solid #0d76d4;
// border-radius: 2px;
.symbol {
@@ -182,6 +208,7 @@
.result-item {
padding: 4px;
+
// box-shadow: 0px 12px 32px 4px rgba(0, 0, 0, .04), 0px 8px 20px rgba(0, 0, 0, .08);
.devcode {
font-weight: 700;
@@ -200,6 +227,15 @@
color: #888;
width: 80%;
text-align: right;
+ white-space: nowrap;
+
+ /* 确保文本在一行内显示 */
+ overflow: hidden;
+
+ /* 超出容器部分隐藏 */
+ text-overflow: ellipsis;
+
+ /* 文字溢出显示省略号 */
}
.title {
diff --git a/src/views/mobile/info/search.vue b/src/views/mobile/info/search.vue
index 9bf1c64..e9e28aa 100644
--- a/src/views/mobile/info/search.vue
+++ b/src/views/mobile/info/search.vue
@@ -4,21 +4,39 @@
Date: 2025-01-02
-->
@@ -27,10 +45,10 @@
-
+
-
-
+
+
@@ -60,17 +78,20 @@
font-weight: 700;
font-size: 1rem;
}
+
::v-deep(.van-cell__value) {
// font-weight: 700;
font-size: 1rem;
}
}
+
.search-btn {
width: 100%;
position: fixed;
bottom: 1vh;
display: flex;
justify-content: center;
+
::v-deep(.el-button) {
font-size: 18px;
}
diff --git a/src/views/mobile/operation/data.vue b/src/views/mobile/operation/data.vue
index 719c691..a1408a1 100644
--- a/src/views/mobile/operation/data.vue
+++ b/src/views/mobile/operation/data.vue
@@ -5,104 +5,17 @@
-->
-
+
+ placeholder="选择运维类型" required @click="showRepairType = true" input-align="right"
+ :rules="[{ required: true, message: '请选择运维类型' }]" />
+ input-align="right" @blur="searchDeviceInfo" clearable :rules="[{ required: true, message: '请输入设备编号' }]" />
-
+
+ placeholder="详细位置" required input-align="right" :rules="[{ required: true, message: '请确认设备编号是否正确' }]" />
-
+
+ input-align="right" clearable :rules="[{ required: true, message: '请输入运维人员' }]" />
+ input-align="right" clearable :rules="[{ required: true, message: '请输入运维内容' }]" />
-
+
-
![]()
+
diff --git a/src/views/mobile/operation/success.vue b/src/views/mobile/operation/success.vue
index 88d4716..e41e1b7 100644
--- a/src/views/mobile/operation/success.vue
+++ b/src/views/mobile/operation/success.vue
@@ -5,13 +5,12 @@
-->
@@ -56,7 +70,7 @@
位置名称
-
{{ detailInfo.position }}
+
{{ detailInfo.ledgerName }}
详细位置
@@ -76,6 +90,17 @@
运维内容
{{ detailInfo.repairContent }}
+
+
现场照片
+
+
![]()
+
+
+
diff --git a/src/views/mobile/record/search.vue b/src/views/mobile/record/search.vue
index c8d90ec..4b13887 100644
--- a/src/views/mobile/record/search.vue
+++ b/src/views/mobile/record/search.vue
@@ -14,7 +14,8 @@
import { showLoadingToast, closeToast } from 'vant'
import { exportFile } from '@/utils/exportUtils'
import { keepSearchParams } from '@/utils/keepQuery'
-const list = ref([])
+import { debounce } from 'lodash-es'
+const list = ref([])
const total = ref(0)
const loading = ref(true)
const userInfo = useUserStore()
@@ -25,7 +26,7 @@
timeType: '', // 时间类型 1 近7日 2近30日 3 自定义时间
beginTime: '',
endTime: '',
- deptId: '',
+ deptid: '',
offset: 1,
limit: 10,
})
@@ -130,7 +131,7 @@
deptTabs.value = ['集团', '单位']
// showDept.value = false
// 确定
- // searchQuery.value.deptId = selectedOptions[0].value
+ // searchQuery.value.deptid = selectedOptions[0].value
// searchQueryForNames.value.deptName = allDeptList.value.filter(item => item.id === selectedOptions[0].value)[0].name
}
else {
@@ -202,7 +203,6 @@
}
// 确认管理单位
const onConfirmDept = (data: any[]) => {
- console.log(data, '管理单位')
const dict = {
0: pickerGroupDept,
1: pickerUnitDept,
@@ -213,7 +213,12 @@
data.forEach((item: any, index: number) => {
dict[index].value = item.selectedValues
})
- searchQuery.value.deptId = data[deptTabs.value.length - 1].selectedValues
+ searchQuery.value.deptid = data[deptTabs.value.length - 1].selectedValues
+ if (!searchQuery.value.deptid[0]) {
+ searchQueryForNames.value.deptName = ''
+ showDept.value = false
+ return
+ }
searchQueryForNames.value.deptName = allDeptList.value.filter(item => item.id === data[deptTabs.value.length - 1].selectedValues[0])[0].name
showDept.value = false
}
@@ -285,7 +290,6 @@
showToast('请选择正确时间范围');
return
}
- // console.log('确认日期')
searchQuery.value.timeType = '3'
searchQuery.value.beginTime = startDate.value.join('-')
searchQuery.value.endTime = endDate.value.join('-')
@@ -348,21 +352,24 @@
offset: searchQuery.value.offset,
limit: 10,
repairType: searchQuery.value.repairType,
- deptId: searchQuery.value.deptId ? searchQuery.value.deptId[0] : '',
+ deptid: searchQuery.value.deptid ? searchQuery.value.deptid[0] : '',
repairPerson: searchQuery.value.userId ? userInfo.name : '',
begTime: searchQuery.value.beginTime,
endTime: searchQuery.value.endTime,
}
search.value = obj
getOperationListPage(obj).then(res => {
- console.log(res.data, '查询结果')
total.value = res.data.total
- list.value = res.data.rows || []
+ list.value = [...list.value, ...(res.data.rows || [])]
+ list.value = list.value.map((item: any) => ({ ...item, repairTime: item.repairTime ? dayjs().format('YYYY-MM-DD') : '' }))
loading.value = false
- console.log(list.value, '132')
})
}
-watch(() => searchQuery.value, () => {
+watch([() => searchQuery.value.beginTime, () => searchQuery.value.deptid, () => searchQuery.value.deviceType, () => searchQuery.value.endTime,
+() => searchQuery.value.repairType, () => searchQuery.value.timeType, () => searchQuery.value.userId
+], () => {
+ list.value = []
+ searchQuery.value.offset = 1
loading.value = true
fetchData()
}, {
@@ -381,7 +388,10 @@
})
// 查看详情
const $router = useRouter()
-const detail = (row: any) => {
+const detail = (event: any, row: any) => {
+ if (event.target.innerHTML === ('收起') || event.target.innerHTML === ('展开')) {
+ return
+ }
$router.push({
name: 'RecordDetail',
query: {
@@ -397,7 +407,6 @@
message: '加载中...',
})
exportOperationList(search.value).then(res => {
- // console.log(res.data)
exportFile(res.data, '运维记录')
closeToast()
})
@@ -407,10 +416,28 @@
keepSearchParams(to.path, 'H5OperationRecord')
})
onActivated(() => {
- if (!($router.options.history.state.back as string || '').includes('detail')) {
+ if (!($router.options.history.state.forward as string || '').includes('detail')) {
fetchData()
}
})
+// 滚动条
+const scrollbarRef = ref()
+const handleScroll = (a) => {
+ // 判断滚动条是否滚动到底部
+ const scrollbarContainer = scrollbarRef.value.$el.querySelector('.el-scrollbar__wrap')
+ const isScrolledToBottom = scrollbarContainer.scrollHeight - scrollbarContainer.scrollTop <= scrollbarContainer.clientHeight + 50
+ if (isScrolledToBottom) {
+ if (list.value.length === total.value) {
+ return
+ }
+ // debounce(() => {
+ loading.value = true
+ searchQuery.value.offset += 1
+ fetchData()
+ // }, 200)
+
+ }
+}
@@ -505,10 +532,10 @@
-
+
+ @click="(event) => detail(event, item)">
{{ item.devcode }}
设备类型
@@ -626,6 +653,15 @@
background-color: #fff;
border-radius: 16px;
border: 1px solid #e4e7ed;
+ white-space: nowrap;
+ /* 确保文本在一行内显示 */
+ overflow: hidden;
+
+ /* 超出容器部分隐藏 */
+ text-overflow: ellipsis;
+
+ /* 文字溢出显示省略号 */
+
}
}