From 97af26e2ad64d7974367df80a900c1f680bd19c5 Mon Sep 17 00:00:00 2001 From: 啊鑫 <t2856754968@163.com> Date: 星期三, 23 七月 2025 10:38:08 +0800 Subject: [PATCH] 首检,巡检,入库检 --- pages/QC/SJ/List.vue | 1059 ++++++++++++++++++++++++++++++++-------------------------- 1 files changed, 582 insertions(+), 477 deletions(-) diff --git a/pages/QC/SJ/List.vue b/pages/QC/SJ/List.vue index fbfe619..0360664 100644 --- a/pages/QC/SJ/List.vue +++ b/pages/QC/SJ/List.vue @@ -1,523 +1,628 @@ <template> - <view class="inspection-app"> - <view class="filter-section"> - <view class="filter-controls"> - - <view class="status-tabs"> - <button :class="['tab-button', activeTab === 0 ? 'active' : '']" - @click="switchTab(0)">鏈楠�</button> - <button :class="['tab-button', activeTab === 1 ? 'active' : '']" - @click="switchTab(1)">{{checkedCount}}</button> - </view> + <view class="inspection-app"> + <!-- 鍒锋柊椤甸潰鍚庣殑椤堕儴鎻愮ず妗� --> + <view :class="{ 'tips-ani': tipShow }" class="tips">鍒锋柊鎴愬姛</view> - </view> - </view> + <!-- 椤堕儴绛涢�夊尯 --> + <view class="filter-section"> + <view class="filter-controls" style="margin-bottom: 5px;"> + <view class="status-tabs"> + <button :class="['tab-button', current === 0 ? 'active' : '']" + @click="onClickItem({currentIndex: 0})">鏈畬鎴�({{ uncheckedCount }}) + </button> + <button :class="['tab-button', current === 1 ? 'active' : '']" + @click="onClickItem({currentIndex: 1})">{{ checkedCount }} + </button> + </view> + </view> - <!-- 妫�楠屽崟鍒楄〃 --> - <view class="inspection-list"> - <!-- 妫�楠屽崟鍗$墖1 --> - <view class="inspection-card" v-for="(item, index) in inspectionList" :key="index"> - <view class="card-header"> - <text class="badge urgent" v-if="item.urgentFlag == 1">鎬ユ枡</text> - <text class="badge urgent" v-if="item.jycs == 1">瓒呮椂</text> - <text class="badge normal" v-if="item.ftype == 1">濮斿</text> - <text class="badge normal" v-if="item.first == 1">棣栨鏉ユ枡</text> - <text class="card-title">妫�楠屽崟鍙�: {{item.billNo}}</text> - <text class="status pass" v-if="item.result=='鍚堟牸' && item.activeTab==1">鍚堟牸</text> - <text class="status Unqualified" v-if="item.result=='涓嶅悎鏍�' && item.activeTab==1">涓嶅悎鏍�</text> - </view> + <view class="filter-controls" style="margin-bottom: 5px;"> + <view class="search-container"> + <input v-model="searchValue" class="search-input" placeholder="璇疯緭鍏ユ楠屽崟鍙锋垨鐗╂枡缂栫爜" + @confirm="handleSearch"/> + <button class="search-button" @click="handleSearch">鎼滅储</button> + </view> + </view> + </view> - <view class="card-body"> - <view class="info-row"> - <view class="info-item"> - <text class="info-label">鐗╂枡淇℃伅</text> - <text class="info-content">{{item.itemNo}} </text> - </view> - <view class="info-item"> - <text class="info-label">浜х嚎</text> - <text class="info-content">{{item.line}}</text> - </view> - <view class="info-item"> - <text class="info-label">宸ュ崟鏁伴噺</text> - <text class="info-content highlight">{{item.daa008}}</text> - </view> + <!-- 妫�楠屽崟鍒楄〃 --> + <view class="inspection-list"> + <!-- 妫�楠屽崟鍗$墖 --> + <view v-for="(item, index) in data" :key="item.id" class="inspection-card" + @click="navigateToDetail(item)"> + <view class="card-header"> + <!-- 娣诲姞鏍囪瘑badge --> + <view v-if="item.urgent == 1" class="badge urgent">鎬ユ枡</view> + <view v-if="item.isFirst == 1" class="badge normal">棣栨</view> + <view class="card-title">妫�楠屽崟鍙�: {{ item.billNo }}</view> + <view :class="{'status-pending': current === 0, 'status-assigned': current === 0 && item.statusUser, 'status-pass': current === 1 && item.result === '鍚堟牸', 'status-fail': current === 1 && item.result === '涓嶅悎鏍�'}" + class="status"> + {{ current === 0 ? (item.statusUser ? '宸插垎閰�' : '鏈彁浜�') : (item.result ? item.result : '宸叉彁浜�') }} + </view> + </view> - </view> - <view class="info-row"> - <view class="info-item"> - <text class="info-label">浜у搧淇℃伅</text> - <text class="info-content">{{item.daa003}} |{{item.daa004}} </text> - </view> - </view> - <view class="info-row"> - <view class="info-item" v-if="item.newFngDesc!=null"> - <text class="info-label">涓婃涓嶈壇鎻忚堪</text> - <text class="info-content">{{item.newFngDesc}}</text> - </view> - <view class="info-item" v-if="item.fngDesc!=null"> - <text class="info-label">涓嶈壇鎻忚堪</text> - <text class="info-content">{{item.fngDesc}}</text> - </view> - </view> + <view class="card-body"> + <view class="info-row"> + <view class="info-item"> + <view class="info-label">鐗╂枡淇℃伅</view> + <view class="info-content">{{ item.itemNo }} | {{ item.daa003 }}<br>{{ item.daa004 }}</view> + </view> + </view> - <view class="meta-info"> - <text class="meta-item"><uni-icons type="calendar" size="14" color="#95a5a6"></uni-icons> - {{item.statusDate}}</text> - <text class="meta-item"><uni-icons type="person" size="14" color="#95a5a6"></uni-icons> - {{item.statusUser}}</text> - </view> - </view> + <view class="info-row"> + <view class="info-item"> + <view class="info-label">浜х嚎</view> + <view class="info-content">{{ item.line }}</view> + </view> + <view class="info-item"> + <view class="info-label">宸ュ崟鏁伴噺</view> + <view class="info-content highlight">{{ item.daa008 }}</view> + </view> + </view> - <view class="card-actions"> - <button v-if="item.activeTab==0" class="primary" @click="startInspection(item)">寮�濮嬫楠�</button> - <button v-if="item.activeTab==1" class="primary" @click="startInspection(item)">鏌ョ湅</button> - </view> - </view> - </view> - </view> + <view class="info-row"> + <view class="info-item"> + <view class="info-label">鍒涘缓浜�</view> + <view class="info-content">{{ item.fName }}</view> + </view> + <view v-if="item.statusUser" class="info-item"> + <view class="info-label">妫�楠屼汉</view> + <view class="info-content">{{ item.statusUser }}</view> + </view> + </view> + + <!-- 鍦ㄦ湭瀹屾垚鐘舵�佷笅鏄剧ず鍒涘缓鏃堕棿锛屽凡瀹屾垚鐘舵�佷笅鏄剧ず妫�娴嬬粨鏋� --> + <view v-if="current === 0" class="meta-info"> + <view class="meta-item">{{ item.statusDate }}</view> + <view class="meta-item">鍒涘缓浜�: {{ item.fName }}</view> + </view> + + <view v-if="current === 1" class="meta-info"> + <view class="meta-item">{{ item.statusDate }}</view> + <view v-if="item.result" class="meta-item">妫�楠岀粨鏋�: {{ item.result }}</view> + </view> + </view> + + <view class="card-actions"> + <button class="primary">{{ current === 0 ? '缁х画妫�楠�' : '鏌ョ湅璇︽儏' }}</button> + </view> + </view> + </view> + + <!-- 娣诲姞鎸夐挳 --> + <view v-if="current === 0" class="plus-button" @click="handleFabClick"> + <view class="plus-icon">+</view> + </view> + </view> </template> <script> - export default { - data() { - return { - projectIndex: 0, - optionsIndex: 0, - projects: ['褰撳墠', '鍏ㄩ儴'], - activeTab: 0, // 0-鏈楠�, 1-宸叉楠� - uncheckedCount: 0, - checkedCount: '宸叉楠�', - inspectionList: [], - pageIndex: 1, - limit: 20, - IQCJL: 0, - options: ['椤圭洰', '鐗╂枡缂栧彿', '鐗╂枡鍚嶇О', '渚涘簲鍟�', '閲囪喘鍛�'], - searchValue: '' +export default { + components: {}, + data() { + return { + items: ['鏈畬鎴�', '宸插畬鎴�'], + current: 0, + data: [], + pageIndex: 1, + limit: 20, + totalPage: 0, + totalCount: 0, + noData: false, // 娌℃湁鏇村鏁版嵁浜� + isLoading: false, // 鏄惁姝e湪鍔犺浇 + tipShow: false, // 鏄惁鏄剧ず椤堕儴鎻愮ず妗� + searchValue: '', + uncheckedCount: 0, + checkedCount: '宸插畬鎴�' + }; + }, + onLoad() { + //椤甸潰鍔犺浇鏃惰皟鐢ㄧ殑浜嬩欢 + this.init(); + }, + methods: { + init() { + let result = "鏈畬鎴�"; + if (this.current === 1) { + result = "宸插畬鎴�"; + } - } - }, - onLoad() { - //椤甸潰鍔犺浇鏃惰皟鐢ㄧ殑浜嬩欢 - this.init(); - }, - methods: { - init() { + if (this.isLoading) return; // 濡傛灉姝e湪鍔犺浇鍒欎笉缁х画鎵ц - let result = "鏈畬鎴�"; - if (this.activeTab === 1) { - result = "宸插畬鎴�"; - } + this.isLoading = true; - if (this.isLoading) return; // 濡傛灉姝e湪鍔犺浇鍒欎笉缁х画鎵ц + //鑾峰彇褰撳墠鐧诲綍鐨勭敤鎴� + let userName = this.$loginInfo.account; - this.isLoading = true; + //椤甸潰鍔犺浇鏃惰皟鐢ㄧ殑浜嬩欢 + this.$post({ + url: "/SJ/GetPage", + data: { + pageIndex: this.pageIndex, + limit: this.limit, + statusUser: userName, + result: result, + searchValue: this.searchValue + } + }).then(res => { + if (this.pageIndex === 1) { + // 濡傛灉鏄涓�椤碉紝鐩存帴瑕嗙洊鍘熸暟鎹� + this.data = res.data.tbBillList; + } else { + if (res.data.tbBillList.length > 0) { + // 濡傛灉鏄笅涓�椤碉紝杩藉姞鏂版暟鎹� + this.data = [...this.data, ...res.data.tbBillList]; + } + } + this.totalCount = res.totalCount; + this.totalPage = Math.ceil(this.totalCount / this.limit); - //鑾峰彇褰撳墠鐧诲綍鐨勭敤鎴� - let userName = this.$loginInfo.account; + this.noData = this.pageIndex >= this.totalPage; + this.isLoading = false; // 缁撴潫鍔犺浇 + // 鏇存柊璁℃暟 + if (this.current === 1) { + this.checkedCount = '宸插畬鎴愶紙' + this.totalCount + '锛�'; + } else { + this.uncheckedCount = this.totalCount; + } + }).catch(() => { + this.isLoading = false; // 鍑虹幇閿欒鏃剁粨鏉熷姞杞� + }); + }, + handleFabClick() { + uni.navigateTo({ + url: 'Add?id' + }); + }, + onClickItem(index) { + if (this.current !== index.currentIndex) { + this.current = index.currentIndex; + this.data = []; + this.pageIndex = 1; + this.init(); + } + }, + handleSearch() { + this.pageIndex = 1; + this.data = []; + this.init(); + }, + navigateToDetail(item) { + uni.navigateTo({ + url: 'Add?id=' + item.id + '&billNo=' + item.billNo + }); + } + }, + /** + * 涓嬫媺鍒锋柊鍥炶皟鍑芥暟 + */ + onPullDownRefresh() { + this.pageIndex = 1; + //閲嶆柊鎵ц涓�閬嶆煡璇� + this.init(); + this.tipShow = true; + //鍏抽棴鍔ㄧ敾 + uni.stopPullDownRefresh(); - //椤甸潰鍔犺浇鏃惰皟鐢ㄧ殑浜嬩欢 - this.$post({ - url: "/SJ/GetPage", - data: { - pageIndex: this.pageIndex , - limit: 20, - statusUser: this.$loginInfo.account, - result: result - } - }).then(res => { - - if (this.pageIndex === 1) { - // 濡傛灉鏄涓�椤碉紝鐩存帴瑕嗙洊鍘熸暟鎹� - this.inspectionList = res.data.tbBillList; - //娣诲姞Tab淇℃伅锛屽垽鏂槸宸叉杩樻槸鏈鏁版嵁 - this.inspectionList.forEach((item, index) => { - this.$set(item, 'activeTab', this.activeTab); - this.$set(item, 'IQCJL', this.IQCJL); - }); - } else { - - if (res.data.tbBillList.length > 0) { - // 濡傛灉鏄笅涓�椤碉紝杩藉姞鏂版暟鎹� - this.inspectionList = [...this.inspectionList, ...res.data.tbBillList]; - //娣诲姞Tab淇℃伅锛屽垽鏂槸宸叉杩樻槸鏈鏁版嵁 - this.inspectionList.forEach((item, index) => { - this.$set(item, 'activeTab', this.activeTab); - this.$set(item, 'IQCJL', this.IQCJL); - }); - } - - } - console.log(this.inspectionList) - this.totalCount = res.data.totalCount; - this.totalPage = Math.ceil(this.totalCount / this.limit); - - this.noData = this.pageIndex >= this.totalPage; - this.isLoading = false; // 缁撴潫鍔犺浇 - if (this.activeTab === 1) { - // this.checkedCount = '宸叉楠岋紙' + res.totalCount + '锛�'; - this.checkedCount = '宸叉楠�'; - } else { - this.uncheckedCount = res.totalCount; - } - }).catch(() => { - this.isLoading = false; // 鍑虹幇閿欒鏃剁粨鏉熷姞杞� - }); - }, - switchTab(index) { - this.activeTab = index - // 杩欓噷鍙互娣诲姞鍒囨崲鏍囩椤电殑閫昏緫 - this.inspectionList = []; - this.init(); - }, - //璺宠浆妫�楠屽崟 - startInspection(item) { - - if (this.activeTab === 1) { - uni.navigateTo({ - url: 'Add?id=' + item.id + '¤t=B' - }) - } else { - uni.navigateTo({ - url: 'Add?id=' + item.id + '¤t=A' - }) - } - - }, - /** - * 涓嬫媺鍒锋柊鍥炶皟鍑芥暟 - */ - onPullDownRefresh() { - - this.pageIndex = 1; - //閲嶆柊鎵ц涓�閬嶆煡璇� - this.init(); - // this.tipShow = true; - //鍏抽棴鍔ㄧ敾 - uni.stopPullDownRefresh(); - - // setTimeout(function () { - // this.tipShow = false; - // }, 6000); - - }, - /** - * 涓婃媺鍔犺浇鍥炶皟鍑芥暟 - */ - onReachBottom() { - if (this.noData || this.isLoading) return; - this.pageIndex++; - this.init(); // 鍔犺浇鏇村鏁版嵁 - }, - onShow() { - //姣忔杩涘叆椤甸潰閮戒細鎵ц鐨勬柟娉� - // this.pageIndex = 1; - // this.data = []; - // //this.current = 0 - this.init(); - } - } - } + setTimeout(() => { + this.tipShow = false; + }, 3000); + }, + /** + * 涓婃媺鍔犺浇鍥炶皟鍑芥暟 + */ + onReachBottom() { + if (this.noData || this.isLoading) return; + this.pageIndex++; + this.init(); // 鍔犺浇鏇村鏁版嵁 + }, + onShow() { + //姣忔杩涘叆椤甸潰閮戒細鎵ц鐨勬柟娉� + this.pageIndex = 1; + this.data = []; + //this.current = 0 + this.init(); + } +}; </script> <style scoped> - /* 鍩虹鏍峰紡閲嶇疆 */ - .inspection-app { - padding: 10px; - background-color: #f5f7fa; - min-height: 100vh; - } +/* 鍩虹鏍峰紡閲嶇疆 */ +.inspection-app { + padding: 10px; + background-color: #f5f7fa; + min-height: 100vh; +} - /* 椤堕儴绛涢�夊尯 */ - .filter-section { - margin-bottom: 24px; - } +/* 椤堕儴绛涢�夊尯 */ +.filter-section { + /* margin-bottom: 24px; */ +} - .filter-section h1 { - font-size: 24px; - font-weight: 600; - color: #2c3e50; - margin-bottom: 16px; - } +.filter-section h1 { + font-size: 24px; + font-weight: 600; + color: #2c3e50; + margin-bottom: 16px; +} - /* 鏂板鎼滅储妗嗘牱寮� */ - .search-container { - display: flex; - flex: 1; - margin: 0 10px; - height: 36px; - /* 涓庡叾浠栨帶浠堕珮搴︿竴鑷� */ - } - - .search-input { - flex: 1; - padding: 8px 12px; - border: 1px solid #ddd; - border-radius: 4px 0 0 4px; - font-size: 14px; - background-color: white; - } - - .search-button { - padding: 0 12px; - border: 1px solid #3498db; - border-radius: 0 4px 4px 0; - background-color: #3498db; - color: white; - font-size: 14px; - margin: 0; - } - - /* .filter-controls { +/* 鎼滅储妗嗘牱寮� */ +.search-container { display: flex; - justify-content: space-between; - align-items: center; + flex: 1; + margin: 0 10px; + height: 36px; +} + +.search-input { + flex: 1; + padding: 8px 12px; + border: 1px solid #ddd; + border-radius: 4px 0 0 4px; + font-size: 14px; + background-color: white; +} + +.search-button { + padding: 0 12px; + border: 1px solid #3498db; + border-radius: 0 4px 4px 0; + background: linear-gradient(135deg, #3498db, #2980b9); + color: white; + font-size: 14px; + margin: 0; + cursor: pointer; + transition: all 0.3s ease; +} + +.search-button:hover { + background: linear-gradient(135deg, #2980b9, #1f618d); + transform: translateY(-1px); + box-shadow: 0 2px 4px rgba(52, 152, 219, 0.3); +} + +.search-button:active { + transform: translateY(0); +} + +.filter-controls { + display: flex; flex-wrap: wrap; - gap: 16px; + gap: 5px; } .dropdown-filter { + min-width: 70px; +} + +.badge { + font-size: 12px; + padding: 4px 8px; + border-radius: 12px; + margin-right: 8px; + font-weight: 500; + letter-spacing: 0.5px; +} + +.badge.urgent { + background: linear-gradient(135deg, #e74c3c, #c0392b); + color: white; + box-shadow: 0 2px 4px rgba(231, 76, 60, 0.3); +} + +.badge.normal { + background: linear-gradient(135deg, #f39c12, #e67e22); + color: white; + box-shadow: 0 2px 4px rgba(243, 156, 18, 0.3); +} + +.meta-info { + display: flex; + gap: 16px; + font-size: 12px; + color: #95a5a6; + margin-top: 12px; +} + +.meta-item { display: flex; align-items: center; + gap: 4px; +} + +.picker { + padding: 8px 12px; + border: 1px solid #ddd; + border-radius: 4px; + background-color: white; + font-size: 14px; + min-width: 120px; +} + +.filter-label { + font-size: 14px; + color: #7f8c8d; +} + +.picker { + padding: 8px 12px; + border: 1px solid #ddd; + border-radius: 4px; + background-color: white; + font-size: 14px; + min-width: 120px; +} + +.status-tabs { + display: flex; + border-radius: 4px; + overflow: hidden; + background-color: #ecf0f1; + flex: 1; + min-width: 200px; +} + +.tab-button { + padding: 0px 16px; + border: none; + background: none; + font-size: 14px; + transition: all 0.3s; + margin: 0; + height: 35px; +} + +.tab-button.active { + background: linear-gradient(135deg, #3498db, #2980b9); + color: white; + box-shadow: 0 2px 4px rgba(52, 152, 219, 0.3); +} + +/* 妫�楠屽崟鍒楄〃 */ +.inspection-list { + display: flex; + flex-direction: column; + gap: 20px; +} + +/* 妫�楠屽崟鍗$墖 */ +.inspection-card { + background-color: white; + border-radius: 8px; + box-shadow: 0 2px 10px rgba(0, 0, 0, 0.05); + overflow: hidden; + transition: all 0.3s ease; + border: 1px solid rgba(52, 152, 219, 0.1); +} + +.inspection-card:hover { + transform: translateY(-2px); + box-shadow: 0 4px 20px rgba(0, 0, 0, 0.1); + border-color: rgba(52, 152, 219, 0.3); +} + +.card-header { + padding: 16px; + border-bottom: 1px solid #eee; + display: flex; + align-items: center; + background: linear-gradient(135deg, #f8f9fa, #e9ecef); +} + +.card-title { + font-size: 16px; + font-weight: 600; + flex: 1; + margin: 0 8px; + color: #2c3e50; +} + +.badge { + font-size: 12px; + padding: 2px 6px; + border-radius: 10px; + margin-right: 8px; +} + +.badge.urgent { + background-color: #e74c3c; + color: white; +} + +.badge.normal { + background-color: #ffaa00; + color: white; +} + +.status { + font-size: 12px; + padding: 4px 8px; + border-radius: 6px; + font-weight: 500; + letter-spacing: 0.3px; + box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1); +} + +.status-pending { + background: linear-gradient(135deg, #f39c12, #e67e22); + color: white; +} + +.status-assigned { + background: linear-gradient(135deg, #3498db, #2980b9); + color: white; +} + +.status-pass { + background: linear-gradient(135deg, #27ae60, #229954); + color: white; +} + +.status-fail { + background: linear-gradient(135deg, #e74c3c, #c0392b); + color: white; +} + +.card-body { + padding: 16px; +} + +.info-row { + display: flex; + margin-bottom: 12px; + gap: 16px; +} + +.info-item { + flex: 1; +} + +.info-label { + display: block; + font-size: 12px; + color: #7f8c8d; + margin-bottom: 4px; +} + +.info-content { + font-size: 14px; + color: #2c3e50; + line-height: 1.5; +} + +.highlight { + font-weight: 600; + color: #e74c3c; + font-size: 16px; +} + +.meta-info { + display: flex; + gap: 16px; + font-size: 12px; + color: #95a5a6; + margin-top: 12px; +} + +.meta-item { + display: flex; + align-items: center; + gap: 4px; +} + +.card-actions { + padding: 12px 16px; + border-top: 1px solid #eee; + display: flex; gap: 8px; -} */ - .filter-controls { - display: flex; - flex-wrap: wrap; - gap: 10px; - } +} - .dropdown-filter { - min-width: 70px; - } +button { + padding: 8px 16px; + border: 1px solid #ddd; + border-radius: 4px; + background-color: white; + font-size: 14px; + transition: all 0.2s; + flex: 1; +} - .filter-label { - font-size: 14px; - color: #7f8c8d; - } +button.primary { + background: linear-gradient(135deg, #3498db, #2980b9); + color: white; + border-color: #2980b9; + box-shadow: 0 2px 4px rgba(52, 152, 219, 0.3); + transition: all 0.3s ease; +} - .picker { - padding: 8px 12px; - border: 1px solid #ddd; - border-radius: 4px; - background-color: white; - font-size: 14px; - min-width: 120px; - } +button.primary:hover { + background: linear-gradient(135deg, #2980b9, #1f618d); + transform: translateY(-1px); + box-shadow: 0 4px 8px rgba(52, 152, 219, 0.4); +} - .status-tabs { - display: flex; - border-radius: 4px; - overflow: hidden; - background-color: #ecf0f1; - } +button.primary:active { + transform: translateY(0); +} - .status-tabs { - flex: 1; - min-width: 200px; - } +/* 娣诲姞鎸夐挳鏍峰紡 */ +.plus-button { + position: fixed; + bottom: 20px; + right: 20px; + width: 60px; + height: 60px; + border-radius: 50%; + background: linear-gradient(135deg, #3498db, #2980b9); + color: #ffffff; + text-align: center; + line-height: 59px; + font-size: 24px; + cursor: pointer; + z-index: 1000; + box-shadow: 0 4px 12px rgba(52, 152, 219, 0.4); + transition: all 0.3s ease; +} - .tab-button { - padding: 0px 16px; - border: none; - background: none; - font-size: 14px; - transition: all 0.3s; - margin: 0; - height: 35px; - } +.plus-button:hover { + transform: translateY(-2px); + box-shadow: 0 6px 16px rgba(52, 152, 219, 0.5); +} - .tab-button.active { - background-color: #3498db; - color: white; - } +.plus-button:active { + transform: translateY(0); +} - /* 妫�楠屽崟鍒楄〃 */ - .inspection-list { - display: flex; - flex-direction: column; - gap: 20px; - } +/* 鍝嶅簲寮忚璁� */ +@media (min-width: 768px) { + .inspection-list { + display: grid; + grid-template-columns: repeat(auto-fill, minmax(400px, 1fr)); + } - /* 妫�楠屽崟鍗$墖 */ - .inspection-card { - background-color: white; - border-radius: 8px; - box-shadow: 0 2px 10px rgba(0, 0, 0, 0.05); - overflow: hidden; - transition: all 0.3s; - } + .info-row { + flex-direction: row; + } +} - .card-header { - padding: 16px; - border-bottom: 1px solid #eee; - display: flex; - align-items: center; - } +/* 鍝嶅簲寮忚璁� */ +@media (min-width: 300px) { + .inspection-list { + display: grid; + grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); + } - .card-title { - font-size: 16px; - font-weight: 600; - flex: 1; - margin: 0 8px; - } + .info-row { + flex-direction: row; + } - .badge { - font-size: 12px; - padding: 2px 6px; - border-radius: 10px; - margin-right: 8px; - } + .picker { + padding: 8px 12px; + border: 1px solid #ddd; + border-radius: 4px; + background-color: white; + font-size: 14px; + min-width: 10px; + } +} - .badge.urgent { - background-color: #e74c3c; - color: white; - } +/* 鍒锋柊鎻愮ず鏍峰紡 */ +.tips { + color: #67c23a; + font-size: 14px; + line-height: 40px; + text-align: center; + background-color: #f0f9eb; + height: 0; + opacity: 0; + transform: translateY(-100%); + transition: all 0.3s; +} - .badge.normal { - background-color: #ffaa00; - color: white; - } - - .status { - font-size: 12px; - padding: 4px 8px; - border-radius: 4px; - font-weight: 500; - } - - .status.pending { - background-color: #f39c12; - color: white; - } - - .status.assigned { - background-color: #3498db; - color: white; - } - - .status.pass { - background-color: #00cd00; - color: white; - } - - .status.Unqualified { - background-color: #ff0000; - color: white; - } - - .card-body { - padding: 16px; - } - - .info-row { - display: flex; - margin-bottom: 12px; - gap: 16px; - } - - .info-item { - flex: 1; - } - - .info-label { - display: block; - font-size: 12px; - color: #7f8c8d; - margin-bottom: 4px; - } - - .info-content { - font-size: 14px; - color: #2c3e50; - line-height: 1.5; - } - - .highlight { - font-weight: 600; - color: #2c3e50; - font-size: 16px; - } - - .meta-info { - display: flex; - gap: 16px; - font-size: 12px; - color: #95a5a6; - margin-top: 12px; - } - - .meta-item { - display: flex; - align-items: center; - gap: 4px; - } - - .card-actions { - padding: 12px 16px; - border-top: 1px solid #eee; - display: flex; - gap: 8px; - } - - button { - padding: 8px 16px; - border: 1px solid #ddd; - border-radius: 4px; - background-color: white; - font-size: 14px; - transition: all 0.2s; - flex: 1; - } - - button.primary { - background-color: #3498db; - color: white; - border-color: #2980b9; - } - - /* 鍝嶅簲寮忚璁� */ - @media (min-width: 768px) { - .inspection-list { - display: grid; - grid-template-columns: repeat(auto-fill, minmax(400px, 1fr)); - } - - .info-row { - flex-direction: row; - } - - } - - /* 鍝嶅簲寮忚璁� */ - @media (min-width: 300px) { - .inspection-list { - display: grid; - grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); - } - - .info-row { - flex-direction: row; - } - - .picker { - padding: 8px 12px; - border: 1px solid #ddd; - border-radius: 4px; - background-color: white; - font-size: 14px; - min-width: 10px; - } - - /* .search-container { - order: 3; - width: 100%; - margin: 0px 0 0 0; - } - - .status-tabs { - order: 4; - width: 100%; - } */ - } +.tips-ani { + transform: translateY(0); + height: 40px; + opacity: 1; +} </style> \ No newline at end of file -- Gitblit v1.9.3