99 lines
3.0 KiB
TypeScript
99 lines
3.0 KiB
TypeScript
import { SHAPES, ShapeCard } from '../../constants/shapes';
|
|
import { WATER_COLORS, PAPER_SIZE } from '../../constants/colors';
|
|
|
|
|
|
|
|
Page({
|
|
data: {
|
|
shapeList: [] as ShapeCard[],
|
|
showSelectShapePopup: false,
|
|
currentShapeKey: '',
|
|
},
|
|
|
|
onLoad() {
|
|
|
|
},
|
|
|
|
openSelectShapePopup(e: any) {
|
|
const { key } = e.detail;
|
|
this.setData({
|
|
showSelectShapePopup: true,
|
|
currentShapeKey: key
|
|
});
|
|
},
|
|
|
|
closeSelectShapePopup() {
|
|
this.setData({
|
|
showSelectShapePopup: false,
|
|
currentShapeKey: ''
|
|
});
|
|
},
|
|
|
|
onChangeShape(e: any) {
|
|
const { shape, currentShapeKey, shapes } = e.detail;
|
|
console.log('shape', shape);
|
|
console.log('shapes', shapes);
|
|
if (currentShapeKey) {
|
|
this.setData({
|
|
showSelectShapePopup: false,
|
|
currentShapeKey: '',
|
|
shapeList: this.data.shapeList.map(item => {
|
|
if (item.id === currentShapeKey) {
|
|
return { ...item, fillColor: item.fillColor };
|
|
}
|
|
return item;
|
|
})
|
|
});
|
|
} else {
|
|
// 随机从 WATER_COLORS.basic12 中获取不重复的颜色
|
|
const colorList = WATER_COLORS.basic12.map(item => item.hex);
|
|
const colorsCopy = [...colorList];
|
|
for (let i = colorsCopy.length - 1; i > 0; i--) {
|
|
const j = Math.floor(Math.random() * (i + 1));
|
|
[colorsCopy[i], colorsCopy[j]] = [colorsCopy[j], colorsCopy[i]];
|
|
}
|
|
const selectedColors = colorsCopy.slice(0, shapes.length);
|
|
|
|
this.setData({
|
|
showSelectShapePopup: false,
|
|
currentShapeKey: '',
|
|
shapeList: shapes.map((item: ShapeCard, idx: number) => ({
|
|
...item,
|
|
fillColor: selectedColors[idx] || item.fillColor
|
|
}))
|
|
});
|
|
}
|
|
},
|
|
/**
|
|
* 随机生成6个图形
|
|
*/
|
|
refreshShapeCard() {
|
|
// 随机取6个图形
|
|
const shapesCopy = [...SHAPES];
|
|
for (let i = shapesCopy.length - 1; i > 0; i--) {
|
|
const j = Math.floor(Math.random() * (i + 1));
|
|
[shapesCopy[i], shapesCopy[j]] = [shapesCopy[j], shapesCopy[i]];
|
|
}
|
|
const selectedShapes = shapesCopy.slice(0, 6);
|
|
|
|
// 随机取6个颜色
|
|
const colorList = WATER_COLORS.basic12.map(item => item.hex);
|
|
const colorsCopy = [...colorList];
|
|
for (let i = colorsCopy.length - 1; i > 0; i--) {
|
|
const j = Math.floor(Math.random() * (i + 1));
|
|
[colorsCopy[i], colorsCopy[j]] = [colorsCopy[j], colorsCopy[i]];
|
|
}
|
|
const selectedColors = colorsCopy.slice(0, 6);
|
|
|
|
// 分配颜色到图形
|
|
const shapeList = selectedShapes.map((shape, idx) => ({
|
|
...shape,
|
|
fillColor: selectedColors[idx]
|
|
}));
|
|
|
|
// 更新数据
|
|
this.setData({
|
|
shapeList
|
|
});
|
|
}
|
|
}); |