首页 ‘企业公告’ 详情 弹框 完成

src/views/dashboard/MyToDo.vue

@@ -97,7 +97,7 @@
                       <span class="department fl" v-if="item.type == '财务'" style="color:orange;">
                         [ {{ item.type }} ]
                       </span>
-                      <span class="title fl">{{ item.title }}</span>
+                      <span class="title fl" @click="showAnnModal(item)">{{ item.title }}</span>
                       <span class="createTime fr">{{ item.createTime }}</span>
                       <span class="createBy fr">{{ item.createBy }}</span>
                     </a>
@@ -242,6 +242,26 @@
       >
       </component>
     </a-modal>
+
+    <!-- 公告详情 弹框 -->
+    <a-modal v-model="annVisible" title="企业公告详情" @ok="handleOk" width="40%">
+      <p>
+        标题： <span class="annDet">{{ annDetail.title }}</span>
+      </p>
+      <p>
+        发布部门： <span class="annDet">{{ annDetail.type }}</span>
+      </p>
+      <p>
+        创建人： <span class="annDet"> {{ annDetail.createBy }}</span>
+      </p>
+      <p>
+        创建日期： <span class="annDet">{{ annDetail.createTime }}</span>
+      </p>
+      <p>详情：</p>
+
+      <!-- 文本框 -->
+      <span v-html="myValue" class="valueBox"></span>
+    </a-modal>
   </div>
 </template>
 
@@ -257,13 +277,19 @@ import SchedulePlan from '@views/oa/my-plan/schedulePlan'
 import { scheduleGetListByTime, scheduleQueryById } from '@api/oa/cd-schedule'
 import { enterpriseEList } from '@api/oa/cd-enterprise-announcement'
 import '@fullcalendar/daygrid/main.css'
+import JEditor from '../../components/jeecg/JEditor.vue'
 export default {
   name: 'Home',
   components: {
-    FullCalendar
+    FullCalendar,
+    JEditor
   },
   data() {
     return {
+      annVisible: false, //公告详情关闭
+      annDetail: [], //公告详情
+      myValue: '', //富文本内容
+      // smallText: '', // 富文本内容
       //日历组件 参数
       calendarOptions: {
         // 日程数组
@@ -396,6 +422,18 @@ export default {
     this.loadData()
   },
   methods: {
+    //公告详情
+    showAnnModal(item) {
+      this.annVisible = true
+      this.annDetail = item //传值给回显数组
+      console.log('点击公告的详情', this.annDetail)
+      this.myValue = this.annDetail.content
+    },
+    //公告详情 弹框按钮
+    handleOk(e) {
+      console.log(e)
+      this.annVisible = false
+    },
     //查询日程数据
     getScheduleData() {
       this.$nextTick(() => {
@@ -573,6 +611,18 @@ export default {
 }
 </script>
 <style lang="less" scoped>
+//富文本内容
+.valueBox {
+  font-weight: 700;
+  display: block;
+  border: 1px solid #ccc;
+  padding: 10px;
+}
+// 整个详情弹框内容
+.annDet {
+  // color: #ccc;
+  font-weight: 700;
+}
 ul li {
   list-style: none;
 }

src/views/oa/my-plan/add/savePlan.vue

@@ -154,13 +154,6 @@ import moment from 'moment'
 import 'moment/locale/zh-cn'
 import JEditor from '../../../../components/jeecg/JEditor.vue'
 import { scheduleAdd, scheduleUpdate } from '@api/oa/cd-schedule'
-// import { mapGetters } from 'vuex'
-// import { defineComponent, ref } from 'vue'
-// import api from '@/api'
-// import { getAction, deleteAction, putAction, postAction } from '@/api/manage'
-// import { extend } from 'dayjs'
-// import { defineComponent, ref } from 'vue'
-// import JEditor from '@views/jeecg/JEditor.vue'
 
 export default {
     name: 'SavePlan',
@@ -173,11 +166,10 @@ export default {
             formLayout: 'horizontal',
             addForm: this.$form.createForm(this, { name: 'coordinated' }),
             formData: {}, // 表单数据(回显)
-            timeList: [], // 开始/结束时间集合
+            timeList: [], // 开始 + 结束时间
             isDate: false, // 默认无时分秒
             smallText: '', // 富文本内容
             title: '' // 弹框头部
-            // checked: true,
         }
     },
     props: {
@@ -204,7 +196,7 @@ export default {
     methods: {
     // 回显表单的赋值
         getFormInfo (e) {
-            console.log('点击日程ID>>', this.formData.id)
+            // console.log('点击日程ID>>', this.formData.id)
             this.$nextTick(() => {
                 this.addForm.setFieldsValue({
                     title: this.formData.title,