| pages.json | ●●●●● 补丁 | 查看 | 原始文档 | blame | 历史 | |
| pages/caigoudingdan/caigoudingdanList.vue | ●●●●● 补丁 | 查看 | 原始文档 | blame | 历史 | |
| pages/caigoudingdan/caigoudingdanListEdit.vue | ●●●●● 补丁 | 查看 | 原始文档 | blame | 历史 | |
| pages/index/tab4.vue | ●●●●● 补丁 | 查看 | 原始文档 | blame | 历史 | |
| pages/xiaoshoudingdan/xiaoshoudingdanBillList.vue | ●●●●● 补丁 | 查看 | 原始文档 | blame | 历史 | |
| pages/xiaoshoudingdan/xiaoshoudingdanListEdit.vue | ●●●●● 补丁 | 查看 | 原始文档 | blame | 历史 |
pages.json
@@ -579,6 +579,12 @@ "navigationBarTitleText": "采购订单列表" } }, { "path": "pages/caigoudingdan/caigoudingdanListEdit", "style": { "navigationBarTitleText": "采购订单查看" } }, { "path": "pages/caigoudingdan/caigoudingdan", "style": { @@ -1689,7 +1695,22 @@ { "navigationBarTitleText" : "待检验列表" } } }, { "path" : "pages/xiaoshoudingdan/xiaoshoudingdanBillList", "style" : { "navigationBarTitleText" : "销售订单列表" } }, { "path" : "pages/xiaoshoudingdan/xiaoshoudingdanListEdit", "style" : { "navigationBarTitleText" : "销售订单" } } ], pages/caigoudingdan/caigoudingdanList.vue
@@ -41,7 +41,7 @@ </view> <view class="button-groups"> <button type="default" size="mini" class="btn-b" @tap.stop="onAddClickHandler">新增</button> <!-- <button type="default" size="mini" class="btn-b" @tap.stop="onAddClickHandler">新增</button> --> <button type="default" size="mini" class="btn-c" @tap.stop="onSearchClickHandler">查询</button> <button type="default" size="mini" class="btn-a" @tap.stop="onResetClickHandler">重置</button> </view> @@ -52,9 +52,9 @@ <uni-card :title="item.物料代码" :extra="item.单据号" style="margin: 10px;" @tap="showDetail = showDetail==index?-1:index"> <view class="card-detail"> <view class="detail" v-if="item.物料代码"> <!-- <view class="detail" v-if="item.物料代码"> <text>物料代码：</text>{{item.物料代码}} </view> </view> --> <view class="detail" v-if="item.物料名称"> <text>物料名称：</text>{{item.物料名称}} </view> @@ -158,6 +158,7 @@ <view class="op" v-if="operations == index"> <!-- <button class="op3" size="mini" plain @tap.stop="edit(item)">编辑</button> --> <button class="op6" size="mini" plain @tap.stop="Browse(item)">查看明细</button> <button class="op4" size="mini" plain @tap.stop="del(item)">删除</button> <button class="op5" size="mini" plain @tap.stop="operations = -1">取消操作</button> </view> @@ -334,6 +335,14 @@ count } = res.data console.log('res.data: ', res.data); if(res.data.Message=="无查看权限！") { uni.showToast({ icon: 'none', title: res.data.Message }) return; } this.listData = data; this.pageMeta.total = count uni.stopPullDownRefresh() @@ -360,7 +369,7 @@ if (res.confirm) { console.log('用户点击确定'); CommonUtils.doRequest2({ url: '/Sc_EmployeeSignInNoteBillController/deleteBill', url: '/Cg_POOrderBill/DeltetCg_POOrderBill', data: { HItemID: item['HInterID'], user: getUserInfo()['Czymc'] @@ -395,6 +404,13 @@ } } }); }, Browse(item) { console.log(item) uni.navigateTo({ url: '/pages/caigoudingdan/caigoudingdanListEdit?linterid=' + item.hmainid + '&HBillNo=' + item.单据号 }) } }, } pages/caigoudingdan/caigoudingdanListEdit.vue
New file @@ -0,0 +1,648 @@ <template> <view class="container"> <view class="header"> <view class="title">采购订单明细</view> <view class="sub-title">{{ HBillNo }}</view> </view> <!-- Tab切换 --> <view class="tab-container"> <view class="tabs"> <view class="tab-item" :class="{'active': currentTab === 0}" @click="switchTab(0)" > 基本信息 </view> <view class="tab-item" :class="{'active': currentTab === 1}" @click="switchTab(1)" > 审核信息 </view> <view class="tab-item" :class="{'active': currentTab === 2}" @click="switchTab(2)" > 物料信息 </view> </view> <view class="tab-indicator" :style="indicatorStyle"></view> </view> <scroll-view scroll-y class="content" :style="{height: scrollHeight + 'px'}" > <!-- Tab 0: 基本信息 --> <view v-if="currentTab === 0" class="tab-content"> <view class="info-card"> <view class="card-title">订单基本信息</view> <view class="info-grid"> <view class="info-item" v-if="orderInfo.日期"> <text class="label">日期：</text> <text class="value">{{ orderInfo.日期 }}</text> </view> <view class="info-item" v-if="orderInfo.单据号"> <text class="label">单据号：</text> <text class="value">{{ orderInfo.单据号 }}</text> </view> <view class="info-item" v-if="orderInfo.部门代码"> <text class="label">部门代码：</text> <text class="value">{{ orderInfo.部门代码 }}</text> </view> <view class="info-item" v-if="orderInfo.部门"> <text class="label">部门：</text> <text class="value">{{ orderInfo.部门 }}</text> </view> <view class="info-item" v-if="orderInfo.业务员代码"> <text class="label">业务员代码：</text> <text class="value">{{ orderInfo.业务员代码 }}</text> </view> <view class="info-item" v-if="orderInfo.业务员"> <text class="label">业务员：</text> <text class="value">{{ orderInfo.业务员 }}</text> </view> <view class="info-item" v-if="orderInfo.交货地点"> <text class="label">交货地点：</text> <text class="value">{{ orderInfo.交货地点 }}</text> </view> <view class="info-item" v-if="orderInfo.结算方式代码"> <text class="label">结算方式代码：</text> <text class="value">{{ orderInfo.结算方式代码 }}</text> </view> <view class="info-item" v-if="orderInfo.结算方式"> <text class="label">结算方式：</text> <text class="value">{{ orderInfo.结算方式 }}</text> </view> <view class="info-item" v-if="orderInfo.供应商代码"> <text class="label">供应商代码：</text> <text class="value">{{ orderInfo.供应商代码 }}</text> </view> <view class="info-item" v-if="orderInfo.供应商"> <text class="label">供应商：</text> <text class="value">{{ orderInfo.供应商 }}</text> </view> <view class="info-item" v-if="orderInfo.币别代码"> <text class="label">币别代码：</text> <text class="value">{{ orderInfo.币别代码 }}</text> </view> <view class="info-item" v-if="orderInfo.币别"> <text class="label">币别：</text> <text class="value">{{ orderInfo.币别 }}</text> </view> <view class="info-item" v-if="orderInfo.汇率"> <text class="label">汇率：</text> <text class="value">{{ orderInfo.汇率 }}</text> </view> <view class="info-item" v-if="orderInfo.主管代码"> <text class="label">主管代码：</text> <text class="value">{{ orderInfo.主管代码 }}</text> </view> <view class="info-item" v-if="orderInfo.主管"> <text class="label">主管：</text> <text class="value">{{ orderInfo.主管 }}</text> </view> <view class="info-item" v-if="orderInfo.采购方式代码"> <text class="label">采购方式代码：</text> <text class="value">{{ orderInfo.采购方式代码 }}</text> </view> <view class="info-item" v-if="orderInfo.采购方式"> <text class="label">采购方式：</text> <text class="value">{{ orderInfo.采购方式 }}</text> </view> <view class="info-item" v-if="orderInfo.结算日期"> <text class="label">结算日期：</text> <text class="value">{{ orderInfo.结算日期 }}</text> </view> <view class="info-item full-width" v-if="orderInfo.摘要"> <text class="label">摘要：</text> <text class="value">{{ orderInfo.摘要 }}</text> </view> </view> </view> </view> <!-- Tab 1: 审核信息 --> <view v-if="currentTab === 1" class="tab-content"> <view class="info-card"> <view class="card-title">审批流程信息</view> <view class="info-grid"> <view class="info-item" v-if="orderInfo.制单人"> <text class="label">制单人：</text> <text class="value">{{ orderInfo.制单人 }}</text> </view> <view class="info-item" v-if="orderInfo.制单日期"> <text class="label">制单日期：</text> <text class="value">{{ formatDate(orderInfo.制单日期) }}</text> </view> <view class="info-item" v-if="orderInfo.审核人"> <text class="label">审核人：</text> <text class="value">{{ orderInfo.审核人 }}</text> </view> <view class="info-item" v-if="orderInfo.审核日期"> <text class="label">审核日期：</text> <text class="value">{{ formatDate(orderInfo.审核日期) }}</text> </view> <view class="info-item" v-if="orderInfo.修改人"> <text class="label">修改人：</text> <text class="value">{{ orderInfo.修改人 }}</text> </view> <view class="info-item" v-if="orderInfo.修改日期"> <text class="label">修改日期：</text> <text class="value">{{ formatDate(orderInfo.修改日期) }}</text> </view> </view> </view> </view> <!-- Tab 2: 物料信息 --> <view v-if="currentTab === 2" class="tab-content"> <view class="material-list"> <view v-for="(item, index) in materialList" :key="index" class="material-card" > <view class="material-header"> <text class="material-code">{{ item.物料代码 || '物料' + (index + 1) }}</text> <text class="material-name">{{ item.物料名称 }}</text> </view> <view class="material-info"> <view class="info-row"> <view class="info-col" v-if="item.规格型号"> <text class="label">规格型号：</text> <text class="value">{{ item.规格型号 }}</text> </view> <view class="info-col" v-if="item.计量单位代码"> <text class="label">单位代码：</text> <text class="value">{{ item.计量单位代码 }}</text> </view> <view class="info-col" v-if="item.计量单位"> <text class="label">单位：</text> <text class="value">{{ item.计量单位 }}</text> </view> </view> <view class="info-row"> <view class="info-col" v-if="item.数量"> <text class="label">数量：</text> <text class="value">{{ item.数量 }}</text> </view> <view class="info-col" v-if="item.入库数量"> <text class="label">入库数量：</text> <text class="value">{{ item.入库数量 }}</text> </view> <view class="info-col" v-if="item.开票数量"> <text class="label">开票数量：</text> <text class="value">{{ item.开票数量 }}</text> </view> </view> <view class="info-row"> <view class="info-col" v-if="item.关联数量"> <text class="label">关联数量：</text> <text class="value">{{ item.关联数量 }}</text> </view> <view class="info-col" v-if="item.未关联数量"> <text class="label">未关联数量：</text> <text class="value">{{ item.未关联数量 }}</text> </view> </view> <view class="info-row"> <view class="info-col" v-if="item.含税单价"> <text class="label">含税单价：</text> <text class="value">{{ item.含税单价 }}</text> </view> <view class="info-col" v-if="item.折扣率"> <text class="label">折扣率：</text> <text class="value">{{ item.折扣率 }}</text> </view> <view class="info-col" v-if="item.实际含税单价"> <text class="label">实际单价：</text> <text class="value">{{ item.实际含税单价 }}</text> </view> </view> <view class="info-row"> <view class="info-col" v-if="item.单价"> <text class="label">单价：</text> <text class="value">{{ item.单价 }}</text> </view> <view class="info-col" v-if="item.金额"> <text class="label">金额：</text> <text class="value">{{ item.金额 }}</text> </view> </view> <view class="info-row"> <view class="info-col" v-if="item.税率"> <text class="label">税率：</text> <text class="value">{{ item.税率 }}%</text> </view> <view class="info-col" v-if="item.税额"> <text class="label">税额：</text> <text class="value">{{ item.税额 }}</text> </view> <view class="info-col" v-if="item.价税合计"> <text class="label">价税合计：</text> <text class="value">{{ item.价税合计 }}</text> </view> </view> <view class="info-row" v-if="item.交货日期"> <view class="info-col full-width"> <text class="label">交货日期：</text> <text class="value">{{ item.交货日期 }}</text> </view> </view> </view> </view> <view v-if="materialList.length === 0" class="empty-state"> <uni-icons type="list" size="50" color="#ccc"></uni-icons> <text class="empty-text">暂无物料信息</text> </view> </view> </view> </scroll-view> <view class="footer"> <button class="back-btn" @click="goBack">返回</button> </view> <uni-load-more v-if="loading" status="loading" :content-text="loadingText"></uni-load-more> </view> </template> <script> import { CommonUtils } from '@/utils/common.js' import { getUserInfo } from "../../utils/auth"; export default { data() { return { // 参数 linterid: '', HBillNo: '', currentTab: 0, scrollHeight: 0, loading: false, loadingText: { contentdown: '上拉显示更多', contentrefresh: '正在加载...', contentnomore: '没有更多数据了' }, orderInfo: {}, materialList: [], allData: [], } }, computed: { indicatorStyle() { const tabWidth = 100 / 3; return { width: tabWidth + '%', transform: `translateX(${this.currentTab * 100}%)` }; } }, onLoad(options) { if (options.linterid && options.HBillNo) { this.linterid = options.linterid; this.HBillNo = options.HBillNo; this.loadOrderDetail(); } else { uni.showToast({ title: '参数错误', icon: 'error' }); setTimeout(() => { uni.navigateBack(); }, 1500); } // 计算滚动区域高度 this.calcScrollHeight(); }, onReady() { uni.onWindowResize(() => { this.calcScrollHeight(); }); }, methods: { calcScrollHeight() { const systemInfo = uni.getSystemInfoSync(); const windowHeight = systemInfo.windowHeight; const query = uni.createSelectorQuery().in(this); query.select('.header').boundingClientRect(); query.select('.tab-container').boundingClientRect(); query.select('.footer').boundingClientRect(); query.exec((res) => { if (res[0] && res[1] && res[2]) { const headerHeight = res[0].height; const tabHeight = res[1].height; const footerHeight = res[2].height; const margin = 5; // 安全边距 this.scrollHeight = windowHeight - headerHeight - tabHeight - footerHeight - margin; } }); }, switchTab(index) { this.currentTab = index; }, loadOrderDetail() { this.loading = true; const sWhere = ` and hmainid = '${this.linterid}'`; CommonUtils.doRequest2({ url: '/Cg_POOrderBill/QueryListEdit', data: { sWhere: sWhere, user: getUserInfo()["Czymc"], }, resFunction: (res) => { this.loading = false; if (res.data.Message === "无查看权限！") { uni.showToast({ icon: 'none', title: res.data.Message }); return; } if (res.data.code === "1" && res.data.data && res.data.data.length > 0) { this.allData = res.data.data; this.orderInfo = { ...this.allData[0] }; this.materialList = this.allData; if (!this.orderInfo.单据号 && this.HBillNo) { this.orderInfo.单据号 = this.HBillNo; } } else { uni.showToast({ title: '未找到订单信息', icon: 'none' }); } }, errFunction: (err) => { this.loading = false; uni.showToast({ title: '加载失败', icon: 'error' }); console.error('加载订单详情失败:', err); } }); }, formatDate(dateStr) { if (!dateStr) return ''; if (dateStr.length >= 10) { return dateStr.substr(0, 10); } return dateStr; }, // 返回上一页 goBack() { uni.navigateBack(); } } } </script> <style lang="scss" scoped> .container { display: flex; flex-direction: column; height: 100vh; background-color: #f5f5f5; } .header { padding: 30rpx; background: linear-gradient(135deg, #3a78ff 0%, #5a9cff 100%); color: white; text-align: center; .title { font-size: 36rpx; font-weight: bold; margin-bottom: 10rpx; } .sub-title { font-size: 28rpx; opacity: 0.9; } } .tab-container { background-color: white; position: relative; box-shadow: 0 2rpx 10rpx rgba(0, 0, 0, 0.05); .tabs { display: flex; .tab-item { flex: 1; text-align: center; padding: 25rpx 0; font-size: 30rpx; color: #666; transition: all 0.3s; &.active { color: #3a78ff; font-weight: bold; } } } .tab-indicator { height: 4rpx; background-color: #3a78ff; transition: transform 0.3s ease; } } .content { flex: 1; } .tab-content { padding: 20rpx; } .info-card { background-color: white; border-radius: 16rpx; padding: 30rpx; margin-bottom: 20rpx; box-shadow: 0 4rpx 20rpx rgba(0, 0, 0, 0.05); .card-title { font-size: 32rpx; font-weight: bold; color: #333; margin-bottom: 30rpx; padding-bottom: 15rpx; border-bottom: 1rpx solid #eee; } .info-grid { display: flex; flex-wrap: wrap; .info-item { width: 50%; margin-bottom: 25rpx; &.full-width { width: 100%; } .label { color: #666; font-size: 28rpx; margin-right: 10rpx; } .value { color: #333; font-size: 28rpx; font-weight: 500; word-break: break-all; } } } } .material-list { .material-card { background-color: white; border-radius: 16rpx; margin-bottom: 20rpx; padding: 30rpx; box-shadow: 0 4rpx 20rpx rgba(0, 0, 0, 0.05); .material-header { display: flex; align-items: center; margin-bottom: 25rpx; padding-bottom: 15rpx; border-bottom: 1rpx solid #eee; .material-code { font-size: 30rpx; font-weight: bold; color: #3a78ff; margin-right: 20rpx; background-color: #f0f7ff; padding: 5rpx 15rpx; border-radius: 8rpx; } .material-name { font-size: 28rpx; color: #333; flex: 1; } } .material-info { .info-row { display: flex; flex-wrap: wrap; margin-bottom: 15rpx; &:last-child { margin-bottom: 0; } .info-col { width: 50%; margin-bottom: 10rpx; &.full-width { width: 100%; } .label { color: #888; font-size: 26rpx; margin-right: 8rpx; } .value { color: #333; font-size: 26rpx; font-weight: 500; } } } } } } .empty-state { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 100rpx 0; .empty-text { color: #999; font-size: 28rpx; margin-top: 20rpx; } } .footer { padding: 20rpx 30rpx; background-color: white; border-top: 1rpx solid #eee; .back-btn { background-color: #3a78ff; color: white; border-radius: 50rpx; height: 80rpx; line-height: 80rpx; font-size: 32rpx; &:active { background-color: #2c5fcc; } } } </style> pages/index/tab4.vue
@@ -181,14 +181,21 @@ "url": "/pages/ZLGL/awaitCheckBillList/awaitCheckBillList", "id": 19, "hidden": false } { }, { "img": "../../static/icon/icon15.png", "text": "采购订单列表", "url": "/pages/caigoudingdan/caigoudingdanList", "id": 20, "hidden": false }, { "img": "../../static/icon/icon15.png", "text": "销售订单列表", "url": "/pages/xiaoshoudingdan/xiaoshoudingdanBillList", "id": 21, "hidden": false }, ] } }, pages/xiaoshoudingdan/xiaoshoudingdanBillList.vue
New file @@ -0,0 +1,604 @@ <template> <view> <view class="page-header"> <view class="search-item"> <view class="left">日期间隔</view> <view class="right"> <picker mode="selector" :value="curDateGap" :range="dateRangePicker" @change="onDateRangePickerChangeHandler"> <input disabled v-model="curDateGap" placeholder="请选择日期间隔" /> <view class="picker-overlay"></view> </picker> </view> </view> <view class="search-item"> <view class="left">开始日期</view> <view class="right"> <uni-datetime-picker :clear-icon="false" type="date" v-model="startDate" :disabled="!enableCustomDateRange"> <view class="datetime-picker-inner" :class="enableCustomDateRange?'font__enable':'font__disable'"> <text>{{ startDate }}</text> </view> </uni-datetime-picker> </view> </view> <view class="search-item"> <view class="left">结束日期</view> <view class="right"> <uni-datetime-picker :clear-icon="false" type="date" v-model="endDate" :disabled="!enableCustomDateRange"> <view class="datetime-picker-inner" :class="enableCustomDateRange?'font__enable':'font__disable'">{{ endDate }}</view> </uni-datetime-picker> </view> </view> <view class="search-item"> <view class="left">单据号</view> <view class="right"> <input type="text" auto-focus v-model="HBillNo" /> </view> </view> <view class="button-groups"> <!-- <button type="default" size="mini" class="btn-b" @tap.stop="onAddClickHandler">新增</button> --> <button type="default" size="mini" class="btn-c" @tap.stop="onSearchClickHandler">查询</button> <button type="default" size="mini" class="btn-a" @tap.stop="onResetClickHandler">重置</button> </view> </view> <view style="width: 100%;height: 16rpx;background-color: #e5e5e5;"></view> <scroll-view id="pageContent" scroll-y class="page-content" :style="{height: pageContentHeight + 'px'}"> <view v-for="(item,index) in listData" :key="index"> <uni-card :title="item.物料代码" :extra="item.单据号" style="margin: 10px;" @tap="showDetail = showDetail==index?-1:index"> <view class="card-detail"> <view class="detail" v-if="item.物料名称"> <text>物料名称：</text>{{item.物料名称}} </view> <view class="detail" v-if="item.部门代码"> <text>部门代码：</text>{{item.部门代码}} </view> <view class="detail" v-if="item.部门"> <text>部门：</text>{{item.部门}} </view> <view class="detail" v-if="item.业务员代码"> <text>业务员代码：</text>{{item.业务员代码}} </view> <view class="detail" v-if="item.业务员"> <text>业务员：</text>{{item.业务员}} </view> <view class="detail" v-if="item.结算方"> <text>结算方：</text>{{item.结算方}} </view> <view class="detail" v-if="item.项目编码"> <text>项目编码：</text>{{item.项目编码}} </view> <view class="detail" v-if="item.项目名称"> <text>项目名称：</text>{{item.项目名称}} </view> <view class="detail" v-if="item.币别"> <text>币别：</text>{{item.币别}} </view> <view class="detail" v-if="item.汇率"> <text>汇率：</text>{{item.汇率}} </view> <!-- --> <view class="detail" v-if="item.主管"> <text>主管：</text>{{item.主管}} </view> <view class="detail" v-if="item.客户代码"> <text>客户代码：</text>{{item.客户代码}} </view> <view class="detail" v-if="item.客户"> <text>客户：</text>{{item.客户}} </view> <view class="detail" v-if="item.主仓库"> <text>主仓库：</text>{{item.主仓库}} </view> <view class="detail" v-if="item.实际含税单价"> <text>实际含税单价：</text>{{item.实际含税单价}} </view> <view class="detail" v-if="item.折扣率"> <text>折扣率：</text>{{item.折扣率}} </view> <view class="detail" v-if="item.实际含税单价"> <text>实际含税单价：</text>{{item.实际含税单价}} </view> <view class="detail" v-if="item.生产关联数量"> <text>生产关联数量：</text>{{item.生产关联数量}} </view> <view class="detail" v-if="item.生产未关联数量"> <text>生产未关联数量：</text>{{item.生产未关联数量}} </view> </view> <view class="card-detail" v-if="showDetail == index"> <view class="detail" v-if="item.制单人"> <text>制单人：</text>{{item.制单人}} </view> <view class="detail" v-if="item.制单日期"> <text>制单日期：</text>{{item.制单日期.substr(0,10)}} </view> <view class="detail" v-if="item.审核人"> <text>审核人：</text>{{item.审核人}} </view> <view class="detail" v-if="item.审核日期"> <text>审核日期：</text>{{item.审核日期.substr(0,10)}} </view> <view class="detail" v-if="item.修改人"> <text>修改人：</text>{{item.修改人}} </view> <view class="detail" v-if="item.修改日期"> <text>修改日期：</text>{{item.修改日期.substr(0,10)}} </view> <view class="detail" v-if="item.关闭人"> <text>关闭人：</text>{{item.关闭人}} </view> <view class="detail" v-if="item.关闭日期"> <text>关闭日期：</text>{{item.关闭日期.substr(0,10)}} </view> <view class="detail" v-if="item.作废人"> <text>作废人：</text>{{item.作废人}} </view> <view class="detail" v-if="item.作废日期"> <text>作废日期：</text>{{item.作废日期.substr(0,10)}} </view> </view> <view class="more" v-if="showDetail == index && operations != index"> <view class="part" style="border-right: 1px solid #eee;"> <uni-icons type="top" style="color: #888;margin-right: 10rpx;" size="14"></uni-icons>收起 </view> <view class="part" @tap.stop="operations = operations==index?-1:index"> <uni-icons type="more-filled" style="color: #888;margin-right: 10rpx;" size="14"></uni-icons>操作 </view> </view> <view class="more" v-if="showDetail != index && operations != index"> <view class="part" style="border-right: 1px solid #eee;"> <uni-icons type="bottom" style="color: #888;margin-right: 10rpx;" size="14"></uni-icons>更多信息 </view> <view class="part" @tap.stop="operations = operations==index?-1:index"> <uni-icons type="more-filled" style="color: #888;margin-right: 10rpx;" size="14"></uni-icons>操作 </view> </view> <view class="op" v-if="operations == index"> <!-- <button class="op3" size="mini" plain @tap.stop="edit(item)">编辑</button> --> <button class="op6" size="mini" plain @tap.stop="Browse(item)">查看明细</button> <button class="op4" size="mini" plain @tap.stop="del(item)">删除</button> <button class="op5" size="mini" plain @tap.stop="operations = -1">取消操作</button> </view> </uni-card> </view> <view class="over" v-if="listData.length == 0">暂无数据</view> </scroll-view> <!-- 分页器 --> <view class="page-footer"> <uni-pagination id="pagination" title="标题文字" v-model="pageMeta.curPage" :pageSize="pageMeta.size" :total="pageMeta.total" @change="onPageChangeHandler"></uni-pagination> </view> </view> </template> <script> import dayjs from 'dayjs' import { CommonUtils } from '@/utils/common.js' import { getUserInfo } from "../../utils/auth"; export default { data() { return { // 计算卡片列表高度 pagination_top: 0, pageContent_top: 0, // 分页控制 pageMeta: { curPage: 1, size: 50, total: 0, }, // 滚动控制 scrollTop: 0, old: { scrollTop: 0 }, dateRangePicker: ["任意间隔", "今天", "近两天", "近三天", "近四天", "近五天", "近六天", "近七天", "近30天"], curDateGap: "近七天", enableCustomDateRange: false, startDate: dayjs(new Date()).subtract(7, 'day').format('YYYY-MM-DD'), endDate: dayjs(new Date()).format('YYYY-MM-DD'), HBillNo: '', listData: [], showDetail: -1, operations: -1, } }, computed: { pageContentHeight: { get() { return (this.pagination_top - this.pageContent_top) } }, }, onLoad() { this.onSearchClickHandler() }, onPullDownRefresh() { this.onSearchClickHandler() }, async onReady() { // #ifndef MP-WEIXIN let query = uni.createSelectorQuery().in(this) query.select("#pagination") .boundingClientRect((data) => { if (data) { this.pagination_top = data.top } else { console.log("未找到#pagination节点"); } }) .exec(); query.select("#pageContent") .boundingClientRect((data) => { if (data) { this.pageContent_top = data.top } else { console.log("未找到#pageContent节点"); } }) .exec(); // #endif }, methods: { goTop: function(e) { // 解决view层不同步的问题 this.scrollTop = this.old.scrollTop this.$nextTick(function() { this.scrollTop = 0 }); }, onDateRangePickerChangeHandler({ detail }) { this.enableCustomDateRange = false this.curDateGap = this.dateRangePicker[detail.value] let date = new Date() switch (this.curDateGap) { case "今天": this.startDate = dayjs(date).format("YYYY-MM-DD") break; case "近一天": this.startDate = dayjs(date).subtract(1, 'day').format("YYYY-MM-DD") break; case "近两天": this.startDate = dayjs(date).subtract(2, 'day').format("YYYY-MM-DD") break; case "近三天": this.startDate = dayjs(date).subtract(3, 'day').format("YYYY-MM-DD") break; case "近四天": this.startDate = dayjs(date).subtract(4, 'day').format("YYYY-MM-DD") break; case "近五天": this.startDate = dayjs(date).subtract(5, 'day').format("YYYY-MM-DD") break; case "近六天": this.startDate = dayjs(date).subtract(6, 'day').format("YYYY-MM-DD") break; case "近七天": this.startDate = dayjs(date).subtract(7, 'day').format("YYYY-MM-DD") break; case "近30天": this.startDate = dayjs(date).subtract(30, 'day').format("YYYY-MM-DD") break; } if (this.curDateGap == '任意间隔') { this.enableCustomDateRange = true } }, onSearchClickHandler() { let sWhere = "" if (this.startDate) { sWhere += " and CONVERT(varchar(100),日期, 23) >= '" + this.startDate + "'"; } if (this.endDate) { sWhere += " and CONVERT(varchar(100),日期, 23) <= '" + this.endDate + "'"; } if (this.HBillNo) { sWhere += " and 单据号 like '%" + this.HBillNo + "%'"; } this.get_DisplayPage(sWhere); }, clear() { this.curDateGap = "近七天" this.enableCustomDateRange = false this.startDate = dayjs(new Date()).subtract(7, 'day').format('YYYY-MM-DD') this.endDate = dayjs(new Date()).format('YYYY-MM-DD') this.HBillNo = '' }, async onResetClickHandler() { this.clear() await this.$nextTick() this.onSearchClickHandler() }, get_DisplayPage(sWhere) { CommonUtils.doRequest2({ url: '/Xs_SeOrderBill/list_ByPage', data: { "sWhere": sWhere, "user": getUserInfo()["Czymc"], "Organization":getUserInfo()["Organization"], "page":1, "size":50 }, resFunction: (res) => { let { data, Message, count } = res.data console.log('res.data: ', res.data); if(res.data.Message=="无查看权限！") { uni.showToast({ icon: 'none', title: res.data.Message }) return; } this.listData = data; this.pageMeta.total = count uni.stopPullDownRefresh() } }) }, onPageChangeHandler() { this.onSearchClickHandler() this.goTop() }, // 新增 onAddClickHandler() { uni.navigateTo({ url: "/pages/EmployeeRecords/EmployeeRecordsBill?operationType=1" }) }, //删除点检记录单 del(item) { console.log(item); uni.showModal({ title: '删除确认', content: '确认要删除吗，删除后不能恢复', success: (res) => { if (res.confirm) { console.log('用户点击确定'); CommonUtils.doRequest2({ url: '/Xs_SeOrderBill/DropXs_SeOrderBill', data: { HItemID: item['HInterID'], user: getUserInfo()['Czymc'] }, resFunction: (res) => { let { data, count, Message } = res.data if (count == 1) { uni.showToast({ icon: count === 1 ? 'success' : 'error', title: Message, duration: 2000 }); // 等待提示显示完成再刷新 setTimeout(() => { this.onSearchClickHandler(); }, 2000); } else { uni.showToast({ icon: 'none', title: Message }) } } }) } else if (res.cancel) { console.log('用户点击取消'); } } }); }, Browse(item) { console.log(item) uni.navigateTo({ url: '/pages/xiaoshoudingdan/xiaoshoudingdanListEdit?linterid=' + item.hmainid + '&HBillNo=' + item.单据号 }) } }, } </script> <style lang="scss"> .page-header { display: flex; box-sizing: border-box; padding: 20rpx; flex-direction: column; gap: 10rpx; font-size: 32rpx; .search-item { display: flex; flex-direction: row; gap: 10rpx; justify-content: center; align-items: center; .left { width: 4em; } .right { flex: 1; position: relative; border-radius: 22rpx; border: 1px solid #acacac; display: flex; padding: 4rpx 10rpx; picker { width: 100%; } } } input { width: inherit; padding: 8rpx 20rpx; font-size: 30rpx; } .datetime-picker-inner { padding: 8rpx 20rpx; font-size: 30rpx; display: flex; align-items: center; } .font__enable { color: #000; } .font__disable { color: #cccccc; } } .button-groups { box-sizing: border-box; padding: 10rpx 0 0 0; display: flex; flex-direction: row; gap: 10rpx; justify-content: space-between; button { border-radius: 50rpx; width: 180rpx; height: 66rpx; line-height: 66rpx; font-size: 28rpx; } .btn-a { background-color: #acacac; color: #fff; } .btn-b { background-color: #41a863; color: #fff; } .btn-c { background-color: #3a78ff; color: #fff; } } .page-content { // height: 40vh; box-sizing: border-box; padding: 10rpx 0; .card-detail { width: 100%; display: flex; flex-wrap: wrap; justify-content: space-between; line-height: 120%; .detail { // width: 50%; font-size: 26rpx; margin-bottom: 12rpx; color: #555; margin-right: 20rpx; text { color: #999; font-size: 26rpx; } } } .more { color: #888; font-size: 24rpx; display: flex; border-top: 1px solid #eee; padding-top: 20rpx; .part { width: 50%; text-align: center; } } .op { display: flex; justify-content: space-around; margin-top: 20rpx; button { padding: 0; width: 150rpx; font-size: 25rpx; } .op1 { border: 1px solid #41a863; color: #41a863; } .op2 { border: 1px solid #d98d00; color: #d98d00; } .op3 { border: 1px solid #3a78ff; color: #3a78ff; } .op4 { border: 1px solid #da0000; color: #da0000; } .op5 { border: 1px solid #888; color: #888; } } } .page-footer { position: fixed; bottom: 0; width: 100%; box-sizing: border-box; padding: 32rpx 40rpx; } </style> pages/xiaoshoudingdan/xiaoshoudingdanListEdit.vue
New file @@ -0,0 +1,742 @@ <template> <view class="container"> <view class="header"> <view class="title">销售订单明细</view> <view class="sub-title">{{ HBillNo }}</view> </view> <!-- Tab切换 --> <view class="tab-container"> <view class="tabs"> <view class="tab-item" :class="{'active': currentTab === 0}" @click="switchTab(0)" > 基本信息 </view> <view class="tab-item" :class="{'active': currentTab === 1}" @click="switchTab(1)" > 审核信息 </view> <view class="tab-item" :class="{'active': currentTab === 2}" @click="switchTab(2)" > 物料信息 </view> </view> <view class="tab-indicator" :style="indicatorStyle"></view> </view> <scroll-view scroll-y class="content" :style="{height: scrollHeight + 'px'}" > <!-- Tab 0: 基本信息 --> <view v-if="currentTab === 0" class="tab-content"> <view class="info-card"> <view class="card-title">订单基本信息</view> <view class="info-grid"> <view class="info-item" v-if="orderInfo.日期"> <text class="label">日期：</text> <text class="value">{{ orderInfo.日期 }}</text> </view> <view class="info-item" v-if="orderInfo.单据号"> <text class="label">单据号：</text> <text class="value">{{ orderInfo.单据号 }}</text> </view> <view class="info-item" v-if="orderInfo.客户代码"> <text class="label">客户代码：</text> <text class="value">{{ orderInfo.客户代码 }}</text> </view> <view class="info-item" v-if="orderInfo.客户"> <text class="label">客户：</text> <text class="value">{{ orderInfo.客户 }}</text> </view> <view class="info-item" v-if="orderInfo.部门代码"> <text class="label">部门代码：</text> <text class="value">{{ orderInfo.部门代码 }}</text> </view> <view class="info-item" v-if="orderInfo.部门"> <text class="label">部门：</text> <text class="value">{{ orderInfo.部门 }}</text> </view> <view class="info-item" v-if="orderInfo.业务员代码"> <text class="label">业务员代码：</text> <text class="value">{{ orderInfo.业务员代码 }}</text> </view> <view class="info-item" v-if="orderInfo.业务员"> <text class="label">业务员：</text> <text class="value">{{ orderInfo.业务员 }}</text> </view> <view class="info-item" v-if="orderInfo.交货地点"> <text class="label">交货地点：</text> <text class="value">{{ orderInfo.交货地点 }}</text> </view> <view class="info-item" v-if="orderInfo.结算方式代码"> <text class="label">结算方式代码：</text> <text class="value">{{ orderInfo.结算方式代码 }}</text> </view> <view class="info-item" v-if="orderInfo.结算方式"> <text class="label">结算方式：</text> <text class="value">{{ orderInfo.结算方式 }}</text> </view> <view class="info-item" v-if="orderInfo.项目编码"> <text class="label">项目编码：</text> <text class="value">{{ orderInfo.项目编码 }}</text> </view> <view class="info-item" v-if="orderInfo.项目名称"> <text class="label">项目名称：</text> <text class="value">{{ orderInfo.项目名称 }}</text> </view> <view class="info-item" v-if="orderInfo.主仓库"> <text class="label">主仓库：</text> <text class="value">{{ orderInfo.主仓库 }}</text> </view> <view class="info-item" v-if="orderInfo.币别代码"> <text class="label">币别代码：</text> <text class="value">{{ orderInfo.币别代码 }}</text> </view> <view class="info-item" v-if="orderInfo.币别"> <text class="label">币别：</text> <text class="value">{{ orderInfo.币别 }}</text> </view> <view class="info-item" v-if="orderInfo.汇率"> <text class="label">汇率：</text> <text class="value">{{ orderInfo.汇率 }}</text> </view> <view class="info-item" v-if="orderInfo.主管代码"> <text class="label">主管代码：</text> <text class="value">{{ orderInfo.主管代码 }}</text> </view> <view class="info-item" v-if="orderInfo.主管"> <text class="label">主管：</text> <text class="value">{{ orderInfo.主管 }}</text> </view> <view class="info-item" v-if="orderInfo.定金比例"> <text class="label">定金比例：</text> <text class="value">{{ orderInfo.定金比例 }}</text> </view> <view class="info-item" v-if="orderInfo.联系人"> <text class="label">联系人：</text> <text class="value">{{ orderInfo.联系人 }}</text> </view> <view class="info-item" v-if="orderInfo.结算日期"> <text class="label">结算日期：</text> <text class="value">{{ orderInfo.结算日期 }}</text> </view> <view class="info-item full-width" v-if="orderInfo.摘要"> <text class="label">摘要：</text> <text class="value">{{ orderInfo.摘要 }}</text> </view> </view> </view> </view> <!-- Tab 1: 审核信息 --> <view v-if="currentTab === 1" class="tab-content"> <view class="info-card"> <view class="card-title">审批流程信息</view> <view class="info-grid"> <view class="info-item" v-if="orderInfo.制单人"> <text class="label">制单人：</text> <text class="value">{{ orderInfo.制单人 }}</text> </view> <view class="info-item" v-if="orderInfo.制单日期"> <text class="label">制单日期：</text> <text class="value">{{ formatDate(orderInfo.制单日期) }}</text> </view> <view class="info-item" v-if="orderInfo.审核人"> <text class="label">审核人：</text> <text class="value">{{ orderInfo.审核人 }}</text> </view> <view class="info-item" v-if="orderInfo.审核日期"> <text class="label">审核日期：</text> <text class="value">{{ formatDate(orderInfo.审核日期) }}</text> </view> <view class="info-item" v-if="orderInfo.修改人"> <text class="label">修改人：</text> <text class="value">{{ orderInfo.修改人 }}</text> </view> <view class="info-item" v-if="orderInfo.修改日期"> <text class="label">修改日期：</text> <text class="value">{{ formatDate(orderInfo.修改日期) }}</text> </view> </view> </view> </view> <!-- Tab 2: 物料信息 --> <view v-if="currentTab === 2" class="tab-content"> <view class="material-list"> <view v-for="(item, index) in materialList" :key="index" class="material-card" > <view class="material-header"> <text class="material-code">{{ item.物料代码 || '物料' + (index + 1) }}</text> <text class="material-name">{{ item.物料名称 }}</text> </view> <view class="material-info"> <view class="info-row"> <view class="info-col" v-if="item.规格型号"> <text class="label">规格型号：</text> <text class="value">{{ item.规格型号 }}</text> </view> <view class="info-col" v-if="item.计量单位代码"> <text class="label">单位代码：</text> <text class="value">{{ item.计量单位代码 }}</text> </view> <view class="info-col" v-if="item.计量单位"> <text class="label">单位：</text> <text class="value">{{ item.计量单位 }}</text> </view> <view class="info-col" v-if="item.克重"> <text class="label">克重：</text> <text class="value">{{ item.克重 }}</text> </view> <view class="info-col" v-if="item.幅宽"> <text class="label">幅宽：</text> <text class="value">{{ item.幅宽 }}</text> </view> <view class="info-col" v-if="染色要求"> <text class="label">染色要求：</text> <text class="value">{{ item.染色要求 }}</text> </view> <view class="info-col" v-if="白坯要求"> <text class="label">白坯要求：</text> <text class="value">{{ item.白坯要求 }}</text> </view> </view> <view class="info-row"> <view class="info-col" v-if="item.批号"> <text class="label">批号：</text> <text class="value">{{ item.批号 }}</text> </view> <view class="info-col" v-if="item.数量"> <text class="label">数量：</text> <text class="value">{{ item.数量 }}</text> </view> <view class="info-col" v-if="item.生产入库数量"> <text class="label">生产入库数量：</text> <text class="value">{{ item.生产入库数量 }}</text> </view> <view class="info-col" v-if="item.开票数量"> <text class="label">开票数量：</text> <text class="value">{{ item.开票数量 }}</text> </view> </view> <view class="info-row"> <view class="info-col" v-if="item.关联数量"> <text class="label">关联数量：</text> <text class="value">{{ item.关联数量 }}</text> </view> <view class="info-col" v-if="item.未关联数量"> <text class="label">未关联数量：</text> <text class="value">{{ item.未关联数量 }}</text> </view> </view> <view class="info-row"> <view class="info-col" v-if="item.含税单价"> <text class="label">含税单价：</text> <text class="value">{{ item.含税单价 }}</text> </view> <view class="info-col" v-if="item.折扣率"> <text class="label">折扣率：</text> <text class="value">{{ item.折扣率 }}</text> </view> <view class="info-col" v-if="item.实际含税单价"> <text class="label">实际单价：</text> <text class="value">{{ item.实际含税单价 }}</text> </view> </view> <view class="info-row"> <view class="info-col" v-if="item.单价"> <text class="label">单价：</text> <text class="value">{{ item.单价 }}</text> </view> <view class="info-col" v-if="item.金额"> <text class="label">金额：</text> <text class="value">{{ item.金额 }}</text> </view> <view class="info-col" v-if="item.销售出库审核金额"> <text class="label">销售出库审核金额：</text> <text class="value">{{ item.销售出库审核金额 }}</text> </view> <view class="info-col" v-if="item.销售出库审核金额"> <text class="label">销售出库审核金额：</text> <text class="value">{{ item.销售出库审核金额 }}</text> </view> <view class="info-col" v-if="item.销售退库数量"> <text class="label">销售退库数量：</text> <text class="value">{{ item.销售退库数量 }}</text> </view> <view class="info-col" v-if="item.销售退库审核数量"> <text class="label">销售退库审核数量：</text> <text class="value">{{ item.销售退库审核数量 }}</text> </view> <view class="info-col" v-if="item.是否下推生产订单"> <text class="label">是否下推生产订单：</text> <text class="value">{{ item.是否下推生产订单 }}</text> </view> </view> <view class="info-row"> <view class="info-col" v-if="item.客户物料编码"> <text class="label">客户物料编码：</text> <text class="value">{{ item.客户物料编码 }}%</text> </view> <view class="info-col" v-if="item.客户规格型号"> <text class="label">客户规格型号：</text> <text class="value">{{ item.客户规格型号 }}%</text> </view> <view class="info-col" v-if="item.客户物料名称"> <text class="label">客户物料名称：</text> <text class="value">{{ item.客户物料名称 }}%</text> </view> <view class="info-col" v-if="item.是否取库存"> <text class="label">是否取库存：</text> <text class="value">{{ item.是否取库存 }}%</text> </view> <view class="info-col" v-if="item.剩余订金"> <text class="label">剩余订金：</text> <text class="value">{{ item.剩余订金 }}%</text> </view> <view class="info-col" v-if="item.报废数量"> <text class="label">报废数量：</text> <text class="value">{{ item.报废数量 }}%</text> </view> <view class="info-col" v-if="item.生产入库数量"> <text class="label">生产入库数量：</text> <text class="value">{{ item.生产入库数量 }}%</text> </view> <!-- --> <view class="info-col" v-if="item.税率"> <text class="label">税率：</text> <text class="value">{{ item.税率 }}%</text> </view> <view class="info-col" v-if="item.税额"> <text class="label">税额：</text> <text class="value">{{ item.税额 }}</text> </view> <view class="info-col" v-if="item.价税合计"> <text class="label">价税合计：</text> <text class="value">{{ item.价税合计 }}</text> </view> </view> <view class="info-row" v-if="item.交货日期"> <view class="info-col full-width"> <text class="label">交货日期：</text> <text class="value">{{ item.交货日期 }}</text> </view> </view> <view class="info-row" v-if="item.投料"> <view class="info-col full-width"> <text class="label">投料：</text> <text class="value">{{ item.投料 }}</text> </view> </view> <view class="info-row" v-if="item.深加工"> <view class="info-col full-width"> <text class="label">深加工：</text> <text class="value">{{ item.深加工 }}</text> </view> </view> </view> </view> <view v-if="materialList.length === 0" class="empty-state"> <uni-icons type="list" size="50" color="#ccc"></uni-icons> <text class="empty-text">暂无物料信息</text> </view> </view> </view> </scroll-view> <view class="footer"> <button class="back-btn" @click="goBack">返回</button> </view> <uni-load-more v-if="loading" status="loading" :content-text="loadingText"></uni-load-more> </view> </template> <script> import { CommonUtils } from '@/utils/common.js' import { getUserInfo } from "../../utils/auth"; export default { data() { return { // 参数 linterid: '', HBillNo: '', currentTab: 0, scrollHeight: 0, loading: false, loadingText: { contentdown: '上拉显示更多', contentrefresh: '正在加载...', contentnomore: '没有更多数据了' }, orderInfo: {}, materialList: [], allData: [], } }, computed: { indicatorStyle() { const tabWidth = 100 / 3; return { width: tabWidth + '%', transform: `translateX(${this.currentTab * 100}%)` }; } }, onLoad(options) { if (options.linterid && options.HBillNo) { this.linterid = options.linterid; this.HBillNo = options.HBillNo; this.loadOrderDetail(); } else { uni.showToast({ title: '参数错误', icon: 'error' }); setTimeout(() => { uni.navigateBack(); }, 1500); } // 计算滚动区域高度 this.calcScrollHeight(); }, onReady() { uni.onWindowResize(() => { this.calcScrollHeight(); }); }, methods: { calcScrollHeight() { const systemInfo = uni.getSystemInfoSync(); const windowHeight = systemInfo.windowHeight; const query = uni.createSelectorQuery().in(this); query.select('.header').boundingClientRect(); query.select('.tab-container').boundingClientRect(); query.select('.footer').boundingClientRect(); query.exec((res) => { if (res[0] && res[1] && res[2]) { const headerHeight = res[0].height; const tabHeight = res[1].height; const footerHeight = res[2].height; const margin = 5; // 安全边距 this.scrollHeight = windowHeight - headerHeight - tabHeight - footerHeight - margin; } }); }, switchTab(index) { this.currentTab = index; }, loadOrderDetail() { this.loading = true; const sWhere = ` and hmainid = '${this.linterid}'`; CommonUtils.doRequest2({ url: '/Xs_SeOrderBill/list_ByPage', data: { sWhere: sWhere, user: getUserInfo()["Czymc"], Organization:getUserInfo()["Organization"], page:1, size:50 }, resFunction: (res) => { this.loading = false; if (res.data.Message === "无查看权限！") { uni.showToast({ icon: 'none', title: res.data.Message }); return; } if (res.data.code === "1" && res.data.data && res.data.data.length > 0) { this.allData = res.data.data; this.orderInfo = { ...this.allData[0] }; this.materialList = this.allData; if (!this.orderInfo.单据号 && this.HBillNo) { this.orderInfo.单据号 = this.HBillNo; } } else { uni.showToast({ title: '未找到订单信息', icon: 'none' }); } }, errFunction: (err) => { this.loading = false; uni.showToast({ title: '加载失败', icon: 'error' }); console.error('加载订单详情失败:', err); } }); }, formatDate(dateStr) { if (!dateStr) return ''; if (dateStr.length >= 10) { return dateStr.substr(0, 10); } return dateStr; }, // 返回上一页 goBack() { uni.navigateBack(); } } } </script> <style lang="scss" scoped> .container { display: flex; flex-direction: column; height: 100vh; background-color: #f5f5f5; } .header { padding: 30rpx; background: linear-gradient(135deg, #3a78ff 0%, #5a9cff 100%); color: white; text-align: center; .title { font-size: 36rpx; font-weight: bold; margin-bottom: 10rpx; } .sub-title { font-size: 28rpx; opacity: 0.9; } } .tab-container { background-color: white; position: relative; box-shadow: 0 2rpx 10rpx rgba(0, 0, 0, 0.05); .tabs { display: flex; .tab-item { flex: 1; text-align: center; padding: 25rpx 0; font-size: 30rpx; color: #666; transition: all 0.3s; &.active { color: #3a78ff; font-weight: bold; } } } .tab-indicator { height: 4rpx; background-color: #3a78ff; transition: transform 0.3s ease; } } .content { flex: 1; } .tab-content { padding: 20rpx; } .info-card { background-color: white; border-radius: 16rpx; padding: 30rpx; margin-bottom: 20rpx; box-shadow: 0 4rpx 20rpx rgba(0, 0, 0, 0.05); .card-title { font-size: 32rpx; font-weight: bold; color: #333; margin-bottom: 30rpx; padding-bottom: 15rpx; border-bottom: 1rpx solid #eee; } .info-grid { display: flex; flex-wrap: wrap; .info-item { width: 50%; margin-bottom: 25rpx; &.full-width { width: 100%; } .label { color: #666; font-size: 28rpx; margin-right: 10rpx; } .value { color: #333; font-size: 28rpx; font-weight: 500; word-break: break-all; } } } } .material-list { .material-card { background-color: white; border-radius: 16rpx; margin-bottom: 20rpx; padding: 30rpx; box-shadow: 0 4rpx 20rpx rgba(0, 0, 0, 0.05); .material-header { display: flex; align-items: center; margin-bottom: 25rpx; padding-bottom: 15rpx; border-bottom: 1rpx solid #eee; .material-code { font-size: 30rpx; font-weight: bold; color: #3a78ff; margin-right: 20rpx; background-color: #f0f7ff; padding: 5rpx 15rpx; border-radius: 8rpx; } .material-name { font-size: 28rpx; color: #333; flex: 1; } } .material-info { .info-row { display: flex; flex-wrap: wrap; margin-bottom: 15rpx; &:last-child { margin-bottom: 0; } .info-col { width: 50%; margin-bottom: 10rpx; &.full-width { width: 100%; } .label { color: #888; font-size: 26rpx; margin-right: 8rpx; } .value { color: #333; font-size: 26rpx; font-weight: 500; } } } } } } .empty-state { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 100rpx 0; .empty-text { color: #999; font-size: 28rpx; margin-top: 20rpx; } } .footer { padding: 20rpx 30rpx; background-color: white; border-top: 1rpx solid #eee; .back-btn { background-color: #3a78ff; color: white; border-radius: 50rpx; height: 80rpx; line-height: 80rpx; font-size: 32rpx; &:active { background-color: #2c5fcc; } } } </style>
