This just is a README.
使用 Vue + LeanCloud 開發的一個週報系統,純前端實現。
並利用 LeanCloud 提供的雲引擎服務實現在週五給全員發送郵件提醒填寫週報,週六週日分別再次對未填人員發送郵件進行填寫提醒。
基本配置
LeanCloud 應用配置
前往 LeanCloud 新增應用。 並導入 /appSchema/ 下的 schema
修改 src/config/av.config-example.js 文件,填入 LeanCloud 應用的 App ID 和 App key。
此 id 和 key 可以從 LeanCloud 要關聯的應用 => 設置 => 應用 Key 中獲取。
// 填寫配置後重命名此文件為av.config.js
export default {
id: '填寫LeanCloud應用的ID',
key: '填寫LeanCloud應用的Key'
}
週報配置
可以從 src/config/input.config.js 和 src/config/group.config.js 中配置週報填寫的類型、説明以及小組配置,格式相應參見文件即可。
input.config.js中的配置信息,用於配置輸入頁面中存在的不同類型和相對應的提示,以及每週的基礎工時、計算為任務飽和度的關聯任務等。group.config.js中配置的小組信息,將在首個成員註冊時自動寫入到 LeanClound 應用中。
規劃時,計算任務飽和度是單獨配置的,但實際開發中,這塊耦合住了,在考慮優化掉,做成一個通用的產品,如果你有任何想法,可以聯繫我,謝謝。
發送郵件配置
修改 mail/mailer-example.php 文件,配置完成後重命名為 mailer.php 即可
public static $HOST = 'smtp.163.com'; // 郵箱的服務器地址
public static $PORT = 465; // smtp 服務器的遠程服務器端口號
public static $SMTP = 'ssl'; // 使用 ssl 加密方式登錄
public static $CHARSET = 'UTF-8'; // 設置發送的郵件的編碼
/**
* 配置此處信息後將此文件重命名為mailer.php即可
*/
private static $USERNAME = '配置用户'; // 授權登錄的賬號
private static $PASSWORD = '配置授權密碼'; // 授權登錄的密碼
private static $NICKNAME = '新點前端週報'; // 發件人的暱稱
無需郵件服務器,直接使用各個郵箱的 SMTP 服務即可完成。
這裏發送郵件的實現是使用了 PHPMailer 簡單包裝來實現的。
注:
- 不要使用 QQ 郵箱的 SMTP ,我在使用中,團隊30+人, 單獨發送到10+後,之後的都失敗了,提醒發送郵件過快。使用163郵箱的暫無問題。
-
why php?
- 因為目前沒在服務器上裝有nodejs。
- 雖然 LeanCloud 提供的免費雲引擎,本身就支持nodejs服務,但是免費版是做測試用的,會自動休眠,不夠穩定,經常掛掉。
- 若使用nodejs,可使用 nodemailer 來發送郵件。
以上展示了配置發送郵件的功能,還需要定時查找用户或未提交的用户來發送郵件。
此處使用了 LeanCloud 提供的雲引擎中的定時任務來實現。
- 定義雲函數,以便發送郵件。實現可參考 weeklyReportSendEmail
- 在 LeanCloud 的應用中 點擊
雲引擎 => 定時任務來創建定時任務,定時執行發送郵件。
相關文檔可參考 LeanCloud 開發指南
構建使用步驟
此項目直接使用 Vue-cli 工具初始化,配置進行了略微修改,相關命令如下:
# install dependencies
npm install
# serve with hot reload at localhost:8086
npm run dev
# build for production with minification
npm run build
# build for production and view the bundle analyzer report
npm run build --report
關於打包後的部署使用,請根據要放的目錄,自行調整 /config/index.js 中的
assetsPublicPath 路徑,並將打包生成的文件(默認在 /dist/ 下)全部拷貝到你指定目錄下即可。
// 例如:這裏最後期望通過訪問 域名/weeklyreport/ 訪問此週報系統,則配置為/weeklyreport/即可
assetsPublicPath: '/weeklyreport/',
效果展示
填寫
彙總展示
只想看你關心的?這裏有!
彙總圖表
還支持任意時段的歷史查看,下方表格和圖標的展示同周彙總。
個人信息維護
管理員對成員查看和管理
對了,還可以導出表格為csv