1

xuxy

2024-06-24 2e05e553f0caadf3d4ed9def5c922709f6ff942e

1

 common/self.scss

@@ -945,3 +945,6 @@
.before-line::before{
    border-top: 2rpx solid #EEEEEE;
}
.img100{
    background-size: 100% 100%;
}

 pages.json

@@ -80,6 +80,14 @@
                "navigationBarBackgroundColor": "#E6F2EB"
                
            }
        },
        {
            "path" : "pages/farmer/flower-manage/flower-add",
            "style" : 
            {
                "navigationBarTitleText" : "",
                "enablePullDownRefresh" : false
            }
        }
    ],
    "globalStyle": {

 pages/farmer/flower-manage/flower-add.vue

对比新文件
@@ -0,0 +1,436 @@
<template>
    <view class="container-page">
        <view>
            <view class="form-item">
                <view class="label required">商品分类</view>
                <view class="m-l-a m-r-0 flex " :class="[!dto.applicationType?'desc-gray':'']" @click="()=>{
                    if(!id){
                        show_select_type=true
                    }
                }">
                    <view>{{dto.applicationTypeStr||dto.applicationType || '请选择'}}</view>
                    <u-icon class="m-l-a" name="arrow-right"></u-icon>
                </view>

            </view>
            <view class="form-item before-line">
                <view class="label required">商品单位</view>
                <view class="m-l-a m-r-0 flex">
                    <input v-model="dto.applicationTitle" placeholder="请输入店铺名称"
                        style="margin-top: 16px;text-align: right;"></input>

                </view>
            </view>
            <view class="form-item before-line">
                <view class="label required">商品颜色</view>
                <view class="m-l-a m-r-0 flex " :class="[!dto.applicationType?'desc-gray':'']" @click="()=>{
                    if(!id){
                        show_select_type=true
                    }
                }">
                    <view>{{dto.applicationTypeStr||dto.applicationType || '请选择'}}</view>
                    <u-icon class="m-l-a" name="arrow-right"></u-icon>
                </view>

            </view>
            <view class="line-gray-big"></view>

            <view class="form-item">
                <view class="label required">列表封面图（130*120px）</view>
                <view class="m-l-a m-r-0 flex">
                    <view class="component-button-upload" @click="uploadIcon('icon')"
                        :style="{'background-image':dto.icon&&`url('${dto.icon}')`||''}">

                    </view>
                </view>
            </view>
            <view class="form-item before-line">
                <view class="label required">商品轮播图（300*160px）</view>
                <view class="m-l-a m-r-0 flex">
                    <view class="component-button-upload" @click="uploadIcon('icon')"
                        :style="{'background-image':dto.icon&&`url('${dto.icon}')`||''}">

                    </view>
                </view>
            </view>
            <view class="line-gray-big"></view>


            <view class="form-item before-line">
                <view class="label required">售价</view>
                <view class="m-l-a m-r-0 flex">
                    <input v-model="dto.applicationTitle" placeholder="请输入数字" type="digit"
                        style="margin-top: 16px;text-align: right;"></input>
                </view>
            </view>
            <view class="form-item before-line">
                <view class="label required">库存</view>
                <view class="m-l-a m-r-0 flex">
                    <input v-model="dto.applicationTitle" placeholder="请输入数字" type="number"
                        style="margin-top: 16px;text-align: right;"></input>
                </view>
            </view>

            <view class="line-gray-big"></view>

            <view class="form-item ">
                <view class="label required">商品参数详情</view>
                <view class="m-l-a m-r-0 flex " :class="[!dto.applicationType?'desc-gray':'']" @click="()=>{
                    if(!id){
                        show_select_type=true
                    }
                }">
                    <view>{{dto.applicationTypeStr||dto.applicationType || '去设置'}}</view>
                    <u-icon class="m-l-a" name="arrow-right"></u-icon>
                </view>

            </view>
            <view class="line-gray-big"></view>
            <view class="form-item before-line">
                <view class="label required">商品等级</view>
                <view class="m-l-a m-r-0 flex " :class="[!dto.applicationType?'desc-gray':'']" @click="()=>{
                    if(!id){
                        show_select_type=true
                    }
                }">
                    <view>{{dto.applicationTypeStr||dto.applicationType || '请选择'}}</view>
                    <u-icon class="m-l-a" name="arrow-right"></u-icon>
                </view>

            </view>


            <view class="form-item before-line">
                <view class="label required">商品视频</view>
                <view class="m-l-a m-r-0 flex">
                    <view class="component-button-upload m-r-15" @click="uploadIcon('icon')"
                        :style="{'background-image':dto.icon&&`url('${dto.icon}')`||''}">

                    </view>

                </view>
            </view>




            <view class="button-green-1 m-t-20 button-fixed-bottom before-line" @click="submit">
                提交审核
            </view>

        </view>


        <u-picker @confirm="select_type" keyName="label" @cancel="show_select_type=false" :show="show_select_type"
            :columns="columns_types"></u-picker>

        <u-picker @confirm="select_user" keyName="label" @cancel="show_select_user=false" :show="show_select_user"
            :columns="userListCols"></u-picker>


    </view>
</template>

<script>
    import environments from '@/environments'
    import xflSelect from '@/components/xfl-select/xfl-select.vue'; //导入

    import {
        mapState
    } from 'vuex'

    export default {

        data() {
            return {
                id: '',
                orderId: '',
                show_addlog: false,
                log_remarks: '',
                refresh: false,
                api: '',
                dto: {
                    id: '',
                    applicationType: '',
                },
                show_select_type: false,
                show_select_user: false,
                columns_types: [],
                audit_remarks: '',
                audit_result: false,
                show_audit: false,


                //审核方式
                shTypeList: [{
                        name: '身份证',
                        disabled: false
                    },
                    {
                        name: '营业执照',
                        disabled: false
                    }
                ],
                radiovalue1: '身份证',

            }
        },
        onLoad(options) {
            if (options.id) {
                this.id = options.id
                this.getDetail()
            } else {
                // this.$http.request('get', '/api/personnel/employee/list', {
                //     params: {
                //         size: 4000,
                //         current: 1
                //     }
                // }).then(res => {
                //     this.userListAll = (res.data && res.data.records || []).map(item => {
                //         item.label = item.label || item.name || item.nickName || item.loginName || '-'
                //         return item
                //     })
                //     var index = 0
                //     this.userList = this.userListAll.map(item => {
                //         index += 1
                //         return `${index}.` + item.label + (item.tel ? `(${item.tel})` : '')
                //     })
                //     var arr = this.userListAll.map(item => {
                //         return {
                //             label: item.label + (item.tel ? `(${item.tel})` : ''),
                //             value: item.id
                //         }
                //     })
                //     this.userListCols = [arr]

                // })


                this.$http.request('get', '/api/dict/value', {
                    params: {
                        typeCode: 'APPLICATION_TYPE'
                    }
                }).then(res => {
                    var data = res.data
                    this.columns_types = [data || []]
                    this.columns_types[0].unshift({
                        label: '全部',
                        value: ''
                    })

                })
            }

        },

        methods: {


            select_type(e) {
                this.show_select_type = false
                this.dto.applicationTypeStr = e.value[0].label
                this.dto.applicationType = e.value[0].value
            },
            select_user(e) {
                this.show_select_user = false
                this.dto.auditPersonStr = e.value[0].label
                this.dto.auditPersonId = e.value[0].value
            },

            async getDetail() {
                this.$message.showLoading()
                const {
                    code,
                    data
                } = await this.$http.request('get', "/api/app/application/get/" + this.id, {})
                if (code == 0) {
                    this.dto = {
                        ...data,

                    }
                    if (this.dto.applicationDate) {
                        this.dto.applicationDate = this.$util.toDate(new Date(this.dto.applicationDate))
                    }
                    // console.log('this.dto', this.dto)

                }

                this.$message.hideLoading()

            },
            async submit() {
                if (!this.dto.applicationType) {
                    this.$message.showToast('未选择类型')
                    return
                }
                if (!this.dto.applicationTitle) {
                    this.$message.showToast('未填写申请主题')
                    return
                }
                if (!this.dto.auditPersonId) {
                    this.$message.showToast('未选择审批人')
                    return
                }
                await this.$message.confirm(`是否确定提交申请${this.auditPersonName?("，审批人为:"+this.auditPersonName):""}`)

                // this.$message.showToast('1')
                // return
                var dto = {
                    ...this.dto,
                    applicationDate: this.$util.toDate(new Date()),
                    applicantId: this.currentInfo.id
                }
                this.$message.showLoading()
                const re = await this.$http.request('post', '/api/app/application/create', {
                    data: dto
                })
                this.$message.hideLoading()
                if (re.code == 2000 || re.code == 0) {
                    this.$message.showToast('操作成功')
                    //需要标记加一下
                    this.$store.dispatch('sign_add', 'application');

                    this.backpage()
                }
            },
            async submitAudit() {
                var url = ''
                if (this.audit_result) {
                    url = '/api/app/application/audit/pass'
                } else {
                    url = '/api/app/application/audit/reject'
                }
                var dto = {
                    id: this.id,
                    auditRemarks: this.audit_remarks
                }
                this.show_audit = false
                this.$message.showLoading()
                const re = await this.$http.request('post', url, {
                    data: dto
                })
                this.$message.hideLoading()
                if (re.code == 2000 || re.code == 0) {
                    this.$message.showToast('操作成功')
                    this.$store.dispatch('sign_add', 'application');

                    this.getDetail()
                }
            },
            uploadIcon(key) {
                const that = this
                uni.chooseImage({
                    count: 1, // 最多可以选择的图片张数，默认9
                    sizeType: ['original', 'compressed'], //original 原图，compressed 压缩图，默认二者都有
                    sourceType: ['camera', 'album'], //album 从相册选图，camera 使用相机，默认二者都有。如需直接开相机或直接选相册，请只使用一个选项
                    success: function({
                        errMsg,
                        tempFiles
                    }) {
                        if (errMsg === 'chooseImage:ok') {
                            // console.log(tempFiles[0])
                            that.$message.showLoading()
                            that.$http.upload(tempFiles[0].path).then(async res => {
                                var pic = res.data && res.data.length > 0 && res.data[
                                        0]
                                    .url || ''
                                that.$message.hideLoading()
                                that.dto[key] = pic || ''
                                that.$forceUpdate()
                            }).catch(res => {
                                that.$message.hideLoading()

                            })
                        }
                    }
                })
            },

        },
        computed: {
            ...mapState(['currentInfo'])
        },
        components: {
            xflSelect
        }
    }
</script>

<style lang="scss" scoped>
    .form-item {
        // padding: 40rpx;
        border-bottom: 1px solid #F3F3F3;
        display: flex;
        // height: 100px;

        .label {
            width: 300rpx;
            line-height: 60px;

        }

        .flex {
            line-height: 60px;

            .flex1 {
                flex: 1;
                text-align: center;
                color: var(--selfblue)
            }


        }
    }

    .form-item.bottom-border-no {
        border-bottom: none;
    }

    .container-page {
        padding: 40rpx;
        background-color: #FFFFFF;
        // min-height: calc(100vh - 80rpx);
        min-height: 100vh;
    }

    .style {
        width: fit-content;
        margin: 0 auto;
        line-height: 64rpx;
        border-radius: 8rpx;
        padding-left: 20rpx;
        padding-right: 20rpx;
        // padding-top: 5rpx;
        // padding-bottom: 5rpx;
        border: 2rpx solid var(--selfblue);
        background-color: var(--selfbluebg);
        min-width: 100rpx;
    }


    .style-1 {
        border: 1px solid rgb(122, 187, 255);
        border: 1px solid #409EFF;
        color: #409EFF;
        background-color: rgb(240, 247, 255);
    }

    .style-2 {
        border: 1px solid rgb(255, 184, 78);
        border: 1px solid #FE9044;
        color: #FE9044;
        background-color: rgb(255, 247, 235);
    }

    .style-3 {
        border: 1px solid #19be6b;
        color: #19be6b;
        background-color: rgb(231, 244, 238);
    }

    .style-4 {
        border: 1px solid #F56c6c;
        color: #F56c6c;
        background-color: rgb(254, 243, 243);
    }
</style>

 pages/farmer/flower-manage/flower-manage.vue

@@ -1,6 +1,72 @@
<template>
    <view>
		
    <view class="flow-manage">
        <view class="top-buttons" v-if="type==='all'">
            <view @click.stop="clickButton('add')" class="button button-add"></view>
            <view class="button button-search-in"></view>
            <view class="button button-search-unpass"></view>
            <view class="button button-search-inpass"></view>
            <view class="button button-search-delete"></view>

        </view>

        <view class="p15" style="min-height: calc(100vh - 160rpx);">
            <no-data v-if="!list||list.length==0" style="width: 100%;"></no-data>
            <view v-for="(item,index) in list" :key="index" class="m-b-24 flow-manage-list">
                <view class="flow-manage-list-item">
                    <view class="flex">
                        <image class="flower-img img100 m-r-6" :src="item.img" @click="previewImg(item.img)"></image>
                        <view>
                            <view class="flex">
                                <view class="title">{{item.title}}<span class="level">A级别</span></view>
                                <view class="t-red m-l-a m-r-0">
                                    ￥20.00/扎
                                </view>
                            </view>
                            <view class="each-list">
                                <view class="each-item">
                                    <view class="label">分类</view>
                                    <view class="value">卡罗拉</view>

                                </view>
                                <view class="each-item">
                                    <view class="label">颜色</view>
                                    <view class="value">红色</view>

                                </view>
                                <view class="each-item">
                                    <view class="label">规格</view>
                                    <view class="value">20支/扎</view>

                                </view>
                                <view class="each-item">
                                    <view class="label">库存</view>
                                    <view class="value">10</view>

                                </view>
                                <view class="each-item">
                                    <view class="label">销量</view>
                                    <view class="value">10</view>
                                </view>
                            </view>
                        </view>
                    </view>
                    <view class="line-gray">

                    </view>
                    <view class="buttons">
                        <view class="button">复制</view>
                        <view class="button">删除</view>
                        <view class="button">下架</view>
                        <view class="button" @click.stop="toDetail(item)">编辑</view>
                        <view class="button">价格</view>
                        <view class="button">库存</view>
                    </view>
                </view>
            </view>
        </view>

        <!-- 判断是否到底了，自动吧 -->
        <footer-msg :more="page.total>0&&page.total>page.current*page.size"></footer-msg>
    </view>
</template>

@@ -8,15 +74,137 @@
    export default {
        data() {
            return {
				
                type: 'all',
                query: {
                    type: ''
                }
            }
        },
        onLoad(options) {
            this.type = options.type || 'all'
            //todo 根据type切换查询条件
            this.listApi = '/api/ua/announcement/list'
            this.getList()
        },
        onReachBottom() {
            this.page.current += 1
            this.getMore()
        },
        async onPullDownRefresh() {
            this.page.current = 1
            await this.getList()
            uni.stopPullDownRefresh()
        },
        methods: {
			
            toDetail(item) {
                uni.navigateTo({
                    url: '/pages/farmer/flower-manage/flower-add?id=' + item.id
                })
            },
            clickButton(type) {
                if (type == 'add') {
                    //添加页面
                    uni.navigateTo({
                        url: '/pages/farmer/flower-manage/flower-add'
                    })
                } else {
                    uni.navigateTo({
                        url: '/pages/farmer/flower-manage/flower-manage?type=' + type
                    })
                }
            },
        }
    }
</script>

<style>
<style lang="scss" scoped>
    .flow-manage {
        .flow-manage-list {
            margin: 20rpx 30rpx;
            padding: 22rpx;

</style>
            .flow-manage-item {
                margin-bottom: 20rpx;

                .buttons {
                    display: flex;

                    .button {
                        margin: 0 auto;
                        width: 98rpx;
                        height: 48rpx;
                        border-radius: 24rpx;
                        border: 2rpx solid #CECECE;
                    }
                }

                .flower-img {
                    width: 128rpx;
                    height: 118rpx;

                }

                .each-list {
                    display: flex;
                    flex-wrap: wrap;

                    .each-item {
                        min-width: 30%;
                        max-width: 40%;
                        text-align: center;

                        .label {
                            font-weight: 400;
                            font-size: 24rpx;
                            color: #666666;
                        }

                        .label::after {
                            content: ": "
                        }

                        .value {}
                    }
                }
            }
        }

        .top-buttons {
            display: flex;
            margin: 22rpx 42rpx;

            .button {
                // flex:1;
                margin: 0 auto;
                width: 96rpx;
                height: 130rpx;
                background-size: 100% 100%;
            }

            .button-add {
                background-image: url('@/static/images/farmer/flower/flower-mange-icon-add-flower.png');

            }

            .button-search-in {
                background-image: url('@/static/images/farmer/flower/flower-mange-icon-flower-in.png');

            }

            .button-search-unpass {
                background-image: url('@/static/images/farmer/flower/flower-mange-icon-flower-unpass.png');

            }

            .button-search-inpass {
                background-image: url('@/static/images/farmer/flower/flower-mange-icon-flower-inpass.png');

            }

            .button-search-delete {
                background-image: url('@/static/images/farmer/flower/flower-mange-icon-flower-delete.png');

            }
        }
    }
</style>

 static/images/farmer/flower/flower-mange-icon-add-flower.png

 static/images/farmer/flower/flower-mange-icon-flower-delete.png

 static/images/farmer/flower/flower-mange-icon-flower-in.png

 static/images/farmer/flower/flower-mange-icon-flower-inpass.png

 static/images/farmer/flower/flower-mange-icon-flower-unpass.png