|
|
@@ -0,0 +1,207 @@
|
|
|
+<script setup>
|
|
|
+import moment from 'moment'
|
|
|
+import {ref,reactive} from 'vue'
|
|
|
+import { useRouter } from 'vue-router'
|
|
|
+import apiReport from '@/api/report'
|
|
|
+import { showToast } from 'vant'
|
|
|
+import { useWindowSize } from '@vueuse/core'
|
|
|
+
|
|
|
+
|
|
|
+const router=useRouter()
|
|
|
+
|
|
|
+
|
|
|
+const reportBaseInfo=reactive({
|
|
|
+ addType:'',
|
|
|
+ title:'',
|
|
|
+ author:'弘则研究',
|
|
|
+ createtime:moment().format('YYYY-MM-DD'),
|
|
|
+})
|
|
|
+
|
|
|
+</script>
|
|
|
+<template>
|
|
|
+ <div class="reportInfo-page">
|
|
|
+ <van-cell-group>
|
|
|
+ <van-cell
|
|
|
+ value-class="cell-con"
|
|
|
+ required
|
|
|
+ title="报告类型"
|
|
|
+ :value="reportBaseInfo.addType"
|
|
|
+ is-link
|
|
|
+ @click="handleShowAddType"
|
|
|
+ />
|
|
|
+ </van-cell-group>
|
|
|
+ <van-cell-group style="margin: 10px 0">
|
|
|
+ <van-cell
|
|
|
+ required
|
|
|
+ title="报告标题"
|
|
|
+ :label="reportBaseInfo.title"
|
|
|
+ is-link
|
|
|
+ @click="handleShowReportTitle"
|
|
|
+ />
|
|
|
+ </van-cell-group>
|
|
|
+ <van-cell-group>
|
|
|
+ <van-cell
|
|
|
+ required
|
|
|
+ title="发布时间"
|
|
|
+ :value="reportBaseInfo.createtime"
|
|
|
+ is-link
|
|
|
+ @click="handleShowCreatetime"
|
|
|
+ />
|
|
|
+ <van-cell
|
|
|
+ title="作者"
|
|
|
+ :value="reportBaseInfo.author"
|
|
|
+ is-link
|
|
|
+ @click="handleShowAuthor"
|
|
|
+ />
|
|
|
+ </van-cell-group>
|
|
|
+
|
|
|
+ <div class="bot-btns">
|
|
|
+ <van-button class="bot-btn" type="default" @click="close"
|
|
|
+ >取消</van-button
|
|
|
+ >
|
|
|
+ <van-button class="bot-btn" type="primary" @click="handleSave"
|
|
|
+ >保存</van-button
|
|
|
+ >
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <!-- 新增方式 -->
|
|
|
+ <van-action-sheet
|
|
|
+ v-model:show="showAddTypePop"
|
|
|
+ cancel-text="取消"
|
|
|
+ close-on-click-action
|
|
|
+ :actions="[
|
|
|
+ {
|
|
|
+ name: '晨报',
|
|
|
+ value: '晨报',
|
|
|
+ },
|
|
|
+ {
|
|
|
+ name: '周报',
|
|
|
+ value: '周报',
|
|
|
+ },
|
|
|
+ ]"
|
|
|
+ @select="selectAddType"
|
|
|
+ />
|
|
|
+
|
|
|
+ <!-- 标题 -->
|
|
|
+ <van-popup
|
|
|
+ v-model:show="showReportTitlePop"
|
|
|
+ position="bottom"
|
|
|
+ :style="{ height: '100%' }"
|
|
|
+ >
|
|
|
+ <div class="input-report-title-pop">
|
|
|
+ <van-field v-model="temReportTitleVal" placeholder="请输入报告标题" />
|
|
|
+ <div class="bot-btns">
|
|
|
+ <van-button
|
|
|
+ class="bot-btn"
|
|
|
+ type="default"
|
|
|
+ @click="showReportTitlePop = false"
|
|
|
+ >取消</van-button
|
|
|
+ >
|
|
|
+ <van-button
|
|
|
+ class="bot-btn"
|
|
|
+ type="primary"
|
|
|
+ :disabled="!temReportTitleVal"
|
|
|
+ @click="handleConfirmReportTitle"
|
|
|
+ >确定</van-button
|
|
|
+ >
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </van-popup>
|
|
|
+
|
|
|
+ <!-- 创建日期 -->
|
|
|
+ <van-popup
|
|
|
+ v-model:show="showCreateTimePop"
|
|
|
+ :position="width > 650 ? 'center' : 'bottom'"
|
|
|
+ :style="width > 650 ? { width: '400px' } : ''"
|
|
|
+ round
|
|
|
+ >
|
|
|
+ <van-calendar
|
|
|
+ :poppable="false"
|
|
|
+ :min-date="minDate"
|
|
|
+ :default-date="defaultDate"
|
|
|
+ v-model:show="showCreateTimePop"
|
|
|
+ title="选择创建日期"
|
|
|
+ @confirm="handleConfirmCreatime"
|
|
|
+ :style="{ height: '500px' }"
|
|
|
+ />
|
|
|
+ </van-popup>
|
|
|
+
|
|
|
+ <!-- 作者 -->
|
|
|
+ <van-popup
|
|
|
+ v-model:show="showAuthorPop"
|
|
|
+ position="bottom"
|
|
|
+ :style="{ height: '100%' }"
|
|
|
+ >
|
|
|
+ <div class="input-report-title-pop">
|
|
|
+ <van-field v-model="temAuthorVal" placeholder="请填写作者" />
|
|
|
+ <div class="bot-btns">
|
|
|
+ <van-button
|
|
|
+ class="bot-btn"
|
|
|
+ type="default"
|
|
|
+ @click="showAuthorPop = false"
|
|
|
+ >取消</van-button
|
|
|
+ >
|
|
|
+ <van-button
|
|
|
+ class="bot-btn"
|
|
|
+ type="primary"
|
|
|
+ :disabled="!temAuthorVal"
|
|
|
+ @click="handleConfirmAuthor"
|
|
|
+ >确定</van-button
|
|
|
+ >
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </van-popup>
|
|
|
+</template>
|
|
|
+<style scoped lang="scss">
|
|
|
+.reportInfo-page{
|
|
|
+ height: 100dvh;
|
|
|
+ min-height: 95vh;
|
|
|
+ position: relative;
|
|
|
+ background: #EDEDED;
|
|
|
+ :deep(.cell-con){
|
|
|
+ flex: 2;
|
|
|
+ }
|
|
|
+ .bot-btns{
|
|
|
+ position: absolute;
|
|
|
+ bottom: 48px;
|
|
|
+ left: 0;
|
|
|
+ width: 100%;
|
|
|
+ text-align: center;
|
|
|
+ }
|
|
|
+}
|
|
|
+.bot-btn{
|
|
|
+ width: 315px;
|
|
|
+ margin: 0 10px;
|
|
|
+}
|
|
|
+.input-report-title-pop{
|
|
|
+ height: 100%;
|
|
|
+ display: flex;
|
|
|
+ flex-direction: column;
|
|
|
+ justify-content: space-between;
|
|
|
+ background-color: $page-bg-grey;
|
|
|
+
|
|
|
+ .bot-btns{
|
|
|
+ flex-shrink: 0;
|
|
|
+ padding: 20px 0;
|
|
|
+ text-align: center;
|
|
|
+ }
|
|
|
+}
|
|
|
+@media screen and (min-width:$media-width){
|
|
|
+ .reportInfo-page{
|
|
|
+ height: calc(100dvh - 60px);
|
|
|
+ min-height: calc(95vh - 60px);
|
|
|
+ .bot-btns{
|
|
|
+ bottom: 24px;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .bot-btn{
|
|
|
+ margin: 0 10px;
|
|
|
+ }
|
|
|
+ .input-report-title-pop{
|
|
|
+ .bot-btns{
|
|
|
+ padding: 10px 0;
|
|
|
+ }
|
|
|
+ }
|
|
|
+}
|
|
|
+</style>
|
