提示
本篇主要是将laravel-fast-api-youhujun 的自定义命令进行说明,从而提高开发效率
视频演示
2026/9/2大约 26 分钟
富文本编辑组件-tinymce
代码示例:
<template>
<el-row type="flex" justify="center">
<el-col :span="24">
<el-form-item label="内容" prop="content" class="editor">
<TinyMceEditor
v-model:content-value="createForm.content"
:disabled="false"
></TinyMceEditor>
</el-form-item>
</el-col>
</el-row>
</template>
<script setup lang="ts">
import TinyMceEditor from "@/pages/laravel-fast-api/v1/components/element/Editor/Tinymce/TinyMceEditor.vue";
</script>
<style lang="scss" scoped>
.editor :deep(.el-form-item__content) {
width: 100%;
min-width: 40rem;
max-width: 100rem;
height: auto;
}
</style>2026/8/22小于 1 分钟
SelectRegion-选择地区
代码示例:
提示
注意 :multiple="false" 单选, :multiple="true" 多选
<template>
<el-row type="flex" justify="center">
<el-col :span="12">
<el-form-item label="店铺地区" prop="region_cascader_array">
<SelectRegion v-model:region-id-array="createForm.region_cascader_array" :multiple="false"></SelectRegion>
</el-form-item>
</el-col>
</el-row>
</template>
<script setup lang="ts">
//公共组件
import SelectRegion from "@/pages/laravel-fast-api/v1/components/element/Address/SelectRegion.vue"
</script>2026/8/16小于 1 分钟
图片上传
单图上传
示例:
<template>
<UploadSinglePicture
:upload-data="{type:null, use_type:20, file_type: '', save_path: 'picture'}"
type="image"
show-content="轮播图片"
:is-show-button="true"
v-model:upload-picture-uid="createForm.album_picture_uid"
v-model:upload-picture-url="uploadPicutreUrl"
/>
</template>
<script setup lang="ts">
//公共组件
import UploadSinglePicture from "@/pages/laravel-fast-api/v1/components/element/Upload/UploadPicture/UplaodSinglePicture.vue"
//上传图片回显
const uploadPicutreUrl = ref("");
</script>2026/8/1大约 1 分钟
面板组件使用
代码示例:
<template>
<YhCardItem>
<template #item-content>
<el-tag>现金账户</el-tag>
<el-row :gutter="10">
<el-col :span="8" style="text-align: center">
<el-statistic
title="可用余额"
:value="Number(userCashAssets.available_cash_amount)"
/>
</el-col>
<el-col :span="8" style="text-align: center">
<el-statistic
title="冻结金额"
:value="Number(userCashAssets.freeze_cash_amount)"
/>
</el-col>
<el-col :span="8" style="text-align: center">
<el-row :gutter="10">
<el-tag type="info" style="margin-right: 10px">账户状态:</el-tag>
<el-tag v-if="userCashAssets.account_status" type="success">正常</el-tag>
<el-tag v-else type="danger">冻结</el-tag>
</el-row>
</el-col>
</el-row>
</template>
</YhCardItem>
</template>
<script setup lang="ts">
import YhCardItem from "@/pages/laravel-fast-api/v1/components/element/Card/CardList/CardItem.vue";
</script>2026/8/1小于 1 分钟
今天数到一个视频,再次了解到了指数级增长,一张纸,只有0.001cm.对折103次,厚度就可以穿透人类可观测宇宙的边界.
再次新生激荡豪迈之感.因为我清楚的知道游鹄生态的未来,也是指数级增长的.而且是无限的
我知道,绝大多数的人看待游鹄生态,就像看待这样一张纸.不,应该说根本就不会看到.
但是我看到了,游鹄生态这张纸对折103次后的样子.
总是莫名的新潮澎湃激动很久.只有沉浸式的投入写代码中,才能慢慢平复这种心情.
2026/8/1小于 1 分钟
选择银行
代码示例:
<template>
<el-row type="flex" justify="center">
<el-col :span="24">
<el-form-item label="开户银行" prop="bank_id">
<SelectBank v-model:select-bank-id="createForm.bank_id"></SelectBank>
</el-form-item>
</el-col>
</el-row>
</template>
<script setup lang="ts">
//公共组件
import SelectBank from "@/pages/laravel-fast-api/v1/components/element/Bank/SelectBank.vue";
</script>2026/8/1小于 1 分钟
选择用户
代码示例:
<template>
<el-row type="flex" justify="center">
<el-col :span="12">
<el-form-item label="选择用户" prop="user_uid">
<SelectUser v-model:select-user-uid="createForm.user_uid"></SelectUser>
</el-form-item>
</el-col>
</el-row>
</template>
<script setup lang="ts">
//公共组件
import SelectUser from "@/pages/laravel-fast-api/v1/components/element/User/SelectUser.vue";
</script>2026/8/1小于 1 分钟
提示
说明:在开发调试过程中难免会有测试,调试产生脏数据,为了不影响后续开发,需要将调试数据清空.需要对数据库,缓存,以及es进行清空,如果每次都整体初始化是非常繁琐的,因此特别整理该文档,方便开发调试
测试实例
在开发过程中,随着业务变化,后台业务菜单一定会出现调整,这里选用最具有代表性的菜单(Permission)调试来说明
数据库调试
2026/7/29大约 1 分钟
提示
说明:在开发调试过程中难免会有测试,调试产生脏数据,为了不影响后续开发,需要将调试数据清空.需要对数据库,缓存,以及es进行清空,如果每次都整体初始化是非常繁琐的,因此特别整理该文档,方便开发调试
测试实例
在开发过程中,随着业务变化,后台业务菜单一定会出现调整,这里选用最具有代表性的菜单(Permission)调试来说明
数据库调试
2026/7/29大约 1 分钟