From bbdd646b82cb8c84079598b7200b1102fd247b28 Mon Sep 17 00:00:00 2001
From: gaoluyang <2820782392@qq.com>
Date: 星期一, 29 十二月 2025 16:08:48 +0800
Subject: [PATCH] 昭德-巡检上传开发调整
---
src/pages/inspectionUpload/index.vue | 942 +++++++++++++++++++++++-----------------------------------
1 files changed, 381 insertions(+), 561 deletions(-)
diff --git a/src/pages/inspectionUpload/index.vue b/src/pages/inspectionUpload/index.vue
index 3b9e0d7..4f257c1 100644
--- a/src/pages/inspectionUpload/index.vue
+++ b/src/pages/inspectionUpload/index.vue
@@ -1,610 +1,430 @@
<template>
- <view class="inspection-upload-page">
- <!-- 椤甸潰澶撮儴 -->
- <PageHeader title="宸℃涓婁紶" @back="goBack"/>
-
- <!-- 鏁版嵁鍒楄〃 -->
- <view class="table-section">
- <!-- 鐢熶骇宸℃鍒楄〃 -->
- <view class="task-list">
- <view
- v-for="(item, index) in taskTableData"
- :key="index"
- class="task-item"
- @click="handleAdd(item)"
- >
- <view class="task-header">
- <view class="task-info">
- <text class="task-name">{{ item.taskName }}</text>
- <text class="task-location">{{ item.inspectionLocation }}</text>
- </view>
- <view class="task-actions">
- <u-button
- type="primary"
- size="small"
- @click.stop="handleAdd(item)"
- :customStyle="{
- borderRadius: '15px',
- height: '30px',
- fontSize: '12px'
- }"
- >
- 涓婁紶
- </u-button>
- <u-button
- type="info"
- size="small"
- @click.stop="startScanForTask(item)"
- :customStyle="{
- borderRadius: '15px',
- height: '30px',
- fontSize: '12px'
- }"
- >
- 鎵爜
- </u-button>
- </view>
- </view>
- <view class="task-details">
- <view class="detail-item">
- <text class="detail-label">澶囨敞</text>
- <text class="detail-value">{{ item.remarks || '鏃�' }}</text>
- </view>
- <view class="detail-item">
- <text class="detail-label">鎵ц浜�</text>
- <text class="detail-value">{{ item.inspector }}</text>
- </view>
- </view>
- </view>
- </view>
-
- <!-- 绌虹姸鎬� -->
- <view v-if="taskTableData.length === 0" class="no-data">
- <text>鏆傛棤鏁版嵁</text>
- </view>
- </view>
-
- <!-- 鎵爜鍖哄煙 - 鍏ㄥ眬寮圭獥 -->
- <view v-if="isScanning" class="qr-scan-overlay">
- <view class="qr-scan-container">
- <view class="scan-header">
- <text class="scan-title">鎵弿浜岀淮鐮�</text>
- <u-button
- type="error"
- size="small"
- @click.stop="stopScan"
- :customStyle="{
- borderRadius: '15px',
- height: '30px',
- fontSize: '12px'
- }"
- >
- 鍏抽棴
- </u-button>
- </view>
- <camera
- class="qr-camera"
- device-position="back"
- flash="off"
- @scancode="handleScanCode"
- @error="handleCameraError"
- ></camera>
- <view class="scan-frame-wrapper">
- <view class="scan-frame"></view>
- <view class="scan-tip">璇峰皢浜岀淮鐮佹斁鍏ユ鍐�</view>
- </view>
- <u-alert
- v-if="cameraError"
- :title="cameraError"
- type="error"
- :showIcon="true"
- :closable="true"
- @close="cameraError = ''"
- :customStyle="{
- margin: '10px 0'
- }"
- ></u-alert>
- </view>
- </view>
-
- <!-- 寮圭獥缁勪欢 -->
- <form-dia ref="formDia" @closeDia="handleQuery"></form-dia>
- </view>
+ <view class="app-container">
+ <!-- 椤甸潰澶撮儴 -->
+ <PageHeader title="宸℃涓婁紶" @back="goBack"/>
+ <view class="card-container">
+ <!-- 鏍囩椤� -->
+ <u-tabs
+ :list="tabs"
+ :current="activeTabIndex"
+ @change="handleTabChange"
+ :scrollable="false"
+ lineWidth="30"
+ lineColor="#2979ff"
+ :activeStyle="{
+ color: '#2979ff',
+ fontWeight: 'bold'
+ }"
+ />
+ <view>
+ <!-- 鎵爜妯″潡 -->
+ <view v-if="activeTab === 'qrCode'" class="scan-section">
+ <view class="scan-controls">
+ <u-button
+ type="primary"
+ :loading="scanLoading"
+ @click="toggleScan"
+ >
+ {{ scanButtonText }}
+ </u-button>
+ </view>
+
+ <!-- 鐘舵�佹彁绀� -->
+ <view class="status-info">
+ <u-alert
+ v-if="cameraError"
+ :title="cameraError"
+ type="error"
+ :show-icon="true"
+ :closable="true"
+ @close="cameraError = null"
+ />
+ <view v-if="isScanning" class="scanning-text">
+ <u-loading-icon mode="spinner" :color="statusColor" />
+ <text>姝e湪鎵弿浜岀淮鐮�...</text>
+ </view>
+ </view>
+ </view>
+ <view>
+ <!-- 鍔犺浇鐘舵�� -->
+ <view v-if="tableLoading" class="loading-container">
+ <u-loading-icon text="鍔犺浇涓�..." />
+ </view>
+
+ <!-- 鐢熶骇宸℃鍒楄〃 -->
+ <view v-else-if="activeTab !== 'qrCode' && tableData.length > 0" class="list-container">
+ <view v-for="(item, index) in tableData" :key="index" class="list-item">
+ <view class="item-content">
+ <view class="item-row">
+ <text class="item-label">宸℃浠诲姟鍚嶇О锛�</text>
+ <text class="item-value">{{ item.taskName || '-' }}</text>
+ </view>
+ <view class="item-row">
+ <text class="item-label">鍦扮偣锛�</text>
+ <text class="item-value">{{ item.inspectionLocation || '-' }}</text>
+ </view>
+ <view class="item-row">
+ <text class="item-label">澶囨敞锛�</text>
+ <text class="item-value">{{ item.remarks || '-' }}</text>
+ </view>
+ <view class="item-row">
+ <text class="item-label">鎵ц宸℃浜猴細</text>
+ <text class="item-value">{{ item.inspector || '-' }}</text>
+ </view>
+ </view>
+ <view class="item-actions">
+ <u-button type="primary" size="small" @click="handleAdd(item)">涓婁紶</u-button>
+ </view>
+ </view>
+ </view>
+
+ <!-- 鐜板満宸℃鍒楄〃 -->
+ <view v-else-if="activeTab === 'qrCode' && tableData.length > 0" class="list-container">
+ <view v-for="(item, index) in tableData" :key="index" class="list-item">
+ <view class="item-content">
+ <view class="item-row">
+ <text class="item-label">璁惧鍚嶇О锛�</text>
+ <text class="item-value">{{ item.deviceName || '-' }}</text>
+ </view>
+ <view class="item-row">
+ <text class="item-label">鎵�鍦ㄤ綅缃弿杩帮細</text>
+ <text class="item-value">{{ item.location || '-' }}</text>
+ </view>
+ <view class="item-row">
+ <text class="item-label">宸℃浜猴細</text>
+ <text class="item-value">{{ item.scanner || '-' }}</text>
+ </view>
+ <view class="item-row">
+ <text class="item-label">宸℃鏃堕棿锛�</text>
+ <text class="item-value">{{ item.scanTime || '-' }}</text>
+ </view>
+ </view>
+ <view class="item-actions">
+ <u-button type="primary" size="small" @click="viewFile(item)">鏌ョ湅闄勪欢</u-button>
+ </view>
+ </view>
+ </view>
+
+ <!-- 绌烘暟鎹� -->
+ <view v-else-if="!tableLoading && tableData.length === 0" class="no-data">
+ <text>鏆傛棤鏁版嵁</text>
+ </view>
+ </view>
+ </view>
+ </view>
+ <form-dia ref="formDia" @closeDia="handleQuery"></form-dia>
+ <qr-code-form-dia ref="qrCodeFormDia" @closeDia="handleQuery"></qr-code-form-dia>
+ <view-qr-code-files ref="viewQrCodeFiles"></view-qr-code-files>
+ </view>
</template>
<script setup>
-import { onMounted, onUnmounted, ref, nextTick } from 'vue'
-import { onShow } from '@dcloudio/uni-app'
-import PageHeader from '@/components/PageHeader.vue'
-import FormDia from './components/formDia.vue'
-import { getLedgerById } from '@/api/equipmentManagement/ledger.js'
-import {inspectionTaskList} from "@/api/inspectionManagement";
+import { onMounted, ref, reactive, computed, nextTick } from "vue";
+import FormDia from "@/pages/inspectionUpload/components/formDia.vue";
+import { useToast } from '@/utils/uviewplus';
+import QrCodeFormDia from "@/pages/inspectionUpload/components/qrCodeFormDia.vue";
+import { qrCodeList, qrCodeScanRecordList } from "@/api/inspectionUpload/index.js";
+import { inspectionTaskList } from "@/api/inspectionManagement/index.js";
+import ViewQrCodeFiles from "@/components/imageUpload/viewQrCodeFiles.vue";
-// 缁勪欢寮曠敤
-const formDia = ref()
+const { showToast } = useToast();
-// 鍔犺浇鎻愮ず鏂规硶
-const showLoadingToast = (message) => {
- uni.showLoading({
- title: message,
- mask: true
- })
-}
-const closeToast = () => {
- uni.hideLoading()
-}
+const formDia = ref();
+const qrCodeFormDia = ref();
+const viewQrCodeFiles = ref();
+
+// 褰撳墠鏍囩
+const activeTab = ref("task");
+const activeTabIndex = ref(0);
+const tabName = ref("task");
+
+// 鏍囩椤垫暟鎹�
+const tabs = reactive([
+ { name: "鐢熶骇宸℃", value: "task" },
+ { name: "鐜板満宸℃", value: "qrCode" },
+]);
+
// 琛ㄦ牸鏁版嵁
-const taskTableData = ref([]) // 鐢熶骇宸℃鏁版嵁
-
-// 褰撳墠鎵弿鐨勪换鍔�
-const currentScanningTask = ref(null)
-
-// 璇锋眰鍙栨秷鏍囧織锛岀敤浜庡彇娑堟鍦ㄨ繘琛岀殑璇锋眰
-let isRequestCancelled = false
+const tableData = ref([]);
+const tableLoading = ref(false);
// 鎵爜鐩稿叧鐘舵��
-const isScanning = ref(false)
-const cameraError = ref('')
+const isScanning = ref(false);
+const scanLoading = ref(false);
+const cameraError = ref(null);
-// 鐢熷懡鍛ㄦ湡
-onMounted(() => {
- // 寤惰繜鍒濆鍖栵紝纭繚DOM宸叉覆鏌�
- nextTick(() => {
- getList()
- })
-})
+const statusColor = computed(() => {
+ return isScanning.value ? '#67C23A' : '#F56C6C';
+});
-onShow(() => {
- // 椤甸潰鏄剧ず鏃跺埛鏂版暟鎹�
- getList()
-})
+// 鐢熷懡鍛ㄦ湡绠$悊
+onMounted(async () => {
+ handleTabChange({ index: 0 });
+});
-// 缁勪欢閿�姣佹椂鐨勬竻鐞�
-onUnmounted(() => {
- // 璁剧疆鍙栨秷鏍囧織锛岄樆姝㈠悗缁殑寮傛鎿嶄綔
- isRequestCancelled = true
-
- // 鍋滄鎵爜
- if (isScanning.value) {
- isScanning.value = false
- }
-})
+// 鏍囩椤靛垏鎹�
+const handleTabChange = (e) => {
+ const index = typeof e === 'object' && e.index !== undefined ? e.index : e;
+ const selectedTab = tabs[index];
+ if (selectedTab) {
+ activeTab.value = selectedTab.value;
+ activeTabIndex.value = index;
+ tabName.value = selectedTab.value;
+ tableData.value = [];
+ getList();
+ }
+};
-// 杩斿洖涓婁竴椤�
-const goBack = () => {
- uni.navigateBack()
-}
-
-// 鏌ヨ鏁版嵁
+// 鐐瑰嚮鏌ヨ
const handleQuery = () => {
- getList()
-}
+ getList();
+};
// 鑾峰彇鍒楄〃鏁版嵁
const getList = () => {
- // 鏄剧ず鍔犺浇鎻愮ず
- showLoadingToast('鍔犺浇涓�...')
-
- // 璁剧疆鍙栨秷鏍囧織
- isRequestCancelled = false
-
- inspectionTaskList({}).then(res => {
- // 妫�鏌ョ粍浠舵槸鍚﹁繕瀛樺湪涓旇姹傛湭琚彇娑�
- if (!isRequestCancelled) {
- console.log('鐢熶骇宸℃API杩斿洖鏁版嵁:', res);
-
- // 澶勭悊涓嶅悓鐨勬暟鎹粨鏋�
- let records = [];
- if (res && res.data) {
- // 灏濊瘯澶氱鍙兘鐨勬暟鎹粨鏋�
- if (Array.isArray(res.data.records)) {
- records = res.data.records;
- } else if (Array.isArray(res.data.rows)) {
- records = res.data.rows;
- } else if (Array.isArray(res.data)) {
- records = res.data;
- } else if (Array.isArray(res.data.list)) {
- records = res.data.list;
- }
- }
-
- if (records.length > 0) {
- taskTableData.value = records;
- console.log('鐢熶骇宸℃鏁版嵁璁剧疆鎴愬姛锛岃褰曟暟:', records.length);
- } else {
- console.warn('鐢熶骇宸℃鏁版嵁涓虹┖鎴栨牸寮忎笉姝g‘:', res);
- taskTableData.value = [];
- uni.showToast({
- title: '鏆傛棤宸℃浠诲姟鏁版嵁',
- icon: 'none'
- });
- }
- }
- // 鍏抽棴鍔犺浇鎻愮ず
- closeToast()
- }).catch(err => {
- // 妫�鏌ョ粍浠舵槸鍚﹁繕瀛樺湪涓旇姹傛湭琚彇娑�
- if (!isRequestCancelled) {
- console.error('鑾峰彇鐢熶骇宸℃鏁版嵁澶辫触:', err);
- taskTableData.value = [];
- // 娣诲姞閿欒鎻愮ず
- uni.showToast({
- title: '鑾峰彇鏁版嵁澶辫触',
- icon: 'error'
- })
- }
- // 鍏抽棴鍔犺浇鎻愮ず
- closeToast()
- })
-}
-
+ tableLoading.value = true;
+ if (tabName.value === "task") {
+ inspectionTaskList({ size: -1, current: -1 }).then(res => {
+ tableLoading.value = false;
+ tableData.value = res.data.records || [];
+ }).catch(err => {
+ tableLoading.value = false;
+ showToast('鑾峰彇鏁版嵁澶辫触', 'error');
+ });
+ } else {
+ qrCodeScanRecordList({ size: -1, current: -1 }).then(res => {
+ tableLoading.value = false;
+ // 澶勭悊鏁版嵁锛屾牸寮忓寲瀛楁
+ tableData.value = (res.data.records || []).map(item => ({
+ ...item,
+ deviceName: item.qrCode?.deviceName || '-',
+ location: item.qrCode?.location || '-'
+ }));
+ }).catch(err => {
+ tableLoading.value = false;
+ showToast('鑾峰彇鏁版嵁澶辫触', 'error');
+ });
+ }
+};
// 涓婁紶
const handleAdd = (row) => {
- nextTick(() => {
- // 妫�鏌ョ粍浠舵槸鍚﹁繕瀛樺湪
- if (formDia.value && formDia.value.openDialog) {
- formDia.value.openDialog(row)
- } else {
- console.error('涓婁紶缁勪欢寮曠敤涓嶅瓨鍦�')
- uni.showToast({
- title: '缁勪欢鏈噯澶囧ソ',
- icon: 'error'
- })
- }
- })
-}
+ console.log('handleAdd 琚皟鐢�', row);
+ console.log('formDia.value:', formDia.value);
+
+ if (!formDia.value) {
+ showToast('缁勪欢鏈垵濮嬪寲', 'error');
+ return;
+ }
+
+ nextTick(() => {
+ if (formDia.value && formDia.value.openDialog) {
+ formDia.value.openDialog(row);
+ } else {
+ console.error('formDia.value.openDialog 涓嶅瓨鍦�');
+ showToast('鎵撳紑寮圭獥澶辫触', 'error');
+ }
+ });
+};
-// 涓烘寚瀹氫换鍔″紑濮嬫壂鐮�
-const startScanForTask = async (task) => {
- try {
- // 璁板綍褰撳墠鎵弿鐨勪换鍔�
- currentScanningTask.value = task
- console.log('涓轰换鍔″紑濮嬫壂鐮�:', task.taskName)
-
- // 鏄剧ず鎵弿鐣岄潰
- isScanning.value = true
-
- // 浣跨敤uniapp鐨勬壂鐮丄PI
- uni.scanCode({
- success: (res) => {
- console.log('鎵爜鎴愬姛:', res)
- handleScanSuccess(res)
- },
- fail: (err) => {
- console.error('鎵爜澶辫触:', err)
- uni.showToast({
- title: '鎵爜澶辫触',
- icon: 'error'
- })
- // 鍏抽棴鎵弿鐣岄潰
- isScanning.value = false
- },
- complete: () => {
- // 鎵爜瀹屾垚鍚庡叧闂壂鎻忕晫闈�
- setTimeout(() => {
- isScanning.value = false
- }, 1000)
- }
- })
- } catch (e) {
- console.error('鍚姩鎵爜澶辫触:', e)
- uni.showToast({
- title: '鍚姩鎵爜澶辫触',
- icon: 'error'
- })
- isScanning.value = false
- }
-}
+// 鏌ョ湅闄勪欢
+const viewFile = (row) => {
+ nextTick(() => {
+ viewQrCodeFiles.value?.openDialog(row);
+ });
+};
+
+// 鎵爜鎸夐挳鏂囨湰
+const scanButtonText = computed(() => {
+ if (scanLoading.value) return '姝e湪鍒濆鍖�...';
+ return isScanning.value ? '鍋滄鎵爜' : '寮�濮嬫壂鐮�';
+});
+
+// 鍒囨崲鎵爜鐘舵��
+const toggleScan = async () => {
+ if (isScanning.value) {
+ stopScan();
+ } else {
+ startScan();
+ }
+};
+
+// 寮�濮嬫壂鐮�
+const startScan = () => {
+ if (isScanning.value) {
+ showToast('姝e湪鎵弿涓紝璇风◢鍊�...', 'warning');
+ return;
+ }
+
+ scanLoading.value = true;
+
+ // 璋冪敤uni-app鐨勬壂鐮丄PI
+ uni.scanCode({
+ scanType: ['qrCode', 'barCode'],
+ success: (res) => {
+ scanLoading.value = false;
+ handleScanSuccess(res.result);
+ },
+ fail: (err) => {
+ scanLoading.value = false;
+ console.error('鎵爜澶辫触:', err);
+ cameraError.value = '鎵爜澶辫触锛岃閲嶈瘯';
+ setTimeout(() => {
+ cameraError.value = null;
+ }, 3000);
+ }
+ });
+};
+
+// 鎵弿鎴愬姛澶勭悊
+const handleScanSuccess = async (result) => {
+ try {
+ if (!result) {
+ showToast('鎵爜缁撴灉涓虹┖', 'warning');
+ return;
+ }
+
+ showToast('璇嗗埆鎴愬姛', 'success');
+
+ // 瑙f瀽浜岀淮鐮佹暟鎹�
+ let qrData;
+ try {
+ qrData = JSON.parse(result);
+ } catch (e) {
+ // 濡傛灉涓嶆槸JSON鏍煎紡锛岀洿鎺ヤ娇鐢ㄥ師濮嬫暟鎹�
+ qrData = { data: result };
+ }
+
+ callBackendAPI(qrData);
+ } catch (error) {
+ showToast(error.message || '澶勭悊鎵爜缁撴灉澶辫触', 'error');
+ }
+};
+
+// 璋冪敤鍚庣API
+const callBackendAPI = (result) => {
+ nextTick(() => {
+ qrCodeFormDia.value?.openDialog(result);
+ });
+};
// 鍋滄鎵爜
const stopScan = () => {
- isScanning.value = false
- currentScanningTask.value = null
-}
-
-// 鎵爜鎴愬姛澶勭悊
-const handleScanSuccess = async (result) => {
- try {
- console.log('澶勭悊鎵爜缁撴灉:', result)
- console.log('褰撳墠鍏宠仈浠诲姟:', currentScanningTask.value?.taskName)
-
- uni.showToast({
- title: '璇嗗埆鎴愬姛',
- icon: 'success'
- })
-
- // 瑙f瀽浜岀淮鐮佹暟鎹�
- let qrData
- let deviceId = ''
-
- try {
- qrData = JSON.parse(result.result)
- console.log('瑙f瀽鐨勪簩缁寸爜鏁版嵁:', qrData)
- deviceId = qrData.deviceId || qrData.qrCodeId
- } catch (e) {
- // 濡傛灉涓嶆槸JSON鏍煎紡锛屽皾璇曚粠URL涓彁鍙杁eviceId
- const url = result.result
-
- if (url.includes('deviceId=')) {
- // 浠嶶RL涓彁鍙杁eviceId
- const match = url.match(/deviceId=(\d+)/)
- if (match && match[1]) {
- deviceId = match[1]
- }
- }
-
- qrData = {
- deviceName: deviceId ? `璁惧${deviceId}` : result.result,
- location: '',
- qrCodeId: deviceId // 浣跨敤鎻愬彇鐨刣eviceId鎴栧師濮嬬粨鏋�
- }
- }
-
- // 濡傛灉鏈夎澶嘔D锛屽皾璇曚粠API鑾峰彇鐪熷疄鐨勮澶囧悕绉�
- if (deviceId) {
- try {
- console.log('姝e湪鏌ヨ璁惧淇℃伅锛岃澶嘔D:', deviceId)
- const response = await getLedgerById(deviceId)
- console.log('璁惧淇℃伅鏌ヨ缁撴灉:', response)
-
- if (response.code === 200 && response.data) {
- qrData.deviceName = response.data.deviceName || `璁惧${deviceId}`
- qrData.location = response.data.storageLocation || ''
- console.log('鑾峰彇鍒拌澶囧悕绉�:', qrData.deviceName)
- } else {
- console.warn('璁惧淇℃伅鏌ヨ澶辫触锛屼娇鐢ㄩ粯璁ゅ悕绉�')
- qrData.deviceName = qrData.deviceName || `璁惧${deviceId}`
- }
- } catch (apiError) {
- console.error('鏌ヨ璁惧淇℃伅澶辫触:', apiError)
- // API璋冪敤澶辫触鏃朵娇鐢ㄩ粯璁ゅ悕绉�
- qrData.deviceName = qrData.deviceName || `璁惧${deviceId}`
- }
- }
-
- // 纭繚鏁版嵁瀹屾暣鎬�
- if (!qrData.deviceName) {
- qrData.deviceName = result.result
- }
- if (!qrData.qrCodeId) {
- qrData.qrCodeId = deviceId || result.result
- }
-
- // 灏嗘壂鐮佹暟鎹笌浠诲姟鍏宠仈
- if (currentScanningTask.value) {
- // 鍏宠仈浠诲姟淇℃伅
- const taskData = {
- ...currentScanningTask.value,
- qrCodeData: qrData
- }
-
- // 鎵撳紑涓婁紶寮圭獥锛屼紶閫掑叧鑱斿悗鐨勪换鍔℃暟鎹�
- nextTick(() => {
- if (formDia.value && formDia.value.openDialog) {
- formDia.value.openDialog(taskData)
- } else {
- console.error('涓婁紶缁勪欢寮曠敤涓嶅瓨鍦�')
- uni.showToast({
- title: '缁勪欢鏈噯澶囧ソ',
- icon: 'error'
- })
- }
- })
- }
- } catch (error) {
- console.error('澶勭悊鎵爜缁撴灉澶辫触:', error)
- uni.showToast({
- title: error.message || '鏁版嵁瑙f瀽澶辫触',
- icon: 'error'
- })
- } finally {
- // 鍏抽棴鎵弿鐣岄潰
- isScanning.value = false
- }
-}
-
-// 鎽勫儚澶撮敊璇鐞�
-const handleCameraError = (error) => {
- console.error('鎽勫儚澶撮敊璇�:', error)
- cameraError.value = '鎽勫儚澶磋闂け璐ワ紝璇锋鏌ユ潈闄愯缃�'
-}
+ isScanning.value = false;
+ scanLoading.value = false;
+};
+// 杩斿洖涓婁竴椤�
+const goBack = () => {
+ uni.navigateBack();
+};
</script>
-<style scoped lang="scss">
-// 瀵煎叆閿�鍞ā鍧楀叕鍏辨牱寮�
-@import '@/styles/sales-common.scss';
-
-// 椤甸潰瀹瑰櫒鏍峰紡
-.inspection-upload-page {
- min-height: 100vh;
- background: #f8f9fa;
- position: relative;
+<style scoped>
+.app-container {
+ padding: 20rpx;
+ background-color: #f5f5f5;
+ min-height: 100vh;
}
-// 鍒楄〃瀹瑰櫒鏍峰紡
-.table-section {
- padding: 20px;
+.card-container {
+ background-color: #fff;
+ border-radius: 16rpx;
+ padding: 20rpx;
}
-// 浠诲姟鍒楄〃鏍峰紡 - 浣跨敤閿�鍞彴璐︾殑鏍峰紡瑙勮寖
-.task-list {
- .task-item {
- background: #ffffff;
- border-radius: 12px;
- margin-bottom: 16px;
- overflow: hidden;
- box-shadow: 0 2px 8px rgba(0, 0, 0, 0.05);
- padding: 0 16px;
-
- &:active {
- transform: scale(0.98);
- box-shadow: 0 1px 4px rgba(0, 0, 0, 0.1);
- }
- }
+.scan-section {
+ margin: 20rpx 0;
}
-// 椤圭洰澶撮儴鏍峰紡
-.task-header {
- padding: 16px 0;
- display: flex;
- align-items: center;
- justify-content: space-between;
- margin-bottom: 0;
+.scan-controls {
+ display: flex;
+ justify-content: center;
+ margin-bottom: 20rpx;
}
-.task-info {
- flex: 1;
+.status-info {
+ margin-top: 32rpx;
+ text-align: center;
}
-.task-name {
- font-size: 14px;
- color: #333;
- font-weight: 500;
- margin-bottom: 0;
- line-height: 1.4;
+.scanning-text {
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ color: #2979ff;
+ margin-top: 16rpx;
+ font-size: 28rpx;
}
-.task-location {
- font-size: 12px;
- color: #666;
- margin-top: 4px;
+.scanning-text text {
+ margin-left: 10rpx;
}
-// 浠诲姟鎿嶄綔鎸夐挳鏍峰紡
-.task-actions {
- display: flex;
- align-items: center;
- gap: 8px;
- margin-left: 0;
+.loading-container {
+ display: flex;
+ justify-content: center;
+ align-items: center;
+ padding: 40rpx 0;
}
-// 浠诲姟璇︽儏鏍峰紡 - 浣跨敤閿�鍞彴璐︾殑璇︽儏琛屾牱寮�
-.task-details {
- padding: 16px 0;
-
- .detail-item {
- display: flex;
- align-items: flex-end;
- justify-content: space-between;
- margin-bottom: 8px;
-
- &:last-child {
- margin-bottom: 0;
- }
-
- .detail-label {
- font-size: 12px;
- color: #777777;
- min-width: 60px;
- flex-shrink: 0;
- }
-
- .detail-value {
- font-size: 12px;
- color: #000000;
- text-align: right;
- flex: 1;
- margin-left: 16px;
- line-height: 1.4;
- }
- }
+.list-container {
+ margin-top: 20rpx;
}
-// 鏃犳暟鎹彁绀烘牱寮� - 浣跨敤閿�鍞彴璐︾殑鏍峰紡
+.list-item {
+ background-color: #fff;
+ border-radius: 16rpx;
+ padding: 24rpx;
+ margin-bottom: 20rpx;
+ border: 1px solid #f0f0f0;
+}
+
+.item-content {
+ margin-bottom: 20rpx;
+}
+
+.item-row {
+ display: flex;
+ margin-bottom: 16rpx;
+ font-size: 28rpx;
+ line-height: 40rpx;
+}
+
+.item-row:last-child {
+ margin-bottom: 0;
+}
+
+.item-label {
+ color: #666;
+ width: 200rpx;
+ flex-shrink: 0;
+}
+
+.item-value {
+ color: #333;
+ flex: 1;
+ word-break: break-all;
+}
+
+.item-actions {
+ display: flex;
+ justify-content: flex-end;
+ padding-top: 20rpx;
+ border-top: 1px solid #f0f0f0;
+}
+
.no-data {
- padding: 40px 0;
- text-align: center;
- color: #999;
- background: none;
- margin: 0;
+ text-align: center;
+ padding: 80rpx 0;
+ color: #999;
+ font-size: 28rpx;
}
-.no-data text {
- font-size: 14px;
- color: #999;
+/* 绉诲姩绔紭鍖� */
+@media (max-width: 768px) {
+ .app-container {
+ padding: 10rpx;
+ }
}
-
-/* 鎵爜寮圭獥鏍峰紡 */
-.qr-scan-overlay {
- position: fixed;
- top: 0;
- left: 0;
- right: 0;
- bottom: 0;
- background-color: rgba(0, 0, 0, 0.8);
- z-index: 9999;
- display: flex;
- flex-direction: column;
- justify-content: center;
- align-items: center;
- padding: 20px;
-}
-
-.qr-scan-container {
- width: 100%;
- max-width: 400px;
- background-color: #000;
- border-radius: 12px;
- overflow: hidden;
-}
-
-.scan-header {
- display: flex;
- justify-content: space-between;
- align-items: center;
- padding: 15px;
- background-color: rgba(0, 0, 0, 0.7);
-}
-
-.scan-title {
- font-size: 18px;
- font-weight: 600;
- color: #fff;
-}
-
-.qr-camera {
- width: 100%;
- height: 400px;
-}
-
-.scan-frame-wrapper {
- position: relative;
- width: 100%;
- height: 300px;
-}
-
-.scan-frame {
- position: absolute;
- top: 50%;
- left: 50%;
- transform: translate(-50%, -50%);
- width: 80%;
- height: 80%;
- border: 3px solid #1890ff;
- border-radius: 8px;
- box-shadow: 0 0 20px rgba(24, 144, 255, 0.3);
- animation: pulse 2s infinite;
-}
-
-.scan-tip {
- position: absolute;
- bottom: 10px;
- left: 50%;
- transform: translateX(-50%);
- color: #fff;
- font-size: 14px;
- text-align: center;
- background-color: rgba(0, 0, 0, 0.6);
- padding: 5px 15px;
- border-radius: 20px;
-}
-
-@keyframes pulse {
- 0% { opacity: 0.8; }
- 50% { opacity: 0.4; }
- 100% { opacity: 0.8; }
-}
-
-</style>
\ No newline at end of file
+</style>
--
Gitblit v1.9.3