# 企业官网PC端-移动端-thinkphp6-vue3

**Repository Path**: lijun274289963/site-tp6-vue3

## Basic Information

- **Project Name**: 企业官网PC端-移动端-thinkphp6-vue3
- **Description**: 企业官网PC端-移动端-thinkphp6-vue3
- **Primary Language**: JavaScript
- **License**: Apache-2.0
- **Default Branch**: master
- **Homepage**: http://www.88an.top
- **GVP Project**: No

## Statistics

- **Stars**: 0
- **Forks**: 28
- **Created**: 2022-08-09
- **Last Updated**: 2023-05-11

## Categories & Tags

**Categories**: Uncategorized

**Tags**: None

## README

# 企业官网PC端-移动端-thinkphp6-vue3

## 介绍

人生中的第一个开源项目，自己练习做着玩的，请轻喷<br />
我主要是做web前端开发，会点php，会点mysql增删改查<br />
后台语言php，php框架采用thinkphp6，后台管理页面采用vue3+elementPlus+vite+pinia<br />
排版，UI，数据库表设计，后台模块设计，接口，等全部自己开发<br />
虽然使用vue3开发，但是却没有使用ts，感觉写ts太繁琐，严重降低我的开发效率<br />

功能有：<br />
导出execl表格<br />
更换全局主题色<br />
一键暗黑模式<br />
多语言<br />
图片管理<br />
拖拽排序<br />
图片裁剪<br />
多端适配<br />
高度封装页面组件<br />
根据页面优化数据库字段<br />
达到组件通用，表通用，可达到快速开发新模块

#### 网站截图
![网站截图](20220728114000.png)
![网站截图](20220805102228.png)
#### 后台截图
![后台截图](20220728114449.png)

## 在线演示

网站 [http://site.88an.top](http://site.88an.top)<br />

后台vue版 [http://site.88an.top/vue.html](http://site.88an.top/vue.html)<br />

后台layui的iframe版（该版本功能不完善，目前只维护vue版本的，不喜欢vue的可以自行维护这个版本） [http://site.88an.top/admin](http://site.88an.top/admin)<br />

账号：admin 密码：admin<br />
请勿随意修改登录密码，如果需要测试，修改完成之后，麻烦将密码改回来<br/>

## 使用说明

### 后端PHP
网站运行目录为thinkphp框架根目录下的/public<br />
数据库账号密码修改：thinkphp6/.env 文件<br />

内容如下：<br />

```
APP_DEBUG = true

[APP]
DEFAULT_TIMEZONE = Asia/Shanghai

[DATABASE]
TYPE = mysql
HOSTNAME = 127.0.0.1
DATABASE = an_site
USERNAME = an_site
PASSWORD = an_site
HOSTPORT = 3306
CHARSET = utf8
DEBUG = false

[LANG]
default_lang = zh-cn
```

### 前端VUE3
vue项目，更改api请求域名<br />
开发环境域名 修改：vue3/.env.development 文件<br />
```
VITE_BASE_URL = 'http://site/'
```

生产环境域名 修改：vue3/.env.production 文件<br />
```
VITE_BASE_API = 'http://site.88an.top/'
VITE_BASE_URL = 'http://site.88an.top/'
```

前端开发本地代理域名配置 修改：vue3/vite.config.js<br />
```
// 配置域名代理
server: {
	host:"0.0.0.0",//配置局域网ip访问
	proxy: {
		'/myApi': {
			target: 'http://site',
			changeOrigin: true,
			ws: true,
			rewrite: (path) => path.replace(/^\/myApi/, '')
		},
	},
},
```
### 后台页面编译打包
```
npm run build
```

会在vue3/dist目录下输出打包文件,内容如下：<br />
assets 目录<br />
UEditor 目录<br />
favicon.ico<br />
index.html<br />

除了index.html文件，其他三个 需要复制或移动到 site-tp6-vue3/public/vue3vite2/目录下<br />
index.html文件,更改为vue.html,移动到复制或移动到 site-tp6-vue3/public/目录下