[富文本]样式结束

src/views/jeecg/RichText.vue

@@ -57,7 +57,7 @@ export default {
     },
     props: {
         // 接收父组件 addann 的属性
-        modelValue: {
+        richTextVal: {
             type: String,
             default: null
         }
@@ -65,7 +65,7 @@ export default {
 
     data () {
         return {
-            content: this.modelValue,
+            content: this.richTextVal,
             init: {
                 language_url: require('./../../utils/zh_CN.js'), // 中文语言包路径
                 language: 'zh_CN',
@@ -99,7 +99,8 @@ export default {
             }
         }
     },
-    methods: {}
+    methods: {
+    }
 }
 </script>
 <style lang="less" scoped>

src/views/oa/enter-ann/add/addAnnModal.vue

@@ -1,15 +1,14 @@
 <template>
   <a-modal
-    title="新增公告"
+    title="新增企业公告"
     v-model="addModalVisible"
     :confirmLoading="confirmLoading"
     @ok="handleOk"
     @cancel="handleCancel"
-    width="80%"
+    width="86%"
   >
-    <!-- tabel 加载 -->
     <a-spin :spinning="confirmLoading">
-      <a-form :form="addform" :label-col="{ span: 4 }" :wrapper-col="{ span: 18 }">
+      <a-form :form="addAnnForm" :label-col="{ span: 4 }" :wrapper-col="{ span: 14 }">
         <!-- 标题 类型 -->
         <a-row :gutter="24">
           <a-col :span="12">
@@ -20,6 +19,7 @@
               />
             </a-form-item>
           </a-col>
+
           <a-col :span="12">
             <a-form-item label="类型">
               <a-select
@@ -40,7 +40,8 @@
             <a-form-item label="创建人">
               <a-input
                 v-decorator="['createBy', { rules: [{ required: false, message: '请输入创建人' }] }]"
-                placeholder="请输入创建人"
+                placeholder="系统回显"
+                disabled
               />
             </a-form-item>
           </a-col>
@@ -48,8 +49,11 @@
           <a-col :span="12">
             <a-form-item label="创建日期">
               <a-date-picker
+                disabled
+                style="width:100%"
                 showTime
-                placeholder="请选择创建日期"
+                format="YYYY-MM-DD HH:mm"
+                placeholder="系统回显"
                 @change="createTimeChange"
                 @ok="createTimeOk"
                 v-decorator="['createTime', { rules: [{ required: false, message: '请选择紧创建日期' }] }]"
@@ -61,15 +65,16 @@
         <!-- 内容 -->
         <a-row :gutter="24">
           <a-col :span="12">
-            <a-form-item label="内容">
-              <div v-decorator="['details', { rules: [{ required: true, message: '请输入公告内容' }] }]">
-
-              </div>
-            </a-form-item>
+            <a-form-item label="公告内容:"></a-form-item>
           </a-col>
-          <a-col :span="24">
-            <!-- 引入富文本 组件 -->
-            <RichText ref="RichText" :modelValue="smallText"></RichText>
+          <a-col :span="21">
+            <RichText ref="RichText" :richTextVal="smallText" style="marginLeft:120px;"></RichText>
+
+            <!-- 富文本 组件 ----------------------------------------------
+                  父组件讲属性  modelValue 传递给子组件
+                  父组件 通过 $refs.RichText。。。。 拿到组件里的属性及方法
+                  父组件 通过 richTextVal给 子组件传值
+            -------------------------------------------------------------->
           </a-col>
         </a-row>
       </a-form>
@@ -88,18 +93,34 @@ export default {
     },
     data () {
         return {
-            addform: this.$form.createForm(this),
+            addAnnForm: this.$form.createForm(this),
             confirmLoading: false,
             addModalVisible: false,
-            smallText: ''// 弹框内富文本的内容
+            smallText: '' // 弹框内 富文本的内容
         }
     },
     created () {},
     methods: {
-        // 弹框保存
+    // 弹框保存
         handleOk () {
-            // 触发表单验证
-            console.log('弹框点击了保存')
+            // 触发表单验证、发送新增请求、提示新增成功、关闭弹框
+            this.addAnnForm.validateFields((err, vals) => {
+                console.log('新增企业公告的信息：', vals)
+                if (!err && this.$refs.RichText.content !== '') {
+                    var news = {}
+                    news.title = vals.title
+                    news.type = vals.type
+                    // news.createBy = vals.createBy
+                    // news.createTime = vals.createTime.format('YYYY-MM-DD HH:mm:ss')
+                    console.log(this.$refs.RichText.content)
+                    news.content = this.$refs.RichText.content // 拿到子组件的富文本 内容
+                    console.log('这是添加的一条日程计划:', news)
+                    this.$message.success('新增企业公告成功')
+                    this.addModalVisible = false
+                } else {
+                    this.$message.error('请填写完整的日程计划')
+                }
+            })
         },
         close () {
             this.$emit('close')
@@ -110,8 +131,8 @@ export default {
         },
         createTimeChange (value, dateString) {
             // value:Moment[],dateString:string[]
-            console.log('Selected Time:', value)
-            console.log('Formatted Selected Time:', dateString)
+            console.log('选择的时间:', value)
+            console.log('格式化选择的时间:', dateString)
         },
         createTimeOk (value) {
             console.log('createTimeOk:', value)

src/views/oa/enterpriseAnnouncement.vue

@@ -133,7 +133,7 @@ export default {
                     width: '20%'
                 }
             ],
-            // 公共数据
+            // 公告数据
             annDataList: [
                 {
                     id: '1',
@@ -154,15 +154,39 @@ export default {
             ]
         }
     },
-    created () {},
+    created () {
+        // this.getAnnList() //渲染公告
+    },
     methods: {
-    // 新增
+    // 查询日程计划列表
+        // getAnnList () {
+        //     jiekou(null).then(res => {
+        //         if (res.success) {
+        //             let list = res.result // 查询结果
+        //             var annList = [] // 企业公告集合
+        //             list.forEach(e => {
+        //                 let annObj = {
+        //                     title: e.title,
+        //                     type: e.type,
+        //                     content: e.content,
+        //                     createBy: e.createBy,
+        //                     createTime: e.createTime,
+        //                     isRelease: e.isRelease
+        //                 }
+        //                 // 一条公告数据放到公告列表中
+        //                 annList.push(annObj)
+        //             })
+        //         }
+        //     })
+        // },
+        // 新增
         addOpen () {
             console.log('点击了大页面的新增')
             // 拿到子组件的弹框 属性
             this.$refs.AddAnnModal.addModalVisible = true
         },
-        // 查询
+
+        // 查询按钮
         searchQuery () {
             // this.loading = true
         },
@@ -224,11 +248,13 @@ export default {
 <style lang="less" scoped>
 @import '~@assets/less/common.less';
 .sendAnn {
-  padding: 2px 6px;
-  background-color: #95d5b2;
-  color: #2d6a4f;
-  border: #1b4332;
+  border: 1px solid rgb(0, 100, 148);
+  color: rgb(0, 100, 148);
   border-radius: 4px;
-  // font-size: 16px;
+  background-color: white;
+}
+.sendAnn:hover {
+  background-color: rgba(0, 100, 148, 0.8);
+  color: white;
 }
 </style>

src/views/oa/my-links/add/addLinksModal.vue

@@ -5,7 +5,7 @@
     :confirmLoading="confirmLoading"
     @ok="handleOk"
     @cancel="handleCancel"
-    width="80%"
+    width="86%"
   >
     <!-- tabel 加载 -->
     <a-spin :spinning="confirmLoading">
@@ -35,30 +35,21 @@
           <a-col :span="12">
             <a-form-item label="创建人">
               <a-input
+                disabled
                 v-decorator="['createBy', { rules: [{ required: false, message: '请输入创建人' }] }]"
-                placeholder="请输入创建人"
+                placeholder="系统回显"
               />
             </a-form-item>
           </a-col>
-
-          <a-col :span="12">
-          </a-col>
         </a-row>
 
         <!-- 内容 -->
         <a-row :gutter="24">
           <a-col :span="12">
-            <a-form-item label="简介">
-              <div v-decorator="['details', { rules: [{ required: true, message: '请输入友情链接简介' }] }]"></div>
-            </a-form-item>
+            <a-form-item label="公司简介:" style="marginBottom:0;"></a-form-item>
           </a-col>
-          <a-col :span="24">
-            <!-- 文本域 -->
-            <a-col :span="24">
-              <a-form-item label="简介">
-                <a-textarea v-model="memo" placeholder="公司简介" />
-              </a-form-item>
-            </a-col>
+          <a-col :span="22">
+            <a-textarea v-model="memo" placeholder="请输入公司简介" style="marginLeft:120px;"/>
           </a-col>
         </a-row>
       </a-form>
@@ -80,12 +71,12 @@ export default {
             addLinkform: this.$form.createForm(this),
             confirmLoading: false,
             addLinksModVis: false,
-            smallText: '' // 文本域内容
+            memo: '' // 公司简介
         }
     },
     created () {},
     methods: {
-        // 弹框保存
+    // 弹框保存
         handleOk () {
             // 触发表单验证
             console.log('弹框点击了保存')

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

@@ -1,73 +1,74 @@
 <template>
-  <div>
-    <a-modal v-model="savePlanModalVisible" title="新增日程计划" @ok="handleOk" @cancel="handleCancel" width="52%">
-      <div>
-        <a-divider orientation="left">基本信息</a-divider>
-        <a-form :form="addForm" :label-col="{ span: 5 }" :wrapper-col="{ span: 17 }">
+  <a-modal v-model="savePlanModalVisible" title="新增日程计划" @ok="handleOk" @cancel="handleCancel" width="86%">
+    <a-divider orientation="left" dashed class="divider">基本信息</a-divider>
 
-          <!-- 日程标题 类型 -->
-          <a-row :gutter="24">
-            <!-- 日程标题 -->
-            <a-col :span="12">
-              <a-form-item label="日程标题">
-                <a-input
-                  v-decorator="['title', { rules: [{ required: true, message: '请输入日程标题' }] }]"
-                  placeholder="请输入日程标题"
-                />
-              </a-form-item>
-            </a-col>
-            <!-- 日程类型 -->
-            <a-col :span="12">
-              <a-form-item label="日程类型">
-                <a-select
-                  v-decorator="['type', { rules: [{ required: false, message: '请选择日程类型' }] }]"
-                  placeholder="请选择日程类型"
-                >
-                  <a-select-option value="日常记录">日常记录</a-select-option>
-                  <a-select-option value="本周工作">本周工作</a-select-option>
-                  <a-select-option value="下周计划">下周计划</a-select-option>
-                </a-select>
-              </a-form-item>
-            </a-col>
-          </a-row>
+    <a-form :form="addForm" :label-col="{ span: 4 }" :wrapper-col="{ span: 14 }">
+      <!-- 日程标题 类型 -->
+      <a-row :gutter="24">
+        <a-col :span="12">
+          <a-form-item label="标题">
+            <a-input
+              v-decorator="['title', { rules: [{ required: true, message: '请输入日程标题' }] }]"
+              placeholder="请输入日程标题"
+            />
+          </a-form-item>
+        </a-col>
 
-          <!-- 紧急程度 日程时间 -->
-          <a-row :gutter="24">
-            <a-col :span="12">
-              <a-form-item label="紧急程度">
-                <a-select
-                  v-decorator="['degreeOfUrgency', { rules: [{ required: false, message: '请选择紧急程度' }] }]"
-                  placeholder="请选择紧急程度"
-                >
-                  <a-select-option value="一般">一般</a-select-option>
-                  <a-select-option value="重要">重要</a-select-option>
-                  <a-select-option value="紧机">紧机</a-select-option>
-                </a-select>
-              </a-form-item>
-            </a-col>
-            <a-col :span="12">
-              <a-form-item label="日程时间">
-                <!-- 有时分秒 -->
-                <a-range-picker
-                  v-if="isDate == true"
-                  showTime
-                  format="YYYY-MM-DD HH:mm"
-                  @change="continueTimeChange"
-                  v-decorator="['continue', { rules: [{ required: true, message: '请选择日程时间' }] }]"
-                >
-                </a-range-picker>
-                <!-- 无时分秒 -->
-                <a-range-picker
-                  v-if="isDate == false"
-                  format="YYYY-MM-DD"
-                  @change="continueTimeChange"
-                  v-decorator="['continue', { rules: [{ required: true, message: '请选择日程日期' }] }]"
-                >
-                </a-range-picker>
-              </a-form-item>
-            </a-col>
-            <!-- 提醒类型 -->
-            <!-- <a-col :span="12">
+        <a-col :span="12">
+          <a-form-item label="类型">
+            <a-select
+              v-decorator="['type', { rules: [{ required: false, message: '请选择日程类型' }] }]"
+              placeholder="请选择日程类型"
+              width="100%"
+            >
+              <a-select-option value="日常记录">日常记录</a-select-option>
+              <a-select-option value="本周工作">本周工作</a-select-option>
+              <a-select-option value="下周计划">下周计划</a-select-option>
+            </a-select>
+          </a-form-item>
+        </a-col>
+      </a-row>
+      <!-- 紧急程度 日程时间 -->
+      <a-row :gutter="24">
+        <a-col :span="12">
+          <a-form-item label="紧急程度">
+            <a-select
+              v-decorator="['degreeOfUrgency', { rules: [{ required: false, message: '请选择紧急程度' }] }]"
+              placeholder="请选择紧急程度"
+            >
+              <a-select-option value="一般">一般</a-select-option>
+              <a-select-option value="重要">重要</a-select-option>
+              <a-select-option value="紧机">紧机</a-select-option>
+            </a-select>
+          </a-form-item>
+        </a-col>
+        <a-col :span="12">
+          <a-form-item label="日程时间">
+            <!-- 有 时分秒 -->
+            <a-range-picker
+              style="width:100%"
+              v-if="isDate == true"
+              showTime
+              format="YYYY-MM-DD HH:mm"
+              @change="continueTimeChange"
+              v-decorator="['continue', { rules: [{ required: true, message: '请选择日程时间' }] }]"
+            >
+            </a-range-picker>
+            <!-- 无 时分秒 -->
+            <a-range-picker
+              style="width:100%"
+              v-if="isDate == false"
+              format="YYYY-MM-DD"
+              @change="continueTimeChange"
+              v-decorator="['continue', { rules: [{ required: true, message: '请选择日程日期' }] }]"
+            >
+            </a-range-picker>
+          </a-form-item>
+        </a-col>
+      </a-row>
+      <!-- 日程时间 -->
+      <a-row :gutter="24">
+        <!-- <a-col :span="12">
               <a-form-item label="提醒类型">
                 <a-select
                   v-decorator="['how', { rules: [{ required: false, message: '请选择提醒类型' }] }]"
@@ -79,28 +80,18 @@
                 </a-select>
               </a-form-item>
             </a-col> -->
-
-            <!-- 紧急程度 -->
-
-            <!-- 日程时间 -->
-            <a-row :gutter="24">
-              <!-- 是否全天 -->
-              <!-- <a-col :span="12">
+        <!-- <a-col :span="12">
               <a-form-item label="是否全天">
                 <a-checkbox v-model="checked" checked="checked"></a-checkbox>
               </a-form-item>
             </a-col> -->
-            </a-row>
-          </a-row>
-
-          <a-row :gutter="24">
-            <!-- 提醒时间 -->
-            <!-- <a-col :span="12">
+      </a-row>
+      <a-row :gutter="24">
+        <!-- <a-col :span="12">
               <a-form-item label="提醒时间">
                 <a-select
                   v-decorator="['when', { rules: [{ required: false, message: '请选择提醒时间' }] }]"
-                  placeholder="请选择提醒时间"
-                >
+                  placeholder="请选择提醒时间">
                   <a-select-option value="不提醒">不提醒</a-select-option>
                   <a-select-option value="开始时">开始时</a-select-option>
                   <a-select-option value="提前5分钟">提前5分钟</a-select-option>
@@ -109,14 +100,11 @@
                 </a-select>
               </a-form-item>
             </a-col> -->
-
-            <!-- 重复提醒 -->
-            <!-- <a-col :span="12">
+        <!-- <a-col :span="12">
               <a-form-item label="重复提醒">
                 <a-select
                   v-decorator="['repeat', { rules: [{ required: false, message: '请选择重复提醒' }] }]"
-                  placeholder="请选择重复提醒"
-                >
+                  placeholder="请选择重复提醒">
                   <a-select-option value="一般">不重复</a-select-option>
                   <a-select-option value="每天">每天</a-select-option>
                   <a-select-option value="每周">每周</a-select-option>
@@ -125,40 +113,41 @@
                 </a-select>
               </a-form-item>
             </a-col> -->
-          </a-row>
-
-          <a-divider orientation="left">其他信息</a-divider>
-          <!-- 颜色 -->
-          <a-row :gutter="24">
-            <a-col :span="24">
-              <a-form-item label="颜色">
-                <div>
-                  <a-radio-group
-                    v-decorator="['backgroundColor', { rules: [{ required: false, message: '请选择日程背景色' }] }]"
-                  >
-                    <a-radio-button value="#d1495b" style="background:#d1495b; marginRight:8px;"></a-radio-button>
-                    <a-radio-button value="#fa541c" style="background:#fa541c; marginRight:8px;"></a-radio-button>
-                    <a-radio-button value="#faad14" style="background:#faad14; marginRight:8px;"></a-radio-button>
-                    <a-radio-button value="#5497a7" style="background:#5497a7; marginRight:8px;"></a-radio-button>
-                    <a-radio-button value="#3bb273" style="background:#3bb273; marginRight:8px;"></a-radio-button>
-                    <a-radio-button value="#81c3d7" style="background:#81c3d7; marginRight:8px;"></a-radio-button>
-                    <a-radio-button value="#004e98" style="background:#004e98; marginRight:8px;"></a-radio-button>
-                    <a-radio-button value="#985277" style="background:#985277;"></a-radio-button>
-                  </a-radio-group>
-                </div>
-              </a-form-item>
-            </a-col>
-          </a-row>
+      </a-row>
 
-          <!-- 文字编辑器 -->
-          <a-row :gutter="24">
-            <!-- 引入富文本 组件 -->
-            <RichText ref="RichText" :modelValue="smallText"></RichText>
-          </a-row>
-        </a-form>
-      </div>
-    </a-modal>
-  </div>
+      <a-divider orientation="left" dashed class="divider">其他信息</a-divider>
+      <!-- 颜色 -->
+      <a-row :gutter="24">
+        <a-col :span="12">
+          <a-form-item label="选择颜色">
+            <div>
+              <a-radio-group
+                v-decorator="['backgroundColor', { rules: [{ required: false, message: '请选择日程背景色' }] }]"
+              >
+                <a-radio-button value="#4281a4" style="background:#4281a4;marginRight:4px;"></a-radio-button>
+                <a-radio-button value="#da5552" style="background:#da5552;marginRight:4px;"></a-radio-button>
+                <a-radio-button value="#25a18e" style="background:#25a18e;marginRight:4px;"></a-radio-button>
+                <a-radio-button value="#648381" style="background:#648381;marginRight:4px;"></a-radio-button>
+                <a-radio-button value="#ffbf46" style="background:#ffbf46;marginRight:4px;"></a-radio-button>
+                <a-radio-button value="#595959" style="background:#595959;marginRight:4px;"></a-radio-button>
+                <a-radio-button value="#f46036" style="background:#f46036;"></a-radio-button>
+              </a-radio-group>
+            </div>
+          </a-form-item>
+        </a-col>
+      </a-row>
+      <!-- 内容 -->
+      <a-row :gutter="24">
+        <a-col :span="12">
+          <a-form-item label="日程内容:" style="marginBottom:0;"></a-form-item>
+        </a-col>
+        <!-- 引入富文本组件 -->
+        <a-col :span="24">
+          <RichText ref="RichText" :modelValue="smallText" style="margin:0 170px 0 130px;"></RichText>
+        </a-col>
+      </a-row>
+    </a-form>
+  </a-modal>
 </template>
 
 <script>
@@ -187,7 +176,7 @@ export default {
             formData: {}, // 表单数据(回显)
             showTime: [], // 开始结束时间集合
             isDate: false, // 默认无时分秒
-            ssmm: '' // 神神秘秘
+            smallText: '' // 富文本内容
         }
     },
     props: {
@@ -223,8 +212,6 @@ export default {
                 // 1、父组件点击的时间 赋值给表单
                 this.formData.startTime = this.fatherData
                 this.formData.endTime = this.fatherData
-                console.log('在这个时间上加半小时好吗', this.formData.endTime)
-
                 /// 2、判断该时间 有无时分秒 赋值给 isDate
                 this.isDate = this.isDatetime(this.fatherData)
                 var showTime = [
@@ -320,7 +307,7 @@ export default {
                     }
                     // ----------------------------------------------
                 } else {
-                    this.$message.success('请填写信息')
+                    this.$message.error('请填写信息')
                     console.log('没有填写相关信息')
                 }
             })
@@ -330,10 +317,6 @@ export default {
         continueTimeChange (date, dateString) {
             console.log('date>>>>>>>>>>>>>>>', date)
             console.log('dateString>>>>>>>>>>>>>>>', dateString)
-            // var ssmm = dateString
-            // console.log('神神秘秘', ssmm)
-            // let startTime = date[0].format('YYYY-MM-DD HH:mm') // 也可以不要具体时间
-            // let endTime = date[1].format('YYYY-MM-DD HH:mm')
             let startTime = dateString[0]
             let ee = dateString[1]
             console.log('startTime', startTime)
@@ -350,7 +333,11 @@ export default {
 </script>
 <style lang="less" scoped>
 .ant-radio-button-wrapper-checked {
-  border: 3px solid #36cfc9;
+  border: 4px solid #13c2c2;
   border-radius: 4px;
 }
+.divider {
+  color: #003566;
+  font-weight: 700;
+}
 </style>

src/views/oa/my-plan/schedulePlan.vue

@@ -3,7 +3,11 @@
     <a-card title="我的计划" style="width: 100%">
       <p>
         <FullCalendar :options="calendarOptions" class="eventDeal-wrap" />
-        <save-plan ref="savePlan" :fatherMethod="search" :fatherData="timeList"></save-plan>
+        <!-- 父组件通过 savePlan 拿子组件的 属性 -->
+        <save-plan
+          ref="savePlan"
+          :fatherMethod="search"
+          :fatherData="timeList"></save-plan>
       </p>
     </a-card>
   </div>
@@ -167,11 +171,9 @@ export default {
                             extendedProps: {
                                 status: 'done'
                             }
-                            // borderColor: 'none'
                         }
                         eventList.push(Object) // 把日程推到日程列表
                     })
-                    // console.log('日程', eventList)
                     // 刷新 日程列表
                     this.calendarOptions.events = eventList
                 }

src/views/oa/myLinks.vue

@@ -7,7 +7,7 @@
         <a-row :gutter="24">
           <a-col :md="6" :sm="8">
             <a-form-item label="名称">
-              <a-input placeholder="请输入标题查询" v-model="queryParam.name"></a-input>
+              <a-input placeholder="请输入公司名称查询" v-model="queryParam.name"></a-input>
             </a-form-item>
           </a-col>
 
@@ -232,9 +232,14 @@ export default {
 <style lang="less" scoped>
 @import '~@assets/less/common.less';
 .sendAnn {
-  background-color: #95d5b2;
-  color: #2d6a4f;
-  border: #1b4332;
+  border: 1px solid rgb(0, 100, 148);
+  color: rgb(0, 100, 148);
   border-radius: 4px;
+  background-color: white;
+}
+.sendAnn:hover {
+  background-color: rgba(0, 100, 148,.8);
+  color: white;
+  // border-radius: 4px;
 }
 </style>