修改本地请求地址
This commit is contained in:
4
node_modules/@vant/weapp/dist/circle/canvas.d.ts
generated
vendored
4
node_modules/@vant/weapp/dist/circle/canvas.d.ts
generated
vendored
@@ -1,4 +0,0 @@
|
||||
/// <reference types="miniprogram-api-typings" />
|
||||
type CanvasContext = WechatMiniprogram.CanvasContext;
|
||||
export declare function adaptor(ctx: CanvasContext & Record<string, unknown>): CanvasContext;
|
||||
export {};
|
43
node_modules/@vant/weapp/dist/circle/canvas.js
generated
vendored
43
node_modules/@vant/weapp/dist/circle/canvas.js
generated
vendored
@@ -1,43 +0,0 @@
|
||||
export function adaptor(ctx) {
|
||||
// @ts-ignore
|
||||
return Object.assign(ctx, {
|
||||
setStrokeStyle(val) {
|
||||
ctx.strokeStyle = val;
|
||||
},
|
||||
setLineWidth(val) {
|
||||
ctx.lineWidth = val;
|
||||
},
|
||||
setLineCap(val) {
|
||||
ctx.lineCap = val;
|
||||
},
|
||||
setFillStyle(val) {
|
||||
ctx.fillStyle = val;
|
||||
},
|
||||
setFontSize(val) {
|
||||
ctx.font = String(val);
|
||||
},
|
||||
setGlobalAlpha(val) {
|
||||
ctx.globalAlpha = val;
|
||||
},
|
||||
setLineJoin(val) {
|
||||
ctx.lineJoin = val;
|
||||
},
|
||||
setTextAlign(val) {
|
||||
ctx.textAlign = val;
|
||||
},
|
||||
setMiterLimit(val) {
|
||||
ctx.miterLimit = val;
|
||||
},
|
||||
setShadow(offsetX, offsetY, blur, color) {
|
||||
ctx.shadowOffsetX = offsetX;
|
||||
ctx.shadowOffsetY = offsetY;
|
||||
ctx.shadowBlur = blur;
|
||||
ctx.shadowColor = color;
|
||||
},
|
||||
setTextBaseline(val) {
|
||||
ctx.textBaseline = val;
|
||||
},
|
||||
createCircularGradient() { },
|
||||
draw() { },
|
||||
});
|
||||
}
|
1
node_modules/@vant/weapp/dist/circle/index.d.ts
generated
vendored
1
node_modules/@vant/weapp/dist/circle/index.d.ts
generated
vendored
@@ -1 +0,0 @@
|
||||
export {};
|
197
node_modules/@vant/weapp/dist/circle/index.js
generated
vendored
197
node_modules/@vant/weapp/dist/circle/index.js
generated
vendored
@@ -1,197 +0,0 @@
|
||||
import { BLUE, WHITE } from '../common/color';
|
||||
import { VantComponent } from '../common/component';
|
||||
import { getSystemInfoSync } from '../common/utils';
|
||||
import { isObj } from '../common/validator';
|
||||
import { canIUseCanvas2d } from '../common/version';
|
||||
import { adaptor } from './canvas';
|
||||
function format(rate) {
|
||||
return Math.min(Math.max(rate, 0), 100);
|
||||
}
|
||||
const PERIMETER = 2 * Math.PI;
|
||||
const BEGIN_ANGLE = -Math.PI / 2;
|
||||
const STEP = 1;
|
||||
VantComponent({
|
||||
props: {
|
||||
text: String,
|
||||
lineCap: {
|
||||
type: String,
|
||||
value: 'round',
|
||||
},
|
||||
value: {
|
||||
type: Number,
|
||||
value: 0,
|
||||
observer: 'reRender',
|
||||
},
|
||||
speed: {
|
||||
type: Number,
|
||||
value: 50,
|
||||
},
|
||||
size: {
|
||||
type: Number,
|
||||
value: 100,
|
||||
observer() {
|
||||
this.drawCircle(this.currentValue);
|
||||
},
|
||||
},
|
||||
fill: String,
|
||||
layerColor: {
|
||||
type: String,
|
||||
value: WHITE,
|
||||
},
|
||||
color: {
|
||||
type: null,
|
||||
value: BLUE,
|
||||
observer() {
|
||||
this.setHoverColor().then(() => {
|
||||
this.drawCircle(this.currentValue);
|
||||
});
|
||||
},
|
||||
},
|
||||
type: {
|
||||
type: String,
|
||||
value: '',
|
||||
},
|
||||
strokeWidth: {
|
||||
type: Number,
|
||||
value: 4,
|
||||
},
|
||||
clockwise: {
|
||||
type: Boolean,
|
||||
value: true,
|
||||
},
|
||||
},
|
||||
data: {
|
||||
hoverColor: BLUE,
|
||||
},
|
||||
methods: {
|
||||
getContext() {
|
||||
const { type, size } = this.data;
|
||||
if (type === '' || !canIUseCanvas2d()) {
|
||||
const ctx = wx.createCanvasContext('van-circle', this);
|
||||
return Promise.resolve(ctx);
|
||||
}
|
||||
const dpr = getSystemInfoSync().pixelRatio;
|
||||
return new Promise((resolve) => {
|
||||
wx.createSelectorQuery()
|
||||
.in(this)
|
||||
.select('#van-circle')
|
||||
.node()
|
||||
.exec((res) => {
|
||||
const canvas = res[0].node;
|
||||
const ctx = canvas.getContext(type);
|
||||
if (!this.inited) {
|
||||
this.inited = true;
|
||||
canvas.width = size * dpr;
|
||||
canvas.height = size * dpr;
|
||||
ctx.scale(dpr, dpr);
|
||||
}
|
||||
resolve(adaptor(ctx));
|
||||
});
|
||||
});
|
||||
},
|
||||
setHoverColor() {
|
||||
const { color, size } = this.data;
|
||||
if (isObj(color)) {
|
||||
return this.getContext().then((context) => {
|
||||
if (!context)
|
||||
return;
|
||||
const LinearColor = context.createLinearGradient(size, 0, 0, 0);
|
||||
Object.keys(color)
|
||||
.sort((a, b) => parseFloat(a) - parseFloat(b))
|
||||
.map((key) => LinearColor.addColorStop(parseFloat(key) / 100, color[key]));
|
||||
this.hoverColor = LinearColor;
|
||||
});
|
||||
}
|
||||
this.hoverColor = color;
|
||||
return Promise.resolve();
|
||||
},
|
||||
presetCanvas(context, strokeStyle, beginAngle, endAngle, fill) {
|
||||
const { strokeWidth, lineCap, clockwise, size } = this.data;
|
||||
const position = size / 2;
|
||||
const radius = position - strokeWidth / 2;
|
||||
context.setStrokeStyle(strokeStyle);
|
||||
context.setLineWidth(strokeWidth);
|
||||
context.setLineCap(lineCap);
|
||||
context.beginPath();
|
||||
context.arc(position, position, radius, beginAngle, endAngle, !clockwise);
|
||||
context.stroke();
|
||||
if (fill) {
|
||||
context.setFillStyle(fill);
|
||||
context.fill();
|
||||
}
|
||||
},
|
||||
renderLayerCircle(context) {
|
||||
const { layerColor, fill } = this.data;
|
||||
this.presetCanvas(context, layerColor, 0, PERIMETER, fill);
|
||||
},
|
||||
renderHoverCircle(context, formatValue) {
|
||||
const { clockwise } = this.data;
|
||||
// 结束角度
|
||||
const progress = PERIMETER * (formatValue / 100);
|
||||
const endAngle = clockwise
|
||||
? BEGIN_ANGLE + progress
|
||||
: 3 * Math.PI - (BEGIN_ANGLE + progress);
|
||||
this.presetCanvas(context, this.hoverColor, BEGIN_ANGLE, endAngle);
|
||||
},
|
||||
drawCircle(currentValue) {
|
||||
const { size } = this.data;
|
||||
this.getContext().then((context) => {
|
||||
if (!context)
|
||||
return;
|
||||
context.clearRect(0, 0, size, size);
|
||||
this.renderLayerCircle(context);
|
||||
const formatValue = format(currentValue);
|
||||
if (formatValue !== 0) {
|
||||
this.renderHoverCircle(context, formatValue);
|
||||
}
|
||||
context.draw();
|
||||
});
|
||||
},
|
||||
reRender() {
|
||||
// tofector 动画暂时没有想到好的解决方案
|
||||
const { value, speed } = this.data;
|
||||
if (speed <= 0 || speed > 1000) {
|
||||
this.drawCircle(value);
|
||||
return;
|
||||
}
|
||||
this.clearMockInterval();
|
||||
this.currentValue = this.currentValue || 0;
|
||||
const run = () => {
|
||||
this.interval = setTimeout(() => {
|
||||
if (this.currentValue !== value) {
|
||||
if (Math.abs(this.currentValue - value) < STEP) {
|
||||
this.currentValue = value;
|
||||
}
|
||||
else if (this.currentValue < value) {
|
||||
this.currentValue += STEP;
|
||||
}
|
||||
else {
|
||||
this.currentValue -= STEP;
|
||||
}
|
||||
this.drawCircle(this.currentValue);
|
||||
run();
|
||||
}
|
||||
else {
|
||||
this.clearMockInterval();
|
||||
}
|
||||
}, 1000 / speed);
|
||||
};
|
||||
run();
|
||||
},
|
||||
clearMockInterval() {
|
||||
if (this.interval) {
|
||||
clearTimeout(this.interval);
|
||||
this.interval = null;
|
||||
}
|
||||
},
|
||||
},
|
||||
mounted() {
|
||||
this.currentValue = this.data.value;
|
||||
this.setHoverColor().then(() => {
|
||||
this.drawCircle(this.currentValue);
|
||||
});
|
||||
},
|
||||
destroyed() {
|
||||
this.clearMockInterval();
|
||||
},
|
||||
});
|
3
node_modules/@vant/weapp/dist/circle/index.json
generated
vendored
3
node_modules/@vant/weapp/dist/circle/index.json
generated
vendored
@@ -1,3 +0,0 @@
|
||||
{
|
||||
"component": true
|
||||
}
|
9
node_modules/@vant/weapp/dist/circle/index.wxml
generated
vendored
9
node_modules/@vant/weapp/dist/circle/index.wxml
generated
vendored
@@ -1,9 +0,0 @@
|
||||
<wxs src="../wxs/utils.wxs" module="utils" />
|
||||
|
||||
<view class="van-circle">
|
||||
<canvas class="van-circle__canvas" type="{{ type }}" style="width: {{ utils.addUnit(size) }};height:{{ utils.addUnit(size) }}" id="van-circle" canvas-id="van-circle"></canvas>
|
||||
<view wx:if="{{ !text }}" class="van-circle__text">
|
||||
<slot></slot>
|
||||
</view>
|
||||
<cover-view wx:else class="van-circle__text">{{ text }}</cover-view>
|
||||
</view>
|
1
node_modules/@vant/weapp/dist/circle/index.wxss
generated
vendored
1
node_modules/@vant/weapp/dist/circle/index.wxss
generated
vendored
@@ -1 +0,0 @@
|
||||
@import '../common/index.wxss';.van-circle{display:inline-block;position:relative;text-align:center}.van-circle__text{color:var(--circle-text-color,#323233);left:0;position:absolute;top:50%;transform:translateY(-50%);width:100%}
|
Reference in New Issue
Block a user