| New file |
| | |
| | | <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="'No.'+item['sorderid']" |
| | | @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> |
| | | <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['还样数量']}} |
| | | </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="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="op1" size="mini" plain @tap.stop="">子表信息</button> --> |
| | | <!-- <button class="op2" size="mini" plain @tap.stop="">反审核</button> --> |
| | | <!-- <button class="op3" size="mini" plain @tap.stop="edit(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: { |
| | | // 新增还样单 |
| | | onAddClickHandler() { |
| | | uni.navigateTo({ |
| | | url: "/pages/huanyangdan/BackSampleCheckBill?operationType=0" |
| | | }) |
| | | }, |
| | | del(item) { |
| | | uni.showModal({ |
| | | title: '删除确认', |
| | | content: '确认要删除吗,删除后不能恢复', |
| | | success: (res) => { |
| | | if (res.confirm) { |
| | | console.log('用户点击确定'); |
| | | CommonUtils.doRequest2({ |
| | | url: '/QC_TakeSampleCheckBill/DeleteQC_BackSampleCheckBillMain', |
| | | data: { |
| | | HInterID: item['hmainid'], |
| | | user: getUserInfo()['Czymc'] |
| | | }, |
| | | resFunction: (res) => { |
| | | let { |
| | | data, |
| | | count, |
| | | Message |
| | | } = res.data |
| | | if (count == 1) { |
| | | uni.showToast({ |
| | | icon: 'none', |
| | | title: '删除成功!' |
| | | }) |
| | | this.onSearchClickHandler() |
| | | } else { |
| | | uni.showToast({ |
| | | icon: 'none', |
| | | title: Message |
| | | }) |
| | | } |
| | | } |
| | | }) |
| | | } else if (res.cancel) { |
| | | console.log('用户点击取消'); |
| | | } |
| | | } |
| | | }); |
| | | }, |
| | | 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: '/QC_TakeSampleCheckBill/get_QC_BackSampleCheckBillListPage', |
| | | data: { |
| | | "sWhere": sWhere, |
| | | "user": getUserInfo()["Czymc"], |
| | | "page": this.pageMeta.curPage, |
| | | "size": this.pageMeta.size |
| | | }, |
| | | resFunction: (res) => { |
| | | let { |
| | | data, |
| | | Message, |
| | | count |
| | | } = res.data |
| | | console.log('res.data: ', res.data); |
| | | this.listData = data; |
| | | this.pageMeta.total = count |
| | | uni.stopPullDownRefresh() |
| | | } |
| | | }) |
| | | }, |
| | | onPageChangeHandler() { |
| | | this.onSearchClickHandler() |
| | | this.goTop() |
| | | } |
| | | }, |
| | | } |
| | | </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> |