diff --git a/.env.development b/.env.development index 302ecd1..0a44c04 100644 --- a/.env.development +++ b/.env.development @@ -1,11 +1,13 @@ # 页面标题 -VUE_APP_TITLE = 若依管理系统 +VUE_APP_TITLE = 铭汉能耗监测控制系统 # 开发环境配置 ENV = 'development' -# 若依管理系统/开发环境 -VUE_APP_BASE_API = '/dev-api' +# 开发环境 +# VUE_APP_BASE_API = '/dev-api' +# 后台 +VUE_APP_BASE_API = 'http://192.168.1.222:8080' # 路由懒加载 VUE_CLI_BABEL_TRANSPILE_MODULES = true diff --git a/.env.production b/.env.production index b4893b0..75ebefa 100644 --- a/.env.production +++ b/.env.production @@ -1,8 +1,8 @@ # 页面标题 -VUE_APP_TITLE = 若依管理系统 +VUE_APP_TITLE = 铭汉能耗监测控制系统 # 生产环境配置 ENV = 'production' -# 若依管理系统/生产环境 +# 生产环境 VUE_APP_BASE_API = '/prod-api' diff --git a/public/index.html b/public/index.html index 925455c..6ad1bed 100644 --- a/public/index.html +++ b/public/index.html @@ -118,7 +118,7 @@ top: 0; width: 51%; height: 100%; - background: #7171C6; + background: #002249; z-index: 1000; -webkit-transform: translateX(0); -ms-transform: translateX(0); diff --git a/src/assets/excel/Blob.js b/src/assets/excel/Blob.js new file mode 100644 index 0000000..df88a8d --- /dev/null +++ b/src/assets/excel/Blob.js @@ -0,0 +1,140 @@ +/*! @source http://purl.eligrey.com/github/Blob.js/blob/master/Blob.js */ +(function (view) { + view.URL = view.URL || view.webkitURL; + if (view.Blob && view.URL) { + try { + new Blob; + return + } catch (e) { + } + } + var BlobBuilder = view.BlobBuilder || view.WebKitBlobBuilder || view.MozBlobBuilder || (function (view) { + var get_class = function (object) { + return Object.prototype.toString.call(object).match(/^\[object\s(.*)\]$/)[1] + }, FakeBlobBuilder = function BlobBuilder() { + this.data = [] + }, FakeBlob = function Blob(data, type, encoding) { + this.data = data; + this.size = data.length; + this.type = type; + this.encoding = encoding + }, FBB_proto = FakeBlobBuilder.prototype, FB_proto = FakeBlob.prototype, FileReaderSync = view.FileReaderSync, + FileException = function (type) { + this.code = this[this.name = type] + }, + file_ex_codes = ("NOT_FOUND_ERR SECURITY_ERR ABORT_ERR NOT_READABLE_ERR ENCODING_ERR " + "NO_MODIFICATION_ALLOWED_ERR INVALID_STATE_ERR SYNTAX_ERR").split(" "), + file_ex_code = file_ex_codes.length, real_URL = view.URL || view.webkitURL || view, + real_create_object_URL = real_URL.createObjectURL, real_revoke_object_URL = real_URL.revokeObjectURL, + URL = real_URL, btoa = view.btoa, atob = view.atob, ArrayBuffer = view.ArrayBuffer, Uint8Array = view.Uint8Array; + FakeBlob.fake = FB_proto.fake = true; + while (file_ex_code--) { + FileException.prototype[file_ex_codes[file_ex_code]] = file_ex_code + 1 + } + if (!real_URL.createObjectURL) { + URL = view.URL = {} + } + URL.createObjectURL = function (blob) { + var type = blob.type, data_URI_header; + if (type === null) { + type = "application/octet-stream" + } + if (blob instanceof FakeBlob) { + data_URI_header = "data:" + type; + if (blob.encoding === "base64") { + return data_URI_header + ";base64," + blob.data + } else { + if (blob.encoding === "URI") { + return data_URI_header + "," + decodeURIComponent(blob.data) + } + } + if (btoa) { + return data_URI_header + ";base64," + btoa(blob.data) + } else { + return data_URI_header + "," + encodeURIComponent(blob.data) + } + } else { + if (real_create_object_URL) { + return real_create_object_URL.call(real_URL, blob) + } + } + }; + URL.revokeObjectURL = function (object_URL) { + if (object_URL.substring(0, 5) !== "data:" && real_revoke_object_URL) { + real_revoke_object_URL.call(real_URL, object_URL) + } + }; + FBB_proto.append = function (data) { + var bb = this.data; + if (Uint8Array && (data instanceof ArrayBuffer || data instanceof Uint8Array)) { + var str = "", buf = new Uint8Array(data), i = 0, buf_len = buf.length; + for (; i < buf_len; i++) { + str += String.fromCharCode(buf[i]) + } + bb.push(str) + } else { + if (get_class(data) === "Blob" || get_class(data) === "File") { + if (FileReaderSync) { + var fr = new FileReaderSync; + bb.push(fr.readAsBinaryString(data)) + } else { + throw new FileException("NOT_READABLE_ERR") + } + } else { + if (data instanceof FakeBlob) { + if (data.encoding === "base64" && atob) { + bb.push(atob(data.data)) + } else { + if (data.encoding === "URI") { + bb.push(decodeURIComponent(data.data)) + } else { + if (data.encoding === "raw") { + bb.push(data.data) + } + } + } + } else { + if (typeof data !== "string") { + data += "" + } + bb.push(unescape(encodeURIComponent(data))) + } + } + } + }; + FBB_proto.getBlob = function (type) { + if (!arguments.length) { + type = null + } + return new FakeBlob(this.data.join(""), type, "raw") + }; + FBB_proto.toString = function () { + return "[object BlobBuilder]" + }; + FB_proto.slice = function (start, end, type) { + var args = arguments.length; + if (args < 3) { + type = null + } + return new FakeBlob(this.data.slice(start, args > 1 ? end : this.data.length), type, this.encoding) + }; + FB_proto.toString = function () { + return "[object Blob]" + }; + FB_proto.close = function () { + this.size = this.data.length = 0 + }; + return FakeBlobBuilder + }(view)); + view.Blob = function Blob(blobParts, options) { + var type = options ? (options.type || "") : ""; + var builder = new BlobBuilder(); + if (blobParts) { + for (var i = 0, len = blobParts.length; i < len; i++) { + builder.append(blobParts[i]) + } + } + return builder.getBlob(type) + } + }(typeof self !== "undefined" && self || typeof window !== "undefined" && window || this.content || this)); + + \ No newline at end of file diff --git a/src/assets/excel/Export2Excel.js b/src/assets/excel/Export2Excel.js new file mode 100644 index 0000000..cdd0ef7 --- /dev/null +++ b/src/assets/excel/Export2Excel.js @@ -0,0 +1,236 @@ +// 引入file插件 +import FileSaver from "file-saver"; +// 引入xlsx插件 +import * as XLSX from "xlsx"; + +// 导出 + +function generateArray(table) { + var out = []; + var rows = table.querySelectorAll('tr'); + var ranges = []; + for (var R = 0; R < rows.length; ++R) { + var outRow = []; + var row = rows[R]; + var columns = row.querySelectorAll('td'); + for (var C = 0; C < columns.length; ++C) { + var cell = columns[C]; + var colspan = cell.getAttribute('colspan'); + var rowspan = cell.getAttribute('rowspan'); + var cellValue = cell.innerText; + if (cellValue !== "" && cellValue == +cellValue) cellValue = +cellValue; + + //Skip ranges + ranges.forEach(function (range) { + if (R >= range.s.r && R <= range.e.r && outRow.length >= range.s.c && outRow.length <= range.e.c) { + for (var i = 0; i <= range.e.c - range.s.c; ++i) outRow.push(null); + } + }); + + //Handle Row Span + if (rowspan || colspan) { + rowspan = rowspan || 1; + colspan = colspan || 1; + ranges.push({ + s: { + r: R, + c: outRow.length + }, + e: { + r: R + rowspan - 1, + c: outRow.length + colspan - 1 + } + }); + }; + + //Handle Value + outRow.push(cellValue !== "" ? cellValue : null); + + //Handle Colspan + if (colspan) + for (var k = 0; k < colspan - 1; ++k) outRow.push(null); + } + out.push(outRow); + } + return [out, ranges]; +}; + +function datenum(v, date1904) { + if (date1904) v += 1462; + var epoch = Date.parse(v); + return (epoch - new Date(Date.UTC(1899, 11, 30))) / (24 * 60 * 60 * 1000); +} + +function sheet_from_array_of_arrays(data, opts) { + var ws = {}; + var range = { + s: { + c: 10000000, + r: 10000000 + }, + e: { + c: 0, + r: 0 + } + }; + for (var R = 0; R != data.length; ++R) { + for (var C = 0; C != data[R].length; ++C) { + if (range.s.r > R) range.s.r = R; + if (range.s.c > C) range.s.c = C; + if (range.e.r < R) range.e.r = R; + if (range.e.c < C) range.e.c = C; + var cell = { + v: data[R][C] + }; + if (cell.v == null) continue; + var cell_ref = XLSX.utils.encode_cell({ + c: C, + r: R + }); + + if (typeof cell.v === 'number') cell.t = 'n'; + else if (typeof cell.v === 'boolean') cell.t = 'b'; + else if (cell.v instanceof Date) { + cell.t = 'n'; + cell.z = XLSX.SSF._table[14]; + cell.v = datenum(cell.v); + } else cell.t = 's'; + + + + // 设置表头背景颜色为红色 无效 + if (R == 0) { + cell.s = { + fill: { + fgColor: { + rgb: 'FFFF0000' + } + } + } + } + + ws[cell_ref] = cell; + } + } + if (range.s.c < 10000000) ws['!ref'] = XLSX.utils.encode_range(range); + return ws; +} + +function Workbook() { + if (!(this instanceof Workbook)) return new Workbook(); + this.SheetNames = []; + this.Sheets = {}; +} + +function s2ab(s) { + var buf = new ArrayBuffer(s.length); + var view = new Uint8Array(buf); + for (var i = 0; i != s.length; ++i) view[i] = s.charCodeAt(i) & 0xFF; + return buf; +} + +export function export_table_to_excel(id) { + var theTable = document.getElementById(id); + var oo = generateArray(theTable); + var ranges = oo[1]; + + /* original data */ + var data = oo[0]; + var ws_name = "SheetJS"; + + var wb = new Workbook(), + ws = sheet_from_array_of_arrays(data); + + /* add ranges to worksheet */ + // ws['!cols'] = ['apple', 'banan']; + ws['!merges'] = ranges; + + /* add worksheet to workbook */ + wb.SheetNames.push(ws_name); + wb.Sheets[ws_name] = ws; + + var wbout = XLSX.write(wb, { + bookType: 'xlsx', + bookSST: false, + type: 'binary' + }); + + saveAs(new Blob([s2ab(wbout)], { + type: "application/octet-stream" + }), "test.xlsx") +} + +export function export_json_to_excel({ + multiHeader = [], + header, + data, + filename, + merges = [], + autoWidth = true, + bookType = 'xlsx' +} = {}) { + /* original data */ + filename = filename || 'excel-list' + data = [...data] + data.unshift(header); + + for (let i = multiHeader.length - 1; i > -1; i--) { + data.unshift(multiHeader[i]) + } + + var ws_name = "SheetJS"; + var wb = new Workbook(), + ws = sheet_from_array_of_arrays(data); + + if (merges.length > 0) { + if (!ws['!merges']) ws['!merges'] = []; + merges.forEach(item => { + ws['!merges'].push(XLSX.utils.decode_range(item)) + }) + } + + if (autoWidth) { + /*设置worksheet每列的最大宽度*/ + const colWidth = data.map(row => row.map(val => { + /*先判断是否为null/undefined*/ + if (val == null) { + return { + 'wch': 10 + }; + } + /*再判断是否为中文*/ + else if (val.toString().charCodeAt(0) > 255) { + return { + 'wch': val.toString().length * 2 + }; + } else { + return { + 'wch': val.toString().length + }; + } + })) + /*以第一行为初始值*/ + let result = colWidth[0]; + for (let i = 1; i < colWidth.length; i++) { + for (let j = 0; j < colWidth[i].length; j++) { + if (result[j]['wch'] < colWidth[i][j]['wch']) { + result[j]['wch'] = colWidth[i][j]['wch']; + } + } + } + ws['!cols'] = result; + } + + /* add worksheet to workbook */ + wb.SheetNames.push(ws_name); + wb.Sheets[ws_name] = ws; + + var wbout = XLSX.write(wb, { + bookType: bookType, + bookSST: false, + type: 'binary' + }); + saveAs(new Blob([s2ab(wbout)], { + type: "application/octet-stream" + }), `${filename}.${bookType}`); +} \ No newline at end of file diff --git a/src/assets/excel/Import2Json.js b/src/assets/excel/Import2Json.js new file mode 100644 index 0000000..ac745af --- /dev/null +++ b/src/assets/excel/Import2Json.js @@ -0,0 +1,58 @@ +// import XLSX from 'xlsx' +// 引入file插件 +import FileSaver from "file-saver"; +// 引入xlsx插件 +import * as XLSX from "xlsx"; + +export function readExcel(file){ + const types = file.name.split('.')[1]; + const fileType = [ + 'xlsx', 'xlc', 'xlm', 'xls', 'xlt', 'xlw', 'csv' + ].some(item => item == types); + if (!fileType) { + this.$message({ + type: 'waring', + message: '格式错误！请重新选择' + }) + return + } + const reader = new FileReader(); + let result = []; + reader.onload = function(e) { + const data = e.target.result; + const wb = XLSX.read(data, { + type: 'binary' + }); + wb.SheetNames.forEach((sheetName) => { + result.push({ + sheetName: sheetName, + sheet: XLSX.utils.sheet_to_json(wb.Sheets[sheetName]) + }) + }); + }; + reader.readAsBinaryString(file.raw) + console.log(result) + return result; +} + +export function file2Xce(file){ + return new Promise(function (resolve, reject) { + const reader = new FileReader() + reader.onload = function (e) { + const data = e.target.result + this.wb = XLSX.read(data, { + type: 'binary' + }) + const result = [] + this.wb.SheetNames.forEach((sheetName) => { + result.push({ + sheetName: sheetName, + sheet: XLSX.utils.sheet_to_json(this.wb.Sheets[sheetName]) + }) + }) + resolve(result) + } + reader.readAsBinaryString(file.raw) + // reader.readAsBinaryString(file) // 传统input方法 + }) +} diff --git a/src/assets/fonts/DIN-Bold.otf b/src/assets/fonts/DIN-Bold.otf new file mode 100644 index 0000000..782e68e Binary files /dev/null and b/src/assets/fonts/DIN-Bold.otf differ diff --git a/src/assets/fonts/YouSheBiaoTiHei.ttf b/src/assets/fonts/YouSheBiaoTiHei.ttf new file mode 100644 index 0000000..3729151 Binary files /dev/null and b/src/assets/fonts/YouSheBiaoTiHei.ttf differ diff --git a/src/assets/fonts/fonts.css b/src/assets/fonts/fonts.css new file mode 100644 index 0000000..85122e5 --- /dev/null +++ b/src/assets/fonts/fonts.css @@ -0,0 +1,9 @@ +@font-face { + font-family: "YouSheBiaoTiHei"; + src: url("./YouSheBiaoTiHei.ttf") format("woff") +} +@font-face { + font-family: "DIN-Bold"; + src: url("./DIN-Bold.otf") format("woff") +} + diff --git a/src/assets/icons/svg/component.svg b/src/assets/icons/svg/component.svg index 29c3458..73c39c5 100644 --- a/src/assets/icons/svg/component.svg +++ b/src/assets/icons/svg/component.svg @@ -1 +1 @@ - \ No newline at end of file + \ No newline at end of file diff --git a/src/assets/icons/svg/exit-fullscreen.svg b/src/assets/icons/svg/exit-fullscreen.svg index 485c128..c188cf2 100644 --- a/src/assets/icons/svg/exit-fullscreen.svg +++ b/src/assets/icons/svg/exit-fullscreen.svg @@ -1 +1 @@ - \ No newline at end of file + \ No newline at end of file diff --git a/src/assets/icons/svg/fullscreen.svg b/src/assets/icons/svg/fullscreen.svg index 0e86b6f..3d3b592 100644 --- a/src/assets/icons/svg/fullscreen.svg +++ b/src/assets/icons/svg/fullscreen.svg @@ -1 +1 @@ - \ No newline at end of file + \ No newline at end of file diff --git a/src/assets/icons/svg/login_icon_eye.svg b/src/assets/icons/svg/login_icon_eye.svg new file mode 100644 index 0000000..9d6869d --- /dev/null +++ b/src/assets/icons/svg/login_icon_eye.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/src/assets/icons/svg/login_icon_hide.svg b/src/assets/icons/svg/login_icon_hide.svg new file mode 100644 index 0000000..cb48021 --- /dev/null +++ b/src/assets/icons/svg/login_icon_hide.svg @@ -0,0 +1,3 @@ + + + diff --git a/src/assets/icons/svg/login_icon_key.svg b/src/assets/icons/svg/login_icon_key.svg new file mode 100644 index 0000000..273e3c4 --- /dev/null +++ b/src/assets/icons/svg/login_icon_key.svg @@ -0,0 +1,3 @@ + + + diff --git a/src/assets/icons/svg/login_icon_user.svg b/src/assets/icons/svg/login_icon_user.svg new file mode 100644 index 0000000..b0b9e3f --- /dev/null +++ b/src/assets/icons/svg/login_icon_user.svg @@ -0,0 +1,3 @@ + + + diff --git a/src/assets/icons/svg/search.svg b/src/assets/icons/svg/search.svg index 84233dd..e98b826 100644 --- a/src/assets/icons/svg/search.svg +++ b/src/assets/icons/svg/search.svg @@ -1 +1 @@ - \ No newline at end of file + \ No newline at end of file diff --git a/src/assets/images/alluse1.png b/src/assets/images/alluse1.png new file mode 100644 index 0000000..d614781 Binary files /dev/null and b/src/assets/images/alluse1.png differ diff --git a/src/assets/images/alluse2.png b/src/assets/images/alluse2.png new file mode 100644 index 0000000..5b8cb0b Binary files /dev/null and b/src/assets/images/alluse2.png differ diff --git a/src/assets/images/alluse3.png b/src/assets/images/alluse3.png new file mode 100644 index 0000000..d5329b4 Binary files /dev/null and b/src/assets/images/alluse3.png differ diff --git a/src/assets/images/area-icon.png b/src/assets/images/area-icon.png new file mode 100644 index 0000000..61112f6 Binary files /dev/null and b/src/assets/images/area-icon.png differ diff --git a/src/assets/images/bigscreen.png b/src/assets/images/bigscreen.png new file mode 100644 index 0000000..4371704 Binary files /dev/null and b/src/assets/images/bigscreen.png differ diff --git a/src/assets/images/border-title1.png b/src/assets/images/border-title1.png new file mode 100644 index 0000000..f2a655f Binary files /dev/null and b/src/assets/images/border-title1.png differ diff --git a/src/assets/images/border-title2.png b/src/assets/images/border-title2.png new file mode 100644 index 0000000..44f8fa7 Binary files /dev/null and b/src/assets/images/border-title2.png differ diff --git a/src/assets/images/border-title3.png b/src/assets/images/border-title3.png new file mode 100644 index 0000000..78ffe10 Binary files /dev/null and b/src/assets/images/border-title3.png differ diff --git a/src/assets/images/container-bg.jpg b/src/assets/images/container-bg.jpg new file mode 100644 index 0000000..7f41934 Binary files /dev/null and b/src/assets/images/container-bg.jpg differ diff --git a/src/assets/images/gate-title.png b/src/assets/images/gate-title.png new file mode 100644 index 0000000..8206e8a Binary files /dev/null and b/src/assets/images/gate-title.png differ diff --git a/src/assets/images/gateway.png b/src/assets/images/gateway.png new file mode 100644 index 0000000..e9fe10e Binary files /dev/null and b/src/assets/images/gateway.png differ diff --git a/src/assets/images/icon_dianyuan.png b/src/assets/images/icon_dianyuan.png new file mode 100644 index 0000000..86c4bea Binary files /dev/null and b/src/assets/images/icon_dianyuan.png differ diff --git a/src/assets/images/icon_home.png b/src/assets/images/icon_home.png new file mode 100644 index 0000000..b649922 Binary files /dev/null and b/src/assets/images/icon_home.png differ diff --git a/src/assets/images/icon_time.png b/src/assets/images/icon_time.png new file mode 100644 index 0000000..7c84121 Binary files /dev/null and b/src/assets/images/icon_time.png differ diff --git a/src/assets/images/index_icon_gong.png b/src/assets/images/index_icon_gong.png new file mode 100644 index 0000000..d98f15f Binary files /dev/null and b/src/assets/images/index_icon_gong.png differ diff --git a/src/assets/images/index_icon_gong_pre.png b/src/assets/images/index_icon_gong_pre.png new file mode 100644 index 0000000..bbb4274 Binary files /dev/null and b/src/assets/images/index_icon_gong_pre.png differ diff --git a/src/assets/images/index_icon_jiankong.png b/src/assets/images/index_icon_jiankong.png new file mode 100644 index 0000000..349cc14 Binary files /dev/null and b/src/assets/images/index_icon_jiankong.png differ diff --git a/src/assets/images/index_icon_jiankong_pre.png b/src/assets/images/index_icon_jiankong_pre.png new file mode 100644 index 0000000..e600b83 Binary files /dev/null and b/src/assets/images/index_icon_jiankong_pre.png differ diff --git a/src/assets/images/index_icon_kongtiao.png b/src/assets/images/index_icon_kongtiao.png new file mode 100644 index 0000000..23a7e9c Binary files /dev/null and b/src/assets/images/index_icon_kongtiao.png differ diff --git a/src/assets/images/index_icon_kongtiao_pre.png b/src/assets/images/index_icon_kongtiao_pre.png new file mode 100644 index 0000000..9eae673 Binary files /dev/null and b/src/assets/images/index_icon_kongtiao_pre.png differ diff --git a/src/assets/images/index_icon_peidian.png b/src/assets/images/index_icon_peidian.png new file mode 100644 index 0000000..bd0ecc0 Binary files /dev/null and b/src/assets/images/index_icon_peidian.png differ diff --git a/src/assets/images/index_icon_peidian_pre.png b/src/assets/images/index_icon_peidian_pre.png new file mode 100644 index 0000000..da225c8 Binary files /dev/null and b/src/assets/images/index_icon_peidian_pre.png differ diff --git a/src/assets/images/index_icon_shuidian.png b/src/assets/images/index_icon_shuidian.png new file mode 100644 index 0000000..678c918 Binary files /dev/null and b/src/assets/images/index_icon_shuidian.png differ diff --git a/src/assets/images/index_icon_shuidian_pre.png b/src/assets/images/index_icon_shuidian_pre.png new file mode 100644 index 0000000..03624d5 Binary files /dev/null and b/src/assets/images/index_icon_shuidian_pre.png differ diff --git a/src/assets/images/index_icon_sushe.png b/src/assets/images/index_icon_sushe.png new file mode 100644 index 0000000..17464bb Binary files /dev/null and b/src/assets/images/index_icon_sushe.png differ diff --git a/src/assets/images/index_icon_sushe_pre.png b/src/assets/images/index_icon_sushe_pre.png new file mode 100644 index 0000000..32ef810 Binary files /dev/null and b/src/assets/images/index_icon_sushe_pre.png differ diff --git a/src/assets/images/index_icon_xiaofang.png b/src/assets/images/index_icon_xiaofang.png new file mode 100644 index 0000000..2d6dc33 Binary files /dev/null and b/src/assets/images/index_icon_xiaofang.png differ diff --git a/src/assets/images/index_icon_xiaofang_pre.png b/src/assets/images/index_icon_xiaofang_pre.png new file mode 100644 index 0000000..ffcb208 Binary files /dev/null and b/src/assets/images/index_icon_xiaofang_pre.png differ diff --git a/src/assets/images/index_icon_yunwei.png b/src/assets/images/index_icon_yunwei.png new file mode 100644 index 0000000..6e9e355 Binary files /dev/null and b/src/assets/images/index_icon_yunwei.png differ diff --git a/src/assets/images/index_icon_yunwei_pre.png b/src/assets/images/index_icon_yunwei_pre.png new file mode 100644 index 0000000..7d04254 Binary files /dev/null and b/src/assets/images/index_icon_yunwei_pre.png differ diff --git a/src/assets/images/index_icon_zhaoming.png b/src/assets/images/index_icon_zhaoming.png new file mode 100644 index 0000000..8043973 Binary files /dev/null and b/src/assets/images/index_icon_zhaoming.png differ diff --git a/src/assets/images/index_icon_zhaoming_pre.png b/src/assets/images/index_icon_zhaoming_pre.png new file mode 100644 index 0000000..3c77a39 Binary files /dev/null and b/src/assets/images/index_icon_zhaoming_pre.png differ diff --git a/src/assets/images/index_icon_zonghe.png b/src/assets/images/index_icon_zonghe.png new file mode 100644 index 0000000..c7f5965 Binary files /dev/null and b/src/assets/images/index_icon_zonghe.png differ diff --git a/src/assets/images/index_icon_zonghe_pre.png b/src/assets/images/index_icon_zonghe_pre.png new file mode 100644 index 0000000..fc8437b Binary files /dev/null and b/src/assets/images/index_icon_zonghe_pre.png differ diff --git a/src/assets/images/index_img_down.png b/src/assets/images/index_img_down.png new file mode 100644 index 0000000..68def72 Binary files /dev/null and b/src/assets/images/index_img_down.png differ diff --git a/src/assets/images/index_img_menu.png b/src/assets/images/index_img_menu.png new file mode 100644 index 0000000..e61d3ae Binary files /dev/null and b/src/assets/images/index_img_menu.png differ diff --git a/src/assets/images/index_img_menu_pre.png b/src/assets/images/index_img_menu_pre.png new file mode 100644 index 0000000..ad502fd Binary files /dev/null and b/src/assets/images/index_img_menu_pre.png differ diff --git a/src/assets/images/index_img_top.png b/src/assets/images/index_img_top.png new file mode 100644 index 0000000..001e547 Binary files /dev/null and b/src/assets/images/index_img_top.png differ diff --git a/src/assets/images/left-arrow.png b/src/assets/images/left-arrow.png new file mode 100644 index 0000000..cccca92 Binary files /dev/null and b/src/assets/images/left-arrow.png differ diff --git a/src/assets/images/login-background.png b/src/assets/images/login-background.png new file mode 100644 index 0000000..226932a Binary files /dev/null and b/src/assets/images/login-background.png differ diff --git a/src/assets/images/login_form.png b/src/assets/images/login_form.png new file mode 100644 index 0000000..265e9a1 Binary files /dev/null and b/src/assets/images/login_form.png differ diff --git a/src/assets/images/message-img1.png b/src/assets/images/message-img1.png new file mode 100644 index 0000000..6c44bef Binary files /dev/null and b/src/assets/images/message-img1.png differ diff --git a/src/assets/images/message-img2.png b/src/assets/images/message-img2.png new file mode 100644 index 0000000..1fbd0cc Binary files /dev/null and b/src/assets/images/message-img2.png differ diff --git a/src/assets/images/message-img3.png b/src/assets/images/message-img3.png new file mode 100644 index 0000000..5807f9b Binary files /dev/null and b/src/assets/images/message-img3.png differ diff --git a/src/assets/images/message-img4.png b/src/assets/images/message-img4.png new file mode 100644 index 0000000..e74a990 Binary files /dev/null and b/src/assets/images/message-img4.png differ diff --git a/src/assets/images/message-img5.png b/src/assets/images/message-img5.png new file mode 100644 index 0000000..a6525f0 Binary files /dev/null and b/src/assets/images/message-img5.png differ diff --git a/src/assets/images/message-img6.png b/src/assets/images/message-img6.png new file mode 100644 index 0000000..cbb6dd8 Binary files /dev/null and b/src/assets/images/message-img6.png differ diff --git a/src/assets/images/message-img7.png b/src/assets/images/message-img7.png new file mode 100644 index 0000000..165e694 Binary files /dev/null and b/src/assets/images/message-img7.png differ diff --git a/src/assets/images/message-img8.png b/src/assets/images/message-img8.png new file mode 100644 index 0000000..acb6e2b Binary files /dev/null and b/src/assets/images/message-img8.png differ diff --git a/src/assets/images/person-icon.png b/src/assets/images/person-icon.png new file mode 100644 index 0000000..2edc793 Binary files /dev/null and b/src/assets/images/person-icon.png differ diff --git a/src/assets/images/popup_img_jinggao.png b/src/assets/images/popup_img_jinggao.png new file mode 100644 index 0000000..2d9aefe Binary files /dev/null and b/src/assets/images/popup_img_jinggao.png differ diff --git a/src/assets/images/popup_img_shibai.png b/src/assets/images/popup_img_shibai.png new file mode 100644 index 0000000..caf79e1 Binary files /dev/null and b/src/assets/images/popup_img_shibai.png differ diff --git a/src/assets/images/popup_img_suss.png b/src/assets/images/popup_img_suss.png new file mode 100644 index 0000000..222d573 Binary files /dev/null and b/src/assets/images/popup_img_suss.png differ diff --git a/src/assets/images/popup_img_title.png b/src/assets/images/popup_img_title.png new file mode 100644 index 0000000..fb4fa4a Binary files /dev/null and b/src/assets/images/popup_img_title.png differ diff --git a/src/assets/images/right-arrow.png b/src/assets/images/right-arrow.png new file mode 100644 index 0000000..0477c66 Binary files /dev/null and b/src/assets/images/right-arrow.png differ diff --git a/src/assets/images/school-icon.png b/src/assets/images/school-icon.png new file mode 100644 index 0000000..f11110e Binary files /dev/null and b/src/assets/images/school-icon.png differ diff --git a/src/assets/images/screen_bg.png b/src/assets/images/screen_bg.png new file mode 100644 index 0000000..3ddabb0 Binary files /dev/null and b/src/assets/images/screen_bg.png differ diff --git a/src/assets/images/sidebar-bg.png b/src/assets/images/sidebar-bg.png new file mode 100644 index 0000000..ecc1188 Binary files /dev/null and b/src/assets/images/sidebar-bg.png differ diff --git a/src/assets/images/special-title-bg.png b/src/assets/images/special-title-bg.png new file mode 100644 index 0000000..e21eb2f Binary files /dev/null and b/src/assets/images/special-title-bg.png differ diff --git a/src/assets/images/time-icon.png b/src/assets/images/time-icon.png new file mode 100644 index 0000000..131875a Binary files /dev/null and b/src/assets/images/time-icon.png differ diff --git a/src/assets/images/top-one.png b/src/assets/images/top-one.png new file mode 100644 index 0000000..8701545 Binary files /dev/null and b/src/assets/images/top-one.png differ diff --git a/src/assets/images/top-three.png b/src/assets/images/top-three.png new file mode 100644 index 0000000..1d94b35 Binary files /dev/null and b/src/assets/images/top-three.png differ diff --git a/src/assets/images/top-two.png b/src/assets/images/top-two.png new file mode 100644 index 0000000..381bde9 Binary files /dev/null and b/src/assets/images/top-two.png differ diff --git a/src/assets/images/twoDot.png b/src/assets/images/twoDot.png new file mode 100644 index 0000000..489ba14 Binary files /dev/null and b/src/assets/images/twoDot.png differ diff --git a/src/assets/images/use_left.png b/src/assets/images/use_left.png new file mode 100644 index 0000000..a6ce52c Binary files /dev/null and b/src/assets/images/use_left.png differ diff --git a/src/assets/images/use_right.png b/src/assets/images/use_right.png new file mode 100644 index 0000000..00ecbb6 Binary files /dev/null and b/src/assets/images/use_right.png differ diff --git a/src/assets/images/组 3.png b/src/assets/images/组 3.png new file mode 100644 index 0000000..1c68b01 Binary files /dev/null and b/src/assets/images/组 3.png differ diff --git a/src/assets/styles/element-ui.scss b/src/assets/styles/element-ui.scss index 363092a..b09580b 100644 --- a/src/assets/styles/element-ui.scss +++ b/src/assets/styles/element-ui.scss @@ -3,6 +3,10 @@ .el-breadcrumb__inner, .el-breadcrumb__inner a { font-weight: 400 !important; + color: #c6c6c6; +} +.el-breadcrumb__separator { + color: #c6c6c6; } .el-upload { @@ -69,7 +73,7 @@ // dropdown .el-dropdown-menu { a { - display: block + display: block; } } @@ -89,4 +93,1246 @@ > .el-submenu__title .el-submenu__icon-arrow { display: none; +} +// 面包屑 +.el-breadcrumb__inner.is-link, +.el-breadcrumb__inner a { + color: #c6c6c6; +} +.el-breadcrumb__item:last-child .el-breadcrumb__inner, +.el-breadcrumb__item:last-child .el-breadcrumb__inner:hover, +.el-breadcrumb__item:last-child .el-breadcrumb__inner a, +.el-breadcrumb__item:last-child .el-breadcrumb__inner a:hover { + color: #00b4ff !important; +} +// el-select +.el-form-item__label { + line-height: 50px; + color: #ffffff; +} +// el-input +.el-input__inner { + background: #003059; + border: 1px solid #0163a8; + color: #fff; + box-shadow: inset 0 0 10px rgba(1, 99, 168, 0.5); /* 外部发光效果 */ +} +.el-input__inner::placeholder { + color: #6b8aa3; +} +.el-input__inner:hover { + border-color: #018fe8; +} +.el-input.is-active .el-input__inner, +.el-input__inner:focus { + border: solid 1px #018fe8; +} +.el-input.is-disabled .el-input__inner { + border-color: #018fe8 !important; +} + +.el-range-editor.is-active, +.el-range-editor.is-active:hover, +.el-select .el-input.is-focus .el-input__inner { + border: solid 1px #018fe8; +} + +.el-select .el-input__inner:focus { + border: solid 1px #018fe8; +} +.el-select:hover .el-input__inner { + border-color: #018fe8 !important; +} +// 日期 +.el-date-editor .el-range-input { + background-color: transparent; + color: #fff; +} +.el-date-editor .el-range-separator { + color: #fff; +} +.el-date-editor .el-range-input::placeholder { + color: #6b8aa3; +} +//所有的按钮el-button都需要添加class名为xxx-btn的div包裹，xxx是按钮type +// primary按钮 +.primary-btn::before, +.primary-btn::after, +.el-button--primary::before, +.el-button--primary::after { + box-sizing: border-box; /* 关键属性 */ +} +.primary-btn { + position: relative; + display: flex; + flex-direction: row; + align-items: center; + justify-content: center; + display: inline-block; + margin-right: 10px; +} +.primary-btn::before { + content: ""; + position: absolute; + top: 0px; + right: 0; + width: 5px; + height: 5px; + border-top: 2px solid #05a6f9; + border-right: 2px solid #05a6f9; + z-index: 99 !important; +} +.primary-btn::after { + content: ""; + position: absolute; + bottom: 0; + right: 0; + width: 5px; + height: 5px; + border-bottom: 2px solid #05a6f9; + border-right: 2px solid #05a6f9; +} +.el-button--primary, +.el-button--primary:focus { + background-image: linear-gradient( + 0deg, + rgba(25, 127, 194, 1) 0%, + rgba(8, 55, 102, 1) 100% + ), + linear-gradient(rgba(5, 217, 249, 1), rgba(5, 217, 249, 1)) !important; + background-blend-mode: normal, normal; + border-style: solid; + border-width: 2px; + border-image-source: linear-gradient( + 0deg, + rgba(3, 199, 255, 1) 0%, + rgba(10, 86, 150, 1) 100% + ); + border-image-slice: 1; + background-color: transparent !important; + border-color: none !important; + position: relative; +} +.el-button--primary:hover { + background-image: linear-gradient( + 0deg, + rgb(19, 153, 243) 0%, + rgb(4, 56, 107) 100% + ), + linear-gradient(rgba(5, 217, 249, 1), rgba(5, 217, 249, 1)) !important; + border-image-source: linear-gradient( + 0deg, + rgba(3, 199, 255, 1) 0%, + rgba(10, 86, 150, 1) 100% + ); +} +.el-button--primary::before { + content: ""; + position: absolute; + top: -2px; + left: -2px; + width: 5px; + height: 5px; + border-top: 2px solid #05a6f9; + border-left: 2px solid #05a6f9; +} +.el-button--primary::after { + content: ""; + position: absolute; + bottom: -2px; + left: -2px; + width: 5px; + height: 5px; + border-bottom: 2px solid #05a6f9; + border-left: 2px solid #05a6f9; +} +// success按钮 +.success-btn { + position: relative; + display: flex; + flex-direction: row; + align-items: center; + justify-content: center; + display: inline-block; + margin-right: 10px; +} +.success-btn::before { + content: ""; + position: absolute; + top: 0px; + right: 0; + width: 5px; + height: 5px; + border-top: 2px solid #057ef9; + border-right: 2px solid #057ef9; + z-index: 99 !important; +} +.success-btn::after { + content: ""; + position: absolute; + bottom: 0; + right: 0; + width: 5px; + height: 5px; + border-bottom: 2px solid #057ef9; + border-right: 2px solid #057ef9; +} +.el-button--success, +.el-button--success:focus { + background-image: linear-gradient(0deg, #1961c2 0%, #083766 100%), + linear-gradient(#05d9f9, #05d9f9) !important; + background-blend-mode: normal, normal; + border-style: solid; + border-width: 2px; + border-image-source: linear-gradient(0deg, #0397ff 0%, #0a4996 100%); + border-image-slice: 1; + background-color: transparent !important; + border-color: none !important; + position: relative; +} +.el-button--success:hover { + background-image: linear-gradient(0deg, #477ec7 0%, #083766 100%), + linear-gradient(#05d9f9, #05d9f9) !important; + border-image-source: linear-gradient(0deg, #0b96fa 0%, #0e4e9b 100%); +} +.el-button--success::before { + content: ""; + position: absolute; + top: -2px; + left: -2px; + width: 5px; + height: 5px; + border-top: 2px solid #057ef9; + border-left: 2px solid #057ef9; +} +.el-button--success::after { + content: ""; + position: absolute; + bottom: -2px; + left: -2px; + width: 5px; + height: 5px; + border-bottom: 2px solid #057ef9; + border-left: 2px solid #057ef9; +} +// info按钮 +.info-btn::before, +.info-btn::after, +.el-button--info::before, +.el-button--info::after { + box-sizing: border-box; /* 关键属性 */ +} +.info-btn { + position: relative; + display: flex; + flex-direction: row; + align-items: center; + justify-content: center; + display: inline-block; + margin-right: 10px; +} +.info-btn::before { + content: ""; + position: absolute; + top: 0px; + right: 0; + width: 5px; + height: 5px; + border-top: 2px solid #05d4f9; + border-right: 2px solid #05d4f9; + z-index: 99 !important; +} +.info-btn::after { + content: ""; + position: absolute; + bottom: 0; + right: 0; + width: 5px; + height: 5px; + border-bottom: 2px solid #05d4f9; + border-right: 2px solid #05d4f9; +} +.el-button--info, +.el-button--info:focus { + background-image: linear-gradient(0deg, #19a0c2 0%, #05385b 100%), + linear-gradient(#05d9f9, #05d9f9) !important; + background-blend-mode: normal, normal; + border-style: solid; + border-width: 2px; + border-image-source: linear-gradient(0deg, #03cdff 0%, #085c87 100%); + border-image-slice: 1; + background-color: transparent !important; + border-color: none !important; + position: relative; +} +.el-button--info:hover { + background-image: linear-gradient(0deg, #2daac9 0%, #084874 100%), + linear-gradient(#05d9f9, #05d9f9) !important; + border-image-source: linear-gradient(0deg, #03cdff 0%, #085c87 100%); +} +.el-button--info::before { + content: ""; + position: absolute; + top: -2px; + left: -2px; + width: 5px; + height: 5px; + border-top: 2px solid #05d4f9; + border-left: 2px solid #05d4f9; +} +.el-button--info::after { + content: ""; + position: absolute; + bottom: -2px; + left: -2px; + width: 5px; + height: 5px; + border-bottom: 2px solid #05d4f9; + border-left: 2px solid #05d4f9; +} +// warning按钮 +.warning-btn::before, +.warning-btn::after, +.el-button--warning::before, +.el-button--warning::after { + box-sizing: border-box; /* 关键属性 */ +} +.warning-btn { + position: relative; + display: flex; + flex-direction: row; + align-items: center; + justify-content: center; + display: inline-block; + margin-right: 10px; +} +.warning-btn::before { + content: ""; + position: absolute; + top: 0px; + right: 0; + width: 5px; + height: 5px; + border-top: 2px solid #f98705; + border-right: 2px solid #f98705; + z-index: 99 !important; +} +.warning-btn::after { + content: ""; + position: absolute; + bottom: 0; + right: 0; + width: 5px; + height: 5px; + border-bottom: 2px solid #f98705; + border-right: 2px solid #f98705; +} +.el-button--warning, +.el-button--warning:focus { + background-image: linear-gradient(0deg, #fd813a 0%, #af5704 100%), + linear-gradient(#ffb46d, #ffb46d) !important; + background-blend-mode: normal, normal; + border-style: solid; + border-width: 2px; + border-image-source: linear-gradient(0deg, #ff7403 0%, #af5704 100%); + border-image-slice: 1; + background-color: transparent !important; + border-color: none !important; + position: relative; +} +.el-button--warning:hover { + background-image: linear-gradient(0deg, #f7911e 0%, #bd620d 100%), + linear-gradient(#faa453, #faa453) !important; + border-image-source: linear-gradient(0deg, #f7911e 0%, #bd620d 100%); +} +.el-button--warning::before { + content: ""; + position: absolute; + top: -2px; + left: -2px; + width: 5px; + height: 5px; + border-top: 2px solid #dd6808; + border-left: 2px solid #dd6808; +} +.el-button--warning::after { + content: ""; + position: absolute; + bottom: -2px; + left: -2px; + width: 5px; + height: 5px; + border-bottom: 2px solid #dd6808; + border-left: 2px solid #dd6808; +} +// delete按钮 +.delete-btn::before, +.delete-btn::after, +.el-button--delete::before, +.el-button--delete::after { + box-sizing: border-box; /* 关键属性 */ +} +.delete-btn { + position: relative; + display: flex; + flex-direction: row; + align-items: center; + justify-content: center; + display: inline-block; + margin-right: 10px; +} +.delete-btn::before { + content: ""; + position: absolute; + top: 0px; + right: 0; + width: 5px; + height: 5px; + border-top: 2px solid #f76e45; + border-right: 2px solid #f76e45; + z-index: 99 !important; +} +.delete-btn::after { + content: ""; + position: absolute; + bottom: 0; + right: 0; + width: 5px; + height: 5px; + border-bottom: 2px solid #f76e45; + border-right: 2px solid #f76e45; +} +.el-button--delete, +.el-button--delete:focus { + color: #ffffff; + background-image: linear-gradient( + 0deg, + rgb(194, 87, 25) 0%, + rgb(102, 11, 8) 100% + ), + linear-gradient(rgb(248, 86, 22), rgba(248, 86, 22, 1)) !important; + background-blend-mode: normal, normal; + border-style: solid; + border-width: 2px; + border-image-source: linear-gradient( + 0deg, + rgb(241, 75, 9) 0%, + rgb(150, 43, 10) 100% + ); + border-image-slice: 1; + background-color: transparent !important; + border-color: none !important; + position: relative; +} +.el-button--delete:hover { + color: #ffffff; + background-image: linear-gradient( + 0deg, + rgb(243, 64, 19) 0%, + rgb(107, 16, 4) 100% + ), + linear-gradient(rgb(249, 94, 5), rgba(249, 94, 5, 1)) !important; + border-image-source: linear-gradient( + 0deg, + rgb(255, 95, 3) 0%, + rgb(150, 43, 10) 100% + ); +} +.el-button--delete::before { + content: ""; + position: absolute; + top: -2px; + left: -2px; + width: 5px; + height: 5px; + border-top: 2px solid #f92a05; + border-left: 2px solid #f92a05; +} +.el-button--delete::after { + content: ""; + position: absolute; + bottom: -2px; + left: -2px; + width: 5px; + height: 5px; + border-bottom: 2px solid #f92a05; + border-left: 2px solid #f92a05; +} +// cancel按钮 +.cancel-btn::before, +.cancel-btn::after, +.el-button--cancel::before, +.el-button--cancel::after { + box-sizing: border-box; /* 关键属性 */ +} +.cancel-btn { + position: relative; + display: flex; + flex-direction: row; + align-items: center; + justify-content: center; + display: inline-block; + margin-right: 10px; +} +.cancel-btn::before { + content: ""; + position: absolute; + top: 0px; + right: 0; + width: 5px; + height: 5px; + border-top: 2px solid #8092a1; + border-right: 2px solid #8092a1; + z-index: 99 !important; +} +.cancel-btn::after { + content: ""; + position: absolute; + bottom: 0; + right: 0; + width: 5px; + height: 5px; + border-bottom: 2px solid #8092a1; + border-right: 2px solid #8092a1; +} +.el-button--cancel, +.el-button--cancel:focus { + color: #ffffff; + background-image: linear-gradient( + 0deg, + rgba(49, 86, 111, 1) 0%, + rgba(8, 55, 102, 1) 100% + ), + linear-gradient(rgba(5, 217, 249, 1), rgba(5, 217, 249, 1)) !important; + background-blend-mode: normal, normal; + border-style: solid; + border-width: 2px; + border-image-source: linear-gradient( + 0deg, + rgba(145, 161, 171, 1) 0%, + rgba(84, 98, 110, 1) 100% + ); + border-image-slice: 1; + background-color: transparent !important; + border-color: none !important; + position: relative; +} +.el-button--cancel:hover { + color: #ffffff; + background-image: linear-gradient( + 0deg, + rgb(135, 167, 187) 0%, + rgb(19, 68, 117) 100% + ), + linear-gradient(rgba(5, 217, 249, 1), rgba(5, 217, 249, 1)) !important; + border-image-source: linear-gradient( + 0deg, + rgb(154, 164, 170) 0%, + rgb(84, 102, 117) 100% + ); +} +.el-button--cancel::before { + content: ""; + position: absolute; + top: -2px; + left: -2px; + width: 5px; + height: 5px; + border-top: 2px solid #8092a1; + border-left: 2px solid #8092a1; +} +.el-button--cancel::after { + content: ""; + position: absolute; + bottom: -2px; + left: -2px; + width: 5px; + height: 5px; + border-bottom: 2px solid #8092a1; + border-left: 2px solid #8092a1; +} +/* 下拉select默认样式 + 注意：此时一定要在 里添加 :popper-append-to-body="false" 属性； +// 若未加入 :popper-append-to-body="false" 属性，那么此时渲染后的 DOM 元素不在 #app 元素内部； +// 原因: el-select 里面的 select-popper 元素渲染后会脱离 #app ,因此使用深度选择器也无法定位该元素; */ + +/* .el-select-dropdown__wrap.el-scrollbar__wrap { + margin-bottom: 0 !important; + } */ +.el-select-dropdown .el-scrollbar .el-scrollbar__wrap { + overflow: scroll !important; +} + +/* // 设置下拉框的背景颜色及边框属性； */ +.el-select-dropdown { + /* // 若不将下拉框的背景颜色设置为：transparent，那么做不出来半透明的效果； + // 因为其最终的显示为：下拉框有一个背景颜色且下拉框的字体有一个背景颜色，重叠后的效果展示； */ + background-color: transparent; + border: 0; +} +.el-select-dropdown { + border: 1px solid #00477d; + background-color: #00477d; +} +.el-select-dropdown__item { + color: #a4b2af; +} +.el-select-dropdown__item.selected { + background-color: #00b4ff; + color: #ffffff; +} +.el-select-dropdown__item.hover { + background-color: #00b4ff; + color: #ffffff; +} + +.el-select-dropdown__empty { + background-color: #00477d; +} + +.el-popper[x-placement^="top"] { + margin-top: 10px; +} +/* 下拉框小三角形颜色 */ +.el-popper[x-placement^="top"] .popper__arrow::after { + border-top-color: #00477d; +} + +.el-popper[x-placement^="top"] .popper__arrow { + border-top-color: #00477d; +} + +.el-popper[x-placement^="bottom"] .popper__arrow::after { + border-bottom-color: #00477d; +} + +.el-popper[x-placement^="bottom"] .popper__arrow { + border-bottom-color: #00477d; +} +// 解决下拉框会有白边的情况 +.el-select-dropdown__wrap, +.el-scrollbar__wrap { + margin-bottom: -10px !important; + margin-right: -10px !important; +} + +// 时间 +.el-picker-panel { + background-color: #00477d; + color: #fff; + border: 1px solid #00477d; +} +.el-date-table th, +.el-picker-panel__icon-btn, +.el-date-picker__header-label { + color: #fff; +} +.el-date-table td.today span, +.el-date-table td.available:hover, +.el-picker-panel__icon-btn:hover { + color: #00b4ff; +} +.el-date-table td.current:not(.disabled) span { + background-color: #00b4ff; +} +.el-date-table th { + border-bottom: 1px solid #949597; +} +.el-date-table td.next-month, +.el-date-table td.prev-month { + color: #989a9e; +} +.el-picker-panel *[slot="sidebar"], +.el-picker-panel__sidebar { + background-color: transparent !important; + color: #ffffff !important; + border-right: 1px solid #949597; +} +.el-date-range-picker__content.is-left { + border-right: 1px solid #949597; +} +.el-picker-panel__shortcut { + color: #ffffff !important; +} +.el-date-table td.in-range div { + background-color: #49789c; +} +.el-date-table td.in-range div:hover { + background-color: #335977; +} +.el-month-table td .cell, +.el-year-table td .cell { + color: #ffffff; +} +.el-date-picker__header--bordered { + border-bottom: 1px solid #949597; +} +.el-picker-panel__footer { + background-color: #00477d; + border-top: 1px solid #949597; +} +.el-button.is-disabled.is-plain, +.el-button.is-disabled.is-plain:hover, +.el-button.is-disabled.is-plain:focus, +.el-picker-panel__footer .el-button:nth-child(2) { + border-color: none !important; + color: #ffffff !important; + background-image: linear-gradient(0deg, #197fc2 0%, #083766 100%), + linear-gradient(#05d9f9, #05d9f9); + background-blend-mode: normal, normal; + border-style: solid; + border-width: 2px; + border-image-source: linear-gradient(0deg, #03c7ff 0%, #0a5696 100%); + border-image-slice: 1; + background-color: transparent !important; +} +.el-input.is-disabled .el-input__inner { + background-color: transparent !important; + color: #ffffff !important; +} +.el-date-range-picker__time-header > .el-icon-arrow-right { + color: #c6c6c6 !important; +} +.el-date-range-picker__time-header { + border-bottom: 1px solid #949597; +} +.el-time-panel { + background-color: #043961; + border: solid 1px #043961; +} +.el-time-spinner__item.active:not(.disabled) { + color: #ffffff; +} +.el-time-spinner__item { + color: #989a9e; +} +.el-time-panel__footer .cancel { + color: #ffffff; +} +.el-time-spinner__item:hover:not(.disabled):not(.active) { + background: #197fc2 !important; + color: #ffffff !important; +} +.el-month-table td.in-range div:hover, +.el-month-table td.in-range div { + background-color: #49789c; +} +// 表格 +.el-table th.el-table__cell.is-leaf, +.el-table td.el-table__cell { + border-bottom: 1px solid #00264f !important; +} +.el-table tr { + background-color: rgba(0, 71, 125, 0.2); +} +.el-table .el-table__header-wrapper th, +.el-table .el-table__fixed-header-wrapper th { + background-color: #00477d !important; + color: #b5dfff !important; +} +.el-table { + color: #ffffff; + background-color: transparent !important; +} +// 斑马线 +.el-table--striped .el-table__body tr.el-table__row--striped td.el-table__cell { + background-color: rgba(0, 71, 125, 0.4); +} +.el-table::before, +.el-table--group::after, +.el-table--border::after { + background-color: transparent !important; +} +// hover +.el-table--enable-row-hover .el-table__body tr:hover > td.el-table__cell { + background-color: rgba(0, 71, 125, 0.4); +} +.el-table .cell { + text-align: center; +} +.el-table__body tr.hover-row > td.el-table__cell { + background-color: rgba(0, 71, 125, 0.4) !important; +} +.el-table__fixed::before, +.el-table__fixed-right::before { + display: none; +} +.el-table__fixed-right-patch { + border-bottom: 1px solid #00477d !important; + background-color: #00477d !important; +} +.el-table__fixed, +.el-table__fixed-right { + background-color: transparent !important; +} +// el-table垂直水平滚动条右下角交汇处背景颜色 = 滚动条背景颜色 +.el-table--scrollable-y .el-table__body-wrapper::-webkit-scrollbar-corner { + background-color: #002249 !important; +} + +.el-table__header-wrapper tbody td.el-table__cell, +.el-table__footer-wrapper tbody td.el-table__cell { + background-color: #00477d !important; + color: #ffffff !important; +} +.el-table .el-table__cell.gutter { + background-color: #00477d !important; +} +.el-table__footer-wrapper td.el-table__cell { + border-top: 1px solid #00477d !important; +} +// el-tree +.el-tree { + background: transparent !important; + color: #ffffff; +} +.el-tree-node__content:hover, +.el-upload-list__item:hover, +.el-tree-node:focus > .el-tree-node__content { + background-color: transparent !important; +} +.el-checkbox__inner { + border: 1px solid #057ccf !important; + background-color: transparent !important; +} +.el-checkbox__input.is-checked .el-checkbox__inner { + background-color: #057ccf !important; +} +.el-tree-node__expand-icon { + color: #ffffff; +} +// 分页 +.el-pagination__total, +.el-pagination__jump { + color: #a4b2af; +} +.el-pagination button:disabled, +.el-pagination .btn-prev, +.el-pagination .btn-next { + background-color: #00366b; + color: #ffffff; +} +.el-pager li { + background-color: #00366b; + color: #ffffff; +} +.el-pager li.btn-quicknext, +.el-pager li.btn-quickprev { + color: #ffffff; +} +// tabs +.el-tabs__item { + height: 48px; + background-image: linear-gradient(180deg, #527491 0%, #375c7b 100%), + linear-gradient(#0882ff, #0882ff); + background-blend-mode: normal, normal; + border-radius: 6px 6px 0px 0px; + line-height: 48px; + text-align: center; + font-family: SourceHanSansCN-Regular; + font-size: 18px; + color: #c3cbd4; + margin-right: 6px; +} +.el-tabs__item.is-active { + height: 48px; + background-image: linear-gradient(0deg, #0077cb 0%, #11a8ff 100%), + linear-gradient(#0882ff, #0882ff); + background-blend-mode: normal, normal; + border-radius: 6px 6px 0px 0px; + font-family: SourceHanSansCN-Regular; + font-size: 18px; + line-height: 48px; + color: #ffffff; + text-align: center; +} +.el-tabs--top .el-tabs__item.is-top:nth-child(2), +.el-tabs--top .el-tabs__item.is-bottom:nth-child(2), +.el-tabs--bottom .el-tabs__item.is-top:nth-child(2), +.el-tabs--bottom .el-tabs__item.is-bottom:nth-child(2) { + padding-left: 20px !important; +} +.el-tabs--top .el-tabs__item.is-top:last-child, +.el-tabs--top .el-tabs__item.is-bottom:last-child, +.el-tabs--bottom .el-tabs__item.is-top:last-child, +.el-tabs--bottom .el-tabs__item.is-bottom:last-child { + padding-right: 20px !important; +} +.el-tabs__active-bar { + display: none !important; +} +.el-tabs__nav-wrap::after { + background-color: #00386d; +} + +.el-dropdown-menu { + background-color: #00477d !important; + border: 1px solid #00477d; +} +.el-dropdown-menu__item { + color: #ffffff !important; +} +.el-dropdown-menu__item--divided:before { + height: 0 !important; +} +.el-dropdown-menu__item--divided { + border-top: 1px solid #adaeaf; +} +.el-dropdown-menu__item:not(.is-disabled):hover, +.el-dropdown-menu__item:focus { + background-color: #057ccf; + color: #ffffff; +} +.el-icon-caret-bottom { + color: #c6c6c6 !important; +} +// 滚动条 + +::-webkit-scrollbar { + width: 10px !important; +} + +::-webkit-scrollbar-track { + background: #002249 !important; +} + +::-webkit-scrollbar-thumb { + width: 10px; + background-color: rgb(21, 50, 104) !important; + border-radius: 10px !important; +} +::-webkit-scrollbar-thumb:hover { + background: rgb(38, 75, 143) !important; +} +.el-loading-mask { + background-color: rgba(21, 53, 90, 0.5); +} + +// 弹框 +.el-dialog { + background: linear-gradient( + 0deg, + rgba(0, 58, 112, 0.9), + rgba(0, 42, 81, 0.9) + ) !important; + border-radius: 10px; + border: 2px solid #005fbf; +} +.el-dialog__header { + display: flex !important; + flex-direction: row; + align-items: center; + justify-content: center; +} +.el-dialog__title { + text-align: center; + width: 284px; + height: 45px; + background-image: url(../images/popup_img_title.png); + background-size: 100% 100%; + background-repeat: no-repeat; + display: flex !important; + flex-direction: row; + align-items: center; + justify-content: center; + font-family: SourceHanSansCN-Bold; + font-size: 20px; + line-height: 25px; + color: #ffffff; +} +.el-dialog__headerbtn { + top: 32px !important; +} +.el-dialog__headerbtn .el-dialog__close { + font-size: 25px !important; + color: #ffffff !important; +} +.el-dialog__headerbtn:focus .el-dialog__close, +.el-dialog__headerbtn:hover .el-dialog__close { + color: #018fe8 !important; +} +.dialog-footer .el-button:nth-child(1) { + background-image: linear-gradient(0deg, #31566f 0%, #083766 100%), + linear-gradient(#05d9f9, #05d9f9) !important; + background-blend-mode: normal, normal; + border-style: solid; + border-width: 2px; + border-image-source: linear-gradient(0deg, #91a1ab 0%, #54626e 100%); + border-image-slice: 1; + color: #ffffff; +} +.dialog-footer .el-button:nth-child(1):hover, +.dialog-footer .el-button:nth-child(1):focus, +.dialog-footer .el-button:nth-child(1):active { + background-image: linear-gradient(0deg, #436c88 0%, #123f6d 100%), + linear-gradient(#06c0dd, #06c0dd) !important; + border-image-source: linear-gradient(0deg, #a5b7c2 0%, #687988 100%); +} +.dialog-footer .el-button:nth-child(1)::before, +.dialog-footer .el-button:nth-child(2)::before, +.dialog-footer .el-button:nth-child(1)::after, +.dialog-footer .el-button:nth-child(2)::after { + display: none !important; +} +.el-message-box { + background: linear-gradient( + 0deg, + rgb(7, 74, 136), + rgb(12, 50, 87) + ) !important; + border-radius: 5px; + border: 2px solid #005fbf; +} +.el-message-box__title { + color: #ffffff; +} +.el-message-box__message { + color: #cecece !important; +} +.el-message-box__headerbtn:focus .el-message-box__close, +.el-message-box__headerbtn:hover .el-message-box__close { + color: #018fe8 !important; +} +.el-message-box__headerbtn .el-message-box__close { + color: #ffffff !important; +} +.el-message-box__btns .el-button:nth-child(1)::before, +.el-message-box__btns .el-button:nth-child(2)::before, +.el-message-box__btns .el-button:nth-child(1)::after, +.el-message-box__btns .el-button:nth-child(2)::after { + display: none !important; +} +.el-message-box__btns .el-button:nth-child(1) { + background-image: linear-gradient(0deg, #31566f 0%, #083766 100%), + linear-gradient(#05d9f9, #05d9f9); + background-blend-mode: normal, normal; + border-style: solid; + border-width: 2px; + border-image-source: linear-gradient(0deg, #91a1ab 0%, #54626e 100%); + border-image-slice: 1; + color: #ffffff; +} +.el-message-box__btns .el-button:nth-child(1):hover, +.el-message-box__btns .el-button:nth-child(1):focus, +.el-message-box__btns .el-button:nth-child(1):active { + background-image: linear-gradient(0deg, #436c88 0%, #123f6d 100%), + linear-gradient(#06c0dd, #06c0dd); + border-image-source: linear-gradient(0deg, #a5b7c2 0%, #687988 100%); +} +.el-checkbox { + color: #ffffff; +} +/* 修改消息框的背景颜色 */ +.el-message { + background-image: linear-gradient( + 0deg, + rgba(0, 58, 112, 0.9) 0%, + rgba(0, 50, 97, 0.9) 35%, + rgba(0, 42, 81, 0.9) 100% + ), + linear-gradient(#053766, #053766); + border-radius: 10px; + border: solid 2px #005fbf; + top: 40% !important; + display: flex; + flex-direction: column; + align-items: center; + padding: 25px 15px 25px 20px !important; +} + +/* 修改消息文本颜色 */ +.el-message__content { + font-family: SourceHanSansCN-Bold; + font-size: 20px; + font-weight: normal; + font-stretch: normal; + line-height: 22px; + letter-spacing: 0px; + color: #ffffff !important; +} + +/* 修改成功消息的图标 */ +.el-message .el-icon-success { + content: ""; /* 自定义图标，替换为实际图标路径 */ + background-image: url(../images/popup_img_suss.png); + background-repeat: no-repeat; + background-size: 100% 100%; + display: inline-block; + width: 90px; + height: 90px; + margin-right: 0px !important; + margin-bottom: 16px; + vertical-align: middle; +} +.el-icon-success:before, +.el-icon-error:before, +.el-icon-warning::before { + content: none !important; +} +.el-message__closeBtn { + top: 25px; + color: #ffffff; + font-size: 20px; +} +.el-message .el-icon-error { + content: ""; /* 自定义图标，替换为实际图标路径 */ + background-image: url(../images/popup_img_shibai.png); + background-repeat: no-repeat; + background-size: 100% 100%; + display: inline-block; + width: 90px; + height: 90px; + margin-right: 0px !important; + margin-bottom: 16px; + vertical-align: middle; +} +.el-message .el-icon-warning { + content: ""; /* 自定义图标，替换为实际图标路径 */ + background-image: url(../images/popup_img_jinggao.png); + background-repeat: no-repeat; + background-size: 100% 100%; + display: inline-block; + width: 90px; + height: 90px; + margin-right: 0px !important; + margin-bottom: 16px; + vertical-align: middle; +} +.el-upload-list__item-name { + color: #ffffff; +} +.el-cascader__dropdown { + background: #00477d !important; + border: 1px solid #00477d; + color: #a4b2af !important; +} +.el-cascader-node__label { + // color: #a4b2af; +} +.el-cascader-node:not(.is-disabled):hover, +.el-cascader-node:not(.is-disabled):focus, +.el-cascader-node:not(.is-disabled):hover, +.el-cascader-node:not(.is-disabled):focus { + background-color: #00b4ff !important; + color: #ffffff !important; +} +.el-cascader-node { + color: #a4b2af !important; +} +.el-cascader-node.in-active-path, +.el-cascader-node.is-selectable.in-checked-path, +.el-cascader-node.is-active { + color: #00b4ff !important; +} +.el-cascader-menu { + border-right: 1px solid #949597; +} +.el-card { + background-image: linear-gradient( + 0deg, + rgba(0, 58, 112, 0.9) 0%, + rgba(0, 50, 97, 0.9) 35%, + rgba(0, 42, 81, 0.9) 100% + ), + linear-gradient(#053766, #053766); + background-blend-mode: normal, normal; + border-radius: 10px; + border: solid 2px #005fbf; + color: #ffffff; +} +.el-card__header { + border-bottom: 1px solid #7f92b8; +} +.splitpanes.default-theme .splitpanes__splitter { + background-color: rgba(83, 190, 252, 0.1) !important; +} +.default-theme.splitpanes--vertical > .splitpanes__splitter, +.default-theme .splitpanes--vertical > .splitpanes__splitter { + border-left: 1px solid #555d66 !important; +} +.splitpanes.default-theme .splitpanes__splitter:before, +.splitpanes.default-theme .splitpanes__splitter:after { + background-color: #002249 !important; +} +.splitpanes.default-theme .splitpanes__splitter:hover:before, +.splitpanes.default-theme .splitpanes__splitter:hover:after { + background-color: #000000 !important; +} +.vue-treeselect__control { + // background: transparent !important; + background: #003059 !important; + border: 1px solid #0163a8 !important; + box-shadow: inset 0 0 10px rgba(1, 99, 168, 0.5); /* 外部发光效果 */ +} + +.vue-treeselect__menu { + border: 1px solid #00477d !important; + color: #fff !important; +} +.vue-treeselect--open-below .vue-treeselect__menu { + border-top-color: #00477d; + color: #fff !important; + background-color: #00477d !important; +} +.vue-treeselect__menu { + border: 1px solid #00477d !important; + background: transparent; +} +.vue-treeselect--single .vue-treeselect__option--selected:hover { + background-color: #00b4ff !important; +} +.vue-treeselect--single .vue-treeselect__option--selected { + background-color: #00b4ff !important; + + font-weight: 600; +} +.vue-treeselect__option--highlight { + background: #00b4ff !important; +} +.vue-treeselect div, +.vue-treeselect span { + color: #ffffff !important; +} +.el-tag.el-tag--info { + background-color: #54718b; + border-color: #54718b; + color: #ffffff !important; +} +.el-textarea__inner { + background-color: #003059 !important; + border: 1px solid #0163a8 !important; + box-shadow: inset 0 0 10px rgba(1, 99, 168, 0.5); /* 外部发光效果 */ + color: #ffffff !important; +} +.el-textarea__inner::placeholder { + color: #6b8aa3 !important; +} +.el-select-dropdown.is-multiple .el-select-dropdown__item.selected { + background-color: #00b4ff !important; + color: #ffffff !important; +} +.el-select-dropdown.is-multiple .el-select-dropdown__item.selected { + color: #ffffff; +} +.el-radio { + color: #ffffff !important; +} +.tree-border{ + border: 1px solid #0163a8 !important; + box-shadow: inset 0 0 10px rgba(1, 99, 168, 0.5); /* 外部发光效果 */ +} +.el-input-number__increase, .el-input-number__decrease{ + background: #b0ccdc; +} +.el-table .el-dropdown, .el-icon-arrow-down{ + color: #606266; +} +.ql-editor p, .ql-editor ol, .ql-editor pre, .ql-editor blockquote, .ql-editor h1, .ql-editor h2, .ql-editor h3, .ql-editor h4, .ql-editor h5, .ql-editor h6{ + color: #ffffff !important; +} +.ql-snow.ql-toolbar button svg, .ql-snow .ql-toolbar button svg{ + color: #ffffff !important; +} +.el-dialog__body { + color: #ffffff; } \ No newline at end of file diff --git a/src/assets/styles/index.scss b/src/assets/styles/index.scss index 2f3b9ef..bbc4014 100644 --- a/src/assets/styles/index.scss +++ b/src/assets/styles/index.scss @@ -1,16 +1,20 @@ -@import './variables.scss'; -@import './mixin.scss'; -@import './transition.scss'; -@import './element-ui.scss'; -@import './sidebar.scss'; -@import './btn.scss'; +@import "./variables.scss"; +@import "./mixin.scss"; +@import "./transition.scss"; +@import "./element-ui.scss"; +@import "./sidebar.scss"; +@import "./btn.scss"; body { height: 100%; + font-size: 14px; -moz-osx-font-smoothing: grayscale; -webkit-font-smoothing: antialiased; text-rendering: optimizeLegibility; - font-family: Helvetica Neue, Helvetica, PingFang SC, Hiragino Sans GB, Microsoft YaHei, Arial, sans-serif; + font-family: Helvetica Neue, Helvetica, PingFang SC, Hiragino Sans GB, + Microsoft YaHei, Arial, sans-serif; + overflow-x: hidden; + min-width: 320px; } label { @@ -104,7 +108,8 @@ aside { display: block; line-height: 32px; font-size: 16px; - font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen, Ubuntu, Cantarell, "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif; + font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen, + Ubuntu, Cantarell, "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif; color: #2c3e50; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; @@ -120,9 +125,6 @@ aside { } //main-container全局样式 -.app-container { - padding: 20px; -} .components-container { margin: 30px 50px; @@ -131,10 +133,11 @@ aside { .pagination-container { margin-top: 30px; + background: transparent !important; } .text-center { - text-align: center + text-align: center; } .sub-navbar { @@ -145,7 +148,13 @@ aside { text-align: right; padding-right: 20px; transition: 600ms ease position; - background: linear-gradient(90deg, rgba(32, 182, 249, 1) 0%, rgba(32, 182, 249, 1) 0%, rgba(33, 120, 241, 1) 100%, rgba(33, 120, 241, 1) 100%); + background: linear-gradient( + 90deg, + rgba(32, 182, 249, 1) 0%, + rgba(32, 182, 249, 1) 0%, + rgba(33, 120, 241, 1) 100%, + rgba(33, 120, 241, 1) 100% + ); .subtitle { font-size: 20px; @@ -163,7 +172,7 @@ aside { .link-type, .link-type:focus { - color: #337ab7; + color: #3773e0; cursor: pointer; &:hover { @@ -180,3 +189,259 @@ aside { margin-bottom: 10px; } } + +.choice { + display: flex; + flex-direction: row; + overflow: hidden; + cursor: pointer; + margin-left: 42px; + cursor: pointer; + .mr20 { + font-size: 16px; + color: #a5b6cb; + width: 48px; + text-align: center; + background-color: #366797; + box-shadow: inset 0px 1px 0px 0px rgba(255, 255, 255, 0.4); + border-radius: 14px; + margin-right: 10px; + text-shadow: none !important; + } +} +.timeStyle { + color: #ffffff !important; + background-image: linear-gradient(0deg, #0076c1 0%, #068be0 59%, #0ba0ff 100%), + linear-gradient(#006eea, #006eea); + background-blend-mode: normal, normal; + box-shadow: inset 0px 1px 0px 0px rgba(255, 255, 255, 0.4); + border-radius: 14px; +} + + + + +.special-div { + display: flex; + flex-direction: column; + background-image: linear-gradient( + 0deg, + rgba(0, 68, 126, 0.4) 0%, + rgba(0, 68, 126, 0.08) 100% + ); + border-style: solid; + border-width: 1px; + border-image-source: linear-gradient(0deg, #0088f0 0%, #0088f0 100%); + border-image-slice: 1; + border: 1px solid transparent; /* 设置边框宽度和透明背景 */ + border-image: linear-gradient(0deg, #00447e 0%, rgba(0, 68, 126, 0.2) 100%) 1; /* 使用渐变作为边框图片 */ + .special-top { + background-image: linear-gradient( + 90deg, + rgba(0, 121, 206, 0.5) 0%, + rgba(0, 121, 206, 0.1) 100% + ); + padding: 4px 26px 4px 0px; + position: relative; + min-height: 37px; + } + .special-top::after { + content: ""; + width: 100%; + height: 1px; + background-image: linear-gradient( + 90deg, + #ffffff 0%, + rgba(255, 255, 255, 0.2) 99% + ); + opacity: 0.5; + position: absolute; + top: -3px; + left: 0; + } + .special-top::before { + content: ""; + width: 100%; + height: 1px; + background-image: linear-gradient( + 90deg, + #ffffff 0%, + rgba(255, 255, 255, 0.2) 99% + ); + opacity: 0.5; + position: absolute; + bottom: -3px; + left: 0; + } + .special-title { + width: 100%; + padding-left: 36px; + font-family: Source Han Sans CN; + font-weight: 400; + font-size: 20px; + color: #ffffff; + line-height: 23px; + background-image: url(../images/special-title-bg.png); + background-repeat: no-repeat; + background-size: 140px 35px; + background-position: 0px -3px; + text-shadow: 0 0 5px rgba(255, 255, 255, 0.8); + position: relative; + display: flex; + flex-direction: row; + justify-content: space-between; + align-items: center; + } + .special-title::before { + content: ""; + width: 34px; + height: 13px; + // background-color: ; + background-image: url(../images/twoDot.png); + background-repeat: no-repeat; + background-size: 100% 100%; + position: absolute; + right: 0px; + } +} +// 排名需要样式 +.rank-circle { + display: inline-block; + width: 32px; + height: 32px; + background-image: linear-gradient(-41deg, #7f8ca2 0%, #e5eeff 100%), + linear-gradient(#02336a, #02336a); + background-blend-mode: normal, normal; + box-shadow: inset 1px 1px 0px 0px rgba(255, 255, 255, 0.8); + font-family: SourceHanSansCN-Bold; + font-weight: bold; + color: #273855; + line-height: 32px; + text-align: center; + border-radius: 50%; +} + +.rank-circle.top-1 { + background-image: url("../images/top-one.png"); + background-size: 30px 32px; + background-repeat: no-repeat; + border-radius: 0%; + box-shadow: none; +} + +.rank-circle.top-2 { + background-image: url("../images/top-two.png"); + background-size: 30px 32px; + background-repeat: no-repeat; + border-radius: 0%; + box-shadow: none; +} + +.rank-circle.top-3 { + background-image: url("../images/top-three.png"); + background-size: 30px 32px; + background-repeat: no-repeat; + border-radius: 0%; + box-shadow: none; +} + +.pagination { + width: 100%; + text-align: right; + margin-top: 15px; +} +.table-btn { + display: flex; + flex-direction: row; + align-items: center; + justify-content: center; + flex-wrap: nowrap; +} +// 弹框内容超出高度滚动 +.dialog-content { + max-height: 500px; /* 设置最大高度，可根据实际情况调整 */ + overflow-y: auto; /* 当内容超出最大高度时，显示垂直滚动条 */ +} +.intput-text { + color: #ffffff; + margin: 15px 0; + .down { + color: #0088f0; + cursor: pointer; + font-weight: bold; + } + .down:hover, + .down:focus, + .down:active { + text-decoration: underline; + } +} +// 弹框里的原生table +table { + border-collapse: collapse; + border-spacing: 0; +} +table tr { + height: 45px !important; + color: #ffffff; +} +table th { + color: #ffffff; +} +.el-dialog td { + height: 45px; + width: 280px; + white-space: normal; +} +// 打印的样式 +@media print { + @page { + /* margin: 0; */ + /* 纵向 */ + /* size: portrait; */ + /* 边距 上右下左 */ + margin: 2cm 1cm 3cm 1cm; + // size: A4 portrait; + // margin: 3.7cm 2.6cm 3.5cm; + /* 国家标准公文页边距 GB/T 9704-2012 */ + } + + /* 给需要换行的元素设置word-wrap属性 */ + table td, + p, + div { + word-wrap: break-word; + color: #000000; + } + table thead th { + color: #000000 !important; + font-weight: bold !important; + } +} +.report-detail { + display: flex; + flex-direction: row; + font-size: 14px; + justify-content: space-between; + flex-wrap: nowrap; + width: 40%; + color: #ffffff; +} + +.btn-condition { + width: 100%; + display: flex; + flex-direction: row; + align-items: center; + justify-content: space-between; + .condition-left, + .condition-right { + display: flex; + flex-direction: row; + align-items: flex-start; + justify-content: center; + .el-form-item { + text-align: center; + } + } +} diff --git a/src/assets/styles/ruoyi.scss b/src/assets/styles/ruoyi.scss index 7e44513..d3b1578 100644 --- a/src/assets/styles/ruoyi.scss +++ b/src/assets/styles/ruoyi.scss @@ -48,7 +48,7 @@ margin-bottom: 10px; } .ml10 { - margin-left: 10px; + margin-left: 10px; } .mt20 { @@ -63,17 +63,28 @@ margin-bottom: 20px; } .ml20 { - margin-left: 20px; -} - -.h1, .h2, .h3, .h4, .h5, .h6, h1, h2, h3, h4, h5, h6 { + margin-left: 20px; +} + +.h1, +.h2, +.h3, +.h4, +.h5, +.h6, +h1, +h2, +h3, +h4, +h5, +h6 { font-family: inherit; font-weight: 500; line-height: 1.1; color: inherit; } -.el-message-box__status + .el-message-box__message{ +.el-message-box__status + .el-message-box__message { word-break: break-word; } @@ -89,7 +100,8 @@ } .el-table { - .el-table__header-wrapper, .el-table__fixed-header-wrapper { + .el-table__header-wrapper, + .el-table__fixed-header-wrapper { th { word-break: break-word; background-color: #f8f8f9; @@ -109,10 +121,10 @@ /** 表单布局 **/ .form-header { font-size: 15px; - color: #6379bb; - border-bottom: 1px solid #ddd; + color: #ffffff; + border-bottom: 1px solid #7f92b8; margin: 8px 10px 25px 10px; - padding-bottom: 5px + padding-bottom: 5px; } /** 表格布局 **/ @@ -128,7 +140,7 @@ .tree-border { margin-top: 5px; border: 1px solid #e5e6e7; - background: #FFFFFF none; + background: #ffffff none; border-radius: 4px; } @@ -153,12 +165,14 @@ } /** 表格更多操作下拉样式 */ -.el-table .el-dropdown-link,.el-table .el-dropdown-selfdefine { - cursor: pointer; - margin-left: 5px; +.el-table .el-dropdown-link, +.el-table .el-dropdown-selfdefine { + cursor: pointer; + margin-left: 5px; } -.el-table .el-dropdown, .el-icon-arrow-down { +.el-table .el-dropdown, +.el-icon-arrow-down { font-size: 12px; } @@ -180,8 +194,8 @@ } .list-group-item { - border-bottom: 1px solid #e7eaec; - border-top: 1px solid #e7eaec; + border-bottom: 1px solid #7f92b8; + border-top: 1px solid #7f92b8; margin-bottom: -1px; padding: 11px 0px; font-size: 13px; @@ -209,22 +223,22 @@ /* button color */ .el-button--cyan.is-active, .el-button--cyan:active { - background: #20B2AA; - border-color: #20B2AA; - color: #FFFFFF; + background: #20b2aa; + border-color: #20b2aa; + color: #ffffff; } .el-button--cyan:focus, .el-button--cyan:hover { - background: #48D1CC; - border-color: #48D1CC; - color: #FFFFFF; + background: #48d1cc; + border-color: #48d1cc; + color: #ffffff; } .el-button--cyan { - background-color: #20B2AA; - border-color: #20B2AA; - color: #FFFFFF; + background-color: #20b2aa; + border-color: #20b2aa; + color: #ffffff; } /* text color */ @@ -280,7 +294,7 @@ /* 拖拽列样式 */ .sortable-ghost { - opacity: .8; + opacity: 0.8; color: #fff !important; background: #42b983 !important; } @@ -292,5 +306,5 @@ /* 分割面板样式 */ .splitpanes.default-theme .splitpanes__pane { - background-color: #fff!important; + background-color: transparent !important; } diff --git a/src/assets/styles/sidebar.scss b/src/assets/styles/sidebar.scss index abe5b63..c7a910c 100644 --- a/src/assets/styles/sidebar.scss +++ b/src/assets/styles/sidebar.scss @@ -5,6 +5,7 @@ transition: margin-left .28s; margin-left: $base-sidebar-width; position: relative; + overflow-x: hidden; } .sidebarHide { @@ -15,8 +16,11 @@ -webkit-transition: width .28s; transition: width 0.28s; width: $base-sidebar-width !important; - background-color: $base-menu-background; height: 100%; + // background-color: $base-menu-background; + background-image: url("../images/sidebar-bg.png"); + background-size: 100% 100%; + background-repeat: no-repeat; position: fixed; font-size: 0px; top: 0; @@ -68,29 +72,43 @@ border: none; height: 100%; width: 100% !important; + background-color: transparent!important; } .el-menu-item, .el-submenu__title { overflow: hidden !important; text-overflow: ellipsis !important; white-space: nowrap !important; + background-color: #00477d !important; + } + .el-menu-item.is-active{ + color: #ffffff !important; + font-weight: bold; + background-image: linear-gradient(90deg, #0078cc 0%, #00477d 100%) !important; } // menu hover .submenu-title-noDropdown, .el-submenu__title { &:hover { - background-color: rgba(0, 0, 0, 0.06) !important; + background-image: linear-gradient(90deg, + #0078cc 0%, + #00477d 100%) !important; + color: #ffffff !important; } } & .theme-dark .is-active > .el-submenu__title { color: $base-menu-color-active !important; + // background-image: linear-gradient(90deg, + // #0078cc 0%, + // #00477d 100%) !important; } & .nest-menu .el-submenu>.el-submenu__title, & .el-submenu .el-menu-item { min-width: $base-sidebar-width !important; + padding: 0 35px !important; &:hover { background-color: rgba(0, 0, 0, 0.06) !important; @@ -99,13 +117,16 @@ & .theme-dark .nest-menu .el-submenu>.el-submenu__title, & .theme-dark .el-submenu .el-menu-item { - background-color: $base-sub-menu-background !important; &:hover { - background-color: $base-sub-menu-hover !important; + color: #ffffff !important; + background-color: #0077ca !important; } } } + .el-submenu .el-menu-item { + background-color: #002c58 !important; + } .hideSidebar { .sidebar-container { @@ -192,17 +213,32 @@ // when menu collapsed .el-menu--vertical { + background-color: #002c58 !important; + .el-submenu{ + background-color: #002c58 !important; + } &>.el-menu { + background-color: #002c58 !important; .svg-icon { margin-right: 16px; } } - + .nest-menu .el-menu-item { + background-color: #002c58 !important; + } + // 修改侧边栏伸缩的时候，el-menu-item的样式 .nest-menu .el-submenu>.el-submenu__title, .el-menu-item { &:hover { // you can use $subMenuHover - background-color: rgba(0, 0, 0, 0.06) !important; + color: #ffffff !important; + background-color: #0077ca !important; + } + &:active { + // you can use $subMenuHover + color: #ffffff !important; + font-weight: bold; + background-color: #0077ca !important; } } diff --git a/src/assets/styles/variables.scss b/src/assets/styles/variables.scss index 34484d4..aeb0aff 100644 --- a/src/assets/styles/variables.scss +++ b/src/assets/styles/variables.scss @@ -36,7 +36,7 @@ $base-sub-menu-background:#000c17; $base-sub-menu-hover:#001528; */ -$base-sidebar-width: 200px; +$base-sidebar-width: 232px; // the :export directive is the magic sauce for webpack // https://www.bluematador.com/blog/how-to-share-variables-between-js-and-sass diff --git a/src/components/Breadcrumb/index.vue b/src/components/Breadcrumb/index.vue index 080595a..222be5b 100644 --- a/src/components/Breadcrumb/index.vue +++ b/src/components/Breadcrumb/index.vue @@ -96,7 +96,6 @@ export default { line-height: 50px; margin-left: 8px; .no-redirect { - color: #97a8be; cursor: text; } } diff --git a/src/components/Hamburger/index.vue b/src/components/Hamburger/index.vue index 368b002..076ac8f 100644 --- a/src/components/Hamburger/index.vue +++ b/src/components/Hamburger/index.vue @@ -8,7 +8,7 @@ width="64" height="64" > - + @@ -36,9 +36,13 @@ export default { vertical-align: middle; width: 20px; height: 20px; + color: #fff !important; } .hamburger.is-active { transform: rotate(180deg); } +.svg-path { + fill: white; +} diff --git a/src/components/RuoYi/Doc/index.vue b/src/components/RuoYi/Doc/index.vue deleted file mode 100644 index 75fa864..0000000 --- a/src/components/RuoYi/Doc/index.vue +++ /dev/null @@ -1,21 +0,0 @@ - - - \ No newline at end of file diff --git a/src/components/RuoYi/Git/index.vue b/src/components/RuoYi/Git/index.vue deleted file mode 100644 index bdafbae..0000000 --- a/src/components/RuoYi/Git/index.vue +++ /dev/null @@ -1,21 +0,0 @@ - - - \ No newline at end of file diff --git a/src/components/SizeSelect/index.vue b/src/components/SizeSelect/index.vue deleted file mode 100644 index 069b5de..0000000 --- a/src/components/SizeSelect/index.vue +++ /dev/null @@ -1,56 +0,0 @@ - - - diff --git a/src/components/TopNav/index.vue b/src/components/TopNav/index.vue index 75e2bb6..e27a12f 100644 --- a/src/components/TopNav/index.vue +++ b/src/components/TopNav/index.vue @@ -96,8 +96,8 @@ export default { let activePath = path; if (path !== undefined && path.lastIndexOf("/") > 0 && hideList.indexOf(path) === -1) { const tmpPath = path.substring(1, path.length); - activePath = "/" + tmpPath.substring(0, tmpPath.indexOf("/")); if (!this.$route.meta.link) { + activePath = "/" + tmpPath.substring(0, tmpPath.indexOf("/")); this.$store.dispatch('app/toggleSideBarHide', false); } } else if(!this.$route.children) { diff --git a/src/directive/index.js b/src/directive/index.js index b9b07da..d179608 100644 --- a/src/directive/index.js +++ b/src/directive/index.js @@ -6,6 +6,7 @@ import dialogDragHeight from './dialog/dragHeight' import clipboard from './module/clipboard' const install = function(Vue) { + // 注册一个全局自定义指令 指令名,指令对象 Vue.directive('hasRole', hasRole) Vue.directive('hasPermi', hasPermi) Vue.directive('clipboard', clipboard) diff --git a/src/directive/permission/hasPermi.js b/src/directive/permission/hasPermi.js index 7101e3e..cd49be5 100644 --- a/src/directive/permission/hasPermi.js +++ b/src/directive/permission/hasPermi.js @@ -5,19 +5,32 @@ import store from '@/store' +// 暴露指令对象 export default { + // ==== 指令对象的钩子函数，省略 ==== +// inserted ，被绑定元素插入父节点时调用 (仅保证父节点存在，但不一定已被插入文档中)。 +// ==== 指令对象的钩子函数参数，省略 ==== +// el ：指令所绑定的元素，可以用来直接操作 DOM +// binding 一个对象，包括： + // name: 指令名，不包括 v- 前缀 + // value: 指令的绑定值，这里是['system:user:add'] + // oldValue: 指令绑定的前一个值，仅在 update 和 componentUpdated 钩子中使用（无论值是否改变都可用） inserted(el, binding, vnode) { const { value } = binding - const all_permission = "*:*:*"; + const all_permission = "*:*:*"; // 特殊权限标识 + // store + // && 两边是Boolean时，两个都为 true 运算结果为 true + // && 求值时，如果它们都是真值，则返回最后一个操作数的值，如果有假值，返回第一个假值 const permissions = store.getters && store.getters.permissions - + // 权限标识存在且为不为空的数组 if (value && value instanceof Array && value.length > 0) { const permissionFlag = value - + // 遍历 store.getters.permissions ， + // 是否存在： 当前角色有特殊权限 或 自定义指令绑定值数组中元素存在当前登录角色所拥有的某个权限标识 const hasPermissions = permissions.some(permission => { return all_permission === permission || permissionFlag.includes(permission) }) - + // 如果匹配不上，需要把该节点（button）从父节点删除 if (!hasPermissions) { el.parentNode && el.parentNode.removeChild(el) } diff --git a/src/layout/components/AppMain.vue b/src/layout/components/AppMain.vue index 66b33bf..122a9ca 100644 --- a/src/layout/components/AppMain.vue +++ b/src/layout/components/AppMain.vue @@ -10,50 +10,59 @@ diff --git a/src/layout/components/Navbar.vue b/src/layout/components/Navbar.vue index 466cd98..6a9f861 100644 --- a/src/layout/components/Navbar.vue +++ b/src/layout/components/Navbar.vue @@ -8,21 +8,7 @@
@@ -34,9 +20,9 @@ 个人中心 - + 退出登录 @@ -52,10 +38,7 @@ import Breadcrumb from '@/components/Breadcrumb' import TopNav from '@/components/TopNav' import Hamburger from '@/components/Hamburger' import Screenfull from '@/components/Screenfull' -import SizeSelect from '@/components/SizeSelect' import Search from '@/components/HeaderSearch' -import RuoYiGit from '@/components/RuoYi/Git' -import RuoYiDoc from '@/components/RuoYi/Doc' export default { components: { @@ -63,10 +46,7 @@ export default { TopNav, Hamburger, Screenfull, - SizeSelect, Search, - RuoYiGit, - RuoYiDoc }, computed: { ...mapGetters([ @@ -115,8 +95,16 @@ export default { height: 50px; overflow: hidden; position: relative; - background: #fff; - box-shadow: 0 1px 4px rgba(0,21,41,.08); + background-image: linear-gradient(0deg, + #002c5e 0%, + #0069b2 100%), + linear-gradient( + #002c5e, + #002c5e); + background-blend-mode: normal, + normal; + box-shadow: inset 0px -1px 0px 0px + rgba(255, 255, 255, 0.1); .hamburger-container { line-height: 46px; @@ -125,6 +113,10 @@ export default { cursor: pointer; transition: background .3s; -webkit-tap-highlight-color:transparent; + display: flex; + flex-direction: column; + align-items: center; + justify-content: center; &:hover { background: rgba(0, 0, 0, .025) @@ -149,6 +141,10 @@ export default { float: right; height: 100%; line-height: 50px; + display: flex; + flex-direction: row; + align-items: center; + justify-content: center; &:focus { outline: none; diff --git a/src/layout/components/Sidebar/Logo.vue b/src/layout/components/Sidebar/Logo.vue index 2774cc8..6a978db 100644 --- a/src/layout/components/Sidebar/Logo.vue +++ b/src/layout/components/Sidebar/Logo.vue @@ -1,11 +1,11 @@