|
|
<template> <view> <view class="box"> <view class="title">报价清单</view> <view class="lf-font-24 lf-color-gray lf-m-t-5">请在以下物资信息表内填写报价</view> </view> <!-- 修饰条 --> <self-line></self-line> <view class="box lf-row-between relation"> <view> <text class="title">关联食堂</text> <text class="lf-font-24 lf-color-555 lf-m-l-10">(多选)</text> </view> <view class="lf-font-24 lf-color-gray lf-text-right lf-row-center" style="width: 370rpx; justify-content: flex-end;" @click="switchRelation"> <view class="lf-line-1">{{ selectName }}</view> <u-icon name="arrow-right" class="lf-text-vertical"></u-icon> </view> <view class="mask" :style="{top: node_top +'px'}" v-if="is_show" @click="is_show = false"> <view class="list"> <view class="lf-row-between item" v-for="(item, index) in relation_list" :key="index" @click.stop="selectItem(index)"> <view>{{ item.canteen_name }}</view> <u-icon name="checkmark-circle" color="#1833F2" size="40" v-if="item.checked"></u-icon> </view> </view> </view> </view> <self-line></self-line> <!-- 物料table --> <view class="box"> <wyb-table :first-line-fixed="true" contentBgColor="#eef6fe" :headers="headers" :contents="contents" @onInputChange="onInputChange" width="max-content" height="800rpx"></wyb-table> </view> <!-- 操作按钮 --> <view class="fixed-bottom"> <button class="btn btn1" @click="save(0)">临时保存</button> <button class="btn btn2" @click="save(1)">直接报价</button> </view> </view></template>
<script> import wybTable from '@/components/wyb-table/wyb-table'; let app = getApp(); export default { components: { wybTable }, data(){ return { headers: [{ label: '菜品名称', key: 'name' },{ label: '规格', key: 'spec' },{ label: '税前价', key: 'pre_tax_price' },{ label: '税后价', key: 'after_tax_price' }], contents: [], is_show: false, relation_list: [], node_top: 0, q_sn: '' // 订单号，如果有
} }, computed: { selectName(){ let arr = []; this.relation_list.map(item => { if(item.checked){ arr.push(item.canteen_name); } }); let str = '请选择...'; if(arr.length > 0){ str = arr.join(','); } return str; } }, onLoad(options){ this.q_sn = options.q_sn || ''; // todo 临时保存的数据，下次进来再请求一个接口，页面显示出来
this.getMaterialList(); // this.getCanteenList();
}, onReady(){ let that = this; let info = uni.createSelectorQuery().select(".relation"); info.boundingClientRect(function(data) { let num = app.globalData.customBarH; num += data.height; num += data.top; that.node_top = num; }).exec() }, methods: { // 获取物资列表
getMaterialList(){ this.$http(this.API.API_SUPPLIER_TEMPORARYQUOTATION, { supplier_id: getApp().globalData.supplier_id, // q_sn: this.q_sn // 传入订单号
}).then(res => { let list = res.data.order || []; let contents = list.map(item => { let obj = { name: item.material?.m_name, material_id: item.material?.id, spec: item.name, spec_id: item.id, pre_tax_price: {edit: true, value: ''}, after_tax_price: {edit: true, value: ''} } if(item.quotation && Object.keys(item.quotation).length){ obj.pre_tax_price.value = item.quotation.tax_price; obj.after_tax_price.value = item.quotation.non_tax_price; } return obj; }); this.contents = contents; this.getCanteenList(res.data.canteen || []); // let list = res.data.material || [];
// let contents = list.map(item => {
// console.log("item", item)
// return {
// name: item.material?.m_name,
// spec: item.name,
// pre_tax_price: {edit: true, value: item.tax_standard_price},
// after_tax_price: {edit: true, value: item.non_tax_standard_price},
// spec_id: item.id,
// material_id: item.material?.id
// }
// })
// this.contents = contents;
}) }, // 关联食堂列表
getCanteenList(canteen){ this.$http(this.API.API_SUPPLIER_CANTEENLIST).then(res => { let list = res.data.list.map(item => { item.checked = false; canteen.map(ct => { if(ct == item.id){ item.checked = true; } }) return item; }) this.relation_list = list; }) }, // 监听表格被输入
onInputChange(event){ this.contents[event.contentIndex][event.key].value = event.detailValue; }, // 切换显示关联食堂modal
switchRelation(){ this.is_show = !this.is_show; }, // 选择食堂
selectItem(index){ this.relation_list[index].checked = !this.relation_list[index].checked; }, // 保存
save(_t){ // 物资列表
let list = []; this.contents.map(item => { if(item.pre_tax_price.value || item.after_tax_price.value){ list.push({ m_id: item.material_id, m_spec_id: item.spec_id, tax_price: item.pre_tax_price.value, non_tax_price: item.after_tax_price.value }) } }); // 关联食堂
let canteen_ids = []; this.relation_list.map(item => { if(item.checked){ canteen_ids.push(item.id); } }) if(canteen_ids.length <= 0){ return this.$msg('您未选择关联食堂哦') } // 操作状态，是保存还是直接发起
let state = ['待发单', '待审核'][_t]; this.$http(this.API.API_SUPPLIER_QUOTATIONAPPLY, { data: list, state: state, canteen_ids: canteen_ids }).then(res => { console.log("save", res); this.$msg('操作成功'); }) } } }</script>
<style> page{ overflow: hidden; }</style><style lang="scss" scoped="scoped"> .lf-m-t-5{ margin-top: 5rpx; } .box{ padding: 30rpx 32rpx; width: 100%; height: max-content; box-sizing: border-box; } .title{ color: #222222; font-size: 28rpx; font-weight: bold; } .fixed-bottom{ position: fixed; bottom: 0rpx; left: 0rpx; z-index: 99; width: 750rpx; height: 98rpx; display: flex; justify-content: center; align-items: center; border-top: 1rpx solid #E5E5E5; .btn{ width: 320rpx; height: 82rpx; border-radius: 41rpx; margin: 0; padding: 0; font-size: 32rpx; display: flex; justify-content: center; align-items: center; } .btn1{ border: 2rpx solid #555555; opacity: .5; } .btn2{ background: #1833F2; color: #FFFFFF; margin-left: 50rpx; } } .relation{ position: relative; border-bottom: 1rpx solid #E5E5E5; } .mask{ position: fixed; background-color: rgba(0,0,0,0.4); width: 100%; // top: 149px;
bottom: 0; left: 0; z-index: 100; .list{ min-height: max-content; max-height: 500rpx; overflow: scroll; background-color: #FFFFFF; width: 100%; .item{ height: 92rpx; padding: 0 32rpx; border-bottom: 1rpx solid #E5E5E5; color: #222222; font-size: 24rpx; } } }</style>
|
