actix/examples
1
0
Fork 0
mirror of https://github.com/actix/examples synced 2024-11-23 14:31:07 +01:00
Code Issues Releases Wiki Activity

update vue to v3

Browse Source
This commit is contained in:
Rob Ede 2023-07-18 22:54:35 +01:00
parent 60ecab2732
commit 9b2e24b1b3
No known key found for this signature in database
GPG Key ID: 97C636207D3EF933
9 changed files with 1189 additions and 30 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

8
.prettierrc.yml Normal file
View File

@ -0,0 +1,8 @@
singleQuote: true
arrowParens: avoid
semi: false
overrides:
- files: '*.md'
options:
printWidth: 9999
proseWrap: never

2
cors/README.md
View File

@ -14,7 +14,7 @@ In a separate terminal, also run:
```sh ```sh
cd cors/frontend cd cors/frontend
npm install npm install
npm run serve npm run dev
``` ```
then open browser at: http://localhost:8080 then open browser at: http://localhost:8080

18
cors/frontend/.gitignore vendored
View File

@ -1,11 +1,18 @@
.DS_Store # Logs
node_modules/ logs
/dist/ *.log
.cache
npm-debug.log* npm-debug.log*
yarn-debug.log* yarn-debug.log*
yarn-error.log* yarn-error.log*
package-lock.json pnpm-debug.log*
lerna-debug.log*
node_modules
.DS_Store
dist
dist-ssr
coverage
*.local
# Editor directories and files # Editor directories and files
.idea .idea
@ -13,3 +20,4 @@ package-lock.json
*.ntvs* *.ntvs*
*.njsproj *.njsproj
*.sln *.sln
*.sw?

17
cors/frontend/index.html
View File

@ -1,11 +1,12 @@
<!DOCTYPE html> <!DOCTYPE html>
<html> <html lang="en">
<head> <head>
<meta charset="utf-8"> <meta charset="UTF-8" />
<meta name="viewport" content="width=device-width,initial-scale=1.0"> <meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>webapp</title> <title>CORS Example</title>
</head> </head>
<body> <body>
<div id="app"></div> <div id="app"></div>
</body> <script type="module" src="/src/main.ts"></script>
</body>
</html> </html>

1115
cors/frontend/package-lock.json generated Normal file
View File

File diff suppressed because it is too large Load Diff

17
cors/frontend/package.json
View File

@ -1,16 +1,17 @@
{ {
"name": "frontend-vue", "name": "actix-cors-example-ui",
"version": "0.1.0", "version": "0.0.0",
"description": "webapp", "private": true,
"scripts": { "scripts": {
"serve": "vue-cli-service serve", "dev": "vite",
"build": "vue-cli-service build" "build": "vite build",
"preview": "vite preview"
}, },
"dependencies": { "dependencies": {
"vue": "2.6.12" "vue": "^3.3.4"
}, },
"devDependencies": { "devDependencies": {
"@vue/cli-service": "^5.0.0", "@vitejs/plugin-vue": "^4.2.3",
"vue-template-compiler": "^2.6.0" "vite": "^4.3.9"
} }
} }

16
cors/frontend/src/app.vue
View File

@ -82,14 +82,14 @@ export default {
}, },
method: 'POST', method: 'POST',
}) })
.then((response) => response.json()) .then(response => response.json())
.then((json) => { .then(json => {
console.log(json) console.log(json)
this.email = json.email this.email = json.email
this.username = json.username this.username = json.username
this.password = json.password this.password = json.password
}) })
.catch((e) => { .catch(e => {
console.log(e) console.log(e)
}) })
}, },
@ -103,6 +103,7 @@ export default {
margin: 0 auto; margin: 0 auto;
padding-top: 33px; padding-top: 33px;
} }
#title { #title {
padding: 0.5rem 0; padding: 0.5rem 0;
font-size: 22px; font-size: 22px;
@ -110,6 +111,7 @@ export default {
background-color: bisque; background-color: bisque;
text-align: center; text-align: center;
} }
input[type='text'], input[type='text'],
input[type='password'] { input[type='password'] {
margin: 6px auto auto; margin: 6px auto auto;
@ -119,6 +121,7 @@ input[type='password'] {
border-bottom: 1px solid #aaa; border-bottom: 1px solid #aaa;
font-size: 16px; font-size: 16px;
} }
#submit { #submit {
margin: 10px 0 20px 0; margin: 10px 0 20px 0;
width: 250px; width: 250px;
@ -131,14 +134,17 @@ input[type='password'] {
transition: 0.1s ease; transition: 0.1s ease;
cursor: pointer; cursor: pointer;
} }
input[type='checkbox'] { input[type='checkbox'] {
margin-top: 11px; margin-top: 11px;
} }
dialog { dialog {
top: 50%; top: 50%;
width: 80%; width: 80%;
border: 5px solid rgba(0, 0, 0, 0.3); border: 5px solid rgba(0, 0, 0, 0.3);
} }
dialog::backdrop { dialog::backdrop {
position: fixed; position: fixed;
top: 0; top: 0;
@ -147,6 +153,7 @@ dialog::backdrop {
bottom: 0; bottom: 0;
background-color: rgba(0, 0, 0, 0.7); background-color: rgba(0, 0, 0, 0.7);
} }
#closeDialog { #closeDialog {
display: inline-block; display: inline-block;
border-radius: 3px; border-radius: 3px;
@ -159,16 +166,19 @@ dialog::backdrop {
font-weight: bold; font-weight: bold;
text-align: center; text-align: center;
} }
#closeDialog:hover, #closeDialog:hover,
#closeDialog:focus { #closeDialog:focus {
opacity: 0.92; opacity: 0.92;
cursor: pointer; cursor: pointer;
} }
#user-info { #user-info {
width: 250px; width: 250px;
margin: 0 auto; margin: 0 auto;
padding-top: 44px; padding-top: 44px;
} }
@media only screen and (min-width: 600px) { @media only screen and (min-width: 600px) {
#content { #content {
margin: 0 auto; margin: 0 auto;

10
cors/frontend/src/main.js
View File

@ -1,6 +1,6 @@
import Vue from 'vue' // import './assets/main.css'
import App from './app'
new Vue({ import { createApp } from 'vue'
render: h => h(App) import App from './App.vue'
}).$mount('#app')
createApp(App).mount('#app')

16
cors/frontend/vite.config.js Normal file
View File

@ -0,0 +1,16 @@
import { fileURLToPath, URL } from 'node:url'
import { defineConfig } from 'vite'
import vue from '@vitejs/plugin-vue'
// https://vitejs.dev/config/
export default defineConfig({
plugins: [
vue(),
],
resolve: {
alias: {
'@': fileURLToPath(new URL('./src', import.meta.url))
}
}
})