app-govern/pages/message/feedbackDetail.vue

<template>
    <Cn-page :loading='loading'>
        <view slot='body'>
            <view class='detail'>
                <view class="detail-content ">
                    <view class="detail-content-title mb20">机器不稳定</view>
                    <view> 2023-02-14</view>
                    <view class="mt10 mb10">机器不稳定机器不稳定机器不稳定机器不稳定机器不稳定</view>
                    <uni-file-picker readonly v-model="imageValue" mode="grid" />
                </view>
                <view class="detail-content " style="margin-bottom:0">
                    <view class="detail-content-title ">
                        <view class="title">回复</view>
                        <view class="title-btn" @click="open">新增</view>
                    </view>
                </view>
                <uni-list>
                    <uni-list-item title="客服" note="已经安排专员处理，请保持电话畅通" rightText="09-13 10:52" />
                    <uni-list-item title="用户名" note="重启还是不行" rightText="09-13 10:50" />
                    <uni-list-item title="客服" note="重启试试" rightText="09-13 09:50" />
                </uni-list>
                <!-- 输入框示例 -->
                <uni-popup ref="inputDialog" type="dialog">
                    <uni-popup-dialog ref="inputClose" type="info" mode="input" title="输入内容" value="对话框预置提示内容!"
                        placeholder="请输入内容" @confirm="dialogInputConfirm">
                        <uni-easyinput type="textarea" :maxlength="250" autoHeight v-model="value" placeholder="请输入内容"></uni-easyinput>
                    </uni-popup-dialog>
                </uni-popup>
            </view>
        </view>
    </Cn-page>
</template>
<script>
export default {
    data () {
        return {
            loading: false,
            value: "",
            imageValue: [
                {
                    "name": "file.png",
                    "extname": "png",
                    "url": "/static/logo.png",
                }
            ]

        }
    },
    methods: {
        open () {
            this.$refs.inputDialog.open()
        }
    }
}
</script>
<style lang='scss'>
.detail {
    padding: 20rpx 0;

    .detail-content {
        padding: 20rpx 30rpx;
        background: #fff;
        margin-bottom: 20rpx;
        font-size: 26rpx;

        .detail-content-title {
            font-size: 32rpx;
            color: #111;
            font-weight: 700;
            display: flex;
            justify-content: space-between;

            .title {
                flex: 1;
            }

            .title-btn {
                padding: 0 20rpx;
                height: 50rpx;
                background-color: #007aff;
                font-size: 24rpx;
                color: #fff;
                text-align: center;
                line-height: 50rpx;
                border-radius: 10rpx;
            }
        }
    }
}
</style>