|
@@ -1,68 +1,69 @@
|
|
|
<template>
|
|
|
<view class="proInit">
|
|
|
<tui-skeleton
|
|
|
- v-if="skeletonShow"
|
|
|
- backgroundColor="#fafafa"
|
|
|
- borderRadius="10rpx"
|
|
|
- :isLoading="true"
|
|
|
- :loadingType="5"
|
|
|
+ v-if="skeletonShow"
|
|
|
+ backgroundColor="#fafafa"
|
|
|
+ borderRadius="10rpx"
|
|
|
+ :isLoading="true"
|
|
|
+ :loadingType="5"
|
|
|
></tui-skeleton>
|
|
|
<view v-else>
|
|
|
<tui-tabs :tabs="tabs" :currentTab="currentTab" @change="handlerTabs" class="tab"></tui-tabs>
|
|
|
- <view class="tabsContent" v-for="(item, index) in 5" :key="index" :style="{marginTop: index === 0 ? '40px' : ''}">
|
|
|
- <proCard @modelData="modelData" :procuretInfo='item' @popupAdd="popupAdd" @popupChange='popupChange'/>
|
|
|
+ <view
|
|
|
+ class="tabsContent"
|
|
|
+ v-for="(item, index) in procurementList"
|
|
|
+ :key="index"
|
|
|
+ :style="{ marginTop: index === 0 ? '40px' : '' }"
|
|
|
+ >
|
|
|
+ <proCard @modelData="modelData" :proTabId='currentTab' :procuretInfo="item" @popupAdd="popupAdd" @popupChange="popupChange" />
|
|
|
</view>
|
|
|
</view>
|
|
|
<!-- 弹窗提示 -->
|
|
|
<tui-modal
|
|
|
- :show="modal"
|
|
|
- @click="handleClick"
|
|
|
- @cancel="hideMobel"
|
|
|
- :content="contentModalText"
|
|
|
- :button="modalButton"
|
|
|
- color="#333"
|
|
|
- :size="32"
|
|
|
- shape="circle"
|
|
|
- :maskClosable="false"
|
|
|
- >
|
|
|
- </tui-modal>
|
|
|
+ :show="modal"
|
|
|
+ @click="handleClick"
|
|
|
+ @cancel="hideMobel"
|
|
|
+ :content="contentModalText"
|
|
|
+ :button="modalButton"
|
|
|
+ color="#333"
|
|
|
+ :size="32"
|
|
|
+ shape="circle"
|
|
|
+ :maskClosable="false"
|
|
|
+ ></tui-modal>
|
|
|
<view class="add_btn" @click="procurementAdd">
|
|
|
<image style="width: 100%;height: 100%;" src="@/static/procurement/add_pro.png"></image>
|
|
|
</view>
|
|
|
- <tui-bottom-popup :zIndex="1002" :maskZIndex="1001" :show="popupShow" @close="handlerPopupClose">
|
|
|
- <view class="popup_content">
|
|
|
- <view class="pro_popup_title">
|
|
|
- 参与需求
|
|
|
- </view>
|
|
|
+ <tui-bottom-popup :zIndex="1002" :maskZIndex="1001" :show="popupShow" @close="handlerPopupClose">
|
|
|
+ <view class="popup_content">
|
|
|
+ <view class="pro_popup_title">参与需求</view>
|
|
|
<view class="popup_form">
|
|
|
- <view class="popup_form_item">
|
|
|
- 商品图片:
|
|
|
- </view>
|
|
|
+ <view class="popup_form_item">商品图片:</view>
|
|
|
<view class="popup_img">
|
|
|
<image style="width: 100%;height: 100%;" src="" mode="aspectFill"></image>
|
|
|
</view>
|
|
|
</view>
|
|
|
<view class="popup_form">
|
|
|
- <view class="popup_form_item">
|
|
|
- 商品名称:
|
|
|
- </view>
|
|
|
+ <view class="popup_form_item">商品名称:</view>
|
|
|
<view class="popup_form_name">
|
|
|
- 韩国恩盛进口氢洁气小气泡清韩进口氢洁气小气泡清
|
|
|
- 口氢洁气小气泡清韩进口氢洁气小气泡
|
|
|
+ 韩国恩盛进口氢洁气小气泡清韩进口氢洁气小气泡清 口氢洁气小气泡清韩进口氢洁气小气泡
|
|
|
</view>
|
|
|
</view>
|
|
|
<form>
|
|
|
<view class="uni-form-item uni-column">
|
|
|
- <view class="title"><text style="font-size: 26rpx;color: #F85050;">*</text>期望单价:</view>
|
|
|
+ <view class="title">
|
|
|
+ <text style="font-size: 26rpx;color: #F85050;">*</text>
|
|
|
+ 期望单价:
|
|
|
+ </view>
|
|
|
<view style="position: relative;">
|
|
|
- <view class="input_icon">
|
|
|
- ¥
|
|
|
- </view>
|
|
|
+ <view class="input_icon">¥</view>
|
|
|
<input class="uni-input" focus placeholder="自动获得焦点" />
|
|
|
</view>
|
|
|
</view>
|
|
|
<view class="uni-form-item uni-column">
|
|
|
- <view class="title"><text style="font-size: 26rpx;color: #F85050;">*</text>采购数量:</view>
|
|
|
+ <view class="title">
|
|
|
+ <text style="font-size: 26rpx;color: #F85050;">*</text>
|
|
|
+ 采购数量:
|
|
|
+ </view>
|
|
|
<view style="position: relative;">
|
|
|
<input class="uni-input" focus placeholder="自动获得焦点" />
|
|
|
</view>
|
|
@@ -72,105 +73,168 @@
|
|
|
<button class="popup_btn submit">确定</button>
|
|
|
</view>
|
|
|
</form>
|
|
|
- </view>
|
|
|
+ </view>
|
|
|
</tui-bottom-popup>
|
|
|
<!--加载loadding-->
|
|
|
<tui-loadmore :visible="loadding" :index="3" type="black"></tui-loadmore>
|
|
|
- <tui-nomore :visible="!pullUpOn" :backgroundColor="'#F7F7F7'" :text="nomoreText"></tui-nomore>
|
|
|
+ <!-- <tui-nomore :visible="!pullUpOn" :backgroundColor="'#F7F7F7'" :text="nomoreText"></tui-nomore> -->
|
|
|
<!--加载loadding-->
|
|
|
</view>
|
|
|
</template>
|
|
|
|
|
|
<script>
|
|
|
- import proCard from './components/procurement_card.vue'
|
|
|
- import jumpMixins from '@/mixins/jumpMixins.js'
|
|
|
- export default {
|
|
|
- components: {
|
|
|
- proCard,
|
|
|
- },
|
|
|
- mixins: [jumpMixins],
|
|
|
- data() {
|
|
|
- return {
|
|
|
- skeletonShow: true,
|
|
|
- tabs: [
|
|
|
- {
|
|
|
- name: '全部'
|
|
|
- },
|
|
|
- {
|
|
|
- name:'我参与的'
|
|
|
+import proCard from './components/procurement_card.vue'
|
|
|
+import jumpMixins from '@/mixins/jumpMixins.js'
|
|
|
+import { mapState } from 'vuex'
|
|
|
+export default {
|
|
|
+ components: {
|
|
|
+ proCard
|
|
|
+ },
|
|
|
+ mixins: [jumpMixins],
|
|
|
+ data() {
|
|
|
+ return {
|
|
|
+ skeletonShow: true, // loading
|
|
|
+ // tab 栏切换
|
|
|
+ tabs: [
|
|
|
+ {
|
|
|
+ name: '全部'
|
|
|
+ },
|
|
|
+ {
|
|
|
+ name: '我参与的'
|
|
|
+ },
|
|
|
+ {
|
|
|
+ name: '我发起的'
|
|
|
+ }
|
|
|
+ ],
|
|
|
+ currentTab: 0, // tab 当前所在栏
|
|
|
+ modal: false, // 弹窗
|
|
|
+ contentModalText: '确定退出参与该需求吗?', // 弹窗内容
|
|
|
+ // 弹窗配置
|
|
|
+ modalButton: [
|
|
|
+ {
|
|
|
+ text: '取消',
|
|
|
+ type: 'gray',
|
|
|
+ plain: true //是否空心
|
|
|
+ },
|
|
|
+ {
|
|
|
+ text: '确认',
|
|
|
+ customStyle: {
|
|
|
+ color: '#fff',
|
|
|
+ bgColor: 'linear-gradient(90deg, #F28F31 0%, #F3B574 100%)'
|
|
|
},
|
|
|
- {
|
|
|
- name: '我发起的'
|
|
|
- }
|
|
|
- ],
|
|
|
- currentTab: 0,
|
|
|
- modal: false,
|
|
|
- contentModalText: '确定退出参与该需求吗?',
|
|
|
- modalButton: [
|
|
|
- {
|
|
|
- text: '取消',
|
|
|
- type: 'gray',
|
|
|
- plain: true, //是否空心
|
|
|
- },
|
|
|
- {
|
|
|
- text: '确认',
|
|
|
- customStyle: {
|
|
|
- color: '#fff',
|
|
|
- bgColor: 'linear-gradient(90deg, #F28F31 0%, #F3B574 100%)'
|
|
|
- },
|
|
|
- plain: false
|
|
|
- }
|
|
|
- ],
|
|
|
- proDataInfo: {},
|
|
|
- popupShow: false,
|
|
|
- loadding: true,
|
|
|
- pullUpOn: true,
|
|
|
+ plain: false
|
|
|
+ }
|
|
|
+ ],
|
|
|
+ // 组件传递集采需求
|
|
|
+ proDataInfo: {},
|
|
|
+ popupShow: false, // 底部上移栏
|
|
|
+ loadding: false, // 下拉刷新
|
|
|
+ pullUpOn: false, // 下拉刷新
|
|
|
+ // 分页参数
|
|
|
+ pageInfo: {
|
|
|
+ pageNo: 1,
|
|
|
+ pageSize: 10
|
|
|
+ },
|
|
|
+ // 所有数据
|
|
|
+ procurementList: [
|
|
|
+ {
|
|
|
+ id: 1,
|
|
|
+ userId: 2,
|
|
|
+ productImage: '',
|
|
|
+ productName: '测试',
|
|
|
+ price: 1000,
|
|
|
+ number: 1000,
|
|
|
+ saveTime: '2023-1-2',
|
|
|
+ createUserId: 33,
|
|
|
+ isAchieve: 0,
|
|
|
+ delFlag: 0,
|
|
|
+ clubName: '测试机构',
|
|
|
+ isInvolved: 0
|
|
|
+ }
|
|
|
+ ],
|
|
|
+ // 下拉刷新
|
|
|
+ nomoreText: '已经被掏空了~'
|
|
|
+ }
|
|
|
+ },
|
|
|
+ watch: {
|
|
|
+ currentTab(val) {
|
|
|
+ if (val) {
|
|
|
}
|
|
|
- },
|
|
|
- mounted() {
|
|
|
+ }
|
|
|
+ },
|
|
|
+ computed: {
|
|
|
+ // 是否登录
|
|
|
+ ...mapState(['hasLogin'])
|
|
|
+ },
|
|
|
+ onShow() {
|
|
|
+ this.procurementAllList()
|
|
|
+ if (this.hasLogin) {
|
|
|
+ this.skeletonShow = false
|
|
|
+ } else {
|
|
|
+ // this.$api.redirectTo('/pages/login/login')
|
|
|
this.skeletonShow = false
|
|
|
+ }
|
|
|
+ },
|
|
|
+ methods: {
|
|
|
+ // tab 切换
|
|
|
+ handlerTabs($event) {
|
|
|
+ this.currentTab = $event.index
|
|
|
},
|
|
|
- methods:{
|
|
|
- handlerTabs($event) {
|
|
|
- this.currentTab = $event.index
|
|
|
- },
|
|
|
- handleClick($event) {
|
|
|
- this.modal = false
|
|
|
- if ($event.index === 1) {}
|
|
|
- },
|
|
|
- hideMobel($event) {},
|
|
|
- modelData(proData) {
|
|
|
- this.modal = true
|
|
|
- this.proDataInfo = proData
|
|
|
- },
|
|
|
- // 关闭底部
|
|
|
- handlerPopupClose() {
|
|
|
- this.popupShow = false
|
|
|
- },
|
|
|
- // 我要参与
|
|
|
- popupAdd($event) {
|
|
|
- console.log($event)
|
|
|
- this.popupShow = true
|
|
|
- },
|
|
|
- // 修改
|
|
|
- popupChange($event) {
|
|
|
- uni.navigateTo({
|
|
|
- url: '/pages/goods/procurement_info'
|
|
|
- })
|
|
|
- },
|
|
|
- // 发布
|
|
|
- procurementAdd() {
|
|
|
- uni.navigateTo({
|
|
|
- url: '/pages/goods/procurementAdd'
|
|
|
- })
|
|
|
- },
|
|
|
+ // 弹窗确认或取消
|
|
|
+ handleClick($event) {
|
|
|
+ this.modal = false
|
|
|
+ if ($event.index === 1) {
|
|
|
+ }
|
|
|
+ },
|
|
|
+ hideMobel($event) {},
|
|
|
+ // 组件传递商品详情
|
|
|
+ modelData(proData) {
|
|
|
+ this.modal = true
|
|
|
+ this.proDataInfo = proData
|
|
|
+ },
|
|
|
+ // 关闭底部
|
|
|
+ handlerPopupClose() {
|
|
|
+ this.popupShow = false
|
|
|
},
|
|
|
+ // 我要参与
|
|
|
+ popupAdd($event) {
|
|
|
+ console.log($event)
|
|
|
+ this.popupShow = true
|
|
|
+ },
|
|
|
+ // 修改
|
|
|
+ popupChange($event) {
|
|
|
+ uni.navigateTo({
|
|
|
+ url: '/pages/goods/procurement_info'
|
|
|
+ })
|
|
|
+ },
|
|
|
+ // 发布
|
|
|
+ procurementAdd() {
|
|
|
+ uni.navigateTo({
|
|
|
+ url: '/pages/goods/procurementAdd'
|
|
|
+ })
|
|
|
+ },
|
|
|
+ /**
|
|
|
+ * 网络请求
|
|
|
+ */
|
|
|
+ // 全部集采
|
|
|
+ async procurementAllList() {
|
|
|
+ try {
|
|
|
+ const data = await this.ProcurementService.procurementAllList(this.pageInfo)
|
|
|
+ this.procurementList = data.list
|
|
|
+ } catch (error) {
|
|
|
+ console.log(error)
|
|
|
+ }
|
|
|
+ }
|
|
|
}
|
|
|
+}
|
|
|
</script>
|
|
|
|
|
|
-<style lang="scss" scoped>
|
|
|
+<style lang="scss">
|
|
|
+page {
|
|
|
+ background-color: #f7f7f7;
|
|
|
+}
|
|
|
.proInit {
|
|
|
- background-color: #F7F7F7;
|
|
|
+ background-color: #f7f7f7;
|
|
|
}
|
|
|
.proInit .tab {
|
|
|
position: fixed;
|
|
@@ -179,13 +243,13 @@
|
|
|
z-index: 9;
|
|
|
}
|
|
|
::v-deep .tui-tabs-slider.data-v-9311a734 {
|
|
|
- background: #F3B574 !important;
|
|
|
+ background: #f3b574 !important;
|
|
|
}
|
|
|
::v-deep .tui-tabs-title.tui-tabs-active {
|
|
|
- color: #F3B574 !important;
|
|
|
+ color: #f3b574 !important;
|
|
|
}
|
|
|
.tabsContent {
|
|
|
- background-color: #F7F7F7;
|
|
|
+ background-color: #f7f7f7;
|
|
|
padding: 16rpx 32rpx;
|
|
|
// margin-bottom: 32rpx;
|
|
|
}
|
|
@@ -234,12 +298,12 @@
|
|
|
position: absolute;
|
|
|
left: 15rpx;
|
|
|
top: 24rpx;
|
|
|
- color: #B2B2B2;
|
|
|
+ color: #b2b2b2;
|
|
|
font-size: 26rpx;
|
|
|
}
|
|
|
.uni-form-item .uni-input {
|
|
|
height: 80rpx;
|
|
|
- border: 1px solid #B2B2B2;
|
|
|
+ border: 1px solid #b2b2b2;
|
|
|
border-radius: 6rpx 6rpx 6rpx 6rpx;
|
|
|
font-size: 26rpx;
|
|
|
padding-left: 47rpx;
|
|
@@ -261,13 +325,13 @@
|
|
|
line-height: 84rpx;
|
|
|
}
|
|
|
::v-deep .submit_btn .cancel {
|
|
|
- background-color: #FFF4E6;
|
|
|
- color: #F3B574;
|
|
|
+ background-color: #fff4e6;
|
|
|
+ color: #f3b574;
|
|
|
font-size: 32rpx;
|
|
|
}
|
|
|
::v-deep .submit_btn .submit {
|
|
|
- background-color: #F3B574;
|
|
|
- color: #FFFFFF;
|
|
|
+ background-color: #f3b574;
|
|
|
+ color: #ffffff;
|
|
|
font-size: 32rpx;
|
|
|
}
|
|
|
-</style>
|
|
|
+</style>
|