#### 一、安装的工具（准备工作）
该项目部署复杂度偏高（有兴趣学习该技术栈者可以尝试部署）
##### 1. 我们先安装node.js [http://nodejs.cn/download/]
##### 2. win+r 输入cmd 点击确定 打开命令行面板输入 （安装cnpm）
###### `npm install -g cnpm --registry=https://registry.npm.taobao.org`
##### 3. 运行项目至少需要两个开发工具，一个Hbuildex；一个微信开发者工具
Hbuildex下载地址：[下载app开发版](https://www.dcloud.io/hbuilderx.html)
微信开发者工具：[下载稳定版](https://developers.weixin.qq.com/miniprogram/dev/devtools/download.html)
##### 4. 打开微信公众平台—注册小程序—获取Appid--开发管理--开发设置中获取Appid
#### **二、云数据库的配置**
###### diancan-user:该套代码包为小程序代码
##### 1.将该套代码包放入Hbuildex中，打开manifest.json文件，微信小程序配置——微信小程序Appid改为你注册的小程序id。
##### 在APP.vue文件中把env改为自己的环境id（环境id在微信开发者工具的云开发中获取）根据提示创建一个云开发和云开发环境。
##### 2.鼠标选中该项目diancan-user，然后点击编辑器顶部运行——运行到小程序模拟器。此时有可能不会打开，那么手动打开微信开发者工具，在设置中的代理设置里点击安全开启服务端口，如果成功运行到开发者工具，此时控制台会报错
##### 3.点击微信开发者工具顶部云开发（如果还没有开通根据提示开通）进入云开发控制台，点击数据库根据以下命名创建每一个集合：
```js
business-acc:商家账号：权限{所有用户可读，仅创建者可读写}
shop-infor:商家信息：同上
dishes-category:菜品类目：同上
dishunit:菜品单位：同上
dishes-data:菜品管理：自定义权限把以下代码粘贴进去{"read": true,"write": true}
order-data：存储订单：权限{仅创建者可读写}
seven_day_sales:存储每一天的销售额：自定义权限把以下代码粘贴覆盖进去
{"read": true,"write": true}
table_qr_code:桌号管理：权限{所有用户可读，仅创建者可读写}
```
##### 4.在微信开发者工具上的资源管理器上创建一个文件夹，文件夹命名为：cloudfunctions鼠标右即点击创建一个nodejs云函数命名为：Dish-manage，然后我们的Dish-manage文件下会生成一些文件，我们只要将文件里的index.js文件替换为diancan-user/云函数文件里的index.js
然后将文件里的env替换成自己的环境id，代码如下：
```
cloud.init({
env: '改为你自己的云环境id'
})
```
##### 接下来在Dish-manage文件上右键：上传并部署（选择不上传node_modules），云端安转依赖，等待上传成，包括云函数中文件的search.js文件（步骤同上）
#### 三、代码的修改
##### 1. 回到user代码包中，打开main.js文件15-16行以及pc端的src/main.js，如下：
```js
Vue.prototype.goeasy = GoEasy.getInstance({
host:"改为你自己的区域", //改为：区域.goeasy.io
appkey:"改为你自己的appkey", //进入详情Common key
modules:['pubsub'] //根据需要，传入‘pubsub’或'im’，或数组方式同时传入
});
```
##### 2.微信公众开发管理中的平台开发设置中配置服务器域名（socket合法域名）wss://wx-hangzhou.goeasy.io
##### 3. 打开diancan-node:该套代码包为接口端
##### 4.打开config/databaseapi.js文件第7第8行如下，将小程序appid和秘钥secret改为你自己的
```js
let param = qs.stringify({
grant_type:'client_credential',
appid:'改为你自己的',
secret:'改为你自己的'（微信公众平台进入开发管理-开发设置生成一个APPsecret）
})
```
##### 5.模板id获取步骤：
##### 5.1打开微信公众平台选择订阅信息，选择公共模板库 搜索模板输入——商家确认订单通知——选上支付金额、支付时间、订单编号，三项。
注：小程序注册的的服务类目必须是餐饮服务中的餐饮信息服务才可以检索到，如果不是餐饮信息可以在我们微信公众平台的设置中找到服务类目进行更改或者添加进去。
##### 5.2选择完模板后，就可以在我的模板中查看模板id了，我们把它复制下来打开config/databaseapi.js文件第70行将订阅消息template_id改为你自己的模板id。
##### 6.打开router/order/order.js文件中更改75行的三个字段名称(amount1,time2,character_string3)。(在我的模板——详情中查看自己的三个字段。看看是否与该字段一样，如果不一样则进行更改)
##### **7.我们再次打开diancan-user中的pages/home-page/page.vue 将121行中template_id改为自己的。**
#### **四、腾讯云存储（cos）的配置**
##### 1.在node代码中打开cos/cos.js文件第4-11行如下：
```
var cos = new COS({
SecretId: '改为你自己的', （在腾讯云的密钥管理中获取）
SecretKey: '改为你自己的', （同上）
Protocol:'https:'
});
```
##### 打开该链接注册[https://cloud.tencent.com/login?s_url=https%3A%2F%2Fconsole.cloud.tencent.com%2Fcos]进入腾讯云对象存储 我们找到存储桶，选择创建一个存储桶（我们只需要修改权限为：公有读私有写，地域选择离自己最近的）
```
let Bucket = '改为你自己的' （这个为创建的存储桶名称）
let Region = '改为你自己的' （这个为所属的地域）
```
##### 2.**进入存储桶中创建一个文件夹用于存放上传的文件。**
##### **第18行和36行：Key: '改为你自己的文件夹名称' + filename,（key为自己创建的文件夹）**
**3.在HbuliderX中右键 diancan-node 使用命令行打开出窗口所在目录 输入npm install --save 成功后会出现一个node_modules包**
**再执行nodemon app.js启动服务器端 如果没有成功就用 npm run test**
#### 五、后台管理端的启动
###### saoma-diancan-pc:该套代码包后台管理端
##### 1.在HbuliderX中右键 saoma-diancan-pc 使用命令行打开出窗口所在目录 输入 npm install --save
##### 2.再执行npm run serve 启动项目，浏览器打开该地址，注册一个账号再登录进去
##### 3.根据提示创建商家信息，此时可以添加点餐码和上传菜品类目和上架菜品
##### 4.在上一步后台管理添加点餐码和上架菜品后，到微信开发者工具通过你添加的二维码编译进入
#### **六、连接打印机**
###### 1.我们必须购买芯烨云打印机
###### 2.我们根据说明书将打印机连接到wifi
###### 3.进入芯烨云打印机后端管理平台 [https://admin.xpyun.net/#/login?redirect=%2Fpersonal]注册账号， 然后进行认证后即可进入。
###### 4.然后我们选择打印管理中的-设备管理 输入打印机编号也就是打印机身上的sn把打印机添加进我们的设备中。
###### **5.我们打开我们diancan-user文件在printer中打开Xpyun.js文件**
**修改以下代码**
```js
let xpYun = {
user:'在芯烨云后端管理平台中的账号信息把开发者id拷贝过来',
timestamp:new Date().getTime(),
UserKEY:'这个为开发者密钥在开发者id下面',
sn:'打印机身上的sn',
name:'设置成自己的店铺名称'
}
```
###### 6.如果我们要更改打印机打印的内容我们进入到print_content.js文件中，根据自己的店面，地址，电话，进行更改
#### 七、代码上线（必须在本地测试没有任何问题，能跑通的情况再进行上线部署）
##### 1.diancan-node
###### 我们先打开[https://cloud.weixin.qq.com/cloudrun?utm_source=idecloudconsole] 然后扫码登录然后选择我们所要登录的小程序，在提示面板中往下拉选择koa框架部署(时间可以
基于vue+Koa +小程序+云开发+云存储的全栈扫码点餐系统+源码+开发文档+部署教程+代码解析（高分优秀项目）
版权申诉
37 浏览量
2024-05-12
19:45:12
上传
评论 1
收藏 8.12MB ZIP 举报
基于vue+Koa +小程序+云开发+云存储的全栈扫码点餐系统+源码+开发文档+部署教程+代码解析（高分优秀项目） （183个子文件） 
popup.css 4KB pop-ups.css 2KB goods.css 2KB reset.css 2KB pubiss.css 955B headtap.css 947B shadow.css 386B overall.css 363B animat.css 336B Dockerfile 553B .DS_Store 6KB
index.html 1KB favicon.ico 4KB 1632321676601-6079438.jfif 67KB
1659773322634-8822163.jpg 579KB 1659773695791-2520426.jpg 579KB beijing.jpg 331KB vendor.js 1.52MB page.js 48KB search.js 32KB details.js 31KB goods-details.js 29KB goods-details.js 29KB index.js 29KB my-order.js 29KB shopping-cart.js 28KB home.js 27KB order.js 27KB saoma.js 26KB main.js 20KB runtime.js 12KB dish.js 6KB code.js 5KB infor.js 4KB checking.js 3KB order.js 3KB databaseapi.js 2KB login.js 2KB header.js 2KB api.js 2KB main.js 2KB cos.js 2KB index.js 1KB index.js 1KB app.js 1KB state-type.js 1KB Date_analysis.js 837B auth.js 807B store.js 789B main.js 732B index.js 658B title.js 622B request.js 578B code-img.js 542B abnormal.js 466B result.js 410B jwt.js 345B store.js 310B order.js 247B anti-shake.js 208B babel.config.js 190B handle.js 129B tokentime.js 120B app.js 89B postcss.config.js 59B vue.config.js 38B package-lock.json 927KB package-lock.json 208KB manifest.json 3KB pages.json 1KB package-lock.json 832B project.config.json 678B project.config.json 675B package.json 647B package.json 595B app.json 506B launch.json 504B project.private.config.json 352B project.private.config.json 352B page.json 263B sitemap.json 191B search.json 175B details.json 161B index.json 147B my-order.json 116B saoma.json 116B package.json 111B goods-details.json 48B order.json 48B home.json 48B shopping-cart.json 48B goods-details.json 48B .automator.json 0B LICENSE 1KB vendor.js.map 2.31MB page.js.map 37KB search.js.map 16KB details.js.map 16KB goods-details.js.map 13KB goods-details.js.map 13KB共 183 条
- 1
- 2
资源评论
