diff --git a/App.vue b/App.vue index 07dac14..5cc77d3 100644 --- a/App.vue +++ b/App.vue @@ -28,6 +28,8 @@ onHide(() => { \ No newline at end of file diff --git a/components/Calender/example.vue b/components/Calender/example.vue new file mode 100644 index 0000000..d120867 --- /dev/null +++ b/components/Calender/example.vue @@ -0,0 +1,253 @@ + + + + + \ No newline at end of file diff --git a/components/Calender/images/日期-价格弹窗.png b/components/Calender/images/日期-价格弹窗.png new file mode 100644 index 0000000..543d484 Binary files /dev/null and b/components/Calender/images/日期-价格弹窗.png differ diff --git a/components/Calender/index.vue b/components/Calender/index.vue new file mode 100644 index 0000000..b95225c --- /dev/null +++ b/components/Calender/index.vue @@ -0,0 +1,423 @@ + + + + + \ No newline at end of file diff --git a/components/Calender/styles/index.scss b/components/Calender/styles/index.scss new file mode 100644 index 0000000..bba01e7 --- /dev/null +++ b/components/Calender/styles/index.scss @@ -0,0 +1,265 @@ +// 颜色系统 +$primary-color: #1890ff; +$primary-light: #e6f7ff; +$primary-dark: #0050b3; + +// 中性色 +$text-primary: #262626; +$text-secondary: #8c8c8c; +$text-disabled: #bfbfbf; +$background-white: #ffffff; +$background-gray: #f5f5f5; +$border-color: #d9d9d9; + +// 状态色 +$success-color: #52c41a; +$warning-color: #faad14; +$error-color: #ff4d4f; + +// 尺寸规范 +$modal-max-height: 80vh; +$modal-border-radius: 12px; +$modal-padding: 12px; + +// 日期格子尺寸 +$date-cell-size: 40px; +$date-cell-gap: 4px; +$date-cell-border-radius: 6px; + +// 字体大小 +$font-size-title: 18px; +$font-size-subtitle: 14px; +$font-size-date: 16px; +$font-size-price: 12px; +$font-size-label: 10px; + +// uni-popup会自动处理遮罩层和定位，这里移除相关样式 + +// 弹窗主体 +.calendar-popup { + position: relative; + width: 100%; + background-color: $background-white; + border-radius: $modal-border-radius; + overflow: hidden; +} + +// 头部区域 +.calendar-header { + display: flex; + align-items: flex-start; + justify-content: space-between; + padding: $modal-padding; + border-bottom: 1px solid $border-color; + background-color: $background-white; +} + +.header-content { + flex: 1; + display: flex; + flex-direction: column; + gap: 4px; +} + +.header-title { + font-size: $font-size-title; + font-weight: 600; + color: $text-primary; + line-height: 1.4; +} + +.header-subtitle { + font-size: $font-size-subtitle; + color: $text-secondary; + line-height: 1.4; +} + +.header-close { + display: flex; + align-items: center; + justify-content: center; + width: 32px; + height: 32px; + border-radius: 50%; + transition: background-color 0.2s; + + &:active { + background-color: $background-gray; + } +} + +// 周标题行 - 固定显示 +.week-header { + display: flex; + padding: 16px $modal-padding 8px; + background-color: $background-white; + border-bottom: 1px solid #eeeeee; +} + +// 日历主体区域 +.calendar-body { + padding: 8px $modal-padding $modal-padding; + max-height: calc(#{$modal-max-height} - 140px); + overflow-y: auto; + -webkit-overflow-scrolling: touch; + + &::-webkit-scrollbar { + display: none; + } +} + +.week-day { + flex: 1; + text-align: center; + font-size: $font-size-subtitle; + color: $text-secondary; + font-weight: 500; + line-height: 1.4; +} + +// 全年容器 +.year-container { + display: flex; + flex-direction: column; + gap: 32px; +} + +// 月份区域 +.month-section { + display: flex; + flex-direction: column; +} + +.month-title { + font-size: $font-size-title; + font-weight: 600; + color: $text-primary; + text-align: center; + margin-bottom: 16px; + margin-top: 8px; + line-height: 1.4; +} + +// 日期网格 +.date-grid { + display: grid; + grid-template-columns: repeat(7, 1fr); + gap: $date-cell-gap; +} + +// 日期格子基础样式 +.date-cell { + position: relative; + width: $date-cell-size; + height: $date-cell-size; + display: flex; + flex-direction: column; + align-items: center; + justify-content: space-between; + padding: 2px; + border-radius: $date-cell-border-radius; + transition: all 0.2s ease; + cursor: pointer; +} + +// 空白格子 +.date-cell-empty { + background-color: transparent; + cursor: default; +} + +// 有内容的格子 +.date-cell-content { + background-color: $background-white; + border: 1px solid transparent; + + &:hover { + background-color: $background-gray; + } + + &:active { + transform: scale(0.95); + } +} + +// 禁用状态 +.date-cell-disabled { + background-color: $background-gray !important; + color: $text-disabled !important; + cursor: not-allowed !important; + + .date-number, + .date-price { + color: $text-disabled !important; + } + + &:hover { + background-color: $background-gray !important; + transform: none !important; + } +} + +// 选中状态 +.date-cell-selected { + background-color: $primary-color !important; + border-color: $primary-color !important; + + .date-number, + .date-price, + .date-label { + color: $background-white !important; + } + + &:hover { + background-color: $primary-dark !important; + } +} + +// 范围内状态 +.date-cell-in-range { + background-color: $primary-light !important; + border-color: $primary-light !important; + + .date-number { + color: $primary-color !important; + } + + .date-price { + color: $primary-dark !important; + } +} + +// 日期数字 +.date-number { + font-size: $font-size-date; + font-weight: 500; + color: $text-primary; + line-height: 1; + flex: 1; + display: flex; + align-items: center; + justify-content: center; +} + +// 价格文字 +.date-price { + font-size: $font-size-price; + color: $text-secondary; + line-height: 1; + font-weight: 400; + text-align: center; + min-height: 14px; +} + +// 自定义标签 +.date-label { + font-size: $font-size-label; + color: $primary-color; + padding: 1px 4px; + border-radius: 2px; + line-height: 1; + white-space: nowrap; + font-weight: 500; + text-align: center; + min-height: 12px; +} diff --git a/components/Calender/year-demo.vue b/components/Calender/year-demo.vue new file mode 100644 index 0000000..ccdaf02 --- /dev/null +++ b/components/Calender/year-demo.vue @@ -0,0 +1,269 @@ + + + + + \ No newline at end of file diff --git a/components/Qrcode/index.vue b/components/Qrcode/index.vue new file mode 100644 index 0000000..cdb9c25 --- /dev/null +++ b/components/Qrcode/index.vue @@ -0,0 +1,271 @@ + + + + + diff --git a/components/Qrcode/qrcode.js b/components/Qrcode/qrcode.js new file mode 100644 index 0000000..d1a71f1 --- /dev/null +++ b/components/Qrcode/qrcode.js @@ -0,0 +1,1201 @@ +let QRCode = {}; +(function () { + /** + * 获取单个字符的utf8编码 + * unicode BMP平面约65535个字符 + * @param {num} code + * return {array} + */ + function unicodeFormat8(code) { + // 1 byte + var c0, c1, c2; + if (code < 128) { + return [code]; + // 2 bytes + } else if (code < 2048) { + c0 = 192 + (code >> 6); + c1 = 128 + (code & 63); + return [c0, c1]; + // 3 bytes + } else { + c0 = 224 + (code >> 12); + c1 = 128 + (code >> 6 & 63); + c2 = 128 + (code & 63); + return [c0, c1, c2]; + } + } + /** + * 获取字符串的utf8编码字节串 + * @param {string} string + * @return {array} + */ + function getUTF8Bytes(string) { + var utf8codes = []; + for (var i = 0; i < string.length; i++) { + var code = string.charCodeAt(i); + var utf8 = unicodeFormat8(code); + for (var j = 0; j < utf8.length; j++) { + utf8codes.push(utf8[j]); + } + } + return utf8codes; + } + /** + * 二维码算法实现 + * @param {string} data 要编码的信息字符串 + * @param {num} errorCorrectLevel 纠错等级 + */ + function QRCodeAlg(data, errorCorrectLevel) { + this.typeNumber = -1; //版本 + this.errorCorrectLevel = errorCorrectLevel; + this.modules = null; //二维矩阵，存放最终结果 + this.moduleCount = 0; //矩阵大小 + this.dataCache = null; //数据缓存 + this.rsBlocks = null; //版本数据信息 + this.totalDataCount = -1; //可使用的数据量 + this.data = data; + this.utf8bytes = getUTF8Bytes(data); + this.make(); + } + QRCodeAlg.prototype = { + constructor: QRCodeAlg, + /** + * 获取二维码矩阵大小 + * @return {num} 矩阵大小 + */ + getModuleCount: function () { + return this.moduleCount; + }, + /** + * 编码 + */ + make: function () { + this.getRightType(); + this.dataCache = this.createData(); + this.createQrcode(); + }, + /** + * 设置二位矩阵功能图形 + * @param {bool} test 表示是否在寻找最好掩膜阶段 + * @param {num} maskPattern 掩膜的版本 + */ + makeImpl: function (maskPattern) { + this.moduleCount = this.typeNumber * 4 + 17; + this.modules = new Array(this.moduleCount); + for (var row = 0; row < this.moduleCount; row++) { + this.modules[row] = new Array(this.moduleCount); + } + this.setupPositionProbePattern(0, 0); + this.setupPositionProbePattern(this.moduleCount - 7, 0); + this.setupPositionProbePattern(0, this.moduleCount - 7); + this.setupPositionAdjustPattern(); + this.setupTimingPattern(); + this.setupTypeInfo(true, maskPattern); + if (this.typeNumber >= 7) { + this.setupTypeNumber(true); + } + this.mapData(this.dataCache, maskPattern); + }, + /** + * 设置二维码的位置探测图形 + * @param {num} row 探测图形的中心横坐标 + * @param {num} col 探测图形的中心纵坐标 + */ + setupPositionProbePattern: function (row, col) { + for (var r = -1; r <= 7; r++) { + if (row + r <= -1 || this.moduleCount <= row + r) continue; + for (var c = -1; c <= 7; c++) { + if (col + c <= -1 || this.moduleCount <= col + c) continue; + if ((0 <= r && r <= 6 && (c == 0 || c == 6)) || (0 <= c && c <= 6 && (r == 0 || r == 6)) || (2 <= r && r <= 4 && 2 <= c && c <= 4)) { + this.modules[row + r][col + c] = true; + } else { + this.modules[row + r][col + c] = false; + } + } + } + }, + /** + * 创建二维码 + * @return {[type]} [description] + */ + createQrcode: function () { + var minLostPoint = 0; + var pattern = 0; + var bestModules = null; + for (var i = 0; i < 8; i++) { + this.makeImpl(i); + var lostPoint = QRUtil.getLostPoint(this); + if (i == 0 || minLostPoint > lostPoint) { + minLostPoint = lostPoint; + pattern = i; + bestModules = this.modules; + } + } + this.modules = bestModules; + this.setupTypeInfo(false, pattern); + if (this.typeNumber >= 7) { + this.setupTypeNumber(false); + } + }, + /** + * 设置定位图形 + * @return {[type]} [description] + */ + setupTimingPattern: function () { + for (var r = 8; r < this.moduleCount - 8; r++) { + if (this.modules[r][6] != null) { + continue; + } + this.modules[r][6] = (r % 2 == 0); + if (this.modules[6][r] != null) { + continue; + } + this.modules[6][r] = (r % 2 == 0); + } + }, + /** + * 设置矫正图形 + * @return {[type]} [description] + */ + setupPositionAdjustPattern: function () { + var pos = QRUtil.getPatternPosition(this.typeNumber); + for (var i = 0; i < pos.length; i++) { + for (var j = 0; j < pos.length; j++) { + var row = pos[i]; + var col = pos[j]; + if (this.modules[row][col] != null) { + continue; + } + for (var r = -2; r <= 2; r++) { + for (var c = -2; c <= 2; c++) { + if (r == -2 || r == 2 || c == -2 || c == 2 || (r == 0 && c == 0)) { + this.modules[row + r][col + c] = true; + } else { + this.modules[row + r][col + c] = false; + } + } + } + } + } + }, + /** + * 设置版本信息（7以上版本才有） + * @param {bool} test 是否处于判断最佳掩膜阶段 + * @return {[type]} [description] + */ + setupTypeNumber: function (test) { + var bits = QRUtil.getBCHTypeNumber(this.typeNumber); + for (var i = 0; i < 18; i++) { + var mod = (!test && ((bits >> i) & 1) == 1); + this.modules[Math.floor(i / 3)][i % 3 + this.moduleCount - 8 - 3] = mod; + this.modules[i % 3 + this.moduleCount - 8 - 3][Math.floor(i / 3)] = mod; + } + }, + /** + * 设置格式信息（纠错等级和掩膜版本） + * @param {bool} test + * @param {num} maskPattern 掩膜版本 + * @return {} + */ + setupTypeInfo: function (test, maskPattern) { + var data = (QRErrorCorrectLevel[this.errorCorrectLevel] << 3) | maskPattern; + var bits = QRUtil.getBCHTypeInfo(data); + // vertical + for (var i = 0; i < 15; i++) { + var mod = (!test && ((bits >> i) & 1) == 1); + if (i < 6) { + this.modules[i][8] = mod; + } else if (i < 8) { + this.modules[i + 1][8] = mod; + } else { + this.modules[this.moduleCount - 15 + i][8] = mod; + } + // horizontal + var mod = (!test && ((bits >> i) & 1) == 1); + if (i < 8) { + this.modules[8][this.moduleCount - i - 1] = mod; + } else if (i < 9) { + this.modules[8][15 - i - 1 + 1] = mod; + } else { + this.modules[8][15 - i - 1] = mod; + } + } + // fixed module + this.modules[this.moduleCount - 8][8] = (!test); + }, + /** + * 数据编码 + * @return {[type]} [description] + */ + createData: function () { + var buffer = new QRBitBuffer(); + var lengthBits = this.typeNumber > 9 ? 16 : 8; + buffer.put(4, 4); //添加模式 + buffer.put(this.utf8bytes.length, lengthBits); + for (var i = 0, l = this.utf8bytes.length; i < l; i++) { + buffer.put(this.utf8bytes[i], 8); + } + if (buffer.length + 4 <= this.totalDataCount * 8) { + buffer.put(0, 4); + } + // padding + while (buffer.length % 8 != 0) { + buffer.putBit(false); + } + // padding + while (true) { + if (buffer.length >= this.totalDataCount * 8) { + break; + } + buffer.put(QRCodeAlg.PAD0, 8); + if (buffer.length >= this.totalDataCount * 8) { + break; + } + buffer.put(QRCodeAlg.PAD1, 8); + } + return this.createBytes(buffer); + }, + /** + * 纠错码编码 + * @param {buffer} buffer 数据编码 + * @return {[type]} + */ + createBytes: function (buffer) { + var offset = 0; + var maxDcCount = 0; + var maxEcCount = 0; + var length = this.rsBlock.length / 3; + var rsBlocks = new Array(); + for (var i = 0; i < length; i++) { + var count = this.rsBlock[i * 3 + 0]; + var totalCount = this.rsBlock[i * 3 + 1]; + var dataCount = this.rsBlock[i * 3 + 2]; + for (var j = 0; j < count; j++) { + rsBlocks.push([dataCount, totalCount]); + } + } + var dcdata = new Array(rsBlocks.length); + var ecdata = new Array(rsBlocks.length); + for (var r = 0; r < rsBlocks.length; r++) { + var dcCount = rsBlocks[r][0]; + var ecCount = rsBlocks[r][1] - dcCount; + maxDcCount = Math.max(maxDcCount, dcCount); + maxEcCount = Math.max(maxEcCount, ecCount); + dcdata[r] = new Array(dcCount); + for (var i = 0; i < dcdata[r].length; i++) { + dcdata[r][i] = 0xff & buffer.buffer[i + offset]; + } + offset += dcCount; + var rsPoly = QRUtil.getErrorCorrectPolynomial(ecCount); + var rawPoly = new QRPolynomial(dcdata[r], rsPoly.getLength() - 1); + var modPoly = rawPoly.mod(rsPoly); + ecdata[r] = new Array(rsPoly.getLength() - 1); + for (var i = 0; i < ecdata[r].length; i++) { + var modIndex = i + modPoly.getLength() - ecdata[r].length; + ecdata[r][i] = (modIndex >= 0) ? modPoly.get(modIndex) : 0; + } + } + var data = new Array(this.totalDataCount); + var index = 0; + for (var i = 0; i < maxDcCount; i++) { + for (var r = 0; r < rsBlocks.length; r++) { + if (i < dcdata[r].length) { + data[index++] = dcdata[r][i]; + } + } + } + for (var i = 0; i < maxEcCount; i++) { + for (var r = 0; r < rsBlocks.length; r++) { + if (i < ecdata[r].length) { + data[index++] = ecdata[r][i]; + } + } + } + return data; + + }, + /** + * 布置模块，构建最终信息 + * @param {} data + * @param {} maskPattern + * @return {} + */ + mapData: function (data, maskPattern) { + var inc = -1; + var row = this.moduleCount - 1; + var bitIndex = 7; + var byteIndex = 0; + for (var col = this.moduleCount - 1; col > 0; col -= 2) { + if (col == 6) col--; + while (true) { + for (var c = 0; c < 2; c++) { + if (this.modules[row][col - c] == null) { + var dark = false; + if (byteIndex < data.length) { + dark = (((data[byteIndex] >>> bitIndex) & 1) == 1); + } + var mask = QRUtil.getMask(maskPattern, row, col - c); + if (mask) { + dark = !dark; + } + this.modules[row][col - c] = dark; + bitIndex--; + if (bitIndex == -1) { + byteIndex++; + bitIndex = 7; + } + } + } + row += inc; + if (row < 0 || this.moduleCount <= row) { + row -= inc; + inc = -inc; + break; + } + } + } + } + }; + /** + * 填充字段 + */ + QRCodeAlg.PAD0 = 0xEC; + QRCodeAlg.PAD1 = 0x11; + //--------------------------------------------------------------------- + // 纠错等级对应的编码 + //--------------------------------------------------------------------- + var QRErrorCorrectLevel = [1, 0, 3, 2]; + //--------------------------------------------------------------------- + // 掩膜版本 + //--------------------------------------------------------------------- + var QRMaskPattern = { + PATTERN000: 0, + PATTERN001: 1, + PATTERN010: 2, + PATTERN011: 3, + PATTERN100: 4, + PATTERN101: 5, + PATTERN110: 6, + PATTERN111: 7 + }; + //--------------------------------------------------------------------- + // 工具类 + //--------------------------------------------------------------------- + var QRUtil = { + /* + 每个版本矫正图形的位置 + */ + PATTERN_POSITION_TABLE: [ + [], + [6, 18], + [6, 22], + [6, 26], + [6, 30], + [6, 34], + [6, 22, 38], + [6, 24, 42], + [6, 26, 46], + [6, 28, 50], + [6, 30, 54], + [6, 32, 58], + [6, 34, 62], + [6, 26, 46, 66], + [6, 26, 48, 70], + [6, 26, 50, 74], + [6, 30, 54, 78], + [6, 30, 56, 82], + [6, 30, 58, 86], + [6, 34, 62, 90], + [6, 28, 50, 72, 94], + [6, 26, 50, 74, 98], + [6, 30, 54, 78, 102], + [6, 28, 54, 80, 106], + [6, 32, 58, 84, 110], + [6, 30, 58, 86, 114], + [6, 34, 62, 90, 118], + [6, 26, 50, 74, 98, 122], + [6, 30, 54, 78, 102, 126], + [6, 26, 52, 78, 104, 130], + [6, 30, 56, 82, 108, 134], + [6, 34, 60, 86, 112, 138], + [6, 30, 58, 86, 114, 142], + [6, 34, 62, 90, 118, 146], + [6, 30, 54, 78, 102, 126, 150], + [6, 24, 50, 76, 102, 128, 154], + [6, 28, 54, 80, 106, 132, 158], + [6, 32, 58, 84, 110, 136, 162], + [6, 26, 54, 82, 110, 138, 166], + [6, 30, 58, 86, 114, 142, 170] + ], + G15: (1 << 10) | (1 << 8) | (1 << 5) | (1 << 4) | (1 << 2) | (1 << 1) | (1 << 0), + G18: (1 << 12) | (1 << 11) | (1 << 10) | (1 << 9) | (1 << 8) | (1 << 5) | (1 << 2) | (1 << 0), + G15_MASK: (1 << 14) | (1 << 12) | (1 << 10) | (1 << 4) | (1 << 1), + /* + BCH编码格式信息 + */ + getBCHTypeInfo: function (data) { + var d = data << 10; + while (QRUtil.getBCHDigit(d) - QRUtil.getBCHDigit(QRUtil.G15) >= 0) { + d ^= (QRUtil.G15 << (QRUtil.getBCHDigit(d) - QRUtil.getBCHDigit(QRUtil.G15))); + } + return ((data << 10) | d) ^ QRUtil.G15_MASK; + }, + /* + BCH编码版本信息 + */ + getBCHTypeNumber: function (data) { + var d = data << 12; + while (QRUtil.getBCHDigit(d) - QRUtil.getBCHDigit(QRUtil.G18) >= 0) { + d ^= (QRUtil.G18 << (QRUtil.getBCHDigit(d) - QRUtil.getBCHDigit(QRUtil.G18))); + } + return (data << 12) | d; + }, + /* + 获取BCH位信息 + */ + getBCHDigit: function (data) { + var digit = 0; + while (data != 0) { + digit++; + data >>>= 1; + } + return digit; + }, + /* + 获取版本对应的矫正图形位置 + */ + getPatternPosition: function (typeNumber) { + return QRUtil.PATTERN_POSITION_TABLE[typeNumber - 1]; + }, + /* + 掩膜算法 + */ + getMask: function (maskPattern, i, j) { + switch (maskPattern) { + case QRMaskPattern.PATTERN000: + return (i + j) % 2 == 0; + case QRMaskPattern.PATTERN001: + return i % 2 == 0; + case QRMaskPattern.PATTERN010: + return j % 3 == 0; + case QRMaskPattern.PATTERN011: + return (i + j) % 3 == 0; + case QRMaskPattern.PATTERN100: + return (Math.floor(i / 2) + Math.floor(j / 3)) % 2 == 0; + case QRMaskPattern.PATTERN101: + return (i * j) % 2 + (i * j) % 3 == 0; + case QRMaskPattern.PATTERN110: + return ((i * j) % 2 + (i * j) % 3) % 2 == 0; + case QRMaskPattern.PATTERN111: + return ((i * j) % 3 + (i + j) % 2) % 2 == 0; + default: + throw new Error("bad maskPattern:" + maskPattern); + } + }, + /* + 获取RS的纠错多项式 + */ + getErrorCorrectPolynomial: function (errorCorrectLength) { + var a = new QRPolynomial([1], 0); + for (var i = 0; i < errorCorrectLength; i++) { + a = a.multiply(new QRPolynomial([1, QRMath.gexp(i)], 0)); + } + return a; + }, + /* + 获取评价 + */ + getLostPoint: function (qrCode) { + var moduleCount = qrCode.getModuleCount(), + lostPoint = 0, + darkCount = 0; + for (var row = 0; row < moduleCount; row++) { + var sameCount = 0; + var head = qrCode.modules[row][0]; + for (var col = 0; col < moduleCount; col++) { + var current = qrCode.modules[row][col]; + //level 3 评价 + if (col < moduleCount - 6) { + if (current && !qrCode.modules[row][col + 1] && qrCode.modules[row][col + 2] && qrCode.modules[row][col + 3] && qrCode.modules[row][col + 4] && !qrCode.modules[row][col + 5] && qrCode.modules[row][col + 6]) { + if (col < moduleCount - 10) { + if (qrCode.modules[row][col + 7] && qrCode.modules[row][col + 8] && qrCode.modules[row][col + 9] && qrCode.modules[row][col + 10]) { + lostPoint += 40; + } + } else if (col > 3) { + if (qrCode.modules[row][col - 1] && qrCode.modules[row][col - 2] && qrCode.modules[row][col - 3] && qrCode.modules[row][col - 4]) { + lostPoint += 40; + } + } + } + } + //level 2 评价 + if ((row < moduleCount - 1) && (col < moduleCount - 1)) { + var count = 0; + if (current) count++; + if (qrCode.modules[row + 1][col]) count++; + if (qrCode.modules[row][col + 1]) count++; + if (qrCode.modules[row + 1][col + 1]) count++; + if (count == 0 || count == 4) { + lostPoint += 3; + } + } + //level 1 评价 + if (head ^ current) { + sameCount++; + } else { + head = current; + if (sameCount >= 5) { + lostPoint += (3 + sameCount - 5); + } + sameCount = 1; + } + //level 4 评价 + if (current) { + darkCount++; + } + } + } + for (var col = 0; col < moduleCount; col++) { + var sameCount = 0; + var head = qrCode.modules[0][col]; + for (var row = 0; row < moduleCount; row++) { + var current = qrCode.modules[row][col]; + //level 3 评价 + if (row < moduleCount - 6) { + if (current && !qrCode.modules[row + 1][col] && qrCode.modules[row + 2][col] && qrCode.modules[row + 3][col] && qrCode.modules[row + 4][col] && !qrCode.modules[row + 5][col] && qrCode.modules[row + 6][col]) { + if (row < moduleCount - 10) { + if (qrCode.modules[row + 7][col] && qrCode.modules[row + 8][col] && qrCode.modules[row + 9][col] && qrCode.modules[row + 10][col]) { + lostPoint += 40; + } + } else if (row > 3) { + if (qrCode.modules[row - 1][col] && qrCode.modules[row - 2][col] && qrCode.modules[row - 3][col] && qrCode.modules[row - 4][col]) { + lostPoint += 40; + } + } + } + } + //level 1 评价 + if (head ^ current) { + sameCount++; + } else { + head = current; + if (sameCount >= 5) { + lostPoint += (3 + sameCount - 5); + } + sameCount = 1; + } + } + } + // LEVEL4 + var ratio = Math.abs(100 * darkCount / moduleCount / moduleCount - 50) / 5; + lostPoint += ratio * 10; + return lostPoint; + } + + }; + //--------------------------------------------------------------------- + // QRMath使用的数学工具 + //--------------------------------------------------------------------- + var QRMath = { + /* + 将n转化为a^m + */ + glog: function (n) { + if (n < 1) { + throw new Error("glog(" + n + ")"); + } + return QRMath.LOG_TABLE[n]; + }, + /* + 将a^m转化为n + */ + gexp: function (n) { + while (n < 0) { + n += 255; + } + while (n >= 256) { + n -= 255; + } + return QRMath.EXP_TABLE[n]; + }, + EXP_TABLE: new Array(256), + LOG_TABLE: new Array(256) + + }; + for (var i = 0; i < 8; i++) { + QRMath.EXP_TABLE[i] = 1 << i; + } + for (var i = 8; i < 256; i++) { + QRMath.EXP_TABLE[i] = QRMath.EXP_TABLE[i - 4] ^ QRMath.EXP_TABLE[i - 5] ^ QRMath.EXP_TABLE[i - 6] ^ QRMath.EXP_TABLE[i - 8]; + } + for (var i = 0; i < 255; i++) { + QRMath.LOG_TABLE[QRMath.EXP_TABLE[i]] = i; + } + //--------------------------------------------------------------------- + // QRPolynomial 多项式 + //--------------------------------------------------------------------- + /** + * 多项式类 + * @param {Array} num 系数 + * @param {num} shift a^shift + */ + function QRPolynomial(num, shift) { + if (num.length == undefined) { + throw new Error(num.length + "/" + shift); + } + var offset = 0; + while (offset < num.length && num[offset] == 0) { + offset++; + } + this.num = new Array(num.length - offset + shift); + for (var i = 0; i < num.length - offset; i++) { + this.num[i] = num[i + offset]; + } + } + QRPolynomial.prototype = { + get: function (index) { + return this.num[index]; + }, + getLength: function () { + return this.num.length; + }, + /** + * 多项式乘法 + * @param {QRPolynomial} e 被乘多项式 + * @return {[type]} [description] + */ + multiply: function (e) { + var num = new Array(this.getLength() + e.getLength() - 1); + for (var i = 0; i < this.getLength(); i++) { + for (var j = 0; j < e.getLength(); j++) { + num[i + j] ^= QRMath.gexp(QRMath.glog(this.get(i)) + QRMath.glog(e.get(j))); + } + } + return new QRPolynomial(num, 0); + }, + /** + * 多项式模运算 + * @param {QRPolynomial} e 模多项式 + * @return {} + */ + mod: function (e) { + var tl = this.getLength(), + el = e.getLength(); + if (tl - el < 0) { + return this; + } + var num = new Array(tl); + for (var i = 0; i < tl; i++) { + num[i] = this.get(i); + } + while (num.length >= el) { + var ratio = QRMath.glog(num[0]) - QRMath.glog(e.get(0)); + + for (var i = 0; i < e.getLength(); i++) { + num[i] ^= QRMath.gexp(QRMath.glog(e.get(i)) + ratio); + } + while (num[0] == 0) { + num.shift(); + } + } + return new QRPolynomial(num, 0); + } + }; + + //--------------------------------------------------------------------- + // RS_BLOCK_TABLE + //--------------------------------------------------------------------- + /* + 二维码各个版本信息[块数, 每块中的数据块数, 每块中的信息块数] + */ + var RS_BLOCK_TABLE = [ + // L + // M + // Q + // H + // 1 + [1, 26, 19], + [1, 26, 16], + [1, 26, 13], + [1, 26, 9], + + // 2 + [1, 44, 34], + [1, 44, 28], + [1, 44, 22], + [1, 44, 16], + + // 3 + [1, 70, 55], + [1, 70, 44], + [2, 35, 17], + [2, 35, 13], + + // 4 + [1, 100, 80], + [2, 50, 32], + [2, 50, 24], + [4, 25, 9], + + // 5 + [1, 134, 108], + [2, 67, 43], + [2, 33, 15, 2, 34, 16], + [2, 33, 11, 2, 34, 12], + + // 6 + [2, 86, 68], + [4, 43, 27], + [4, 43, 19], + [4, 43, 15], + + // 7 + [2, 98, 78], + [4, 49, 31], + [2, 32, 14, 4, 33, 15], + [4, 39, 13, 1, 40, 14], + + // 8 + [2, 121, 97], + [2, 60, 38, 2, 61, 39], + [4, 40, 18, 2, 41, 19], + [4, 40, 14, 2, 41, 15], + + // 9 + [2, 146, 116], + [3, 58, 36, 2, 59, 37], + [4, 36, 16, 4, 37, 17], + [4, 36, 12, 4, 37, 13], + + // 10 + [2, 86, 68, 2, 87, 69], + [4, 69, 43, 1, 70, 44], + [6, 43, 19, 2, 44, 20], + [6, 43, 15, 2, 44, 16], + + // 11 + [4, 101, 81], + [1, 80, 50, 4, 81, 51], + [4, 50, 22, 4, 51, 23], + [3, 36, 12, 8, 37, 13], + + // 12 + [2, 116, 92, 2, 117, 93], + [6, 58, 36, 2, 59, 37], + [4, 46, 20, 6, 47, 21], + [7, 42, 14, 4, 43, 15], + + // 13 + [4, 133, 107], + [8, 59, 37, 1, 60, 38], + [8, 44, 20, 4, 45, 21], + [12, 33, 11, 4, 34, 12], + + // 14 + [3, 145, 115, 1, 146, 116], + [4, 64, 40, 5, 65, 41], + [11, 36, 16, 5, 37, 17], + [11, 36, 12, 5, 37, 13], + + // 15 + [5, 109, 87, 1, 110, 88], + [5, 65, 41, 5, 66, 42], + [5, 54, 24, 7, 55, 25], + [11, 36, 12], + + // 16 + [5, 122, 98, 1, 123, 99], + [7, 73, 45, 3, 74, 46], + [15, 43, 19, 2, 44, 20], + [3, 45, 15, 13, 46, 16], + + // 17 + [1, 135, 107, 5, 136, 108], + [10, 74, 46, 1, 75, 47], + [1, 50, 22, 15, 51, 23], + [2, 42, 14, 17, 43, 15], + + // 18 + [5, 150, 120, 1, 151, 121], + [9, 69, 43, 4, 70, 44], + [17, 50, 22, 1, 51, 23], + [2, 42, 14, 19, 43, 15], + + // 19 + [3, 141, 113, 4, 142, 114], + [3, 70, 44, 11, 71, 45], + [17, 47, 21, 4, 48, 22], + [9, 39, 13, 16, 40, 14], + + // 20 + [3, 135, 107, 5, 136, 108], + [3, 67, 41, 13, 68, 42], + [15, 54, 24, 5, 55, 25], + [15, 43, 15, 10, 44, 16], + + // 21 + [4, 144, 116, 4, 145, 117], + [17, 68, 42], + [17, 50, 22, 6, 51, 23], + [19, 46, 16, 6, 47, 17], + + // 22 + [2, 139, 111, 7, 140, 112], + [17, 74, 46], + [7, 54, 24, 16, 55, 25], + [34, 37, 13], + + // 23 + [4, 151, 121, 5, 152, 122], + [4, 75, 47, 14, 76, 48], + [11, 54, 24, 14, 55, 25], + [16, 45, 15, 14, 46, 16], + + // 24 + [6, 147, 117, 4, 148, 118], + [6, 73, 45, 14, 74, 46], + [11, 54, 24, 16, 55, 25], + [30, 46, 16, 2, 47, 17], + + // 25 + [8, 132, 106, 4, 133, 107], + [8, 75, 47, 13, 76, 48], + [7, 54, 24, 22, 55, 25], + [22, 45, 15, 13, 46, 16], + + // 26 + [10, 142, 114, 2, 143, 115], + [19, 74, 46, 4, 75, 47], + [28, 50, 22, 6, 51, 23], + [33, 46, 16, 4, 47, 17], + + // 27 + [8, 152, 122, 4, 153, 123], + [22, 73, 45, 3, 74, 46], + [8, 53, 23, 26, 54, 24], + [12, 45, 15, 28, 46, 16], + + // 28 + [3, 147, 117, 10, 148, 118], + [3, 73, 45, 23, 74, 46], + [4, 54, 24, 31, 55, 25], + [11, 45, 15, 31, 46, 16], + + // 29 + [7, 146, 116, 7, 147, 117], + [21, 73, 45, 7, 74, 46], + [1, 53, 23, 37, 54, 24], + [19, 45, 15, 26, 46, 16], + + // 30 + [5, 145, 115, 10, 146, 116], + [19, 75, 47, 10, 76, 48], + [15, 54, 24, 25, 55, 25], + [23, 45, 15, 25, 46, 16], + + // 31 + [13, 145, 115, 3, 146, 116], + [2, 74, 46, 29, 75, 47], + [42, 54, 24, 1, 55, 25], + [23, 45, 15, 28, 46, 16], + + // 32 + [17, 145, 115], + [10, 74, 46, 23, 75, 47], + [10, 54, 24, 35, 55, 25], + [19, 45, 15, 35, 46, 16], + + // 33 + [17, 145, 115, 1, 146, 116], + [14, 74, 46, 21, 75, 47], + [29, 54, 24, 19, 55, 25], + [11, 45, 15, 46, 46, 16], + + // 34 + [13, 145, 115, 6, 146, 116], + [14, 74, 46, 23, 75, 47], + [44, 54, 24, 7, 55, 25], + [59, 46, 16, 1, 47, 17], + + // 35 + [12, 151, 121, 7, 152, 122], + [12, 75, 47, 26, 76, 48], + [39, 54, 24, 14, 55, 25], + [22, 45, 15, 41, 46, 16], + + // 36 + [6, 151, 121, 14, 152, 122], + [6, 75, 47, 34, 76, 48], + [46, 54, 24, 10, 55, 25], + [2, 45, 15, 64, 46, 16], + + // 37 + [17, 152, 122, 4, 153, 123], + [29, 74, 46, 14, 75, 47], + [49, 54, 24, 10, 55, 25], + [24, 45, 15, 46, 46, 16], + + // 38 + [4, 152, 122, 18, 153, 123], + [13, 74, 46, 32, 75, 47], + [48, 54, 24, 14, 55, 25], + [42, 45, 15, 32, 46, 16], + + // 39 + [20, 147, 117, 4, 148, 118], + [40, 75, 47, 7, 76, 48], + [43, 54, 24, 22, 55, 25], + [10, 45, 15, 67, 46, 16], + + // 40 + [19, 148, 118, 6, 149, 119], + [18, 75, 47, 31, 76, 48], + [34, 54, 24, 34, 55, 25], + [20, 45, 15, 61, 46, 16] + ]; + + /** + * 根据数据获取对应版本 + * @return {[type]} [description] + */ + QRCodeAlg.prototype.getRightType = function () { + for (var typeNumber = 1; typeNumber < 41; typeNumber++) { + var rsBlock = RS_BLOCK_TABLE[(typeNumber - 1) * 4 + this.errorCorrectLevel]; + if (rsBlock == undefined) { + throw new Error("bad rs block @ typeNumber:" + typeNumber + "/errorCorrectLevel:" + this.errorCorrectLevel); + } + var length = rsBlock.length / 3; + var totalDataCount = 0; + for (var i = 0; i < length; i++) { + var count = rsBlock[i * 3 + 0]; + var dataCount = rsBlock[i * 3 + 2]; + totalDataCount += dataCount * count; + } + var lengthBytes = typeNumber > 9 ? 2 : 1; + if (this.utf8bytes.length + lengthBytes < totalDataCount || typeNumber == 40) { + this.typeNumber = typeNumber; + this.rsBlock = rsBlock; + this.totalDataCount = totalDataCount; + break; + } + } + }; + + //--------------------------------------------------------------------- + // QRBitBuffer + //--------------------------------------------------------------------- + function QRBitBuffer() { + this.buffer = new Array(); + this.length = 0; + } + QRBitBuffer.prototype = { + get: function (index) { + var bufIndex = Math.floor(index / 8); + return ((this.buffer[bufIndex] >>> (7 - index % 8)) & 1); + }, + put: function (num, length) { + for (var i = 0; i < length; i++) { + this.putBit(((num >>> (length - i - 1)) & 1)); + } + }, + putBit: function (bit) { + var bufIndex = Math.floor(this.length / 8); + if (this.buffer.length <= bufIndex) { + this.buffer.push(0); + } + if (bit) { + this.buffer[bufIndex] |= (0x80 >>> (this.length % 8)); + } + this.length++; + } + }; + + + + // xzedit + let qrcodeAlgObjCache = []; + /** + * 二维码构造函数，主要用于绘制 + * @param {参数列表} opt 传递参数 + * @return {} + */ + QRCode = function (opt) { + //设置默认参数 + this.options = { + text: '', + size: 256, + correctLevel: 3, + background: '#ffffff', + foreground: '#000000', + pdground: '#000000', + image: '', + imageSize: 30, + canvasId: opt.canvasId, + context: opt.context, + usingComponents: opt.usingComponents, + showLoading: opt.showLoading, + loadingText: opt.loadingText, + }; + if (typeof opt === 'string') { // 只编码ASCII字符串 + opt = { + text: opt + }; + } + if (opt) { + for (var i in opt) { + this.options[i] = opt[i]; + } + } + //使用QRCodeAlg创建二维码结构 + var qrCodeAlg = null; + for (var i = 0, l = qrcodeAlgObjCache.length; i < l; i++) { + if (qrcodeAlgObjCache[i].text == this.options.text && qrcodeAlgObjCache[i].text.correctLevel == this.options.correctLevel) { + qrCodeAlg = qrcodeAlgObjCache[i].obj; + break; + } + } + if (i == l) { + qrCodeAlg = new QRCodeAlg(this.options.text, this.options.correctLevel); + qrcodeAlgObjCache.push({ + text: this.options.text, + correctLevel: this.options.correctLevel, + obj: qrCodeAlg + }); + } + /** + * 计算矩阵点的前景色 + * @param {Obj} config + * @param {Number} config.row 点x坐标 + * @param {Number} config.col 点y坐标 + * @param {Number} config.count 矩阵大小 + * @param {Number} config.options 组件的options + * @return {String} + */ + let getForeGround = function (config) { + var options = config.options; + if (options.pdground && ( + (config.row > 1 && config.row < 5 && config.col > 1 && config.col < 5) || + (config.row > (config.count - 6) && config.row < (config.count - 2) && config.col > 1 && config.col < 5) || + (config.row > 1 && config.row < 5 && config.col > (config.count - 6) && config.col < (config.count - 2)) + )) { + return options.pdground; + } + return options.foreground; + } + // 创建canvas + let createCanvas = function (options) { + if (options.showLoading) { + uni.showLoading({ + title: options.loadingText, + mask: true + }); + } + var ctx = uni.createCanvasContext(options.canvasId, options.context); + var count = qrCodeAlg.getModuleCount(); + var ratioSize = options.size; + var ratioImgSize = options.imageSize; + //计算每个点的长宽 + var tileW = (ratioSize / count).toPrecision(4); + var tileH = (ratioSize / count).toPrecision(4); + //绘制 + for (var row = 0; row < count; row++) { + for (var col = 0; col < count; col++) { + var w = (Math.ceil((col + 1) * tileW) - Math.floor(col * tileW)); + var h = (Math.ceil((row + 1) * tileW) - Math.floor(row * tileW)); + var foreground = getForeGround({ + row: row, + col: col, + count: count, + options: options + }); + ctx.setFillStyle(qrCodeAlg.modules[row][col] ? foreground : options.background); + ctx.fillRect(Math.round(col * tileW), Math.round(row * tileH), w, h); + } + } + if (options.image) { + var x = Number(((ratioSize - ratioImgSize) / 2).toFixed(2)); + var y = Number(((ratioSize - ratioImgSize) / 2).toFixed(2)); + drawRoundedRect(ctx, x, y, ratioImgSize, ratioImgSize, 2, 6, true, true) + ctx.drawImage(options.image, x, y, ratioImgSize, ratioImgSize); + // 画圆角矩形 + function drawRoundedRect(ctxi, x, y, width, height, r, lineWidth, fill, stroke) { + ctxi.setLineWidth(lineWidth); + ctxi.setFillStyle(options.background); + ctxi.setStrokeStyle(options.background); + ctxi.beginPath(); // draw top and top right corner + ctxi.moveTo(x + r, y); + ctxi.arcTo(x + width, y, x + width, y + r, r); // draw right side and bottom right corner + ctxi.arcTo(x + width, y + height, x + width - r, y + height, r); // draw bottom and bottom left corner + ctxi.arcTo(x, y + height, x, y + height - r, r); // draw left and top left corner + ctxi.arcTo(x, y, x + r, y, r); + ctxi.closePath(); + if (fill) { + ctxi.fill(); + } + if (stroke) { + ctxi.stroke(); + } + } + } + setTimeout(() => { + ctx.draw(true, () => { + // 保存到临时区域 + setTimeout(() => { + uni.canvasToTempFilePath({ + width: options.width, + height: options.height, + destWidth: options.width, + destHeight: options.height, + canvasId: options.canvasId, + quality: Number(1), + success: function (res) { + if (options.cbResult) { + options.cbResult(res.tempFilePath) + } + }, + fail: function (res) { + if (options.cbResult) { + options.cbResult(res) + } + }, + complete: function () { + if (options.showLoading){ + uni.hideLoading(); + } + }, + }, options.context); + }, options.text.length + 100); + }); + }, options.usingComponents ? 0 : 150); + } + createCanvas(this.options); + // 空判定 + let empty = function (v) { + let tp = typeof v, + rt = false; + if (tp == "number" && String(v) == "") { + rt = true + } else if (tp == "undefined") { + rt = true + } else if (tp == "object") { + if (JSON.stringify(v) == "{}" || JSON.stringify(v) == "[]" || v == null) rt = true + } else if (tp == "string") { + if (v == "" || v == "undefined" || v == "null" || v == "{}" || v == "[]") rt = true + } else if (tp == "function") { + rt = false + } + return rt + } + }; + QRCode.prototype.clear = function (fn) { + var ctx = uni.createCanvasContext(this.options.canvasId, this.options.context) + ctx.clearRect(0, 0, this.options.size, this.options.size) + ctx.draw(false, () => { + if (fn) { + fn() + } + }) + }; +})() + +export default QRCode \ No newline at end of file diff --git a/manifest.json b/manifest.json index b8dae08..6422ffb 100644 --- a/manifest.json +++ b/manifest.json @@ -1,89 +1,94 @@ { - "name" : "YGTianmuCS", - "appid" : "__UNI__BB03E8A", - "description" : "", - "versionName" : "1.0.0", - "versionCode" : "100", - "transformPx" : false, - /* 5+App特有相关 */ - "app-plus" : { - "usingComponents" : true, - "nvueStyleCompiler" : "uni-app", - "compilerVersion" : 3, - "splashscreen" : { - "alwaysShowBeforeRender" : true, - "waiting" : true, - "autoclose" : true, - "delay" : 0 - }, - "safearea" : { - "bottom" : { - "offset" : "auto" // 自动适配安全区域 - } - }, - /* 模块配置 */ - "modules" : {}, - /* 应用发布信息 */ - "distribute" : { - /* android打包配置 */ - "android" : { - "permissions" : [ - "", - "", - "", - "", - "", - "", - "", - "", - "", - "", - "", - "", - "", - "", - "" - ] - }, - /* ios打包配置 */ - "ios" : {}, - /* SDK配置 */ - "sdkConfigs" : { - "oauth" : {} - } - } + "name": "YGTianmuCS", + "appid": "__UNI__BB03E8A", + "description": "", + "versionName": "1.0.0", + "versionCode": "100", + "transformPx": false, + /* 5+App特有相关 */ + "app-plus": { + "usingComponents": true, + "nvueStyleCompiler": "uni-app", + "compilerVersion": 3, + "splashscreen": { + "alwaysShowBeforeRender": true, + "waiting": true, + "autoclose": true, + "delay": 0 }, - /* 快应用特有相关 */ - "quickapp" : {}, - /* 小程序特有相关 */ - "mp-weixin" : { - "appid" : "wx5e79df5996572539", - "setting" : { - "urlCheck" : false - }, - "usingComponents" : true, - "permission" : {} + "safearea": { + "bottom": { + "offset": "auto" // 自动适配安全区域 + } }, - "mp-alipay" : { - "usingComponents" : true - }, - "mp-baidu" : { - "usingComponents" : true - }, - "mp-toutiao" : { - "usingComponents" : true - }, - "uniStatistics" : { - "enable" : false - }, - "vueVersion" : "3", - "h5" : { - "router" : { - "base" : "./", - "mode" : "hash" - }, - "devServer" : { - "https" : false - } + /* 模块配置 */ + "modules": {}, + /* 应用发布信息 */ + "distribute": { + /* android打包配置 */ + "android": { + "permissions": [ + "", + "", + "", + "", + "", + "", + "", + "", + "", + "", + "", + "", + "", + "", + "" + ] + }, + /* ios打包配置 */ + "ios": {}, + /* SDK配置 */ + "sdkConfigs": { + "oauth": {} + } } + }, + /* 快应用特有相关 */ + "quickapp": {}, + /* 小程序特有相关 */ + "mp-weixin": { + "appid": "wx5e79df5996572539", + "setting": { + "urlCheck": false + }, + "usingComponents": true, + "requiredPrivateInfos": ["getLocation"], + "permission": { + "scope.userLocation": { + "desc": "用于获取当前所在城市信息" + } + } + }, + "mp-alipay": { + "usingComponents": true + }, + "mp-baidu": { + "usingComponents": true + }, + "mp-toutiao": { + "usingComponents": true + }, + "uniStatistics": { + "enable": false + }, + "vueVersion": "3", + "h5": { + "router": { + "base": "./", + "mode": "hash" + }, + "devServer": { + "https": false + } + } } diff --git a/pages/order/components/CustomNoMore/images/no_more.png b/pages/order/components/CustomNoMore/images/no_more.png deleted file mode 100644 index 8bca5fe..0000000 Binary files a/pages/order/components/CustomNoMore/images/no_more.png and /dev/null differ diff --git a/pages/order/components/CustomNoMore/index.vue b/pages/order/components/CustomNoMore/index.vue deleted file mode 100644 index 3f062e0..0000000 --- a/pages/order/components/CustomNoMore/index.vue +++ /dev/null @@ -1,14 +0,0 @@ - - - \ No newline at end of file diff --git a/pages/order/components/CustomNoMore/styles/index.scss b/pages/order/components/CustomNoMore/styles/index.scss deleted file mode 100644 index d67b2ff..0000000 --- a/pages/order/components/CustomNoMore/styles/index.scss +++ /dev/null @@ -1,17 +0,0 @@ -.nomore { - /* #ifndef APP-NVUE */ - display: flex; - /* #endif */ - flex-direction: column; - align-items: center; - padding: 10px 0; -} -.nomore-image { - width: 100px; - height: 65px; -} -.nomore-text { - margin-top: 5px; - font-size: 12px; - color: #222963; -} \ No newline at end of file diff --git a/pages/order/components/CustomRefresher/images/refresher_loading.gif b/pages/order/components/CustomRefresher/images/refresher_loading.gif deleted file mode 100644 index 1ee754f..0000000 Binary files a/pages/order/components/CustomRefresher/images/refresher_loading.gif and /dev/null differ diff --git a/pages/order/components/CustomRefresher/index.vue b/pages/order/components/CustomRefresher/index.vue deleted file mode 100644 index b2b87db..0000000 --- a/pages/order/components/CustomRefresher/index.vue +++ /dev/null @@ -1,39 +0,0 @@ - - - - - - - diff --git a/pages/order/components/CustomRefresher/styles/index.scss b/pages/order/components/CustomRefresher/styles/index.scss deleted file mode 100644 index c153bae..0000000 --- a/pages/order/components/CustomRefresher/styles/index.scss +++ /dev/null @@ -1,21 +0,0 @@ -.refresher-container { - /* #ifndef APP-NVUE */ - display: flex; - /* #endif */ - height: 150rpx; - flex-direction: column; - align-items: center; - justify-content: center; -} - -.refresher-image { - margin-top: 10rpx; - height: 45px; - width: 45px; -} - -.refresher-text { - margin-top: 10rpx; - font-size: 24rpx; - color: #666666; -} \ No newline at end of file diff --git a/pages/order/components/GoodsInfo/images/food.png b/pages/order/components/GoodsInfo/images/food.png new file mode 100644 index 0000000..8252626 Binary files /dev/null and b/pages/order/components/GoodsInfo/images/food.png differ diff --git a/pages/order/components/GoodsInfo/images/ticket.png b/pages/order/components/GoodsInfo/images/ticket.png new file mode 100644 index 0000000..0ab3334 Binary files /dev/null and b/pages/order/components/GoodsInfo/images/ticket.png differ diff --git a/pages/order/components/GoodsInfo/index.vue b/pages/order/components/GoodsInfo/index.vue index 6c33a8d..196a8d4 100644 --- a/pages/order/components/GoodsInfo/index.vue +++ b/pages/order/components/GoodsInfo/index.vue @@ -1,34 +1,153 @@ \ No newline at end of file +@import "./styles/index.scss"; + diff --git a/pages/order/components/GoodsInfo/styles/index.scss b/pages/order/components/GoodsInfo/styles/index.scss index 1f4ca7c..61a3635 100644 --- a/pages/order/components/GoodsInfo/styles/index.scss +++ b/pages/order/components/GoodsInfo/styles/index.scss @@ -1,77 +1,154 @@ -.goods-info { - background-color: #fff; - border-radius: 10px; - padding: 12px 16px 20px; -} +// ===== SASS变量定义 ===== +// 颜色系统 +$color-white: #fff; +$color-primary: #333; +$color-secondary: #666; +$color-placeholder: pink; -.hotel-header { +// 字体大小 +$font-size-xs: 12px; +$font-size-sm: 14px; +$font-size-base: 16px; + +// 字体粗细 +$font-weight-normal: 400; +$font-weight-medium: 500; +$font-weight-bold: 600; + +// 间距系统 +$spacing-xs: 8px; +$spacing-sm: 10px; +$spacing-md: 12px; +$spacing-lg: 15px; +$spacing-xl: 16px; +$spacing-xxl: 20px; + +// 圆角 +$border-radius-sm: 8px; +$border-radius-md: 10px; + +// 尺寸 +$icon-size-sm: 24px; +$image-size-md: 65px; + +// ===== SASS混合器 ===== +@mixin flex-center { display: flex; align-items: center; - margin-bottom: 10px; } -.hotel-icon { - width: 24px; - height: 24px; - margin-right: 8px; -} - -.hotel-name { - color: #333; - font-size: 12px; - font-weight: 500; -} - -.goods-detail { - display: flex; - margin-bottom: 20px; -} - -.goods-image { - background-color: pink; - width: 65px; - height: 65px; - border-radius: 8px; - margin-right: 15px; -} - -.goods-description { - flex: 1; -} - -.goods-title { - display: block; - font-size: 14px; - font-weight: 500; - margin-bottom: 8px; -} - -.goods-date { - font-size: 12px; - color: #666; -} - -.included-services { - margin-top: 10px; -} - -.services-title { - display: block; - font-size: 12px; - margin-bottom: 12px; -} - -.service-item { +@mixin flex-between { display: flex; justify-content: space-between; - margin-bottom: 10px; } -.service-name { - font-size: 14px; +@mixin text-style($size, $color: $color-primary, $weight: $font-weight-normal) { + font-size: $size; + color: $color; + font-weight: $weight; } -.service-quantity { - font-size: 12px; - color: #666; -} \ No newline at end of file +@mixin card-container { + background-color: $color-white; + border-radius: $border-radius-md; + padding: $spacing-md $spacing-xl $spacing-xxl; +} + +// ===== 主要样式 ===== +.goods-info { + @include card-container; + + // 酒店头部信息 + .hotel-header { + @include flex-center; + margin-bottom: $spacing-sm; + + .hotel-icon { + width: $icon-size-sm; + height: $icon-size-sm; + margin-right: $spacing-xs; + } + + .hotel-name { + @include text-style($font-size-xs, $color-primary, $font-weight-medium); + } + } + + // 商品详情区域 + .goods-detail { + display: flex; + margin-bottom: $spacing-xxl; + + .goods-image { + background-color: $color-placeholder; + width: $image-size-md; + height: $image-size-md; + border-radius: $border-radius-sm; + margin-right: $spacing-lg; + flex-shrink: 0; + } + + .goods-description { + flex: 1; + min-width: 0; // 防止flex子项溢出 + + .goods-title { + display: block; + @include text-style($font-size-sm, $color-primary, $font-weight-medium); + margin-bottom: $spacing-xs; + line-height: 1.4; + } + + .store-address { + @include flex-center; + @include text-style($font-size-xs, $color-primary); + + text { + flex: 1; + padding: 0 6px; + overflow: hidden; + text-overflow: ellipsis; + white-space: nowrap; + } + } + + .in-date, + .out-date { + @include text-style($font-size-xs, $color-secondary); + margin-top: 8px; + } + } + } + + // 包含服务区域 + .included-services { + margin-top: $spacing-sm; + + .services-title { + display: block; + @include text-style($font-size-xs, $color-primary, $font-weight-medium); + margin-bottom: $spacing-md; + } + + .service-item { + @include flex-between; + align-items: center; + margin-bottom: $spacing-sm; + + &:last-child { + margin-bottom: 0; + } + + .service-name { + @include text-style($font-size-sm, $color-primary); + flex: 1; + } + + .service-quantity { + @include text-style($font-size-xs, $color-secondary); + flex-shrink: 0; + margin-left: $spacing-xs; + } + } + } +} diff --git a/pages/order/components/NoticeInfo/index.vue b/pages/order/components/NoticeInfo/index.vue index ed7f8d7..9116636 100644 --- a/pages/order/components/NoticeInfo/index.vue +++ b/pages/order/components/NoticeInfo/index.vue @@ -1,40 +1,30 @@ \ No newline at end of file diff --git a/pages/order/components/NoticeInfo/styles/index.scss b/pages/order/components/NoticeInfo/styles/index.scss index 7589229..73c6e1b 100644 --- a/pages/order/components/NoticeInfo/styles/index.scss +++ b/pages/order/components/NoticeInfo/styles/index.scss @@ -4,36 +4,10 @@ padding: 16px 18px; } -.notice-section { - margin-bottom: 20px; - - &:last-child { - margin-bottom: 0; - } -} - .notice-title { display: flex; align-items: center; - margin-bottom: 8px; - font-size: 14px; - font-weight: 600; + font-size: 16px; + font-weight: 500; color: #333; } - -.notice-icon { - width: 18px; - height: 18px; - margin-right: 10px; -} - -.notice-content { - font-size: 12px; - color: #666; - padding-left: 28px; -} - -.notice-item { - display: block; - margin-bottom: 5px; -} \ No newline at end of file diff --git a/pages/order/components/OrderCard/InfoRow.vue b/pages/order/components/OrderCard/InfoRow.vue new file mode 100644 index 0000000..dea93f0 --- /dev/null +++ b/pages/order/components/OrderCard/InfoRow.vue @@ -0,0 +1,45 @@ + + + + + diff --git a/pages/order/components/OrderCard/OrderCardContent.vue b/pages/order/components/OrderCard/OrderCardContent.vue new file mode 100644 index 0000000..7c8dfd7 --- /dev/null +++ b/pages/order/components/OrderCard/OrderCardContent.vue @@ -0,0 +1,116 @@ + + + + + diff --git a/pages/order/components/OrderCard/README.md b/pages/order/components/OrderCard/README.md new file mode 100644 index 0000000..04f7067 --- /dev/null +++ b/pages/order/components/OrderCard/README.md @@ -0,0 +1,109 @@ +# OrderCard 组件 + +订单卡片组件，用于显示订单和工单信息。 + +## 组件结构 + +``` +OrderCard/ +├── index.vue # 主组件 +├── OrderCardContent.vue # 卡片内容组件 +├── InfoRow.vue # 信息行组件 +├── images/ # 图片资源 +├── styles/ # 样式文件 +└── README.md # 说明文档 +``` + +## 组件说明 + +### OrderCard (主组件) +- 负责整体布局和事件处理 +- 包含卡片头部、分割线、内容区域和操作区域 +- 处理点击、呼叫等交互事件 + +### OrderCardContent (内容组件) +- 负责根据 `orderType` 动态渲染不同的内容 +- 支持订单类型（0-酒店订单，1-门票订单，2-其他订单）和工单类型 +- 使用条件渲染显示对应的信息字段 + +### InfoRow (信息行组件) +- 可复用的信息展示组件 +- 统一的标签和值的显示格式 +- 支持字符串和数字类型的值 + +## 使用方式 + +```vue + + + +``` + +## Props + +### orderData (Object) + +| 字段 | 类型 | 说明 | 必填 | +|------|------|------|------| +| id | String | 订单ID | 是 | +| commodityName | String | 商品名称 | 是 | +| orderType | Number/undefined | 订单类型：0-酒店订单，1-门票订单，2-其他订单，undefined-工单 | 否 | +| orderNumber | String | 订单编号 | 否 | +| checkInTime | String | 入住时间（orderType=0时使用） | 否 | +| visitorName | String | 游客姓名/联系房客 | 否 | +| contactPhone | String | 联系电话 | 否 | +| quantity | Number | 份数（orderType=1,2时使用） | 否 | +| createTime | String | 创建时间（工单时使用） | 否 | +| orderStatus | String | 订单状态 | 否 | +| status | String | 状态 | 否 | + +## Events + +| 事件名 | 说明 | 参数 | +|--------|------|------| +| click | 卡片点击事件 | orderData | +| call | 呼叫事件 | orderData | +| complete | 完成事件 | orderData | + +## 显示逻辑 + +### 订单类型 (orderType !== undefined) + +- **orderType = 0 (酒店订单)**：显示订单编号、入住时间、游客姓名、联系电话 +- **orderType = 1 (门票订单)**：显示订单编号、份数 +- **orderType = 2 (其他订单)**：显示订单编号、份数 + +### 工单类型 (orderType === undefined) + +显示创建时间、联系房客、联系电话 + +## 优势 + +1. **可读性**：组件职责单一，代码结构清晰 +2. **可维护性**：组件化拆分，便于独立维护和测试 +3. **可复用性**：InfoRow 组件可在其他地方复用 +4. **健壮性**：类型检查和默认值处理 +5. **扩展性**：新增订单类型只需修改 OrderCardContent 组件 \ No newline at end of file diff --git a/pages/order/components/OrderCard/constants/order.js b/pages/order/components/OrderCard/constants/order.js new file mode 100644 index 0000000..fc349fd --- /dev/null +++ b/pages/order/components/OrderCard/constants/order.js @@ -0,0 +1,59 @@ +// 订单类型 +export const ORDER_TYPE_MAP = { + 0: [ + { + label: '订单编号', + key: 'orderId' + }, + { + label: '入住时间', + key: 'checkInData' + }, + { + label: '游客姓名', + key: 'visitorName' + }, + { + label: '联系电话', + key: 'contactPhone' + } + ], + 1: [ + { + label: '订单编号', + key: 'orderId' + }, + { + label: '份数', + key: 'commodityAmount' + } + ], + 2: [ + { + label: '订单编号', + key: 'orderId' + }, + { + label: '份数', + key: 'commodityAmount' + } + ], +} + +// 工单类型 +export const SERVICE_TYPE_MAP = { + 0: [ + { + label: '创建时间', + key: 'createTime' + }, + { + label: '联系房客', + key: 'userName' + }, + { + label: '联系电话', + key: 'userPhone' + } + ], +} diff --git a/pages/order/components/OrderCard/images/arrow.png b/pages/order/components/OrderCard/images/arrow.png new file mode 100644 index 0000000..2a8fe8c Binary files /dev/null and b/pages/order/components/OrderCard/images/arrow.png differ diff --git a/pages/order/components/OrderCard/images/food.png b/pages/order/components/OrderCard/images/food.png new file mode 100644 index 0000000..87cf338 Binary files /dev/null and b/pages/order/components/OrderCard/images/food.png differ diff --git a/pages/order/components/OrderCard/images/hotel.png b/pages/order/components/OrderCard/images/hotel.png new file mode 100644 index 0000000..60bba2e Binary files /dev/null and b/pages/order/components/OrderCard/images/hotel.png differ diff --git a/pages/order/components/OrderCard/images/ticket.png b/pages/order/components/OrderCard/images/ticket.png new file mode 100644 index 0000000..175189a Binary files /dev/null and b/pages/order/components/OrderCard/images/ticket.png differ diff --git a/pages/order/components/OrderCard/index.vue b/pages/order/components/OrderCard/index.vue index ddf941f..c31ebe8 100644 --- a/pages/order/components/OrderCard/index.vue +++ b/pages/order/components/OrderCard/index.vue @@ -3,14 +3,20 @@ - - {{ orderData.title }} + + + {{ orderData.workOrderTypeName || orderData.commodityName }} + + - {{ getStatusText(orderData.status) }} + {{ getStatusText(orderData.orderStatus || orderData.workOrderStatus) }} @@ -18,31 +24,18 @@ - - - 创建时间： - {{ orderData.createTime }} - - - 联系房客： - {{ orderData.contactName }} - - - 联系电话： - {{ orderData.contactPhone }} - - - - - - - + \ No newline at end of file + diff --git a/pages/order/components/OrderCard/styles/index.scss b/pages/order/components/OrderCard/styles/index.scss index 7f43dd8..f2c55b1 100644 --- a/pages/order/components/OrderCard/styles/index.scss +++ b/pages/order/components/OrderCard/styles/index.scss @@ -1,10 +1,10 @@ .order-card { background-color: #fff; border-radius: 6px 6px 12px 12px; - box-shadow: 0px 3px 8px 0 rgba(0,0,0,0.12); + box-shadow: 0px 3px 8px 0 rgba(0, 0, 0, 0.12); margin: 12px; transition: all 0.3s ease; - + &:active { transform: scale(0.98); box-shadow: 0 1px 4px rgba(0, 0, 0, 0.1); @@ -40,91 +40,52 @@ font-weight: 500; color: #333333; line-height: 1.4; - flex: 1; +} + +.arrow-icon { + width: 24px; + height: 24px; } .status-tag { box-sizing: border-box; padding: 6px 16px; - border-radius: 20px ; + border-radius: 20px; font-size: 12px; font-weight: 500; - - &.tag-pending { - background-color: #FFF7E6; - color: #FF8C00; - border: 1px solid #FFD591; + + &.tag-0 { + color: #00a6ff; + border: 1px solid #00a6ff; } - - &.tag-completed { - background-color: #F6FFED; - color: #52C41A; - border: 1px solid #B7EB8F; + + &.tag-1 { + color: #f00044; + border: 1px solid #f00044; } - - &.tag-cancelled { - background-color: #F5F5F5; - color: #999999; - border: 1px solid #D9D9D9; + + &.tag-2 { + color: #40ae36; + border: 1px solid #40ae36; } - - &.tag-processing { - background-color: #E6F7FF; - color: #1890FF; - border: 1px solid #91D5FF; + + &.tag-3 { + color: #808389; + border: 1px solid #808389; + } + + &.tag-4 { + color: #0256ff; + border: 1px solid #0256ff; + } + + &.tag-5 { + color: #808389; + border: 1px solid #808389; + } + + &.tag-6 { + color: #fd8702; + border: 1px solid #fd8702; } } - - - -.card-content { - padding: 16px; -} - -.info-row { - display: flex; - align-items: center; - margin-bottom: 10px; - - &:last-child { - margin-bottom: 0; - } -} - -.label { - font-size: 12px; - color: #666666; - flex-shrink: 0; - margin-right: 8px; -} - -.value { - font-size: 14px; - color: #333333; - flex: 1; -} - -.action-area { - padding-bottom: 16px; -} - -.action-btn { - width: 280px; - height: 42px; - border-radius: 50px; - border: 2px solid #FFCA70; - font-size: 14px; - font-weight: 500; - transition: all 0.3s ease; - background: linear-gradient( 179deg, #FFB100 0%, #FF7F19 100%); - color: #ffffff; - margin: 0 auto; - - &:hover { - background: linear-gradient(135deg, #FF7A00 0%, #FF6600 100%); - } - - &:active { - transform: scale(0.95); - } -} \ No newline at end of file diff --git a/pages/order/components/OrderInfo/index.vue b/pages/order/components/OrderInfo/index.vue index b5a85ff..dfa1165 100644 --- a/pages/order/components/OrderInfo/index.vue +++ b/pages/order/components/OrderInfo/index.vue @@ -2,29 +2,166 @@ 订单号 - HUSUWF29387865 + {{ orderData.orderId }} 流水号 - 76487829387865 + {{ orderData.paySerialNumber }} 支付方式 - 微信 + {{ payWayText }} + + + 退款单号 + {{ orderData.refundOrderNo }} + + 实际支付金额 - ¥31.8 + {{ formattedAmount }} + + + + - - - \ No newline at end of file + diff --git a/pages/order/components/OrderInfo/styles/index.scss b/pages/order/components/OrderInfo/styles/index.scss index 255f5dd..a0ae99c 100644 --- a/pages/order/components/OrderInfo/styles/index.scss +++ b/pages/order/components/OrderInfo/styles/index.scss @@ -1,49 +1,224 @@ +// SASS变量定义，提高可维护性和编译性能 + +// 颜色系统 +$order-bg-color: #fff; +$text-color-primary: #333; +$text-color-secondary: #666; +$text-color-accent: #ff5722; +$button-color: #00a6ff; +$button-hover-color: darken($button-color, 8%); +$button-disabled-color: #ccc; +$border-color: #ececec; +$shadow-color: rgba(0, 0, 0, 0.08); + +// 尺寸和间距 +$order-border-radius: 10px; +$order-padding: 16px 18px; +$spacing-small: 8px; +$spacing-medium: 10px; +$spacing-large: 20px; +$button-height: 42px; + +// 字体系统 +$font-size-small: 12px; +$font-size-medium: 14px; +$font-size-large: 18px; +$font-weight-normal: 400; +$font-weight-medium: 500; +$font-weight-semibold: 600; + +// 过渡动画 +$transition-fast: 0.2s ease; +$transition-normal: 0.3s ease; + +// 动画关键帧 +@keyframes loading-spin { + 0% { + transform: rotate(0deg); + } + 100% { + transform: rotate(360deg); + } +} + .order-info { - background-color: #fff; - border-radius: 10px; - padding: 16px 18px; -} + background-color: $order-bg-color; + border-radius: $order-border-radius; + padding: $order-padding; + box-shadow: 0 2px 8px $shadow-color; + transition: box-shadow $transition-normal; -.order-item { - display: flex; - justify-content: space-between; - margin-bottom: 8px; -} + &:hover { + box-shadow: 0 4px 16px rgba(0, 0, 0, 0.12); + } -.label { - font-size: 12px; - color: #666; -} + // 订单项样式，优化布局和视觉层次 + .order-item { + display: flex; + justify-content: space-between; + align-items: center; + margin-bottom: $spacing-small; + padding: 4px 0; + transition: background-color $transition-fast; -.value { - font-size: 12px; - color: #333; -} + .label { + font-size: $font-size-small; + color: $text-color-secondary; + font-weight: $font-weight-normal; + flex-shrink: 0; + line-height: 1.4; + } -.amount .label { - color: #333; -} + .value { + font-size: $font-size-small; + color: $text-color-primary; + font-weight: $font-weight-normal; + text-align: right; + word-break: break-word; + overflow-wrap: break-word; + line-height: 1.4; + max-width: 60%; + } -.amount .value { - color: #ff5722; - font-size: 18px; -} + // 金额特殊样式，增强视觉重点 + &.amount { + .label { + color: $text-color-primary; + font-weight: $font-weight-medium; + font-size: $font-size-medium; + } -.reserve-button { - width: 100%; - background-color: #ffa500; - color: #fff; - border: none; - border-radius: 50px; - height: 42px; - font-size: 14px; - margin-top: 20px; -} + .value { + color: $text-color-accent; + font-size: $font-size-large; + font-weight: $font-weight-semibold; + max-width: none; -.feedback { - display: block; - text-align: center; - font-size: 14px; - color: #333; - margin-top: 10px; -} \ No newline at end of file + // 货币符号样式 + &::before { + content: "¥"; + margin-right: 2px; + font-size: 11px; + } + } + } + } + + .line { + border-bottom: 1px solid $border-color; + margin: $spacing-medium 0; + height: 0; + opacity: 0.6; + transition: opacity $transition-fast; + + &:hover { + opacity: 1; + } + } + + .reserve-button { + width: 100%; + background: linear-gradient(179deg, #00a6ff 0%, #0256ff 100%); + color: #fff; + border: none; + padding: 0; + display: flex; + align-items: center; + justify-content: center; + border-radius: 50px; + height: $button-height; + font-size: $font-size-medium; + font-weight: $font-weight-medium; + margin-top: $spacing-large; + position: relative; + overflow: hidden; + transition: all $transition-normal; + letter-spacing: 0.5px; + + // 按钮波纹效果 + &::before { + content: ""; + position: absolute; + top: 50%; + left: 50%; + width: 0; + height: 0; + background: rgba(255, 255, 255, 0.3); + border-radius: 50%; + transform: translate(-50%, -50%); + transition: width 0.6s, height 0.6s; + } + + &:hover { + background: linear-gradient( + 135deg, + $button-hover-color 0%, + darken($button-hover-color, 5%) 100% + ); + transform: translateY(-2px); + box-shadow: 0 4px 16px rgba($button-color, 0.4); + + &::before { + width: 300px; + height: 300px; + } + } + + &:active { + transform: translateY(-1px); + box-shadow: 0 2px 8px rgba($button-color, 0.3); + } + + &:focus { + outline: none; + box-shadow: 0 0 0 3px rgba($button-color, 0.3); + } + + &:disabled { + background: $button-disabled-color; + cursor: not-allowed; + transform: none; + box-shadow: none; + + &::before { + display: none; + } + } + + // 加载状态样式 + &.loading { + background: $button-disabled-color; + cursor: not-allowed; + transform: none; + box-shadow: none; + position: relative; + + &::before { + display: none; + } + + // 加载动画 + &::after { + content: ""; + position: absolute; + left: 50%; + top: 50%; + width: 16px; + height: 16px; + margin: -8px 0 0 -8px; + border: 2px solid transparent; + border-top: 2px solid #fff; + border-radius: 50%; + animation: loading-spin 1s linear infinite; + } + } + } + + .feedback { + text-align: center; + font-size: $font-size-medium; + color: $text-color-primary; + font-weight: $font-weight-normal; + margin-top: $spacing-medium; + } +} diff --git a/pages/order/components/OrderQrcode/index.vue b/pages/order/components/OrderQrcode/index.vue new file mode 100644 index 0000000..9bf810f --- /dev/null +++ b/pages/order/components/OrderQrcode/index.vue @@ -0,0 +1,35 @@ + + + + + \ No newline at end of file diff --git a/pages/order/components/OrderQrcode/styles/index.scss b/pages/order/components/OrderQrcode/styles/index.scss new file mode 100644 index 0000000..fb026af --- /dev/null +++ b/pages/order/components/OrderQrcode/styles/index.scss @@ -0,0 +1,18 @@ +.order-qrcode { + background: #ffffff; + border-radius: 10px; + box-sizing: border-box; + display: flex; + align-items: center; + justify-content: center; + flex-direction: column; + padding: 18px; + margin-bottom: 12px; + + text { + font-size: 12px; + color: #666666; + line-height: 17px; + margin-top: 4px; + } +} diff --git a/pages/order/components/OrderStatusInfo/index.vue b/pages/order/components/OrderStatusInfo/index.vue index 19dbd8a..ddbdf25 100644 --- a/pages/order/components/OrderStatusInfo/index.vue +++ b/pages/order/components/OrderStatusInfo/index.vue @@ -1,19 +1,89 @@ \ No newline at end of file +@import "./styles/index.scss"; + diff --git a/pages/order/components/TopNavBar/index.vue b/pages/order/components/TopNavBar/index.vue index a160644..92c086a 100644 --- a/pages/order/components/TopNavBar/index.vue +++ b/pages/order/components/TopNavBar/index.vue @@ -2,11 +2,8 @@ - + + @@ -57,4 +54,4 @@ const goBack = () => { \ No newline at end of file + diff --git a/pages/order/components/TopNavBar/styles/index.scss b/pages/order/components/TopNavBar/styles/index.scss index cdc929d..1b92fb4 100644 --- a/pages/order/components/TopNavBar/styles/index.scss +++ b/pages/order/components/TopNavBar/styles/index.scss @@ -1,12 +1,9 @@ - - .nav-content { display: flex; align-items: center; height: 40px; box-sizing: border-box; padding-top: 8px; - } .nav-left { @@ -17,11 +14,6 @@ height: 30px; } -.back-icon { - width: 16px; - height: 16px; -} - .nav-center { flex: 1; display: flex; @@ -34,5 +26,3 @@ color: #333; text-align: center; } - - diff --git a/pages/order/components/UserInfo/index.vue b/pages/order/components/UserInfo/index.vue index 7f8c19c..8fe66b5 100644 --- a/pages/order/components/UserInfo/index.vue +++ b/pages/order/components/UserInfo/index.vue @@ -1,22 +1,96 @@ \ No newline at end of file +@import "./styles/index.scss"; + diff --git a/pages/order/detail.vue b/pages/order/detail.vue index 56fe43e..68edacb 100644 --- a/pages/order/detail.vue +++ b/pages/order/detail.vue @@ -1,22 +1,48 @@ \ No newline at end of file +@import "./styles/detail.scss"; + diff --git a/pages/order/images/back.png b/pages/order/images/back.png deleted file mode 100644 index d7133ce..0000000 Binary files a/pages/order/images/back.png and /dev/null differ diff --git a/pages/order/list.vue b/pages/order/list.vue index ecceed3..8ecebd5 100644 --- a/pages/order/list.vue +++ b/pages/order/list.vue @@ -2,6 +2,9 @@ @@ -21,33 +24,21 @@ - - - - \ No newline at end of file + diff --git a/pages/order/styles/detail.scss b/pages/order/styles/detail.scss index f83ed61..b1ccd5a 100644 --- a/pages/order/styles/detail.scss +++ b/pages/order/styles/detail.scss @@ -1,12 +1,7 @@ .order-detail-wrapper { - background: url('./images/header_bg.png'); - background-position: 0 0; - background-size: 100% 242px; - background-repeat: no-repeat; - padding: 60px 15px; + background: url("./images/header_bg.png"); + background-position: 0 0; + background-size: 100% 242px; + background-repeat: no-repeat; + // padding: 60px 15px; } - -.icon-back { - height: 16px; - width: 16px; -} \ No newline at end of file diff --git a/request/api/OrderApi.js b/request/api/OrderApi.js index b9f33e0..9a51536 100644 --- a/request/api/OrderApi.js +++ b/request/api/OrderApi.js @@ -1,12 +1,51 @@ import request from "../base/request"; // 获取用户订单列表 const userOrderList = (args) => { - return request.post('/hotelBiz/order/userOrderList', args); -} + return request.post("/hotelBiz/order/userOrderList", args); +}; // 获取用户订单列表 const userWorkOrderList = (args) => { - return request.post('/hotelBiz/workOrder/userWorkOrderList', args); -} + return request.post("/hotelBiz/workOrder/userWorkOrderList", args); +}; -export { userOrderList, userWorkOrderList } \ No newline at end of file +// 获取订单详情 +const userOrderDetail = (args) => { + return request.post("/hotelBiz/order/userOrderDetail", args); +}; + +// 预下单 +const preOrder = (args) => { + return request.post("/hotelBiz/trade/preOrder", args); +}; + +// 订单支付 +const orderPay = (args) => { + return request.post("/hotelBiz/trade/order", args); +}; + +// 订单取消 +const orderCancel = (args) => { + return request.post("/hotelBiz/trade/cancelRefund", args); +}; + +// 申请退款 +const orderRefund = (args) => { + return request.post("/hotelBiz/trade/applyRefund", args); +}; + +// 未支付订单立即支付 +const orderPayNow = (args) => { + return request.post("/hotelBiz/trade/applyPay", args); +}; + +export { + userOrderList, + userWorkOrderList, + userOrderDetail, + preOrder, + orderPay, + orderCancel, + orderRefund, + orderPayNow, +}; diff --git a/static/fonts/iconfont.css b/static/fonts/iconfont.css new file mode 100644 index 0000000..30ca297 --- /dev/null +++ b/static/fonts/iconfont.css @@ -0,0 +1,17 @@ +@font-face { + font-family: "ZhiNian"; /* Project id 4988933 */ + src: url("/static/fonts/iconfont.ttf") format("truetype"); +} + +.ZhiNian { + font-family: "ZhiNian" !important; + font-style: normal; +} + +.zn-food:before { + content: "\e607"; +} + +.zn-clock:before { + content: "\e600"; +} diff --git a/static/fonts/iconfont.ttf b/static/fonts/iconfont.ttf new file mode 100644 index 0000000..176d41b Binary files /dev/null and b/static/fonts/iconfont.ttf differ diff --git a/uni_modules/uni-icons/changelog.md b/uni_modules/uni-icons/changelog.md new file mode 100644 index 0000000..0261131 --- /dev/null +++ b/uni_modules/uni-icons/changelog.md @@ -0,0 +1,42 @@ +## 2.0.10（2024-06-07） +- 优化 uni-app x 中，size 属性的类型 +## 2.0.9（2024-01-12） +fix: 修复图标大小默认值错误的问题 +## 2.0.8（2023-12-14） +- 修复 项目未使用 ts 情况下，打包报错的bug +## 2.0.7（2023-12-14） +- 修复 size 属性为 string 时，不加单位导致尺寸异常的bug +## 2.0.6（2023-12-11） +- 优化 兼容老版本icon类型，如 top ，bottom 等 +## 2.0.5（2023-12-11） +- 优化 兼容老版本icon类型，如 top ，bottom 等 +## 2.0.4（2023-12-06） +- 优化 uni-app x 下示例项目图标排序 +## 2.0.3（2023-12-06） +- 修复 nvue下引入组件报错的bug +## 2.0.2（2023-12-05） +-优化 size 属性支持单位 +## 2.0.1（2023-12-05） +- 新增 uni-app x 支持定义图标 +## 1.3.5（2022-01-24） +- 优化 size 属性可以传入不带单位的字符串数值 +## 1.3.4（2022-01-24） +- 优化 size 支持其他单位 +## 1.3.3（2022-01-17） +- 修复 nvue 有些图标不显示的bug，兼容老版本图标 +## 1.3.2（2021-12-01） +- 优化 示例可复制图标名称 +## 1.3.1（2021-11-23） +- 优化 兼容旧组件 type 值 +## 1.3.0（2021-11-19） +- 新增 更多图标 +- 优化 自定义图标使用方式 +- 优化 组件UI，并提供设计资源，详见:[https://uniapp.dcloud.io/component/uniui/resource](https://uniapp.dcloud.io/component/uniui/resource) +- 文档迁移，详见:[https://uniapp.dcloud.io/component/uniui/uni-icons](https://uniapp.dcloud.io/component/uniui/uni-icons) +## 1.1.7（2021-11-08） +## 1.2.0（2021-07-30） +- 组件兼容 vue3，如何创建vue3项目，详见 [uni-app 项目支持 vue3 介绍](https://ask.dcloud.net.cn/article/37834) +## 1.1.5（2021-05-12） +- 新增 组件示例地址 +## 1.1.4（2021-02-05） +- 调整为uni_modules目录规范 diff --git a/uni_modules/uni-icons/components/uni-icons/uni-icons.uvue b/uni_modules/uni-icons/components/uni-icons/uni-icons.uvue new file mode 100644 index 0000000..ce307c1 --- /dev/null +++ b/uni_modules/uni-icons/components/uni-icons/uni-icons.uvue @@ -0,0 +1,91 @@ + + + + + diff --git a/uni_modules/uni-icons/components/uni-icons/uni-icons.vue b/uni_modules/uni-icons/components/uni-icons/uni-icons.vue new file mode 100644 index 0000000..9634a9c --- /dev/null +++ b/uni_modules/uni-icons/components/uni-icons/uni-icons.vue @@ -0,0 +1,110 @@ + + + + + diff --git a/uni_modules/uni-icons/components/uni-icons/uniicons.css b/uni_modules/uni-icons/components/uni-icons/uniicons.css new file mode 100644 index 0000000..0a6b6fe --- /dev/null +++ b/uni_modules/uni-icons/components/uni-icons/uniicons.css @@ -0,0 +1,664 @@ + +.uniui-cart-filled:before { + content: "\e6d0"; +} + +.uniui-gift-filled:before { + content: "\e6c4"; +} + +.uniui-color:before { + content: "\e6cf"; +} + +.uniui-wallet:before { + content: "\e6b1"; +} + +.uniui-settings-filled:before { + content: "\e6ce"; +} + +.uniui-auth-filled:before { + content: "\e6cc"; +} + +.uniui-shop-filled:before { + content: "\e6cd"; +} + +.uniui-staff-filled:before { + content: "\e6cb"; +} + +.uniui-vip-filled:before { + content: "\e6c6"; +} + +.uniui-plus-filled:before { + content: "\e6c7"; +} + +.uniui-folder-add-filled:before { + content: "\e6c8"; +} + +.uniui-color-filled:before { + content: "\e6c9"; +} + +.uniui-tune-filled:before { + content: "\e6ca"; +} + +.uniui-calendar-filled:before { + content: "\e6c0"; +} + +.uniui-notification-filled:before { + content: "\e6c1"; +} + +.uniui-wallet-filled:before { + content: "\e6c2"; +} + +.uniui-medal-filled:before { + content: "\e6c3"; +} + +.uniui-fire-filled:before { + content: "\e6c5"; +} + +.uniui-refreshempty:before { + content: "\e6bf"; +} + +.uniui-location-filled:before { + content: "\e6af"; +} + +.uniui-person-filled:before { + content: "\e69d"; +} + +.uniui-personadd-filled:before { + content: "\e698"; +} + +.uniui-arrowthinleft:before { + content: "\e6d2"; +} + +.uniui-arrowthinup:before { + content: "\e6d3"; +} + +.uniui-arrowthindown:before { + content: "\e6d4"; +} + +.uniui-back:before { + content: "\e6b9"; +} + +.uniui-forward:before { + content: "\e6ba"; +} + +.uniui-arrow-right:before { + content: "\e6bb"; +} + +.uniui-arrow-left:before { + content: "\e6bc"; +} + +.uniui-arrow-up:before { + content: "\e6bd"; +} + +.uniui-arrow-down:before { + content: "\e6be"; +} + +.uniui-arrowthinright:before { + content: "\e6d1"; +} + +.uniui-down:before { + content: "\e6b8"; +} + +.uniui-bottom:before { + content: "\e6b8"; +} + +.uniui-arrowright:before { + content: "\e6d5"; +} + +.uniui-right:before { + content: "\e6b5"; +} + +.uniui-up:before { + content: "\e6b6"; +} + +.uniui-top:before { + content: "\e6b6"; +} + +.uniui-left:before { + content: "\e6b7"; +} + +.uniui-arrowup:before { + content: "\e6d6"; +} + +.uniui-eye:before { + content: "\e651"; +} + +.uniui-eye-filled:before { + content: "\e66a"; +} + +.uniui-eye-slash:before { + content: "\e6b3"; +} + +.uniui-eye-slash-filled:before { + content: "\e6b4"; +} + +.uniui-info-filled:before { + content: "\e649"; +} + +.uniui-reload:before { + content: "\e6b2"; +} + +.uniui-micoff-filled:before { + content: "\e6b0"; +} + +.uniui-map-pin-ellipse:before { + content: "\e6ac"; +} + +.uniui-map-pin:before { + content: "\e6ad"; +} + +.uniui-location:before { + content: "\e6ae"; +} + +.uniui-starhalf:before { + content: "\e683"; +} + +.uniui-star:before { + content: "\e688"; +} + +.uniui-star-filled:before { + content: "\e68f"; +} + +.uniui-calendar:before { + content: "\e6a0"; +} + +.uniui-fire:before { + content: "\e6a1"; +} + +.uniui-medal:before { + content: "\e6a2"; +} + +.uniui-font:before { + content: "\e6a3"; +} + +.uniui-gift:before { + content: "\e6a4"; +} + +.uniui-link:before { + content: "\e6a5"; +} + +.uniui-notification:before { + content: "\e6a6"; +} + +.uniui-staff:before { + content: "\e6a7"; +} + +.uniui-vip:before { + content: "\e6a8"; +} + +.uniui-folder-add:before { + content: "\e6a9"; +} + +.uniui-tune:before { + content: "\e6aa"; +} + +.uniui-auth:before { + content: "\e6ab"; +} + +.uniui-person:before { + content: "\e699"; +} + +.uniui-email-filled:before { + content: "\e69a"; +} + +.uniui-phone-filled:before { + content: "\e69b"; +} + +.uniui-phone:before { + content: "\e69c"; +} + +.uniui-email:before { + content: "\e69e"; +} + +.uniui-personadd:before { + content: "\e69f"; +} + +.uniui-chatboxes-filled:before { + content: "\e692"; +} + +.uniui-contact:before { + content: "\e693"; +} + +.uniui-chatbubble-filled:before { + content: "\e694"; +} + +.uniui-contact-filled:before { + content: "\e695"; +} + +.uniui-chatboxes:before { + content: "\e696"; +} + +.uniui-chatbubble:before { + content: "\e697"; +} + +.uniui-upload-filled:before { + content: "\e68e"; +} + +.uniui-upload:before { + content: "\e690"; +} + +.uniui-weixin:before { + content: "\e691"; +} + +.uniui-compose:before { + content: "\e67f"; +} + +.uniui-qq:before { + content: "\e680"; +} + +.uniui-download-filled:before { + content: "\e681"; +} + +.uniui-pyq:before { + content: "\e682"; +} + +.uniui-sound:before { + content: "\e684"; +} + +.uniui-trash-filled:before { + content: "\e685"; +} + +.uniui-sound-filled:before { + content: "\e686"; +} + +.uniui-trash:before { + content: "\e687"; +} + +.uniui-videocam-filled:before { + content: "\e689"; +} + +.uniui-spinner-cycle:before { + content: "\e68a"; +} + +.uniui-weibo:before { + content: "\e68b"; +} + +.uniui-videocam:before { + content: "\e68c"; +} + +.uniui-download:before { + content: "\e68d"; +} + +.uniui-help:before { + content: "\e679"; +} + +.uniui-navigate-filled:before { + content: "\e67a"; +} + +.uniui-plusempty:before { + content: "\e67b"; +} + +.uniui-smallcircle:before { + content: "\e67c"; +} + +.uniui-minus-filled:before { + content: "\e67d"; +} + +.uniui-micoff:before { + content: "\e67e"; +} + +.uniui-closeempty:before { + content: "\e66c"; +} + +.uniui-clear:before { + content: "\e66d"; +} + +.uniui-navigate:before { + content: "\e66e"; +} + +.uniui-minus:before { + content: "\e66f"; +} + +.uniui-image:before { + content: "\e670"; +} + +.uniui-mic:before { + content: "\e671"; +} + +.uniui-paperplane:before { + content: "\e672"; +} + +.uniui-close:before { + content: "\e673"; +} + +.uniui-help-filled:before { + content: "\e674"; +} + +.uniui-paperplane-filled:before { + content: "\e675"; +} + +.uniui-plus:before { + content: "\e676"; +} + +.uniui-mic-filled:before { + content: "\e677"; +} + +.uniui-image-filled:before { + content: "\e678"; +} + +.uniui-locked-filled:before { + content: "\e668"; +} + +.uniui-info:before { + content: "\e669"; +} + +.uniui-locked:before { + content: "\e66b"; +} + +.uniui-camera-filled:before { + content: "\e658"; +} + +.uniui-chat-filled:before { + content: "\e659"; +} + +.uniui-camera:before { + content: "\e65a"; +} + +.uniui-circle:before { + content: "\e65b"; +} + +.uniui-checkmarkempty:before { + content: "\e65c"; +} + +.uniui-chat:before { + content: "\e65d"; +} + +.uniui-circle-filled:before { + content: "\e65e"; +} + +.uniui-flag:before { + content: "\e65f"; +} + +.uniui-flag-filled:before { + content: "\e660"; +} + +.uniui-gear-filled:before { + content: "\e661"; +} + +.uniui-home:before { + content: "\e662"; +} + +.uniui-home-filled:before { + content: "\e663"; +} + +.uniui-gear:before { + content: "\e664"; +} + +.uniui-smallcircle-filled:before { + content: "\e665"; +} + +.uniui-map-filled:before { + content: "\e666"; +} + +.uniui-map:before { + content: "\e667"; +} + +.uniui-refresh-filled:before { + content: "\e656"; +} + +.uniui-refresh:before { + content: "\e657"; +} + +.uniui-cloud-upload:before { + content: "\e645"; +} + +.uniui-cloud-download-filled:before { + content: "\e646"; +} + +.uniui-cloud-download:before { + content: "\e647"; +} + +.uniui-cloud-upload-filled:before { + content: "\e648"; +} + +.uniui-redo:before { + content: "\e64a"; +} + +.uniui-images-filled:before { + content: "\e64b"; +} + +.uniui-undo-filled:before { + content: "\e64c"; +} + +.uniui-more:before { + content: "\e64d"; +} + +.uniui-more-filled:before { + content: "\e64e"; +} + +.uniui-undo:before { + content: "\e64f"; +} + +.uniui-images:before { + content: "\e650"; +} + +.uniui-paperclip:before { + content: "\e652"; +} + +.uniui-settings:before { + content: "\e653"; +} + +.uniui-search:before { + content: "\e654"; +} + +.uniui-redo-filled:before { + content: "\e655"; +} + +.uniui-list:before { + content: "\e644"; +} + +.uniui-mail-open-filled:before { + content: "\e63a"; +} + +.uniui-hand-down-filled:before { + content: "\e63c"; +} + +.uniui-hand-down:before { + content: "\e63d"; +} + +.uniui-hand-up-filled:before { + content: "\e63e"; +} + +.uniui-hand-up:before { + content: "\e63f"; +} + +.uniui-heart-filled:before { + content: "\e641"; +} + +.uniui-mail-open:before { + content: "\e643"; +} + +.uniui-heart:before { + content: "\e639"; +} + +.uniui-loop:before { + content: "\e633"; +} + +.uniui-pulldown:before { + content: "\e632"; +} + +.uniui-scan:before { + content: "\e62a"; +} + +.uniui-bars:before { + content: "\e627"; +} + +.uniui-checkbox:before { + content: "\e62b"; +} + +.uniui-checkbox-filled:before { + content: "\e62c"; +} + +.uniui-shop:before { + content: "\e62f"; +} + +.uniui-headphones:before { + content: "\e630"; +} + +.uniui-cart:before { + content: "\e631"; +} diff --git a/uni_modules/uni-icons/components/uni-icons/uniicons.ttf b/uni_modules/uni-icons/components/uni-icons/uniicons.ttf new file mode 100644 index 0000000..14696d0 Binary files /dev/null and b/uni_modules/uni-icons/components/uni-icons/uniicons.ttf differ diff --git a/uni_modules/uni-icons/components/uni-icons/uniicons_file.ts b/uni_modules/uni-icons/components/uni-icons/uniicons_file.ts new file mode 100644 index 0000000..86318df --- /dev/null +++ b/uni_modules/uni-icons/components/uni-icons/uniicons_file.ts @@ -0,0 +1,664 @@ + +export type IconsData = { + id : string + name : string + font_family : string + css_prefix_text : string + description : string + glyphs : Array +} + +export type IconsDataItem = { + font_class : string + unicode : string +} + + +export const fontData = [ + { + "font_class": "arrow-down", + "unicode": "\ue6be" + }, + { + "font_class": "arrow-left", + "unicode": "\ue6bc" + }, + { + "font_class": "arrow-right", + "unicode": "\ue6bb" + }, + { + "font_class": "arrow-up", + "unicode": "\ue6bd" + }, + { + "font_class": "auth", + "unicode": "\ue6ab" + }, + { + "font_class": "auth-filled", + "unicode": "\ue6cc" + }, + { + "font_class": "back", + "unicode": "\ue6b9" + }, + { + "font_class": "bars", + "unicode": "\ue627" + }, + { + "font_class": "calendar", + "unicode": "\ue6a0" + }, + { + "font_class": "calendar-filled", + "unicode": "\ue6c0" + }, + { + "font_class": "camera", + "unicode": "\ue65a" + }, + { + "font_class": "camera-filled", + "unicode": "\ue658" + }, + { + "font_class": "cart", + "unicode": "\ue631" + }, + { + "font_class": "cart-filled", + "unicode": "\ue6d0" + }, + { + "font_class": "chat", + "unicode": "\ue65d" + }, + { + "font_class": "chat-filled", + "unicode": "\ue659" + }, + { + "font_class": "chatboxes", + "unicode": "\ue696" + }, + { + "font_class": "chatboxes-filled", + "unicode": "\ue692" + }, + { + "font_class": "chatbubble", + "unicode": "\ue697" + }, + { + "font_class": "chatbubble-filled", + "unicode": "\ue694" + }, + { + "font_class": "checkbox", + "unicode": "\ue62b" + }, + { + "font_class": "checkbox-filled", + "unicode": "\ue62c" + }, + { + "font_class": "checkmarkempty", + "unicode": "\ue65c" + }, + { + "font_class": "circle", + "unicode": "\ue65b" + }, + { + "font_class": "circle-filled", + "unicode": "\ue65e" + }, + { + "font_class": "clear", + "unicode": "\ue66d" + }, + { + "font_class": "close", + "unicode": "\ue673" + }, + { + "font_class": "closeempty", + "unicode": "\ue66c" + }, + { + "font_class": "cloud-download", + "unicode": "\ue647" + }, + { + "font_class": "cloud-download-filled", + "unicode": "\ue646" + }, + { + "font_class": "cloud-upload", + "unicode": "\ue645" + }, + { + "font_class": "cloud-upload-filled", + "unicode": "\ue648" + }, + { + "font_class": "color", + "unicode": "\ue6cf" + }, + { + "font_class": "color-filled", + "unicode": "\ue6c9" + }, + { + "font_class": "compose", + "unicode": "\ue67f" + }, + { + "font_class": "contact", + "unicode": "\ue693" + }, + { + "font_class": "contact-filled", + "unicode": "\ue695" + }, + { + "font_class": "down", + "unicode": "\ue6b8" + }, + { + "font_class": "bottom", + "unicode": "\ue6b8" + }, + { + "font_class": "download", + "unicode": "\ue68d" + }, + { + "font_class": "download-filled", + "unicode": "\ue681" + }, + { + "font_class": "email", + "unicode": "\ue69e" + }, + { + "font_class": "email-filled", + "unicode": "\ue69a" + }, + { + "font_class": "eye", + "unicode": "\ue651" + }, + { + "font_class": "eye-filled", + "unicode": "\ue66a" + }, + { + "font_class": "eye-slash", + "unicode": "\ue6b3" + }, + { + "font_class": "eye-slash-filled", + "unicode": "\ue6b4" + }, + { + "font_class": "fire", + "unicode": "\ue6a1" + }, + { + "font_class": "fire-filled", + "unicode": "\ue6c5" + }, + { + "font_class": "flag", + "unicode": "\ue65f" + }, + { + "font_class": "flag-filled", + "unicode": "\ue660" + }, + { + "font_class": "folder-add", + "unicode": "\ue6a9" + }, + { + "font_class": "folder-add-filled", + "unicode": "\ue6c8" + }, + { + "font_class": "font", + "unicode": "\ue6a3" + }, + { + "font_class": "forward", + "unicode": "\ue6ba" + }, + { + "font_class": "gear", + "unicode": "\ue664" + }, + { + "font_class": "gear-filled", + "unicode": "\ue661" + }, + { + "font_class": "gift", + "unicode": "\ue6a4" + }, + { + "font_class": "gift-filled", + "unicode": "\ue6c4" + }, + { + "font_class": "hand-down", + "unicode": "\ue63d" + }, + { + "font_class": "hand-down-filled", + "unicode": "\ue63c" + }, + { + "font_class": "hand-up", + "unicode": "\ue63f" + }, + { + "font_class": "hand-up-filled", + "unicode": "\ue63e" + }, + { + "font_class": "headphones", + "unicode": "\ue630" + }, + { + "font_class": "heart", + "unicode": "\ue639" + }, + { + "font_class": "heart-filled", + "unicode": "\ue641" + }, + { + "font_class": "help", + "unicode": "\ue679" + }, + { + "font_class": "help-filled", + "unicode": "\ue674" + }, + { + "font_class": "home", + "unicode": "\ue662" + }, + { + "font_class": "home-filled", + "unicode": "\ue663" + }, + { + "font_class": "image", + "unicode": "\ue670" + }, + { + "font_class": "image-filled", + "unicode": "\ue678" + }, + { + "font_class": "images", + "unicode": "\ue650" + }, + { + "font_class": "images-filled", + "unicode": "\ue64b" + }, + { + "font_class": "info", + "unicode": "\ue669" + }, + { + "font_class": "info-filled", + "unicode": "\ue649" + }, + { + "font_class": "left", + "unicode": "\ue6b7" + }, + { + "font_class": "link", + "unicode": "\ue6a5" + }, + { + "font_class": "list", + "unicode": "\ue644" + }, + { + "font_class": "location", + "unicode": "\ue6ae" + }, + { + "font_class": "location-filled", + "unicode": "\ue6af" + }, + { + "font_class": "locked", + "unicode": "\ue66b" + }, + { + "font_class": "locked-filled", + "unicode": "\ue668" + }, + { + "font_class": "loop", + "unicode": "\ue633" + }, + { + "font_class": "mail-open", + "unicode": "\ue643" + }, + { + "font_class": "mail-open-filled", + "unicode": "\ue63a" + }, + { + "font_class": "map", + "unicode": "\ue667" + }, + { + "font_class": "map-filled", + "unicode": "\ue666" + }, + { + "font_class": "map-pin", + "unicode": "\ue6ad" + }, + { + "font_class": "map-pin-ellipse", + "unicode": "\ue6ac" + }, + { + "font_class": "medal", + "unicode": "\ue6a2" + }, + { + "font_class": "medal-filled", + "unicode": "\ue6c3" + }, + { + "font_class": "mic", + "unicode": "\ue671" + }, + { + "font_class": "mic-filled", + "unicode": "\ue677" + }, + { + "font_class": "micoff", + "unicode": "\ue67e" + }, + { + "font_class": "micoff-filled", + "unicode": "\ue6b0" + }, + { + "font_class": "minus", + "unicode": "\ue66f" + }, + { + "font_class": "minus-filled", + "unicode": "\ue67d" + }, + { + "font_class": "more", + "unicode": "\ue64d" + }, + { + "font_class": "more-filled", + "unicode": "\ue64e" + }, + { + "font_class": "navigate", + "unicode": "\ue66e" + }, + { + "font_class": "navigate-filled", + "unicode": "\ue67a" + }, + { + "font_class": "notification", + "unicode": "\ue6a6" + }, + { + "font_class": "notification-filled", + "unicode": "\ue6c1" + }, + { + "font_class": "paperclip", + "unicode": "\ue652" + }, + { + "font_class": "paperplane", + "unicode": "\ue672" + }, + { + "font_class": "paperplane-filled", + "unicode": "\ue675" + }, + { + "font_class": "person", + "unicode": "\ue699" + }, + { + "font_class": "person-filled", + "unicode": "\ue69d" + }, + { + "font_class": "personadd", + "unicode": "\ue69f" + }, + { + "font_class": "personadd-filled", + "unicode": "\ue698" + }, + { + "font_class": "personadd-filled-copy", + "unicode": "\ue6d1" + }, + { + "font_class": "phone", + "unicode": "\ue69c" + }, + { + "font_class": "phone-filled", + "unicode": "\ue69b" + }, + { + "font_class": "plus", + "unicode": "\ue676" + }, + { + "font_class": "plus-filled", + "unicode": "\ue6c7" + }, + { + "font_class": "plusempty", + "unicode": "\ue67b" + }, + { + "font_class": "pulldown", + "unicode": "\ue632" + }, + { + "font_class": "pyq", + "unicode": "\ue682" + }, + { + "font_class": "qq", + "unicode": "\ue680" + }, + { + "font_class": "redo", + "unicode": "\ue64a" + }, + { + "font_class": "redo-filled", + "unicode": "\ue655" + }, + { + "font_class": "refresh", + "unicode": "\ue657" + }, + { + "font_class": "refresh-filled", + "unicode": "\ue656" + }, + { + "font_class": "refreshempty", + "unicode": "\ue6bf" + }, + { + "font_class": "reload", + "unicode": "\ue6b2" + }, + { + "font_class": "right", + "unicode": "\ue6b5" + }, + { + "font_class": "scan", + "unicode": "\ue62a" + }, + { + "font_class": "search", + "unicode": "\ue654" + }, + { + "font_class": "settings", + "unicode": "\ue653" + }, + { + "font_class": "settings-filled", + "unicode": "\ue6ce" + }, + { + "font_class": "shop", + "unicode": "\ue62f" + }, + { + "font_class": "shop-filled", + "unicode": "\ue6cd" + }, + { + "font_class": "smallcircle", + "unicode": "\ue67c" + }, + { + "font_class": "smallcircle-filled", + "unicode": "\ue665" + }, + { + "font_class": "sound", + "unicode": "\ue684" + }, + { + "font_class": "sound-filled", + "unicode": "\ue686" + }, + { + "font_class": "spinner-cycle", + "unicode": "\ue68a" + }, + { + "font_class": "staff", + "unicode": "\ue6a7" + }, + { + "font_class": "staff-filled", + "unicode": "\ue6cb" + }, + { + "font_class": "star", + "unicode": "\ue688" + }, + { + "font_class": "star-filled", + "unicode": "\ue68f" + }, + { + "font_class": "starhalf", + "unicode": "\ue683" + }, + { + "font_class": "trash", + "unicode": "\ue687" + }, + { + "font_class": "trash-filled", + "unicode": "\ue685" + }, + { + "font_class": "tune", + "unicode": "\ue6aa" + }, + { + "font_class": "tune-filled", + "unicode": "\ue6ca" + }, + { + "font_class": "undo", + "unicode": "\ue64f" + }, + { + "font_class": "undo-filled", + "unicode": "\ue64c" + }, + { + "font_class": "up", + "unicode": "\ue6b6" + }, + { + "font_class": "top", + "unicode": "\ue6b6" + }, + { + "font_class": "upload", + "unicode": "\ue690" + }, + { + "font_class": "upload-filled", + "unicode": "\ue68e" + }, + { + "font_class": "videocam", + "unicode": "\ue68c" + }, + { + "font_class": "videocam-filled", + "unicode": "\ue689" + }, + { + "font_class": "vip", + "unicode": "\ue6a8" + }, + { + "font_class": "vip-filled", + "unicode": "\ue6c6" + }, + { + "font_class": "wallet", + "unicode": "\ue6b1" + }, + { + "font_class": "wallet-filled", + "unicode": "\ue6c2" + }, + { + "font_class": "weibo", + "unicode": "\ue68b" + }, + { + "font_class": "weixin", + "unicode": "\ue691" + } +] as IconsDataItem[] + +// export const fontData = JSON.parse(fontDataJson) diff --git a/uni_modules/uni-icons/components/uni-icons/uniicons_file_vue.js b/uni_modules/uni-icons/components/uni-icons/uniicons_file_vue.js new file mode 100644 index 0000000..49e42cd --- /dev/null +++ b/uni_modules/uni-icons/components/uni-icons/uniicons_file_vue.js @@ -0,0 +1,649 @@ + +export const fontData = [ + { + "font_class": "arrow-down", + "unicode": "\ue6be" + }, + { + "font_class": "arrow-left", + "unicode": "\ue6bc" + }, + { + "font_class": "arrow-right", + "unicode": "\ue6bb" + }, + { + "font_class": "arrow-up", + "unicode": "\ue6bd" + }, + { + "font_class": "auth", + "unicode": "\ue6ab" + }, + { + "font_class": "auth-filled", + "unicode": "\ue6cc" + }, + { + "font_class": "back", + "unicode": "\ue6b9" + }, + { + "font_class": "bars", + "unicode": "\ue627" + }, + { + "font_class": "calendar", + "unicode": "\ue6a0" + }, + { + "font_class": "calendar-filled", + "unicode": "\ue6c0" + }, + { + "font_class": "camera", + "unicode": "\ue65a" + }, + { + "font_class": "camera-filled", + "unicode": "\ue658" + }, + { + "font_class": "cart", + "unicode": "\ue631" + }, + { + "font_class": "cart-filled", + "unicode": "\ue6d0" + }, + { + "font_class": "chat", + "unicode": "\ue65d" + }, + { + "font_class": "chat-filled", + "unicode": "\ue659" + }, + { + "font_class": "chatboxes", + "unicode": "\ue696" + }, + { + "font_class": "chatboxes-filled", + "unicode": "\ue692" + }, + { + "font_class": "chatbubble", + "unicode": "\ue697" + }, + { + "font_class": "chatbubble-filled", + "unicode": "\ue694" + }, + { + "font_class": "checkbox", + "unicode": "\ue62b" + }, + { + "font_class": "checkbox-filled", + "unicode": "\ue62c" + }, + { + "font_class": "checkmarkempty", + "unicode": "\ue65c" + }, + { + "font_class": "circle", + "unicode": "\ue65b" + }, + { + "font_class": "circle-filled", + "unicode": "\ue65e" + }, + { + "font_class": "clear", + "unicode": "\ue66d" + }, + { + "font_class": "close", + "unicode": "\ue673" + }, + { + "font_class": "closeempty", + "unicode": "\ue66c" + }, + { + "font_class": "cloud-download", + "unicode": "\ue647" + }, + { + "font_class": "cloud-download-filled", + "unicode": "\ue646" + }, + { + "font_class": "cloud-upload", + "unicode": "\ue645" + }, + { + "font_class": "cloud-upload-filled", + "unicode": "\ue648" + }, + { + "font_class": "color", + "unicode": "\ue6cf" + }, + { + "font_class": "color-filled", + "unicode": "\ue6c9" + }, + { + "font_class": "compose", + "unicode": "\ue67f" + }, + { + "font_class": "contact", + "unicode": "\ue693" + }, + { + "font_class": "contact-filled", + "unicode": "\ue695" + }, + { + "font_class": "down", + "unicode": "\ue6b8" + }, + { + "font_class": "bottom", + "unicode": "\ue6b8" + }, + { + "font_class": "download", + "unicode": "\ue68d" + }, + { + "font_class": "download-filled", + "unicode": "\ue681" + }, + { + "font_class": "email", + "unicode": "\ue69e" + }, + { + "font_class": "email-filled", + "unicode": "\ue69a" + }, + { + "font_class": "eye", + "unicode": "\ue651" + }, + { + "font_class": "eye-filled", + "unicode": "\ue66a" + }, + { + "font_class": "eye-slash", + "unicode": "\ue6b3" + }, + { + "font_class": "eye-slash-filled", + "unicode": "\ue6b4" + }, + { + "font_class": "fire", + "unicode": "\ue6a1" + }, + { + "font_class": "fire-filled", + "unicode": "\ue6c5" + }, + { + "font_class": "flag", + "unicode": "\ue65f" + }, + { + "font_class": "flag-filled", + "unicode": "\ue660" + }, + { + "font_class": "folder-add", + "unicode": "\ue6a9" + }, + { + "font_class": "folder-add-filled", + "unicode": "\ue6c8" + }, + { + "font_class": "font", + "unicode": "\ue6a3" + }, + { + "font_class": "forward", + "unicode": "\ue6ba" + }, + { + "font_class": "gear", + "unicode": "\ue664" + }, + { + "font_class": "gear-filled", + "unicode": "\ue661" + }, + { + "font_class": "gift", + "unicode": "\ue6a4" + }, + { + "font_class": "gift-filled", + "unicode": "\ue6c4" + }, + { + "font_class": "hand-down", + "unicode": "\ue63d" + }, + { + "font_class": "hand-down-filled", + "unicode": "\ue63c" + }, + { + "font_class": "hand-up", + "unicode": "\ue63f" + }, + { + "font_class": "hand-up-filled", + "unicode": "\ue63e" + }, + { + "font_class": "headphones", + "unicode": "\ue630" + }, + { + "font_class": "heart", + "unicode": "\ue639" + }, + { + "font_class": "heart-filled", + "unicode": "\ue641" + }, + { + "font_class": "help", + "unicode": "\ue679" + }, + { + "font_class": "help-filled", + "unicode": "\ue674" + }, + { + "font_class": "home", + "unicode": "\ue662" + }, + { + "font_class": "home-filled", + "unicode": "\ue663" + }, + { + "font_class": "image", + "unicode": "\ue670" + }, + { + "font_class": "image-filled", + "unicode": "\ue678" + }, + { + "font_class": "images", + "unicode": "\ue650" + }, + { + "font_class": "images-filled", + "unicode": "\ue64b" + }, + { + "font_class": "info", + "unicode": "\ue669" + }, + { + "font_class": "info-filled", + "unicode": "\ue649" + }, + { + "font_class": "left", + "unicode": "\ue6b7" + }, + { + "font_class": "link", + "unicode": "\ue6a5" + }, + { + "font_class": "list", + "unicode": "\ue644" + }, + { + "font_class": "location", + "unicode": "\ue6ae" + }, + { + "font_class": "location-filled", + "unicode": "\ue6af" + }, + { + "font_class": "locked", + "unicode": "\ue66b" + }, + { + "font_class": "locked-filled", + "unicode": "\ue668" + }, + { + "font_class": "loop", + "unicode": "\ue633" + }, + { + "font_class": "mail-open", + "unicode": "\ue643" + }, + { + "font_class": "mail-open-filled", + "unicode": "\ue63a" + }, + { + "font_class": "map", + "unicode": "\ue667" + }, + { + "font_class": "map-filled", + "unicode": "\ue666" + }, + { + "font_class": "map-pin", + "unicode": "\ue6ad" + }, + { + "font_class": "map-pin-ellipse", + "unicode": "\ue6ac" + }, + { + "font_class": "medal", + "unicode": "\ue6a2" + }, + { + "font_class": "medal-filled", + "unicode": "\ue6c3" + }, + { + "font_class": "mic", + "unicode": "\ue671" + }, + { + "font_class": "mic-filled", + "unicode": "\ue677" + }, + { + "font_class": "micoff", + "unicode": "\ue67e" + }, + { + "font_class": "micoff-filled", + "unicode": "\ue6b0" + }, + { + "font_class": "minus", + "unicode": "\ue66f" + }, + { + "font_class": "minus-filled", + "unicode": "\ue67d" + }, + { + "font_class": "more", + "unicode": "\ue64d" + }, + { + "font_class": "more-filled", + "unicode": "\ue64e" + }, + { + "font_class": "navigate", + "unicode": "\ue66e" + }, + { + "font_class": "navigate-filled", + "unicode": "\ue67a" + }, + { + "font_class": "notification", + "unicode": "\ue6a6" + }, + { + "font_class": "notification-filled", + "unicode": "\ue6c1" + }, + { + "font_class": "paperclip", + "unicode": "\ue652" + }, + { + "font_class": "paperplane", + "unicode": "\ue672" + }, + { + "font_class": "paperplane-filled", + "unicode": "\ue675" + }, + { + "font_class": "person", + "unicode": "\ue699" + }, + { + "font_class": "person-filled", + "unicode": "\ue69d" + }, + { + "font_class": "personadd", + "unicode": "\ue69f" + }, + { + "font_class": "personadd-filled", + "unicode": "\ue698" + }, + { + "font_class": "personadd-filled-copy", + "unicode": "\ue6d1" + }, + { + "font_class": "phone", + "unicode": "\ue69c" + }, + { + "font_class": "phone-filled", + "unicode": "\ue69b" + }, + { + "font_class": "plus", + "unicode": "\ue676" + }, + { + "font_class": "plus-filled", + "unicode": "\ue6c7" + }, + { + "font_class": "plusempty", + "unicode": "\ue67b" + }, + { + "font_class": "pulldown", + "unicode": "\ue632" + }, + { + "font_class": "pyq", + "unicode": "\ue682" + }, + { + "font_class": "qq", + "unicode": "\ue680" + }, + { + "font_class": "redo", + "unicode": "\ue64a" + }, + { + "font_class": "redo-filled", + "unicode": "\ue655" + }, + { + "font_class": "refresh", + "unicode": "\ue657" + }, + { + "font_class": "refresh-filled", + "unicode": "\ue656" + }, + { + "font_class": "refreshempty", + "unicode": "\ue6bf" + }, + { + "font_class": "reload", + "unicode": "\ue6b2" + }, + { + "font_class": "right", + "unicode": "\ue6b5" + }, + { + "font_class": "scan", + "unicode": "\ue62a" + }, + { + "font_class": "search", + "unicode": "\ue654" + }, + { + "font_class": "settings", + "unicode": "\ue653" + }, + { + "font_class": "settings-filled", + "unicode": "\ue6ce" + }, + { + "font_class": "shop", + "unicode": "\ue62f" + }, + { + "font_class": "shop-filled", + "unicode": "\ue6cd" + }, + { + "font_class": "smallcircle", + "unicode": "\ue67c" + }, + { + "font_class": "smallcircle-filled", + "unicode": "\ue665" + }, + { + "font_class": "sound", + "unicode": "\ue684" + }, + { + "font_class": "sound-filled", + "unicode": "\ue686" + }, + { + "font_class": "spinner-cycle", + "unicode": "\ue68a" + }, + { + "font_class": "staff", + "unicode": "\ue6a7" + }, + { + "font_class": "staff-filled", + "unicode": "\ue6cb" + }, + { + "font_class": "star", + "unicode": "\ue688" + }, + { + "font_class": "star-filled", + "unicode": "\ue68f" + }, + { + "font_class": "starhalf", + "unicode": "\ue683" + }, + { + "font_class": "trash", + "unicode": "\ue687" + }, + { + "font_class": "trash-filled", + "unicode": "\ue685" + }, + { + "font_class": "tune", + "unicode": "\ue6aa" + }, + { + "font_class": "tune-filled", + "unicode": "\ue6ca" + }, + { + "font_class": "undo", + "unicode": "\ue64f" + }, + { + "font_class": "undo-filled", + "unicode": "\ue64c" + }, + { + "font_class": "up", + "unicode": "\ue6b6" + }, + { + "font_class": "top", + "unicode": "\ue6b6" + }, + { + "font_class": "upload", + "unicode": "\ue690" + }, + { + "font_class": "upload-filled", + "unicode": "\ue68e" + }, + { + "font_class": "videocam", + "unicode": "\ue68c" + }, + { + "font_class": "videocam-filled", + "unicode": "\ue689" + }, + { + "font_class": "vip", + "unicode": "\ue6a8" + }, + { + "font_class": "vip-filled", + "unicode": "\ue6c6" + }, + { + "font_class": "wallet", + "unicode": "\ue6b1" + }, + { + "font_class": "wallet-filled", + "unicode": "\ue6c2" + }, + { + "font_class": "weibo", + "unicode": "\ue68b" + }, + { + "font_class": "weixin", + "unicode": "\ue691" + } +] + +// export const fontData = JSON.parse(fontDataJson) diff --git a/uni_modules/uni-icons/package.json b/uni_modules/uni-icons/package.json new file mode 100644 index 0000000..6b681b4 --- /dev/null +++ b/uni_modules/uni-icons/package.json @@ -0,0 +1,89 @@ +{ + "id": "uni-icons", + "displayName": "uni-icons 图标", + "version": "2.0.10", + "description": "图标组件，用于展示移动端常见的图标，可自定义颜色、大小。", + "keywords": [ + "uni-ui", + "uniui", + "icon", + "图标" +], + "repository": "https://github.com/dcloudio/uni-ui", + "engines": { + "HBuilderX": "^3.2.14" + }, + "directories": { + "example": "../../temps/example_temps" + }, +"dcloudext": { + "sale": { + "regular": { + "price": "0.00" + }, + "sourcecode": { + "price": "0.00" + } + }, + "contact": { + "qq": "" + }, + "declaration": { + "ads": "无", + "data": "无", + "permissions": "无" + }, + "npmurl": "https://www.npmjs.com/package/@dcloudio/uni-ui", + "type": "component-vue" + }, + "uni_modules": { + "dependencies": ["uni-scss"], + "encrypt": [], + "platforms": { + "cloud": { + "tcb": "y", + "aliyun": "y", + "alipay": "n" + }, + "client": { + "App": { + "app-vue": "y", + "app-nvue": "y", + "app-uvue": "y" + }, + "H5-mobile": { + "Safari": "y", + "Android Browser": "y", + "微信浏览器(Android)": "y", + "QQ浏览器(Android)": "y" + }, + "H5-pc": { + "Chrome": "y", + "IE": "y", + "Edge": "y", + "Firefox": "y", + "Safari": "y" + }, + "小程序": { + "微信": "y", + "阿里": "y", + "百度": "y", + "字节跳动": "y", + "QQ": "y", + "钉钉": "y", + "快手": "y", + "飞书": "y", + "京东": "y" + }, + "快应用": { + "华为": "y", + "联盟": "y" + }, + "Vue": { + "vue2": "y", + "vue3": "y" + } + } + } + } +} diff --git a/uni_modules/uni-icons/readme.md b/uni_modules/uni-icons/readme.md new file mode 100644 index 0000000..86234ba --- /dev/null +++ b/uni_modules/uni-icons/readme.md @@ -0,0 +1,8 @@ +## Icons 图标 +> **组件名：uni-icons** +> 代码块： `uIcons` + +用于展示 icons 图标 。 + +### [查看文档](https://uniapp.dcloud.io/component/uniui/uni-icons) +#### 如使用过程中有任何问题，或者您对uni-ui有一些好的建议，欢迎加入 uni-ui 交流群：871950839 diff --git a/uni_modules/uni-scss/changelog.md b/uni_modules/uni-scss/changelog.md new file mode 100644 index 0000000..b863bb0 --- /dev/null +++ b/uni_modules/uni-scss/changelog.md @@ -0,0 +1,8 @@ +## 1.0.3（2022-01-21） +- 优化 组件示例 +## 1.0.2（2021-11-22） +- 修复 / 符号在 vue 不同版本兼容问题引起的报错问题 +## 1.0.1（2021-11-22） +- 修复 vue3中scss语法兼容问题 +## 1.0.0（2021-11-18） +- init diff --git a/uni_modules/uni-scss/index.scss b/uni_modules/uni-scss/index.scss new file mode 100644 index 0000000..1744a5f --- /dev/null +++ b/uni_modules/uni-scss/index.scss @@ -0,0 +1 @@ +@import './styles/index.scss'; diff --git a/uni_modules/uni-scss/package.json b/uni_modules/uni-scss/package.json new file mode 100644 index 0000000..7cc0ccb --- /dev/null +++ b/uni_modules/uni-scss/package.json @@ -0,0 +1,82 @@ +{ + "id": "uni-scss", + "displayName": "uni-scss 辅助样式", + "version": "1.0.3", + "description": "uni-sass是uni-ui提供的一套全局样式 ，通过一些简单的类名和sass变量，实现简单的页面布局操作，比如颜色、边距、圆角等。", + "keywords": [ + "uni-scss", + "uni-ui", + "辅助样式" +], + "repository": "https://github.com/dcloudio/uni-ui", + "engines": { + "HBuilderX": "^3.1.0" + }, + "dcloudext": { + "category": [ + "JS SDK", + "通用 SDK" + ], + "sale": { + "regular": { + "price": "0.00" + }, + "sourcecode": { + "price": "0.00" + } + }, + "contact": { + "qq": "" + }, + "declaration": { + "ads": "无", + "data": "无", + "permissions": "无" + }, + "npmurl": "https://www.npmjs.com/package/@dcloudio/uni-ui" + }, + "uni_modules": { + "dependencies": [], + "encrypt": [], + "platforms": { + "cloud": { + "tcb": "y", + "aliyun": "y" + }, + "client": { + "App": { + "app-vue": "y", + "app-nvue": "u" + }, + "H5-mobile": { + "Safari": "y", + "Android Browser": "y", + "微信浏览器(Android)": "y", + "QQ浏览器(Android)": "y" + }, + "H5-pc": { + "Chrome": "y", + "IE": "y", + "Edge": "y", + "Firefox": "y", + "Safari": "y" + }, + "小程序": { + "微信": "y", + "阿里": "y", + "百度": "y", + "字节跳动": "y", + "QQ": "y" + }, + "快应用": { + "华为": "n", + "联盟": "n" + }, + "Vue": { + "vue2": "y", + "vue3": "y" + } + } + } + } +} diff --git a/uni_modules/uni-scss/readme.md b/uni_modules/uni-scss/readme.md new file mode 100644 index 0000000..b7d1c25 --- /dev/null +++ b/uni_modules/uni-scss/readme.md @@ -0,0 +1,4 @@ +`uni-sass` 是 `uni-ui`提供的一套全局样式 ，通过一些简单的类名和`sass`变量，实现简单的页面布局操作，比如颜色、边距、圆角等。 + +### [查看文档](https://uniapp.dcloud.io/component/uniui/uni-sass) +#### 如使用过程中有任何问题，或者您对uni-ui有一些好的建议，欢迎加入 uni-ui 交流群：871950839 \ No newline at end of file diff --git a/uni_modules/uni-scss/styles/index.scss b/uni_modules/uni-scss/styles/index.scss new file mode 100644 index 0000000..ffac4fe --- /dev/null +++ b/uni_modules/uni-scss/styles/index.scss @@ -0,0 +1,7 @@ +@import './setting/_variables.scss'; +@import './setting/_border.scss'; +@import './setting/_color.scss'; +@import './setting/_space.scss'; +@import './setting/_radius.scss'; +@import './setting/_text.scss'; +@import './setting/_styles.scss'; diff --git a/uni_modules/uni-scss/styles/setting/_border.scss b/uni_modules/uni-scss/styles/setting/_border.scss new file mode 100644 index 0000000..12a11c3 --- /dev/null +++ b/uni_modules/uni-scss/styles/setting/_border.scss @@ -0,0 +1,3 @@ +.uni-border { + border: 1px $uni-border-1 solid; +} \ No newline at end of file diff --git a/uni_modules/uni-scss/styles/setting/_color.scss b/uni_modules/uni-scss/styles/setting/_color.scss new file mode 100644 index 0000000..1ededd9 --- /dev/null +++ b/uni_modules/uni-scss/styles/setting/_color.scss @@ -0,0 +1,66 @@ + +// TODO 暂时不需要 class ，需要用户使用变量实现 ，如果使用类名其实并不推荐 +// @mixin get-styles($k,$c) { +// @if $k == size or $k == weight{ +// font-#{$k}:#{$c} +// }@else{ +// #{$k}:#{$c} +// } +// } +$uni-ui-color:( + // 主色 + primary: $uni-primary, + primary-disable: $uni-primary-disable, + primary-light: $uni-primary-light, + // 辅助色 + success: $uni-success, + success-disable: $uni-success-disable, + success-light: $uni-success-light, + warning: $uni-warning, + warning-disable: $uni-warning-disable, + warning-light: $uni-warning-light, + error: $uni-error, + error-disable: $uni-error-disable, + error-light: $uni-error-light, + info: $uni-info, + info-disable: $uni-info-disable, + info-light: $uni-info-light, + // 中性色 + main-color: $uni-main-color, + base-color: $uni-base-color, + secondary-color: $uni-secondary-color, + extra-color: $uni-extra-color, + // 背景色 + bg-color: $uni-bg-color, + // 边框颜色 + border-1: $uni-border-1, + border-2: $uni-border-2, + border-3: $uni-border-3, + border-4: $uni-border-4, + // 黑色 + black:$uni-black, + // 白色 + white:$uni-white, + // 透明 + transparent:$uni-transparent +) !default; +@each $key, $child in $uni-ui-color { + .uni-#{"" + $key} { + color: $child; + } + .uni-#{"" + $key}-bg { + background-color: $child; + } +} +.uni-shadow-sm { + box-shadow: $uni-shadow-sm; +} +.uni-shadow-base { + box-shadow: $uni-shadow-base; +} +.uni-shadow-lg { + box-shadow: $uni-shadow-lg; +} +.uni-mask { + background-color:$uni-mask; +} diff --git a/uni_modules/uni-scss/styles/setting/_radius.scss b/uni_modules/uni-scss/styles/setting/_radius.scss new file mode 100644 index 0000000..9a0428b --- /dev/null +++ b/uni_modules/uni-scss/styles/setting/_radius.scss @@ -0,0 +1,55 @@ +@mixin radius($r,$d:null ,$important: false){ + $radius-value:map-get($uni-radius, $r) if($important, !important, null); + // Key exists within the $uni-radius variable + @if (map-has-key($uni-radius, $r) and $d){ + @if $d == t { + border-top-left-radius:$radius-value; + border-top-right-radius:$radius-value; + }@else if $d == r { + border-top-right-radius:$radius-value; + border-bottom-right-radius:$radius-value; + }@else if $d == b { + border-bottom-left-radius:$radius-value; + border-bottom-right-radius:$radius-value; + }@else if $d == l { + border-top-left-radius:$radius-value; + border-bottom-left-radius:$radius-value; + }@else if $d == tl { + border-top-left-radius:$radius-value; + }@else if $d == tr { + border-top-right-radius:$radius-value; + }@else if $d == br { + border-bottom-right-radius:$radius-value; + }@else if $d == bl { + border-bottom-left-radius:$radius-value; + } + }@else{ + border-radius:$radius-value; + } +} + +@each $key, $child in $uni-radius { + @if($key){ + .uni-radius-#{"" + $key} { + @include radius($key) + } + }@else{ + .uni-radius { + @include radius($key) + } + } +} + +@each $direction in t, r, b, l,tl, tr, br, bl { + @each $key, $child in $uni-radius { + @if($key){ + .uni-radius-#{"" + $direction}-#{"" + $key} { + @include radius($key,$direction,false) + } + }@else{ + .uni-radius-#{$direction} { + @include radius($key,$direction,false) + } + } + } +} diff --git a/uni_modules/uni-scss/styles/setting/_space.scss b/uni_modules/uni-scss/styles/setting/_space.scss new file mode 100644 index 0000000..3c89528 --- /dev/null +++ b/uni_modules/uni-scss/styles/setting/_space.scss @@ -0,0 +1,56 @@ + +@mixin fn($space,$direction,$size,$n) { + @if $n { + #{$space}-#{$direction}: #{$size*$uni-space-root}px + } @else { + #{$space}-#{$direction}: #{-$size*$uni-space-root}px + } +} +@mixin get-styles($direction,$i,$space,$n){ + @if $direction == t { + @include fn($space, top,$i,$n); + } + @if $direction == r { + @include fn($space, right,$i,$n); + } + @if $direction == b { + @include fn($space, bottom,$i,$n); + } + @if $direction == l { + @include fn($space, left,$i,$n); + } + @if $direction == x { + @include fn($space, left,$i,$n); + @include fn($space, right,$i,$n); + } + @if $direction == y { + @include fn($space, top,$i,$n); + @include fn($space, bottom,$i,$n); + } + @if $direction == a { + @if $n { + #{$space}:#{$i*$uni-space-root}px; + } @else { + #{$space}:#{-$i*$uni-space-root}px; + } + } +} + +@each $orientation in m,p { + $space: margin; + @if $orientation == m { + $space: margin; + } @else { + $space: padding; + } + @for $i from 0 through 16 { + @each $direction in t, r, b, l, x, y, a { + .uni-#{$orientation}#{$direction}-#{$i} { + @include get-styles($direction,$i,$space,true); + } + .uni-#{$orientation}#{$direction}-n#{$i} { + @include get-styles($direction,$i,$space,false); + } + } + } +} \ No newline at end of file diff --git a/uni_modules/uni-scss/styles/setting/_styles.scss b/uni_modules/uni-scss/styles/setting/_styles.scss new file mode 100644 index 0000000..689afec --- /dev/null +++ b/uni_modules/uni-scss/styles/setting/_styles.scss @@ -0,0 +1,167 @@ +/* #ifndef APP-NVUE */ + +$-color-white:#fff; +$-color-black:#000; +@mixin base-style($color) { + color: #fff; + background-color: $color; + border-color: mix($-color-black, $color, 8%); + &:not([hover-class]):active { + background: mix($-color-black, $color, 10%); + border-color: mix($-color-black, $color, 20%); + color: $-color-white; + outline: none; + } +} +@mixin is-color($color) { + @include base-style($color); + &[loading] { + @include base-style($color); + &::before { + margin-right:5px; + } + } + &[disabled] { + &, + &[loading], + &:not([hover-class]):active { + color: $-color-white; + border-color: mix(darken($color,10%), $-color-white); + background-color: mix($color, $-color-white); + } + } + +} +@mixin base-plain-style($color) { + color:$color; + background-color: mix($-color-white, $color, 90%); + border-color: mix($-color-white, $color, 70%); + &:not([hover-class]):active { + background: mix($-color-white, $color, 80%); + color: $color; + outline: none; + border-color: mix($-color-white, $color, 50%); + } +} +@mixin is-plain($color){ + &[plain] { + @include base-plain-style($color); + &[loading] { + @include base-plain-style($color); + &::before { + margin-right:5px; + } + } + &[disabled] { + &, + &:active { + color: mix($-color-white, $color, 40%); + background-color: mix($-color-white, $color, 90%); + border-color: mix($-color-white, $color, 80%); + } + } + } +} + + +.uni-btn { + margin: 5px; + color: #393939; + border:1px solid #ccc; + font-size: 16px; + font-weight: 200; + background-color: #F9F9F9; + // TODO 暂时处理边框隐藏一边的问题 + overflow: visible; + &::after{ + border: none; + } + + &:not([type]),&[type=default] { + color: #999; + &[loading] { + background: none; + &::before { + margin-right:5px; + } + } + + + + &[disabled]{ + color: mix($-color-white, #999, 60%); + &, + &[loading], + &:active { + color: mix($-color-white, #999, 60%); + background-color: mix($-color-white,$-color-black , 98%); + border-color: mix($-color-white, #999, 85%); + } + } + + &[plain] { + color: #999; + background: none; + border-color: $uni-border-1; + &:not([hover-class]):active { + background: none; + color: mix($-color-white, $-color-black, 80%); + border-color: mix($-color-white, $-color-black, 90%); + outline: none; + } + &[disabled]{ + &, + &[loading], + &:active { + background: none; + color: mix($-color-white, #999, 60%); + border-color: mix($-color-white, #999, 85%); + } + } + } + } + + &:not([hover-class]):active { + color: mix($-color-white, $-color-black, 50%); + } + + &[size=mini] { + font-size: 16px; + font-weight: 200; + border-radius: 8px; + } + + + + &.uni-btn-small { + font-size: 14px; + } + &.uni-btn-mini { + font-size: 12px; + } + + &.uni-btn-radius { + border-radius: 999px; + } + &[type=primary] { + @include is-color($uni-primary); + @include is-plain($uni-primary) + } + &[type=success] { + @include is-color($uni-success); + @include is-plain($uni-success) + } + &[type=error] { + @include is-color($uni-error); + @include is-plain($uni-error) + } + &[type=warning] { + @include is-color($uni-warning); + @include is-plain($uni-warning) + } + &[type=info] { + @include is-color($uni-info); + @include is-plain($uni-info) + } +} +/* #endif */ diff --git a/uni_modules/uni-scss/styles/setting/_text.scss b/uni_modules/uni-scss/styles/setting/_text.scss new file mode 100644 index 0000000..a34d08f --- /dev/null +++ b/uni_modules/uni-scss/styles/setting/_text.scss @@ -0,0 +1,24 @@ +@mixin get-styles($k,$c) { + @if $k == size or $k == weight{ + font-#{$k}:#{$c} + }@else{ + #{$k}:#{$c} + } +} + +@each $key, $child in $uni-headings { + /* #ifndef APP-NVUE */ + .uni-#{$key} { + @each $k, $c in $child { + @include get-styles($k,$c) + } + } + /* #endif */ + /* #ifdef APP-NVUE */ + .container .uni-#{$key} { + @each $k, $c in $child { + @include get-styles($k,$c) + } + } + /* #endif */ +} diff --git a/uni_modules/uni-scss/styles/setting/_variables.scss b/uni_modules/uni-scss/styles/setting/_variables.scss new file mode 100644 index 0000000..557d3d7 --- /dev/null +++ b/uni_modules/uni-scss/styles/setting/_variables.scss @@ -0,0 +1,146 @@ +// @use "sass:math"; +@import '../tools/functions.scss'; +// 间距基础倍数 +$uni-space-root: 2 !default; +// 边框半径默认值 +$uni-radius-root:5px !default; +$uni-radius: () !default; +// 边框半径断点 +$uni-radius: map-deep-merge( + ( + 0: 0, + // TODO 当前版本暂时不支持 sm 属性 + // 'sm': math.div($uni-radius-root, 2), + null: $uni-radius-root, + 'lg': $uni-radius-root * 2, + 'xl': $uni-radius-root * 6, + 'pill': 9999px, + 'circle': 50% + ), + $uni-radius +); +// 字体家族 +$body-font-family: 'Roboto', sans-serif !default; +// 文本 +$heading-font-family: $body-font-family !default; +$uni-headings: () !default; +$letterSpacing: -0.01562em; +$uni-headings: map-deep-merge( + ( + 'h1': ( + size: 32px, + weight: 300, + line-height: 50px, + // letter-spacing:-0.01562em + ), + 'h2': ( + size: 28px, + weight: 300, + line-height: 40px, + // letter-spacing: -0.00833em + ), + 'h3': ( + size: 24px, + weight: 400, + line-height: 32px, + // letter-spacing: normal + ), + 'h4': ( + size: 20px, + weight: 400, + line-height: 30px, + // letter-spacing: 0.00735em + ), + 'h5': ( + size: 16px, + weight: 400, + line-height: 24px, + // letter-spacing: normal + ), + 'h6': ( + size: 14px, + weight: 500, + line-height: 18px, + // letter-spacing: 0.0125em + ), + 'subtitle': ( + size: 12px, + weight: 400, + line-height: 20px, + // letter-spacing: 0.00937em + ), + 'body': ( + font-size: 14px, + font-weight: 400, + line-height: 22px, + // letter-spacing: 0.03125em + ), + 'caption': ( + 'size': 12px, + 'weight': 400, + 'line-height': 20px, + // 'letter-spacing': 0.03333em, + // 'text-transform': false + ) + ), + $uni-headings +); + + + +// 主色 +$uni-primary: #2979ff !default; +$uni-primary-disable:lighten($uni-primary,20%) !default; +$uni-primary-light: lighten($uni-primary,25%) !default; + +// 辅助色 +// 除了主色外的场景色，需要在不同的场景中使用（例如危险色表示危险的操作）。 +$uni-success: #18bc37 !default; +$uni-success-disable:lighten($uni-success,20%) !default; +$uni-success-light: lighten($uni-success,25%) !default; + +$uni-warning: #f3a73f !default; +$uni-warning-disable:lighten($uni-warning,20%) !default; +$uni-warning-light: lighten($uni-warning,25%) !default; + +$uni-error: #e43d33 !default; +$uni-error-disable:lighten($uni-error,20%) !default; +$uni-error-light: lighten($uni-error,25%) !default; + +$uni-info: #8f939c !default; +$uni-info-disable:lighten($uni-info,20%) !default; +$uni-info-light: lighten($uni-info,25%) !default; + +// 中性色 +// 中性色用于文本、背景和边框颜色。通过运用不同的中性色，来表现层次结构。 +$uni-main-color: #3a3a3a !default; // 主要文字 +$uni-base-color: #6a6a6a !default; // 常规文字 +$uni-secondary-color: #909399 !default; // 次要文字 +$uni-extra-color: #c7c7c7 !default; // 辅助说明 + +// 边框颜色 +$uni-border-1: #F0F0F0 !default; +$uni-border-2: #EDEDED !default; +$uni-border-3: #DCDCDC !default; +$uni-border-4: #B9B9B9 !default; + +// 常规色 +$uni-black: #000000 !default; +$uni-white: #ffffff !default; +$uni-transparent: rgba($color: #000000, $alpha: 0) !default; + +// 背景色 +$uni-bg-color: #f7f7f7 !default; + +/* 水平间距 */ +$uni-spacing-sm: 8px !default; +$uni-spacing-base: 15px !default; +$uni-spacing-lg: 30px !default; + +// 阴影 +$uni-shadow-sm:0 0 5px rgba($color: #d8d8d8, $alpha: 0.5) !default; +$uni-shadow-base:0 1px 8px 1px rgba($color: #a5a5a5, $alpha: 0.2) !default; +$uni-shadow-lg:0px 1px 10px 2px rgba($color: #a5a4a4, $alpha: 0.5) !default; + +// 蒙版 +$uni-mask: rgba($color: #000000, $alpha: 0.4) !default; diff --git a/uni_modules/uni-scss/styles/tools/functions.scss b/uni_modules/uni-scss/styles/tools/functions.scss new file mode 100644 index 0000000..ac6f63e --- /dev/null +++ b/uni_modules/uni-scss/styles/tools/functions.scss @@ -0,0 +1,19 @@ +// 合并 map +@function map-deep-merge($parent-map, $child-map){ + $result: $parent-map; + @each $key, $child in $child-map { + $parent-has-key: map-has-key($result, $key); + $parent-value: map-get($result, $key); + $parent-type: type-of($parent-value); + $child-type: type-of($child); + $parent-is-map: $parent-type == map; + $child-is-map: $child-type == map; + + @if (not $parent-has-key) or ($parent-type != $child-type) or (not ($parent-is-map and $child-is-map)){ + $result: map-merge($result, ( $key: $child )); + }@else { + $result: map-merge($result, ( $key: map-deep-merge($parent-value, $child) )); + } + } + @return $result; +}; diff --git a/uni_modules/uni-scss/theme.scss b/uni_modules/uni-scss/theme.scss new file mode 100644 index 0000000..80ee62f --- /dev/null +++ b/uni_modules/uni-scss/theme.scss @@ -0,0 +1,31 @@ +// 间距基础倍数 +$uni-space-root: 2; +// 边框半径默认值 +$uni-radius-root:5px; +// 主色 +$uni-primary: #2979ff; +// 辅助色 +$uni-success: #4cd964; +// 警告色 +$uni-warning: #f0ad4e; +// 错误色 +$uni-error: #dd524d; +// 描述色 +$uni-info: #909399; +// 中性色 +$uni-main-color: #303133; +$uni-base-color: #606266; +$uni-secondary-color: #909399; +$uni-extra-color: #C0C4CC; +// 背景色 +$uni-bg-color: #f5f5f5; +// 边框颜色 +$uni-border-1: #DCDFE6; +$uni-border-2: #E4E7ED; +$uni-border-3: #EBEEF5; +$uni-border-4: #F2F6FC; + +// 常规色 +$uni-black: #000000; +$uni-white: #ffffff; +$uni-transparent: rgba($color: #000000, $alpha: 0); diff --git a/uni_modules/uni-scss/variables.scss b/uni_modules/uni-scss/variables.scss new file mode 100644 index 0000000..1c062d4 --- /dev/null +++ b/uni_modules/uni-scss/variables.scss @@ -0,0 +1,62 @@ +@import './styles/setting/_variables.scss'; +// 间距基础倍数 +$uni-space-root: 2; +// 边框半径默认值 +$uni-radius-root:5px; + +// 主色 +$uni-primary: #2979ff; +$uni-primary-disable:mix(#fff,$uni-primary,50%); +$uni-primary-light: mix(#fff,$uni-primary,80%); + +// 辅助色 +// 除了主色外的场景色，需要在不同的场景中使用（例如危险色表示危险的操作）。 +$uni-success: #18bc37; +$uni-success-disable:mix(#fff,$uni-success,50%); +$uni-success-light: mix(#fff,$uni-success,80%); + +$uni-warning: #f3a73f; +$uni-warning-disable:mix(#fff,$uni-warning,50%); +$uni-warning-light: mix(#fff,$uni-warning,80%); + +$uni-error: #e43d33; +$uni-error-disable:mix(#fff,$uni-error,50%); +$uni-error-light: mix(#fff,$uni-error,80%); + +$uni-info: #8f939c; +$uni-info-disable:mix(#fff,$uni-info,50%); +$uni-info-light: mix(#fff,$uni-info,80%); + +// 中性色 +// 中性色用于文本、背景和边框颜色。通过运用不同的中性色，来表现层次结构。 +$uni-main-color: #3a3a3a; // 主要文字 +$uni-base-color: #6a6a6a; // 常规文字 +$uni-secondary-color: #909399; // 次要文字 +$uni-extra-color: #c7c7c7; // 辅助说明 + +// 边框颜色 +$uni-border-1: #F0F0F0; +$uni-border-2: #EDEDED; +$uni-border-3: #DCDCDC; +$uni-border-4: #B9B9B9; + +// 常规色 +$uni-black: #000000; +$uni-white: #ffffff; +$uni-transparent: rgba($color: #000000, $alpha: 0); + +// 背景色 +$uni-bg-color: #f7f7f7; + +/* 水平间距 */ +$uni-spacing-sm: 8px; +$uni-spacing-base: 15px; +$uni-spacing-lg: 30px; + +// 阴影 +$uni-shadow-sm:0 0 5px rgba($color: #d8d8d8, $alpha: 0.5); +$uni-shadow-base:0 1px 8px 1px rgba($color: #a5a5a5, $alpha: 0.2); +$uni-shadow-lg:0px 1px 10px 2px rgba($color: #a5a4a4, $alpha: 0.5); + +// 蒙版 +$uni-mask: rgba($color: #000000, $alpha: 0.4);