Initial commit
This commit is contained in:
commit
9dac7e5fc9
|
|
@ -0,0 +1,5 @@
|
|||
# Default ignored files
|
||||
/shelf/
|
||||
/workspace.xml
|
||||
# Editor-based HTTP Client requests
|
||||
/httpRequests/
|
||||
|
|
@ -0,0 +1,6 @@
|
|||
<component name="InspectionProjectProfileManager">
|
||||
<profile version="1.0">
|
||||
<option name="myName" value="Project Default" />
|
||||
<inspection_tool class="Eslint" enabled="true" level="WARNING" enabled_by_default="true" />
|
||||
</profile>
|
||||
</component>
|
||||
|
|
@ -0,0 +1,8 @@
|
|||
<?xml version="1.0" encoding="UTF-8"?>
|
||||
<project version="4">
|
||||
<component name="ProjectModuleManager">
|
||||
<modules>
|
||||
<module fileurl="file://$PROJECT_DIR$/.idea/policeSecurity.iml" filepath="$PROJECT_DIR$/.idea/policeSecurity.iml" />
|
||||
</modules>
|
||||
</component>
|
||||
</project>
|
||||
|
|
@ -0,0 +1,12 @@
|
|||
<?xml version="1.0" encoding="UTF-8"?>
|
||||
<module type="WEB_MODULE" version="4">
|
||||
<component name="NewModuleRootManager">
|
||||
<content url="file://$MODULE_DIR$">
|
||||
<excludeFolder url="file://$MODULE_DIR$/.tmp" />
|
||||
<excludeFolder url="file://$MODULE_DIR$/temp" />
|
||||
<excludeFolder url="file://$MODULE_DIR$/tmp" />
|
||||
</content>
|
||||
<orderEntry type="inheritedJdk" />
|
||||
<orderEntry type="sourceFolder" forTests="false" />
|
||||
</component>
|
||||
</module>
|
||||
|
|
@ -0,0 +1,6 @@
|
|||
<?xml version="1.0" encoding="UTF-8"?>
|
||||
<project version="4">
|
||||
<component name="VcsDirectoryMappings">
|
||||
<mapping directory="" vcs="Git" />
|
||||
</component>
|
||||
</project>
|
||||
|
|
@ -0,0 +1,12 @@
|
|||
# http://editorconfig.org
|
||||
root = true
|
||||
|
||||
[*]
|
||||
indent_style = space
|
||||
indent_size = 2
|
||||
charset = utf-8
|
||||
trim_trailing_whitespace = true
|
||||
insert_final_newline = true
|
||||
|
||||
[*.md]
|
||||
trim_trailing_whitespace = false
|
||||
|
|
@ -0,0 +1,10 @@
|
|||
# 配置文档参考 https://taro-docs.jd.com/docs/next/env-mode-config
|
||||
TARO_APP_ID="wx0acd1c4fcf94bdd3"
|
||||
TARO_APP_BASE_API="http://172.10.10.93:8765"
|
||||
# TARO_APP_BASE_API="https://www.hnjinglian.cn:5678"
|
||||
|
||||
|
||||
|
||||
# minio
|
||||
TARO_APP_MINIO_URL=http://118.253.177.137:9000
|
||||
TARO_APP_MINIO_BUCKET=police-security-dev
|
||||
|
|
@ -0,0 +1,6 @@
|
|||
# TARO_APP_ID="wx0acd1c4fcf94bdd3"
|
||||
TARO_APP_BASE_API="https://www.hnjinglian.cn:5678"
|
||||
|
||||
# minio
|
||||
TARO_APP_MINIO_URL=https://www.hnjinglian.cn:9002
|
||||
TARO_APP_MINIO_BUCKET=police-security
|
||||
|
|
@ -0,0 +1,19 @@
|
|||
// ESLint 检查 .vue 文件需要单独配置编辑器：
|
||||
// https://eslint.vuejs.org/user-guide/#editor-integrations
|
||||
{
|
||||
"extends": [
|
||||
"taro/vue3"
|
||||
],
|
||||
"rules": {
|
||||
// 添加组件命名忽略规则
|
||||
"vue/multi-word-component-names": [
|
||||
"error",
|
||||
{
|
||||
//需要忽略的组件名
|
||||
"ignores": [
|
||||
"index"
|
||||
]
|
||||
}
|
||||
]
|
||||
}
|
||||
}
|
||||
|
|
@ -0,0 +1,13 @@
|
|||
dist/
|
||||
deploy_versions/
|
||||
.temp/
|
||||
.rn_temp/
|
||||
node_modules/
|
||||
.DS_Store
|
||||
.swc
|
||||
.idea
|
||||
|
||||
|
||||
components.d.ts
|
||||
package-lock.json
|
||||
yarn.lock
|
||||
|
|
@ -0,0 +1,12 @@
|
|||
import TestUtils from '@tarojs/test-utils-vue3'
|
||||
|
||||
describe('Testing', () => {
|
||||
|
||||
test('Test', async () => {
|
||||
const testUtils = new TestUtils()
|
||||
await testUtils.createApp()
|
||||
await testUtils.PageLifecycle.onShow('pages/index/index')
|
||||
expect(testUtils.html()).toMatchSnapshot()
|
||||
})
|
||||
|
||||
})
|
||||
|
|
@ -0,0 +1,10 @@
|
|||
// babel-preset-taro 更多选项和默认值：
|
||||
// https://github.com/NervJS/taro/blob/next/packages/babel-preset-taro/README.md
|
||||
module.exports = {
|
||||
presets: [
|
||||
['taro', {
|
||||
framework: 'vue3',
|
||||
ts: true
|
||||
}]
|
||||
]
|
||||
}
|
||||
|
|
@ -0,0 +1,9 @@
|
|||
import type { UserConfigExport } from "@tarojs/cli";
|
||||
export default {
|
||||
logger: {
|
||||
quiet: false,
|
||||
stats: true
|
||||
},
|
||||
mini: {},
|
||||
h5: {}
|
||||
} satisfies UserConfigExport
|
||||
|
|
@ -0,0 +1,115 @@
|
|||
import {defineConfig, type UserConfigExport} from '@tarojs/cli'
|
||||
import TsconfigPathsPlugin from 'tsconfig-paths-webpack-plugin'
|
||||
import devConfig from './dev'
|
||||
import prodConfig from './prod'
|
||||
import ComponentsPlugin from 'unplugin-vue-components/webpack'
|
||||
import NutUIResolver from "@nutui/auto-import-resolver";
|
||||
|
||||
// https://taro-docs.jd.com/docs/next/config#defineconfig-辅助函数
|
||||
export default defineConfig(async (merge, {command, mode}) => {
|
||||
const baseConfig: UserConfigExport = {
|
||||
projectName: 'collect_information',
|
||||
date: '2024-9-14',
|
||||
designWidth(input: any) {
|
||||
// 配置 NutUI 375 尺寸
|
||||
if (input?.file?.replace(/\\+/g, '/').indexOf('@nutui') > -1) {
|
||||
return 375
|
||||
}
|
||||
// 全局使用 Taro 默认的 750 尺寸
|
||||
return 750
|
||||
},
|
||||
deviceRatio: {
|
||||
640: 2.34 / 2,
|
||||
750: 1,
|
||||
828: 1.81 / 2,
|
||||
375: 2
|
||||
},
|
||||
sourceRoot: 'src',
|
||||
outputRoot: 'dist',
|
||||
// 开启 HTML 插件
|
||||
plugins: ['@tarojs/plugin-html'],
|
||||
defineConstants: {},
|
||||
copy: {
|
||||
patterns: [],
|
||||
options: {}
|
||||
},
|
||||
framework: 'vue3',
|
||||
compiler: 'webpack5',
|
||||
cache: {
|
||||
enable: false // Webpack 持久化缓存配置，建议开启。默认配置请参考：https://docs.taro.zone/docs/config-detail#cache
|
||||
},
|
||||
mini: {
|
||||
miniCssExtractPluginOption: {
|
||||
ignoreOrder: true
|
||||
},
|
||||
postcss: {
|
||||
pxtransform: {
|
||||
enable: true,
|
||||
config: {}
|
||||
},
|
||||
url: {
|
||||
enable: true,
|
||||
config: {
|
||||
limit: 1024 // 设定转换尺寸上限
|
||||
}
|
||||
},
|
||||
cssModules: {
|
||||
enable: false, // 默认为 false，如需使用 css modules 功能，则设为 true
|
||||
config: {
|
||||
namingPattern: 'module', // 转换模式，取值为 global/module
|
||||
generateScopedName: '[name]__[local]___[hash:base64:5]'
|
||||
}
|
||||
}
|
||||
},
|
||||
webpackChain(chain) {
|
||||
chain.resolve.plugin('tsconfig-paths').use(TsconfigPathsPlugin)
|
||||
chain.plugin('unplugin-vue-components').use(ComponentsPlugin({
|
||||
resolvers: [NutUIResolver({taro: true})]
|
||||
}))
|
||||
}
|
||||
},
|
||||
h5: {
|
||||
publicPath: '/',
|
||||
staticDirectory: 'static',
|
||||
output: {
|
||||
filename: 'js/[name].[hash:8].js',
|
||||
chunkFilename: 'js/[name].[chunkhash:8].js'
|
||||
},
|
||||
miniCssExtractPluginOption: {
|
||||
ignoreOrder: true,
|
||||
filename: 'css/[name].[hash].css',
|
||||
chunkFilename: 'css/[name].[chunkhash].css'
|
||||
},
|
||||
postcss: {
|
||||
autoprefixer: {
|
||||
enable: true,
|
||||
config: {}
|
||||
},
|
||||
cssModules: {
|
||||
enable: false, // 默认为 false，如需使用 css modules 功能，则设为 true
|
||||
config: {
|
||||
namingPattern: 'module', // 转换模式，取值为 global/module
|
||||
generateScopedName: '[name]__[local]___[hash:base64:5]'
|
||||
}
|
||||
}
|
||||
},
|
||||
webpackChain(chain) {
|
||||
chain.resolve.plugin('tsconfig-paths').use(TsconfigPathsPlugin)
|
||||
}
|
||||
},
|
||||
rn: {
|
||||
appName: 'taroDemo',
|
||||
postcss: {
|
||||
cssModules: {
|
||||
enable: false, // 默认为 false，如需使用 css modules 功能，则设为 true
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
if (process.env.NODE_ENV === 'development') {
|
||||
// 本地开发构建配置（不混淆压缩）
|
||||
return merge({}, baseConfig, devConfig)
|
||||
}
|
||||
// 生产构建配置（默认开启压缩混淆等）
|
||||
return merge({}, baseConfig, prodConfig)
|
||||
})
|
||||
|
|
@ -0,0 +1,32 @@
|
|||
import type { UserConfigExport } from "@tarojs/cli";
|
||||
export default {
|
||||
mini: {},
|
||||
h5: {
|
||||
/**
|
||||
* WebpackChain 插件配置
|
||||
* @docs https://github.com/neutrinojs/webpack-chain
|
||||
*/
|
||||
// webpackChain (chain) {
|
||||
// /**
|
||||
// * 如果 h5 端编译后体积过大，可以使用 webpack-bundle-analyzer 插件对打包体积进行分析。
|
||||
// * @docs https://github.com/webpack-contrib/webpack-bundle-analyzer
|
||||
// */
|
||||
// chain.plugin('analyzer')
|
||||
// .use(require('webpack-bundle-analyzer').BundleAnalyzerPlugin, [])
|
||||
// /**
|
||||
// * 如果 h5 端首屏加载时间过长，可以使用 prerender-spa-plugin 插件预加载首页。
|
||||
// * @docs https://github.com/chrisvfritz/prerender-spa-plugin
|
||||
// */
|
||||
// const path = require('path')
|
||||
// const Prerender = require('prerender-spa-plugin')
|
||||
// const staticDir = path.join(__dirname, '..', 'dist')
|
||||
// chain
|
||||
// .plugin('prerender')
|
||||
// .use(new Prerender({
|
||||
// staticDir,
|
||||
// routes: [ '/pages/index/index' ],
|
||||
// postProcess: (context) => ({ ...context, outputPath: path.join(staticDir, 'index.html') })
|
||||
// }))
|
||||
// }
|
||||
}
|
||||
} satisfies UserConfigExport
|
||||
|
|
@ -0,0 +1,6 @@
|
|||
const defineJestConfig = require('@tarojs/test-utils-vue3/dist/jest.js').default
|
||||
|
||||
module.exports = defineJestConfig({
|
||||
testEnvironment: 'jsdom',
|
||||
testMatch: ['<rootDir>/__tests__/**/*.(spec|test).[jt]s?(x)']
|
||||
})
|
||||
|
|
@ -0,0 +1,95 @@
|
|||
{
|
||||
"name": "collect_information",
|
||||
"version": "1.0.0",
|
||||
"private": true,
|
||||
"description": "警保联动小程序",
|
||||
"templateInfo": {
|
||||
"name": "default",
|
||||
"typescript": true,
|
||||
"css": "Sass",
|
||||
"framework": "Vue3"
|
||||
},
|
||||
"scripts": {
|
||||
"build:weapp": "taro build --type weapp",
|
||||
"build:swan": "taro build --type swan",
|
||||
"build:alipay": "taro build --type alipay",
|
||||
"build:tt": "taro build --type tt",
|
||||
"build:h5": "taro build --type h5",
|
||||
"build:rn": "taro build --type rn",
|
||||
"build:qq": "taro build --type qq",
|
||||
"build:jd": "taro build --type jd",
|
||||
"build:quickapp": "taro build --type quickapp",
|
||||
"build:harmony-hybrid": "taro build --type harmony-hybrid",
|
||||
"dev:weapp": "npm run build:weapp -- --watch",
|
||||
"dev:swan": "npm run build:swan -- --watch",
|
||||
"dev:alipay": "npm run build:alipay -- --watch",
|
||||
"dev:tt": "npm run build:tt -- --watch",
|
||||
"dev:h5": "npm run build:h5 -- --watch",
|
||||
"dev:rn": "npm run build:rn -- --watch",
|
||||
"dev:qq": "npm run build:qq -- --watch",
|
||||
"dev:jd": "npm run build:jd -- --watch",
|
||||
"dev:quickapp": "npm run build:quickapp -- --watch",
|
||||
"dev:harmony-hybrid": "npm run build:harmony-hybrid -- --watch",
|
||||
"test": "jest"
|
||||
},
|
||||
"browserslist": [
|
||||
"last 3 versions",
|
||||
"Android >= 4.1",
|
||||
"ios >= 8"
|
||||
],
|
||||
"author": "",
|
||||
"dependencies": {
|
||||
"@babel/runtime": "^7.21.5",
|
||||
"@nutui/nutui-taro": "^4.3.13",
|
||||
"@tarojs/components": "3.6.26",
|
||||
"@tarojs/helper": "3.6.26",
|
||||
"@tarojs/plugin-framework-vue3": "3.6.26",
|
||||
"@tarojs/plugin-html": "^3.6.26",
|
||||
"@tarojs/plugin-platform-alipay": "3.6.26",
|
||||
"@tarojs/plugin-platform-h5": "3.6.26",
|
||||
"@tarojs/plugin-platform-harmony-hybrid": "3.6.26",
|
||||
"@tarojs/plugin-platform-jd": "3.6.26",
|
||||
"@tarojs/plugin-platform-qq": "3.6.26",
|
||||
"@tarojs/plugin-platform-swan": "3.6.26",
|
||||
"@tarojs/plugin-platform-tt": "3.6.26",
|
||||
"@tarojs/plugin-platform-weapp": "3.6.26",
|
||||
"@tarojs/runtime": "3.6.26",
|
||||
"@tarojs/shared": "3.6.26",
|
||||
"@tarojs/taro": "3.6.26",
|
||||
"dayjs": "^1.11.13",
|
||||
"pinia": "^2.2.2",
|
||||
"vue": "^3.0.0"
|
||||
|
||||
},
|
||||
"devDependencies": {
|
||||
"@babel/core": "^7.8.0",
|
||||
"@nutui/auto-import-resolver": "^1.0.0",
|
||||
"@tarojs/cli": "3.6.26",
|
||||
"@tarojs/taro-loader": "3.6.26",
|
||||
"@tarojs/test-utils-vue3": "^0.1.1",
|
||||
"@tarojs/webpack5-runner": "3.6.26",
|
||||
"@types/jest": "^29.3.1",
|
||||
"@types/node": "^18.15.11",
|
||||
"@types/webpack-env": "^1.13.6",
|
||||
"@typescript-eslint/eslint-plugin": "^6.2.0",
|
||||
"@typescript-eslint/parser": "^6.2.0",
|
||||
"@vue/babel-plugin-jsx": "^1.0.6",
|
||||
"@vue/compiler-sfc": "^3.0.0",
|
||||
"babel-preset-taro": "3.6.26",
|
||||
"css-loader": "3.4.2",
|
||||
"eslint": "^8.12.0",
|
||||
"eslint-config-taro": "3.6.26",
|
||||
"eslint-plugin-vue": "^8.0.0",
|
||||
"jest": "^29.3.1",
|
||||
"jest-environment-jsdom": "^29.5.0",
|
||||
"postcss": "^8.4.18",
|
||||
"style-loader": "1.3.0",
|
||||
"stylelint": "^14.4.0",
|
||||
"ts-node": "^10.9.1",
|
||||
"tsconfig-paths-webpack-plugin": "^4.1.0",
|
||||
"typescript": "^5.1.0",
|
||||
"unplugin-vue-components": "^0.27.4",
|
||||
"vue-loader": "^17.1.0",
|
||||
"webpack": "5.78.0"
|
||||
}
|
||||
}
|
||||
|
|
@ -0,0 +1,15 @@
|
|||
{
|
||||
"miniprogramRoot": "./dist",
|
||||
"projectname": "collect_information",
|
||||
"description": "警保联动小程序",
|
||||
"appid": "touristappid",
|
||||
"setting": {
|
||||
"urlCheck": false,
|
||||
"es6": false,
|
||||
"enhance": false,
|
||||
"compileHotReLoad": false,
|
||||
"postcss": false,
|
||||
"minified": false
|
||||
},
|
||||
"compileType": "miniprogram"
|
||||
}
|
||||
|
|
@ -0,0 +1,9 @@
|
|||
{
|
||||
"miniprogramRoot": "./",
|
||||
"projectname": "collect_information",
|
||||
"appid": "testAppId",
|
||||
"setting": {
|
||||
"es6": false,
|
||||
"minified": false
|
||||
}
|
||||
}
|
||||
|
|
@ -0,0 +1,48 @@
|
|||
import { MINI_PROGRAM_USER_CONFIG } from "@/config";
|
||||
|
||||
|
||||
const tabBarItems = Object.values(MINI_PROGRAM_USER_CONFIG).map(item => item.tabBarList).flat()
|
||||
|
||||
export default defineAppConfig({
|
||||
pages: [
|
||||
'pages/login/login',
|
||||
'pages/register/register',
|
||||
...tabBarItems.map(i => i.pagePath)
|
||||
],
|
||||
subPackages: [
|
||||
{
|
||||
root: "subPages/projectManager",
|
||||
pages: [
|
||||
'myProject/myProject',
|
||||
'myProject/projectDetails/projectDetails',
|
||||
'securityUserForm/securityUserForm',
|
||||
]
|
||||
},
|
||||
{
|
||||
root: "subPages/police",
|
||||
pages: [
|
||||
'dailyInspection/dailyInspection',
|
||||
'myEnterprisesUnit/myEnterprisesUnit',
|
||||
'myEnterprisesUnit/projectDetails/projectDetails'
|
||||
]
|
||||
},
|
||||
{
|
||||
root: "subPages/select",
|
||||
pages: [
|
||||
'dailyLife/dailyLife',
|
||||
'signature/signature'
|
||||
]
|
||||
},
|
||||
],
|
||||
|
||||
window: {
|
||||
backgroundTextStyle: 'light',
|
||||
navigationBarBackgroundColor: '#4e87ff',
|
||||
navigationBarTitleText: '',
|
||||
navigationBarTextStyle: 'white',
|
||||
},
|
||||
tabBar: {
|
||||
custom: true,
|
||||
list: tabBarItems
|
||||
}
|
||||
})
|
||||
|
|
@ -0,0 +1,32 @@
|
|||
import {createApp} from 'vue'
|
||||
import '@/app.scss'
|
||||
import '@/assets/css/main.css'
|
||||
import {pinia} from "@/store";
|
||||
import Taro from "@tarojs/taro";
|
||||
import {MINI_PROGRAM_USER_CONFIG} from "@/config";
|
||||
import {useUserStore} from "@/store/userStore";
|
||||
import {initEnum} from "@/enums";
|
||||
|
||||
const App = createApp({
|
||||
onLaunch(opt) {
|
||||
initEnum()
|
||||
if (opt.path === 'subPages/projectManager/securityUserForm/securityUserForm' && opt.query.type === 'QcCodeInput') {
|
||||
return
|
||||
}
|
||||
const tokenInfo = useUserStore().getTokenInfo();
|
||||
if (tokenInfo) {
|
||||
Taro.switchTab({
|
||||
url: MINI_PROGRAM_USER_CONFIG[tokenInfo.extData.identity.value].toIndex
|
||||
})
|
||||
} else {
|
||||
Taro.navigateTo({
|
||||
url: '/pages/login/login',
|
||||
})
|
||||
}
|
||||
},
|
||||
// 入口组件不需要实现 render 方法，即使实现了也会被 taro 所覆盖
|
||||
})
|
||||
|
||||
App.use(pinia)
|
||||
|
||||
export default App
|
||||
|
|
@ -0,0 +1,308 @@
|
|||
/* -- 内外边距 -- */
|
||||
.margin-0 {
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
.margin-xs {
|
||||
margin: 10rpx;
|
||||
}
|
||||
|
||||
.margin-sm {
|
||||
margin: 20rpx;
|
||||
}
|
||||
|
||||
.margin {
|
||||
margin: 30rpx;
|
||||
}
|
||||
|
||||
.margin-lg {
|
||||
margin: 40rpx;
|
||||
}
|
||||
|
||||
.margin-xl {
|
||||
margin: 50rpx;
|
||||
}
|
||||
|
||||
.margin-top-xs {
|
||||
margin-top: 10rpx;
|
||||
}
|
||||
|
||||
.margin-top-sm {
|
||||
margin-top: 20rpx;
|
||||
}
|
||||
|
||||
.margin-top {
|
||||
margin-top: 30rpx;
|
||||
}
|
||||
|
||||
.margin-top-lg {
|
||||
margin-top: 40rpx;
|
||||
}
|
||||
|
||||
.margin-top-xl {
|
||||
margin-top: 50rpx;
|
||||
}
|
||||
|
||||
.margin-right-xs {
|
||||
margin-right: 10rpx;
|
||||
}
|
||||
|
||||
.margin-right-sm {
|
||||
margin-right: 20rpx;
|
||||
}
|
||||
|
||||
.margin-right {
|
||||
margin-right: 30rpx;
|
||||
}
|
||||
|
||||
.margin-right-lg {
|
||||
margin-right: 40rpx;
|
||||
}
|
||||
|
||||
.margin-right-xl {
|
||||
margin-right: 50rpx;
|
||||
}
|
||||
|
||||
.margin-bottom-xs {
|
||||
margin-bottom: 10rpx;
|
||||
}
|
||||
|
||||
.margin-bottom-sm {
|
||||
margin-bottom: 20rpx;
|
||||
}
|
||||
|
||||
.margin-bottom {
|
||||
margin-bottom: 30rpx;
|
||||
}
|
||||
|
||||
.margin-bottom-lg {
|
||||
margin-bottom: 40rpx;
|
||||
}
|
||||
|
||||
.margin-bottom-xl {
|
||||
margin-bottom: 50rpx;
|
||||
}
|
||||
|
||||
.margin-left-xs {
|
||||
margin-left: 10rpx;
|
||||
}
|
||||
|
||||
.margin-left-sm {
|
||||
margin-left: 20rpx;
|
||||
}
|
||||
|
||||
.margin-left {
|
||||
margin-left: 30rpx;
|
||||
}
|
||||
|
||||
.margin-left-lg {
|
||||
margin-left: 40rpx;
|
||||
}
|
||||
|
||||
.margin-left-xl {
|
||||
margin-left: 50rpx;
|
||||
}
|
||||
|
||||
.margin-lr-xs {
|
||||
margin-left: 10rpx;
|
||||
margin-right: 10rpx;
|
||||
}
|
||||
|
||||
.margin-lr-sm {
|
||||
margin-left: 20rpx;
|
||||
margin-right: 20rpx;
|
||||
}
|
||||
|
||||
.margin-lr {
|
||||
margin-left: 30rpx;
|
||||
margin-right: 30rpx;
|
||||
}
|
||||
|
||||
.margin-lr-lg {
|
||||
margin-left: 40rpx;
|
||||
margin-right: 40rpx;
|
||||
}
|
||||
|
||||
.margin-lr-xl {
|
||||
margin-left: 50rpx;
|
||||
margin-right: 50rpx;
|
||||
}
|
||||
|
||||
.margin-tb-xs {
|
||||
margin-top: 10rpx;
|
||||
margin-bottom: 10rpx;
|
||||
}
|
||||
|
||||
.margin-tb-sm {
|
||||
margin-top: 20rpx;
|
||||
margin-bottom: 20rpx;
|
||||
}
|
||||
|
||||
.margin-tb {
|
||||
margin-top: 30rpx;
|
||||
margin-bottom: 30rpx;
|
||||
}
|
||||
|
||||
.margin-tb-lg {
|
||||
margin-top: 40rpx;
|
||||
margin-bottom: 40rpx;
|
||||
}
|
||||
|
||||
.margin-tb-xl {
|
||||
margin-top: 50rpx;
|
||||
margin-bottom: 50rpx;
|
||||
}
|
||||
|
||||
.padding-0 {
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
.padding-xs {
|
||||
padding: 10rpx;
|
||||
}
|
||||
|
||||
.padding-sm {
|
||||
padding: 20rpx;
|
||||
}
|
||||
|
||||
.padding {
|
||||
padding: 30rpx;
|
||||
}
|
||||
|
||||
.padding-lg {
|
||||
padding: 40rpx;
|
||||
}
|
||||
|
||||
.padding-xl {
|
||||
padding: 50rpx;
|
||||
}
|
||||
|
||||
.padding-top-xs {
|
||||
padding-top: 10rpx;
|
||||
}
|
||||
|
||||
.padding-top-sm {
|
||||
padding-top: 20rpx;
|
||||
}
|
||||
|
||||
.padding-top {
|
||||
padding-top: 30rpx;
|
||||
}
|
||||
|
||||
.padding-top-lg {
|
||||
padding-top: 40rpx;
|
||||
}
|
||||
|
||||
.padding-top-xl {
|
||||
padding-top: 50rpx;
|
||||
}
|
||||
|
||||
.padding-right-xs {
|
||||
padding-right: 10rpx;
|
||||
}
|
||||
|
||||
.padding-right-sm {
|
||||
padding-right: 20rpx;
|
||||
}
|
||||
|
||||
.padding-right {
|
||||
padding-right: 30rpx;
|
||||
}
|
||||
|
||||
.padding-right-lg {
|
||||
padding-right: 40rpx;
|
||||
}
|
||||
|
||||
.padding-right-xl {
|
||||
padding-right: 50rpx;
|
||||
}
|
||||
|
||||
.padding-bottom-xs {
|
||||
padding-bottom: 10rpx;
|
||||
}
|
||||
|
||||
.padding-bottom-sm {
|
||||
padding-bottom: 20rpx;
|
||||
}
|
||||
|
||||
.padding-bottom {
|
||||
padding-bottom: 30rpx;
|
||||
}
|
||||
|
||||
.padding-bottom-lg {
|
||||
padding-bottom: 40rpx;
|
||||
}
|
||||
|
||||
.padding-bottom-xl {
|
||||
padding-bottom: 50rpx;
|
||||
}
|
||||
|
||||
.padding-left-xs {
|
||||
padding-left: 10rpx;
|
||||
}
|
||||
|
||||
.padding-left-sm {
|
||||
padding-left: 20rpx;
|
||||
}
|
||||
|
||||
.padding-left {
|
||||
padding-left: 30rpx;
|
||||
}
|
||||
|
||||
.padding-left-lg {
|
||||
padding-left: 40rpx;
|
||||
}
|
||||
|
||||
.padding-left-xl {
|
||||
padding-left: 50rpx;
|
||||
}
|
||||
|
||||
.padding-lr-xs {
|
||||
padding-left: 10rpx;
|
||||
padding-right: 10rpx;
|
||||
}
|
||||
|
||||
.padding-lr-sm {
|
||||
padding-left: 20rpx;
|
||||
padding-right: 20rpx;
|
||||
}
|
||||
|
||||
.padding-lr {
|
||||
padding-left: 30rpx;
|
||||
padding-right: 30rpx;
|
||||
}
|
||||
|
||||
.padding-lr-lg {
|
||||
padding-left: 40rpx;
|
||||
padding-right: 40rpx;
|
||||
}
|
||||
|
||||
.padding-lr-xl {
|
||||
padding-left: 50rpx;
|
||||
padding-right: 50rpx;
|
||||
}
|
||||
|
||||
.padding-tb-xs {
|
||||
padding-top: 10rpx;
|
||||
padding-bottom: 10rpx;
|
||||
}
|
||||
|
||||
.padding-tb-sm {
|
||||
padding-top: 20rpx;
|
||||
padding-bottom: 20rpx;
|
||||
}
|
||||
|
||||
.padding-tb {
|
||||
padding-top: 30rpx;
|
||||
padding-bottom: 30rpx;
|
||||
}
|
||||
|
||||
.padding-tb-lg {
|
||||
padding-top: 40rpx;
|
||||
padding-bottom: 40rpx;
|
||||
}
|
||||
|
||||
.padding-tb-xl {
|
||||
padding-top: 50rpx;
|
||||
padding-bottom: 50rpx;
|
||||
}
|
||||
Binary file not shown.
|
After Width: | Height: | Size: 12 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 20 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 30 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 7.0 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 11 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 37 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 38 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 31 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 8.7 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 32 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 35 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 35 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 1.2 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 26 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 520 B |
Binary file not shown.
|
After Width: | Height: | Size: 501 B |
Binary file not shown.
|
After Width: | Height: | Size: 565 B |
Binary file not shown.
|
After Width: | Height: | Size: 416 B |
|
|
@ -0,0 +1,46 @@
|
|||
import {UserConfig} from "@/types/config";
|
||||
|
||||
/**
|
||||
* 客户端
|
||||
*/
|
||||
export const CLIENT_TYPE = 'MINI_PROGRAM'
|
||||
|
||||
/**
|
||||
* 小程序用户配置
|
||||
*/
|
||||
export const MINI_PROGRAM_USER_CONFIG: Record<MiniProgramUserIdentity, UserConfig> = {
|
||||
police: {
|
||||
toIndex: '/pages/police/index/index',
|
||||
tabBarList: [
|
||||
{
|
||||
pagePath: 'pages/police/index/index',
|
||||
text: '首页',
|
||||
iconPath: "assets/mine/punch.png",
|
||||
selectedIconPath: "assets/mine/punch-active.png"
|
||||
},
|
||||
{
|
||||
pagePath: 'pages/police/mine/index',
|
||||
text: '我的',
|
||||
iconPath: "assets/mine/my.png",
|
||||
selectedIconPath: "assets/mine/my-active.png"
|
||||
},
|
||||
]
|
||||
},
|
||||
project_manager: {
|
||||
toIndex: '/pages/projectManager/index/index',
|
||||
tabBarList: [
|
||||
{
|
||||
pagePath: 'pages/projectManager/index/index',
|
||||
text: '首页',
|
||||
iconPath: "assets/mine/punch.png",
|
||||
selectedIconPath: "assets/mine/punch-active.png"
|
||||
},
|
||||
{
|
||||
pagePath: 'pages/projectManager/mine/index',
|
||||
text: '我的',
|
||||
iconPath: "assets/mine/my.png",
|
||||
selectedIconPath: "assets/mine/my-active.png"
|
||||
},
|
||||
]
|
||||
}
|
||||
}
|
||||
|
|
@ -0,0 +1,3 @@
|
|||
export default {
|
||||
"component": true
|
||||
}
|
||||
|
|
@ -0,0 +1,82 @@
|
|||
<template>
|
||||
<cover-view class="tab-bar">
|
||||
<cover-view class="tab-bar-border"></cover-view>
|
||||
<cover-view
|
||||
class="tab-bar-item"
|
||||
v-for="(item, index) in tabBarList"
|
||||
:key="item.pagePath"
|
||||
@tap="switchTab(index, item.pagePath)">
|
||||
<cover-image :src="selected === index ? '/' + item.selectedIconPath : '/' + item.iconPath"/>
|
||||
<cover-view :style="{ color: selected === index ? selectedColor : color }">{{ item.text }}</cover-view>
|
||||
</cover-view>
|
||||
</cover-view>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
import {MINI_PROGRAM_USER_CONFIG} from "@/config";
|
||||
import Taro from "@tarojs/taro";
|
||||
import {useTabBarStore} from "@/store/tabBarStore";
|
||||
import {storeToRefs} from "pinia";
|
||||
import {useUserStore} from "@/store/userStore";
|
||||
import {computed} from "vue";
|
||||
|
||||
const {tokenInfo} = storeToRefs(useUserStore())
|
||||
|
||||
/**
|
||||
* 默认 TabBar 与自定义 TabBar 的最大不同点在于 <p>默认 TabBar 在所有 TabBar 页共享一个组件实例，而自定义 TabBar 在各个 TabBar 页面初始化时都会创建一个新的组件实例。</p>
|
||||
* 也就是说各个 TabBar 页内的自定义 TabBar 组件实例的状态是不共享的。因此对 TabBar 的状态管理（例如 selected 选中态）则尤为重要。
|
||||
*/
|
||||
const tabBarStore = useTabBarStore()
|
||||
const {selected} = storeToRefs(tabBarStore)
|
||||
|
||||
const color = '#000000'
|
||||
const selectedColor = '#DC143C'
|
||||
|
||||
const tabBarList = computed(() => tokenInfo.value ? MINI_PROGRAM_USER_CONFIG[tokenInfo.value.extData.identity.value].tabBarList : []);
|
||||
|
||||
const switchTab = (index: number, path: string) => {
|
||||
tabBarStore.setSelected(index)
|
||||
Taro.switchTab({url: '/' + path})
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
.tab-bar {
|
||||
position: fixed;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
height: 100px;
|
||||
background: white;
|
||||
display: flex;
|
||||
padding-bottom: env(safe-area-inset-bottom);
|
||||
}
|
||||
|
||||
.tab-bar-border {
|
||||
background-color: rgba(0, 0, 0, 0.33);
|
||||
position: absolute;
|
||||
left: 0;
|
||||
top: 0;
|
||||
width: 100%;
|
||||
height: 1px;
|
||||
transform: scaleY(0.5);
|
||||
}
|
||||
|
||||
.tab-bar-item {
|
||||
flex: 1;
|
||||
text-align: center;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
flex-direction: column;
|
||||
}
|
||||
|
||||
.tab-bar-item cover-image {
|
||||
width: 54px;
|
||||
height: 54px;
|
||||
}
|
||||
|
||||
.tab-bar-item cover-view {
|
||||
font-size: 20px;
|
||||
}
|
||||
</style>
|
||||
|
|
@ -0,0 +1,40 @@
|
|||
import api from "@/request";
|
||||
import Taro from "@tarojs/taro";
|
||||
|
||||
type EnumType =
|
||||
'CheckStatus'
|
||||
| 'DeleteFlag'
|
||||
| 'IsEnable'
|
||||
| 'IsOrNot'
|
||||
| 'Sex'
|
||||
| 'ServiceProjectType'
|
||||
| 'MiniProgramUserIdentity'
|
||||
|
||||
export const initEnum = () => {
|
||||
api.get<Record<EnumType, SelectNodeVo<any>[]>>('/common/enums').then(resp => {
|
||||
Taro.setStorageSync('enumMap', resp.data)
|
||||
})
|
||||
};
|
||||
|
||||
export const enumSelectNodes = <T, >(enumType: EnumType): SelectNodeVo<T>[] => Taro.getStorageSync('enumMap')?.[enumType]
|
||||
|
||||
export const getEnumByValue = <T, >(enumType: EnumType, value: T): null | SelectNodeVo<T> => {
|
||||
const enumList = enumSelectNodes<T>(enumType);
|
||||
if (!enumList) {
|
||||
return null;
|
||||
}
|
||||
for (let i = 0; i < enumList.length; i++) {
|
||||
if (value === enumList[i].value) {
|
||||
return enumList[i]
|
||||
}
|
||||
}
|
||||
return null;
|
||||
};
|
||||
|
||||
export const getEnumLabelByValue = <T, >(enumType: EnumType, value: T): string => {
|
||||
const enums = getEnumByValue(enumType, value)
|
||||
if (!enums) {
|
||||
return '-'
|
||||
}
|
||||
return enums.label;
|
||||
};
|
||||
|
|
@ -0,0 +1,17 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta content="text/html; charset=utf-8" http-equiv="Content-Type">
|
||||
<meta content="width=device-width,initial-scale=1,user-scalable=no" name="viewport">
|
||||
<meta name="apple-mobile-web-app-capable" content="yes">
|
||||
<meta name="apple-touch-fullscreen" content="yes">
|
||||
<meta name="format-detection" content="telephone=no,address=no">
|
||||
<meta name="apple-mobile-web-app-status-bar-style" content="white">
|
||||
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" >
|
||||
<title>collect_information</title>
|
||||
<script><%= htmlWebpackPlugin.options.script %></script>
|
||||
</head>
|
||||
<body>
|
||||
<div id="app"></div>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,3 @@
|
|||
export default definePageConfig({
|
||||
navigationBarTitleText: '登录',
|
||||
})
|
||||
|
|
@ -0,0 +1,87 @@
|
|||
.SignMultiple {
|
||||
height: 100vh;
|
||||
background: #f4f5f7;
|
||||
position: relative;
|
||||
|
||||
.urlIndex {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
padding: 0;
|
||||
margin: 0;
|
||||
width: 100%;
|
||||
height: 440rpx;
|
||||
background: #3a6bbe;
|
||||
text-align: center;
|
||||
overflow: hidden;
|
||||
|
||||
.urlTitle {
|
||||
width: 100%;
|
||||
height: 300rpx;
|
||||
|
||||
.urlWelcome {
|
||||
color: #fff;
|
||||
font-size: 24px;
|
||||
}
|
||||
|
||||
.urlHibiscus {
|
||||
height: 200rpx;
|
||||
line-height: 58rpx;
|
||||
//font-size: 38rpx;
|
||||
margin: 40rpx 20rpx;
|
||||
border: 2px solid #a1b8e0;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
|
||||
.contact {
|
||||
height: 100rpx;
|
||||
width: 100rpx;
|
||||
border-radius: 50%;
|
||||
border: solid 1px gray;
|
||||
|
||||
.image {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
border-radius: 50%
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.type {
|
||||
margin: 0 20rpx 0 20rpx;
|
||||
width: 29%;
|
||||
text-align: right;
|
||||
}
|
||||
|
||||
.HiddenEse {
|
||||
position: absolute;
|
||||
top: 4px;
|
||||
right: 0;
|
||||
width: 76rpx;
|
||||
height: 40rpx;
|
||||
|
||||
image {
|
||||
width: 40rpx;
|
||||
height: 40rpx;
|
||||
}
|
||||
}
|
||||
|
||||
.SignItem {
|
||||
transform: translateY(15%);
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
margin: 20rpx 48rpx;
|
||||
border-radius: 20rpx;
|
||||
}
|
||||
|
||||
.Cancel {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
text-align: center;
|
||||
margin: 20rpx 40rpx;
|
||||
}
|
||||
|
||||
}
|
||||
|
|
@ -0,0 +1,130 @@
|
|||
<template>
|
||||
<view class="content">
|
||||
<view class="bg"></view>
|
||||
<view class="bg2"></view>
|
||||
<view class="tips">
|
||||
<text class="title">登录</text>
|
||||
<text class="subtitle">欢迎再次回来~</text>
|
||||
</view>
|
||||
<view class="form-box">
|
||||
<image src="@/assets/logo/guohui.png"/>
|
||||
<view class="btn margin-top-lg" @click="login">一键登录</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
import Taro from "@tarojs/taro";
|
||||
import api from "@/request";
|
||||
import {CLIENT_TYPE, MINI_PROGRAM_USER_CONFIG} from "@/config";
|
||||
import {useUserStore} from "@/store/userStore";
|
||||
|
||||
const {saveTokenInfo} = useUserStore()
|
||||
const login = () => {
|
||||
Taro.login({
|
||||
success: (res) => {
|
||||
if (res.code) {
|
||||
api.post<TokenInfo>("/login", {
|
||||
clientType: CLIENT_TYPE,
|
||||
loginParams: {
|
||||
code: res.code
|
||||
}
|
||||
}, {loading: true}).then(async ({data: tokenInfo}) => {
|
||||
//保存用户信息
|
||||
saveTokenInfo(tokenInfo!)
|
||||
//根据用户身份跳转对应主页
|
||||
await Taro.switchTab({
|
||||
url: MINI_PROGRAM_USER_CONFIG[tokenInfo!.extData.identity.value].toIndex
|
||||
})
|
||||
}).catch(err => {
|
||||
//没有账号
|
||||
if (err.code === 402) {
|
||||
//跳转注册页注册
|
||||
Taro.navigateTo({
|
||||
url: "/pages/register/register",
|
||||
});
|
||||
}
|
||||
})
|
||||
}
|
||||
},
|
||||
});
|
||||
};
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
.content {
|
||||
width: 100vw;
|
||||
height: 100vh;
|
||||
background-color: #ffffff;
|
||||
|
||||
.tips {
|
||||
padding-top: 200rpx;
|
||||
padding-left: 80rpx;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
|
||||
.title {
|
||||
line-height: 70rpx;
|
||||
font-weight: bold;
|
||||
font-size: 50rpx;
|
||||
}
|
||||
|
||||
.subtitle {
|
||||
line-height: 70rpx;
|
||||
font-size: 35rpx;
|
||||
font-weight: bold;
|
||||
color: #b0b0b1;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
.bg {
|
||||
position: fixed;
|
||||
top: -250rpx;
|
||||
right: -250rpx;
|
||||
width: 600rpx;
|
||||
height: 600rpx;
|
||||
border-radius: 100%;
|
||||
background-color: #00baef;
|
||||
z-index: 2
|
||||
}
|
||||
|
||||
.bg2 {
|
||||
position: fixed;
|
||||
top: -150rpx;
|
||||
right: -300rpx;
|
||||
width: 600rpx;
|
||||
height: 600rpx;
|
||||
border-radius: 100%;
|
||||
background-color: #ade8f9;
|
||||
z-index: 1;
|
||||
}
|
||||
|
||||
.form-box {
|
||||
padding-top: 180rpx;
|
||||
padding-left: 70rpx;
|
||||
width: 610rpx;
|
||||
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
|
||||
image {
|
||||
width: 200px;
|
||||
height: 200px;
|
||||
}
|
||||
|
||||
.btn {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
width: 100%;
|
||||
height: 100rpx;
|
||||
border-radius: 100rpx;
|
||||
color: #FFFFFF;
|
||||
background: linear-gradient(to right, #00c6fc, #9adcf1);
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
|
@ -0,0 +1,3 @@
|
|||
export default definePageConfig({
|
||||
navigationBarTitleText: '首页',
|
||||
})
|
||||
|
|
@ -0,0 +1,76 @@
|
|||
.nameTitle {
|
||||
position: absolute;
|
||||
top: 19%;
|
||||
left: 55px;
|
||||
height: 125rpx;
|
||||
background-color: #fff;
|
||||
width: 650rpx;
|
||||
border-radius: 12rpx;
|
||||
box-shadow: 0px 10px 10px -4px #e3e3e3;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
|
||||
.itemSchool {
|
||||
border-right: solid 1.5rpx #dadada;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
width: 25%;
|
||||
font-size: 24px
|
||||
}
|
||||
|
||||
.itemSchool text:nth-child(1) {
|
||||
margin-bottom: 10rpx;
|
||||
color: #898a8a;
|
||||
margin-left: -8px;
|
||||
}
|
||||
}
|
||||
.nameTitle .itemSchool:nth-child(4) {
|
||||
border-right: none;
|
||||
}
|
||||
.swiperDemoItem {
|
||||
color: #3886d0;
|
||||
display: flex;
|
||||
padding: 20px 0 0 50px;
|
||||
overflow: hidden;
|
||||
height: 70rpx;
|
||||
margin-top: 70px;
|
||||
|
||||
.swiperDemoIndex {
|
||||
width: 15px;
|
||||
height: 45px;
|
||||
background-image: linear-gradient(to bottom, #5d9cf9, #317ad9);
|
||||
border-radius: 20px;
|
||||
margin-right: 15px;
|
||||
}
|
||||
}
|
||||
.Module {
|
||||
background-color: #fff;
|
||||
overflow: hidden;
|
||||
.subModule {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
flex-wrap: wrap;
|
||||
.subModuleItem {
|
||||
width: 246rpx;
|
||||
height: 140rpx;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
padding-bottom: 10rpx;
|
||||
.subModuleIndex {
|
||||
width: 45rpx;
|
||||
height: 45rpx;
|
||||
image {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
|
||||
|
|
@ -0,0 +1,47 @@
|
|||
.swiperDemoItem {
|
||||
color: #3886d0;
|
||||
display: flex;
|
||||
padding: 20px 0 0 50px;
|
||||
overflow: hidden;
|
||||
height: 70rpx;
|
||||
|
||||
.swiperDemoIndex {
|
||||
width: 15px;
|
||||
height: 45px;
|
||||
background-image: linear-gradient(to bottom, #5d9cf9, #317ad9);
|
||||
//background: rgb();
|
||||
border-radius: 20px;
|
||||
margin-right: 15px;
|
||||
}
|
||||
}
|
||||
|
||||
.subModule {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
flex-wrap: wrap;
|
||||
margin-right: -3px;
|
||||
margin-left: -1px;
|
||||
|
||||
.subModuleItem {
|
||||
width: 33%;
|
||||
height: 180rpx;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
padding-bottom: 10rpx;
|
||||
border: 1px solid #ccc;
|
||||
border-left: 0;
|
||||
margin-top: -1px;
|
||||
|
||||
.subModuleIndex {
|
||||
width: 65rpx;
|
||||
height: 65rpx;
|
||||
|
||||
image {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
@ -0,0 +1,116 @@
|
|||
<template>
|
||||
<view>
|
||||
<view class="swiperDemo">
|
||||
<nut-swiper ref="swiperRef" pagination-visible pagination-color="#e53e31" :auto-play="3000" :init-page="0">
|
||||
<nut-swiper-item v-for="(item, index) in list" :key="index" style="height: 180px">
|
||||
<image :src="item" alt="" style="height: 100%; width: 100%" draggable="false" />
|
||||
</nut-swiper-item>
|
||||
</nut-swiper>
|
||||
</view>
|
||||
<view class="nameTitle">
|
||||
<view class="itemSchool">
|
||||
<text>单位数量</text>
|
||||
<text style="white-space: nowrap; overflow: hidden; text-overflow: ellipsis; width: 80px; text-align: center">{{ numberStatistics.enterprisesUnitCount }}</text>
|
||||
</view>
|
||||
<view class="itemSchool">
|
||||
<text>服务项目</text>
|
||||
<text>
|
||||
{{ numberStatistics.serviceProjectCount }}
|
||||
</text>
|
||||
</view>
|
||||
<view class="itemSchool">
|
||||
<text>有保安证人员</text>
|
||||
<text>{{ numberStatistics.securityUserCount }}</text>
|
||||
</view>
|
||||
<view class="itemSchool">
|
||||
<text>无保安证人员</text>
|
||||
<text>{{ numberStatistics.noCardSecurityUserCount }}</text>
|
||||
</view>
|
||||
</view>
|
||||
<view class="swiperDemoItem">
|
||||
<view class="swiperDemoIndex"></view>
|
||||
<view>请选择</view>
|
||||
</view>
|
||||
<!--九宫格-->
|
||||
<view class="Module">
|
||||
<view class="subModule">
|
||||
<view class="subModuleItem" v-for="item in subModuleList" :key="item.id" @click="subNavigation(item.url)">
|
||||
<view class="subModuleIndex">
|
||||
<image :src="item.icon"></image>
|
||||
</view>
|
||||
<view style="font-size: 12px; color: #414141; margin-top: 5px">{{ item.name }}</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view style="background-color: #e9eef4; height: 15rpx"></view>
|
||||
</view>
|
||||
</template>
|
||||
<script setup lang="ts">
|
||||
import { onMounted, ref } from 'vue'
|
||||
import Taro from '@tarojs/taro'
|
||||
import icon from '@/assets/images/project.png'
|
||||
import icon01 from '@/assets/images/回单.jpg'
|
||||
import icon02 from '@/assets/images/工单.jpg'
|
||||
import icon03 from '@/assets/images/排名.jpg'
|
||||
import icon04 from '@/assets/images/法制宣传.jpg'
|
||||
import icon06 from '@/assets/images/警保风采.jpg'
|
||||
import './index.scss'
|
||||
import api from '@/request'
|
||||
import { DataStatisticsRes } from '@/types/pages/police'
|
||||
const list = ref([process.env.TARO_APP_MINIO_URL + '/police-security/2024/11/5/dunpai.jpg'])
|
||||
const swiperRef = ref() //轮播图
|
||||
const subModuleList = ref([
|
||||
{
|
||||
id: 0,
|
||||
icon: icon,
|
||||
name: '项目管理',
|
||||
url: '/subPages/police/myEnterprisesUnit/myEnterprisesUnit',
|
||||
},
|
||||
{
|
||||
id: 1,
|
||||
icon: icon02,
|
||||
name: '监督考核',
|
||||
url: '/subPages/police/dailyInspection/dailyInspection',
|
||||
},
|
||||
{
|
||||
id: 2,
|
||||
icon: icon03,
|
||||
name: '考核排名',
|
||||
url: '',
|
||||
},
|
||||
{
|
||||
id: 3,
|
||||
icon: icon06,
|
||||
name: '警保风采',
|
||||
url: '',
|
||||
},
|
||||
{
|
||||
id: 4,
|
||||
icon: icon04,
|
||||
name: '法制宣传',
|
||||
url: '',
|
||||
},
|
||||
{
|
||||
id: 5,
|
||||
icon: icon01,
|
||||
name: '整改回单',
|
||||
url: '',
|
||||
},
|
||||
])
|
||||
|
||||
const numberStatistics = ref<DataStatisticsRes>({
|
||||
enterprisesUnitCount: 0,
|
||||
serviceProjectCount: 0,
|
||||
securityUserCount: 0,
|
||||
noCardSecurityUserCount: 0,
|
||||
})
|
||||
const dataStatistics = async () => {
|
||||
const resp = await api.get<DataStatisticsRes>('/policeIndex/dataStatistics')
|
||||
numberStatistics.value = resp.data as DataStatisticsRes
|
||||
}
|
||||
onMounted(async () => {
|
||||
await dataStatistics()
|
||||
})
|
||||
|
||||
const subNavigation = async (url: string) => Taro.navigateTo({ url })
|
||||
</script>
|
||||
|
|
@ -0,0 +1,108 @@
|
|||
<template>
|
||||
<div class="search" id="search">
|
||||
<a-input v-model="valueInput" @input="searchInput" placeholder="请进行搜索"></a-input>
|
||||
<div v-if="valueInput">
|
||||
<ul>
|
||||
<li v-for="item in searchResults" :key="item.id">{{item}}</li>
|
||||
</ul>
|
||||
</div>
|
||||
<div v-else >
|
||||
没有找到相关结果
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
<script setup lang="ts">
|
||||
import {onMounted, ref,} from "vue";
|
||||
const valueInput = ref('')
|
||||
const list = ref([])
|
||||
const dataList = ref([
|
||||
{
|
||||
id:0,
|
||||
value:'齐家园'
|
||||
},
|
||||
{
|
||||
id:1,
|
||||
value:'刘德华'
|
||||
},
|
||||
{
|
||||
id:2,
|
||||
value:'张学友'
|
||||
},{
|
||||
id:3,
|
||||
value:'黎明'
|
||||
},
|
||||
{
|
||||
id:4,
|
||||
value:'家具城'
|
||||
},
|
||||
{
|
||||
id:5,
|
||||
value:'左岸春天'
|
||||
},
|
||||
{
|
||||
id:6,
|
||||
value:'麦德龙商城'
|
||||
},
|
||||
{
|
||||
id:7,
|
||||
value:'世纪酒店'
|
||||
},
|
||||
{
|
||||
id:8,
|
||||
value:'四方小学'
|
||||
},
|
||||
{
|
||||
id:9,
|
||||
value:'海洋半岛'
|
||||
},
|
||||
{
|
||||
id:10,
|
||||
value:'育英小学'
|
||||
},
|
||||
{
|
||||
id:11,
|
||||
value:'明德小学'
|
||||
},{
|
||||
id:12,
|
||||
value:'希望小学',
|
||||
}
|
||||
])
|
||||
const searchResults = ref([])
|
||||
const searchInput = (e:any)=>{
|
||||
valueInput.value = e.target.value
|
||||
if (!valueInput.value) {
|
||||
searchResults.value = []
|
||||
return;
|
||||
}else{
|
||||
searchResults.value = list.value.filter(item =>
|
||||
item.toLowerCase().includes(valueInput.value.toLowerCase())
|
||||
);
|
||||
}
|
||||
}
|
||||
onMounted(()=>{
|
||||
dataList.value.map((item)=>{
|
||||
return list.value.push(item.value)
|
||||
})
|
||||
})
|
||||
</script>
|
||||
|
||||
|
||||
|
||||
<style scoped lang="scss">
|
||||
.search{
|
||||
padding: 0 10px;
|
||||
overflow: hidden;
|
||||
border: 1px solid #4e71f2;
|
||||
margin: 1px 5px;
|
||||
border-radius: 10px;
|
||||
width: 30%;
|
||||
.ceShi{
|
||||
height: 300px;
|
||||
background: #ccc;
|
||||
}
|
||||
}
|
||||
.nut-input{
|
||||
padding: 20rpx 20rpx;
|
||||
margin: 5px 0;
|
||||
}
|
||||
</style>
|
||||
|
|
@ -0,0 +1,3 @@
|
|||
export default definePageConfig({
|
||||
navigationBarTitleText: '首页',
|
||||
})
|
||||
|
|
@ -0,0 +1,71 @@
|
|||
.public {
|
||||
height: 100vh;
|
||||
background-color: #fff;
|
||||
}
|
||||
.public-container {
|
||||
height: 320rpx;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
background-image: url('../../../assets/images/banner.png');
|
||||
background-repeat: no-repeat;
|
||||
background-position: right;
|
||||
overflow: hidden;
|
||||
padding: 45rpx;
|
||||
box-sizing: border-box;
|
||||
.contacts {
|
||||
height: 75rpx;
|
||||
width: 75rpx;
|
||||
border-radius: 50%;
|
||||
border: solid 1px gray;
|
||||
.image {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
}
|
||||
.tips-text {
|
||||
display: flex;
|
||||
font-size: 28rpx;
|
||||
color: #fff;
|
||||
line-height: 50rpx;
|
||||
margin-left: 20rpx;
|
||||
flex-direction: column;
|
||||
justify-content: space-evenly;
|
||||
}
|
||||
}
|
||||
.exit {
|
||||
height: 100rpx;
|
||||
line-height: 40px;
|
||||
border-bottom: solid 0.5px #ebebf7;
|
||||
box-sizing: border-box;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
color: #7d7d7d;
|
||||
.exitItem {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
margin-left: 30rpx;
|
||||
}
|
||||
.exitItemIndex {
|
||||
height: 40rpx;
|
||||
width: 40rpx;
|
||||
border-radius: 50%;
|
||||
display: block;
|
||||
line-height: 48rpx;
|
||||
image {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
}
|
||||
.microscope {
|
||||
width: 8px;
|
||||
height: 8px;
|
||||
display: inline-block;
|
||||
border: solid 2px #ccc;
|
||||
-webkit-transform: rotate(45deg);
|
||||
transform: rotate(45deg);
|
||||
border-bottom: white;
|
||||
border-left: white;
|
||||
}
|
||||
}
|
||||
|
||||
|
|
@ -0,0 +1,80 @@
|
|||
<template>
|
||||
<view class="public">
|
||||
<!-- 公安-->
|
||||
<view class="public-container" >
|
||||
<view class="contacts">
|
||||
<image src="@/assets/logo/avatar1.png" mode="scaleToFill" class="image" />
|
||||
</view>
|
||||
<view class="tips-text">
|
||||
<view style="font-size: 15px;">名字</view>
|
||||
<view style="font-size: 12px;">
|
||||
<text style="margin-right: 5px">部门 </text>
|
||||
<text>未选择单位</text>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<!-- 用户信息 -->
|
||||
<view class="userIndex">
|
||||
<view class="exit" v-for="item in datalist" :key="item.value" @click="addExit(item.value)">
|
||||
<view class="exitItem">
|
||||
<!-- <view class="exitItemIndex">-->
|
||||
<!-- <image :src="item.url" mode="scaleToFill" class="image" />-->
|
||||
<!-- </view>-->
|
||||
<text style="margin-left: 30rpx;font-size: 12px;">{{ item.name }}</text>
|
||||
</view>
|
||||
<view style="margin-right: 40rpx">
|
||||
<text class="microscope"></text>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<!-- 退出弹框-->
|
||||
<nut-dialog
|
||||
content="是否退出登录?"
|
||||
v-model:visible="visible" @cancel="visible = false" @ok="onOk"
|
||||
/>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
import './index.scss'
|
||||
import {ref} from "vue";
|
||||
import {useUserStore} from "@/store/userStore";
|
||||
import {useTabBarStore} from "@/store/tabBarStore"
|
||||
import Taro from "@tarojs/taro";
|
||||
|
||||
const {setSelected} = useTabBarStore()
|
||||
const {resetUserInfo} = useUserStore()
|
||||
const visible = ref<boolean>(false)
|
||||
const datalist = ref([
|
||||
{
|
||||
value: 0,
|
||||
name: '简介',
|
||||
},
|
||||
{
|
||||
value: 1,
|
||||
name: '退出登录',
|
||||
},
|
||||
{
|
||||
value: 2,
|
||||
name: '修改用户信息',
|
||||
},
|
||||
{
|
||||
value: 3,
|
||||
name: '意见收集',
|
||||
},
|
||||
])
|
||||
const addExit = (index:number)=>{
|
||||
switch (index) {
|
||||
case 1:
|
||||
visible.value = true
|
||||
break;
|
||||
}
|
||||
}
|
||||
const onOk = ()=>{
|
||||
resetUserInfo()
|
||||
setSelected(0)
|
||||
Taro.navigateTo({
|
||||
url: "/pages/login/login",
|
||||
});
|
||||
}
|
||||
</script>
|
||||
|
|
@ -0,0 +1,3 @@
|
|||
export default definePageConfig({
|
||||
navigationBarTitleText: '首页',
|
||||
})
|
||||
|
|
@ -0,0 +1,76 @@
|
|||
.nameTitle {
|
||||
position: absolute;
|
||||
top: 19%;
|
||||
left: 55px;
|
||||
height: 125rpx;
|
||||
background-color: #fff;
|
||||
width: 650rpx;
|
||||
border-radius: 12rpx;
|
||||
box-shadow: 0px 10px 10px -4px #e3e3e3;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
|
||||
.itemSchool {
|
||||
border-right: solid 1.5rpx #dadada;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
width: 25%;
|
||||
font-size: 24px
|
||||
}
|
||||
|
||||
.itemSchool text:nth-child(1) {
|
||||
margin-bottom: 10rpx;
|
||||
color: #898a8a;
|
||||
margin-left: -8px;
|
||||
}
|
||||
}
|
||||
.nameTitle .itemSchool:nth-child(4) {
|
||||
border-right: none;
|
||||
}
|
||||
.swiperDemoItem {
|
||||
color: #3886d0;
|
||||
display: flex;
|
||||
padding: 20px 0 0 50px;
|
||||
overflow: hidden;
|
||||
height: 70rpx;
|
||||
margin-top: 70px;
|
||||
|
||||
.swiperDemoIndex {
|
||||
width: 15px;
|
||||
height: 45px;
|
||||
background-image: linear-gradient(to bottom, #5d9cf9, #317ad9);
|
||||
border-radius: 20px;
|
||||
margin-right: 15px;
|
||||
}
|
||||
}
|
||||
.Module {
|
||||
background-color: #fff;
|
||||
overflow: hidden;
|
||||
.subModule {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
flex-wrap: wrap;
|
||||
.subModuleItem {
|
||||
width: 246rpx;
|
||||
height: 140rpx;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
padding-bottom: 10rpx;
|
||||
.subModuleIndex {
|
||||
width: 45rpx;
|
||||
height: 45rpx;
|
||||
image {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
|
||||
|
|
@ -0,0 +1,100 @@
|
|||
<template>
|
||||
<view>
|
||||
<view class="swiperDemo">
|
||||
<nut-swiper ref="swiperRef" pagination-visible pagination-color="#e53e31" :auto-play="3000" :init-page="0">
|
||||
<nut-swiper-item v-for="(item, index) in list" :key="index" style="height: 180px">
|
||||
<image :src="item" alt="" style="height: 100%; width: 100%" draggable="false" />
|
||||
<view>1123</view>
|
||||
</nut-swiper-item>
|
||||
</nut-swiper>
|
||||
</view>
|
||||
<view class="nameTitle">
|
||||
<view class="itemSchool">
|
||||
<text>单位数量</text>
|
||||
<text style="white-space: nowrap; overflow: hidden; text-overflow: ellipsis; width: 80px; text-align: center">51</text>
|
||||
</view>
|
||||
<view class="itemSchool">
|
||||
<text>服务项目</text>
|
||||
<text> 13123 </text>
|
||||
</view>
|
||||
<view class="itemSchool">
|
||||
<text>有保安证人员</text>
|
||||
<text> 1000</text>
|
||||
</view>
|
||||
<view class="itemSchool">
|
||||
<text>无保安证人员</text>
|
||||
<text> 140</text>
|
||||
</view>
|
||||
</view>
|
||||
<view class="swiperDemoItem">
|
||||
<view class="swiperDemoIndex"></view>
|
||||
<view>请选择</view>
|
||||
</view>
|
||||
<!--九宫格-->
|
||||
<view class="Module">
|
||||
<view class="subModule">
|
||||
<view class="subModuleItem" v-for="item in subModuleList" :key="item.id" @click="subNavigation(item.url)">
|
||||
<view class="subModuleIndex">
|
||||
<image :src="item.icon"></image>
|
||||
</view>
|
||||
<view style="font-size: 12px; color: #414141; margin-top: 5px">{{ item.name }}</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view style="background-color: #e9eef4; height: 15rpx"></view>
|
||||
</view>
|
||||
</template>
|
||||
<script setup lang="ts">
|
||||
import { ref } from 'vue'
|
||||
import Taro from '@tarojs/taro'
|
||||
import icon from '@/assets/images/project.png'
|
||||
import icon01 from '@/assets/images/回单.jpg'
|
||||
import icon02 from '@/assets/images/工单.jpg'
|
||||
import icon03 from '@/assets/images/排名.jpg'
|
||||
import icon04 from '@/assets/images/法制宣传.jpg'
|
||||
import icon06 from '@/assets/images/警保风采.jpg'
|
||||
|
||||
import './index.scss'
|
||||
const list = ref([process.env.TARO_APP_MINIO_URL + '/police-security/2024/11/5/dunpai.jpg'])
|
||||
const swiperRef = ref() //轮播图
|
||||
const subModuleList = ref([
|
||||
{
|
||||
id: 0,
|
||||
icon: icon,
|
||||
name: '项目管理',
|
||||
url: '/subPages/projectManager/myProject/myProject',
|
||||
},
|
||||
{
|
||||
id: 1,
|
||||
icon: icon02,
|
||||
name: '整改工单',
|
||||
url: '',
|
||||
},
|
||||
{
|
||||
id: 2,
|
||||
icon: icon03,
|
||||
name: '考核排名',
|
||||
url: '',
|
||||
},
|
||||
{
|
||||
id: 3,
|
||||
icon: icon06,
|
||||
name: '警保风采',
|
||||
url: '',
|
||||
},
|
||||
{
|
||||
id: 4,
|
||||
icon: icon04,
|
||||
name: '法制宣传',
|
||||
url: '',
|
||||
},
|
||||
{
|
||||
id: 5,
|
||||
icon: icon01,
|
||||
name: '整改回单',
|
||||
url: '',
|
||||
},
|
||||
])
|
||||
|
||||
const subNavigation = async (url: string) => Taro.navigateTo({ url })
|
||||
</script>
|
||||
|
|
@ -0,0 +1,3 @@
|
|||
export default definePageConfig({
|
||||
navigationBarTitleText: '我的',
|
||||
})
|
||||
|
|
@ -0,0 +1,71 @@
|
|||
.mine {
|
||||
height: 100vh;
|
||||
background-color: #fff;
|
||||
}
|
||||
.mine-container {
|
||||
height: 320rpx;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
background-image: url('../../../assets/images/banner.png');
|
||||
background-repeat: no-repeat;
|
||||
background-position: right;
|
||||
overflow: hidden;
|
||||
padding: 45rpx;
|
||||
box-sizing: border-box;
|
||||
.contacts {
|
||||
height: 75rpx;
|
||||
width: 75rpx;
|
||||
border-radius: 50%;
|
||||
border: solid 1px gray;
|
||||
.image {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
}
|
||||
.tips-text {
|
||||
display: flex;
|
||||
font-size: 28rpx;
|
||||
color: #fff;
|
||||
line-height: 50rpx;
|
||||
margin-left: 20rpx;
|
||||
flex-direction: column;
|
||||
justify-content: space-evenly;
|
||||
}
|
||||
}
|
||||
.exit {
|
||||
height: 100rpx;
|
||||
line-height: 40px;
|
||||
border-bottom: solid 0.5px #ebebf7;
|
||||
box-sizing: border-box;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
color: #7d7d7d;
|
||||
.exitItem {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
margin-left: 30rpx;
|
||||
}
|
||||
.exitItemIndex {
|
||||
height: 40rpx;
|
||||
width: 40rpx;
|
||||
border-radius: 50%;
|
||||
display: block;
|
||||
line-height: 48rpx;
|
||||
image {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
}
|
||||
.microscope {
|
||||
width: 8px;
|
||||
height: 8px;
|
||||
display: inline-block;
|
||||
border: solid 2px #ccc;
|
||||
-webkit-transform: rotate(45deg);
|
||||
transform: rotate(45deg);
|
||||
border-bottom: white;
|
||||
border-left: white;
|
||||
}
|
||||
}
|
||||
|
||||
|
|
@ -0,0 +1,81 @@
|
|||
<template>
|
||||
<view class="mine">
|
||||
<view class="mine-container" >
|
||||
<view class="contacts">
|
||||
<image src="@/assets/logo/avatar1.png" mode="scaleToFill" class="image" />
|
||||
</view>
|
||||
<view class="tips-text">
|
||||
<view style="font-size: 15px;">名字</view>
|
||||
<view style="font-size: 12px;">
|
||||
<text style="margin-right: 5px">保安部门 </text>
|
||||
<text>未选择单位</text>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<!-- 用户信息 -->
|
||||
<view class="userIndex">
|
||||
<view class="exit" v-for="item in datalist" :key="item.value" @click="addExit(item.value)">
|
||||
<view class="exitItem">
|
||||
<!-- <view class="exitItemIndex">-->
|
||||
<!-- <image :src="item.url" mode="scaleToFill" class="image" />-->
|
||||
<!-- </view>-->
|
||||
<text style="margin-left: 30rpx;font-size: 12px;">{{ item.name }}</text>
|
||||
</view>
|
||||
<view style="margin-right: 40rpx">
|
||||
<text class="microscope"></text>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<!-- 退出弹框-->
|
||||
<nut-dialog
|
||||
content="是否退出登录?"
|
||||
v-model:visible="visible" @cancel="visible = false" @ok="onOk"
|
||||
/>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
import './index.scss'
|
||||
import {ref} from "vue";
|
||||
import {useUserStore} from "@/store/userStore";
|
||||
import {useTabBarStore} from "@/store/tabBarStore"
|
||||
import Taro from "@tarojs/taro";
|
||||
|
||||
const {setSelected} = useTabBarStore()
|
||||
const {resetUserInfo} = useUserStore()
|
||||
const visible = ref<boolean>(false)
|
||||
const datalist = ref([
|
||||
{
|
||||
value: 0,
|
||||
name: '小程序简介',
|
||||
},
|
||||
{
|
||||
value: 1,
|
||||
name: '退出登录',
|
||||
},
|
||||
{
|
||||
value: 2,
|
||||
name: '修改用户信息',
|
||||
},
|
||||
{
|
||||
value: 3,
|
||||
name: '意见收集',
|
||||
},
|
||||
])
|
||||
|
||||
const addExit = (index:number)=>{
|
||||
switch (index) {
|
||||
case 1:
|
||||
visible.value = true
|
||||
break;
|
||||
}
|
||||
}
|
||||
const onOk = ()=>{
|
||||
resetUserInfo()
|
||||
setSelected(0)
|
||||
Taro.navigateTo({
|
||||
url: "/pages/login/login",
|
||||
});
|
||||
}
|
||||
|
||||
</script>
|
||||
|
|
@ -0,0 +1,3 @@
|
|||
export default definePageConfig({
|
||||
navigationBarTitleText: '注册'
|
||||
})
|
||||
|
|
@ -0,0 +1,43 @@
|
|||
.register {
|
||||
height: 100vh;
|
||||
}
|
||||
|
||||
.nut-cell-group__wrap {
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
.registerIndex {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.registerBtn {
|
||||
margin-top: 40rpx;
|
||||
padding: 0 20px;
|
||||
}
|
||||
|
||||
.buttonChoose {
|
||||
margin: 0;
|
||||
border: none;
|
||||
background: transparent;
|
||||
outline: none;
|
||||
padding: 0;
|
||||
height: 90rpx;
|
||||
width: 90rpx;
|
||||
border-radius: 50%;
|
||||
}
|
||||
|
||||
.nickNameInput{
|
||||
color: black;
|
||||
}
|
||||
|
||||
.contact {
|
||||
height: 83rpx;
|
||||
width: 83rpx;
|
||||
border-radius: 50%;
|
||||
border: solid 1px gray;
|
||||
|
||||
.image {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
}
|
||||
|
|
@ -0,0 +1,225 @@
|
|||
<template>
|
||||
<view class="register">
|
||||
<view class="registerIndex">
|
||||
<nut-form :model-value="formData" ref="formRef" :rules="rules">
|
||||
<nut-form-item label="头像：">
|
||||
<button class="buttonChoose" open-type="chooseAvatar" @chooseAvatar="onChooseAvatar">
|
||||
<view class="contact">
|
||||
<image :src="formData.avatar" mode="scaleToFill" class="image"/>
|
||||
</view>
|
||||
</button>
|
||||
</nut-form-item>
|
||||
<nut-form-item label="姓名：" prop="name">
|
||||
<nut-input
|
||||
v-model="formData.name"
|
||||
placeholder="请输入您的昵称"
|
||||
type="text"
|
||||
/>
|
||||
</nut-form-item>
|
||||
<nut-form-item label="性别：" prop="sex">
|
||||
<nut-radio-group v-model="formData.sex" direction="horizontal">
|
||||
<nut-radio v-for="item in SEX" :key="item.value" :label="item.value"
|
||||
>{{ item.label }}
|
||||
</nut-radio>
|
||||
</nut-radio-group>
|
||||
</nut-form-item>
|
||||
<nut-form-item label="身份：">
|
||||
<nut-radio-group v-model="formData.identity">
|
||||
<nut-radio
|
||||
v-for="item in IDENTITY"
|
||||
:key="item.value"
|
||||
:label="item.value"
|
||||
>{{ item.label }}
|
||||
</nut-radio>
|
||||
</nut-radio-group>
|
||||
</nut-form-item>
|
||||
|
||||
<nut-form-item label="行政区划：" prop="name">
|
||||
<view @click="visible = true" style="color: #808080">
|
||||
{{ streetCommunitySmallCommunityLabel || "请选择行政区划" }}
|
||||
</view>
|
||||
</nut-form-item>
|
||||
<nut-form-item label="单位：" name="unitId">
|
||||
<view @click="unitsList" style="color: #808080">
|
||||
{{ selectedLabel || '请选择单位' }}
|
||||
</view>
|
||||
</nut-form-item>
|
||||
</nut-form>
|
||||
<nut-cascader
|
||||
v-model:visible="visible"
|
||||
v-model="TreeValue"
|
||||
title="选择地址"
|
||||
@change="change"
|
||||
lazy
|
||||
:lazy-load="lazyLoad"
|
||||
text-key="label"
|
||||
></nut-cascader>
|
||||
<nut-popup v-model:visible="show" position="bottom">
|
||||
<nut-picker
|
||||
:field-names="{
|
||||
text: 'label',
|
||||
children: 'extData'
|
||||
}" v-model="formData.unitId" :columns="columns" title="请选择单位" @confirm="confirm" @cancel="show = false"/>
|
||||
</nut-popup>
|
||||
<view class="registerBtn">
|
||||
<nut-button block type="success" @click="register">注册</nut-button>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
<script setup lang="ts">
|
||||
import './register.scss'
|
||||
import {onMounted, ref, watch} from "vue";
|
||||
import {enumSelectNodes} from "@/enums";
|
||||
import Taro from "@tarojs/taro";
|
||||
import api from '@/request/index'
|
||||
import type {FormInstance} from "@nutui/nutui-taro";
|
||||
import {FormRules} from "@nutui/nutui-taro/dist/types/__VUE/form/types";
|
||||
import {RegisterParams} from "@/types/pages/register";
|
||||
|
||||
const IDENTITY = enumSelectNodes('MiniProgramUserIdentity')
|
||||
const SEX = enumSelectNodes('Sex')
|
||||
|
||||
const formData = ref<RegisterParams>({
|
||||
avatar: "https://img12.360buyimg.com/imagetools/jfs/t1/196430/38/8105/14329/60c806a4Ed506298a/e6de9fb7b8490f38.png",
|
||||
name: "",
|
||||
sex: 0,
|
||||
telephone: '',
|
||||
identity: 'police',
|
||||
unitId: ''
|
||||
});
|
||||
const show = ref(false)
|
||||
const visible = ref(false)
|
||||
|
||||
const TreeValue = ref<Record<string, any>[]>([])
|
||||
// const TreeData = ref([]);
|
||||
|
||||
const streetCommunitySmallCommunityLabel = ref<string>("");
|
||||
const getAdministrativeDivisionTree = async (value:string) => {
|
||||
const resp = await api.get<TreeNodeVo<string>[]>('/common/administrativeDivisionByParentCode',{parentCode:value})
|
||||
return resp.data as any
|
||||
}
|
||||
|
||||
|
||||
const change = async (value: string, pathNodes: Record<string, any>[]) => {
|
||||
streetCommunitySmallCommunityLabel.value = pathNodes.map((e) => e.text).join(",");
|
||||
TreeValue.value = value as any
|
||||
}
|
||||
const lazyLoad = async (node:any, resolve:any)=>{
|
||||
if (node.root) {
|
||||
await resolve(getAdministrativeDivisionTree ('0'))
|
||||
} else {
|
||||
await resolve(getAdministrativeDivisionTree (node.value))
|
||||
}
|
||||
}
|
||||
const columns = ref([])
|
||||
const unitsList = async () => {
|
||||
if (streetCommunitySmallCommunityLabel.value !== '') {
|
||||
show.value = true
|
||||
const queryUnitListByIdentityQueryParams = {
|
||||
identity: formData.value.identity,
|
||||
administrativeDivisionCodes: TreeValue.value
|
||||
}
|
||||
const resp = await api.post<TreeNodeVo<string>[]>('/common/queryUnitListByIdentity', queryUnitListByIdentityQueryParams)
|
||||
columns.value = resp.data as any
|
||||
} else {
|
||||
Taro.showToast({
|
||||
title: '请先选择行政区划',
|
||||
})
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
const selectedLabel = ref('')
|
||||
const confirm = ({selectedOptions}) => {
|
||||
Object.keys(selectedOptions).forEach((e) => {
|
||||
selectedLabel.value = selectedOptions[e].label
|
||||
formData.value.unitId = selectedOptions[e].value
|
||||
})
|
||||
console.log(formData.value.unitId, selectedLabel.value)
|
||||
show.value = false
|
||||
}
|
||||
|
||||
// 身份
|
||||
watch(() => formData.value.identity, () => {
|
||||
formData.value.unitId = ''
|
||||
selectedLabel.value = ''
|
||||
})
|
||||
const formRef = ref<FormInstance>()
|
||||
// 注册之前先调用login拿取code 传递给后端
|
||||
// 注册
|
||||
const register = async () => {
|
||||
await Taro.login({
|
||||
success: async function (res) {
|
||||
if (res.code) {
|
||||
const miniProgramUserRegisterParams = {
|
||||
code: res.code,
|
||||
name: formData.value.name,
|
||||
telephone: formData.value.telephone,
|
||||
sex: formData.value.sex,
|
||||
identity: formData.value.identity,
|
||||
unitId: formData.value.unitId
|
||||
}
|
||||
const resp = await api.post<string>('/miniProgramUser/register', miniProgramUserRegisterParams, {loading: true})
|
||||
Taro.showToast({
|
||||
title: "注册成功",
|
||||
icon: 'success',
|
||||
duration: 2000,
|
||||
mask: true,
|
||||
}).then()
|
||||
await Taro.setStorage({
|
||||
key: "token",
|
||||
data: resp.data,
|
||||
success() {
|
||||
Taro.navigateTo({
|
||||
url: '/pages/login/login'
|
||||
})
|
||||
},
|
||||
})
|
||||
} else {
|
||||
Taro.showToast({
|
||||
title: res.errMsg,
|
||||
icon: 'error',
|
||||
duration: 2000,
|
||||
mask: true
|
||||
}).then()
|
||||
}
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
const rules: FormRules = {
|
||||
name: [
|
||||
{required: true, message: "请输入姓名"},
|
||||
{
|
||||
validator: (value) => {
|
||||
return !(value.length < 2 || value.length >= 20);
|
||||
},
|
||||
message: "名字在2~20字符之间",
|
||||
},
|
||||
],
|
||||
sex: [{required: true, message: "请选择性别"}],
|
||||
telephone: [
|
||||
{required: true, message: "请输入手机号码"},
|
||||
{
|
||||
regex: /^400(-?)[0-9]{7}$|^1\d{10}$|^0[0-9]{2,3}-[0-9]{7,8}$/,
|
||||
message: "手机格式错误",
|
||||
},
|
||||
],
|
||||
};
|
||||
|
||||
// 获取头像
|
||||
const onChooseAvatar = (e) => {
|
||||
const {avatarUrl} = e.detail
|
||||
formData.value.avatar = avatarUrl
|
||||
}
|
||||
// 获取昵称
|
||||
// const getNickname = (e) => {
|
||||
// formData.value.name = e.detail.value
|
||||
// console.log(formData.value.name)
|
||||
// }
|
||||
|
||||
onMounted(async () => {
|
||||
await getAdministrativeDivisionTree()
|
||||
})
|
||||
</script>
|
||||
|
|
@ -0,0 +1,3 @@
|
|||
export default {
|
||||
"component": true
|
||||
}
|
||||
|
|
@ -0,0 +1,85 @@
|
|||
.uiwu-flex-align {
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.uiwu-flex {
|
||||
display: flex;
|
||||
}
|
||||
|
||||
.uiwu-flex-space {
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
}
|
||||
|
||||
.uiwu-picker-search {
|
||||
position: absolute;
|
||||
height: 1031rpx;
|
||||
left: 0;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
background: url('../assets/images/popuptiobg.png') no-repeat 0 0 #fff;
|
||||
background-size: 100% auto;
|
||||
border-radius: 30rpx 30rpx 0 0;
|
||||
|
||||
&-btn {
|
||||
padding: 20rpx 30rpx 40rpx;
|
||||
|
||||
text {
|
||||
&:nth-child(1) {
|
||||
color: #999;
|
||||
}
|
||||
|
||||
&:nth-child(2) {
|
||||
color: #00bbff;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
&-input {
|
||||
box-sizing: border-box;
|
||||
height: 80rpx;
|
||||
background: rgba(#f3f6fd, 0.6);
|
||||
border-radius: 16rpx;
|
||||
margin: 0 30rpx;
|
||||
padding-left: 24rpx;
|
||||
padding-right: 10rpx;
|
||||
|
||||
input {
|
||||
font-size: 28rpx;
|
||||
width: 100%;
|
||||
}
|
||||
}
|
||||
|
||||
.scroll-view {
|
||||
width: 100%;
|
||||
height: calc(100% - 212rpx);
|
||||
margin-top: 30rpx;
|
||||
}
|
||||
|
||||
.radio-group {
|
||||
padding: 0 50rpx 30rpx;
|
||||
|
||||
&-item {
|
||||
margin-bottom: 20rpx;
|
||||
|
||||
text {
|
||||
font-size: 28rpx;
|
||||
color: #666;
|
||||
}
|
||||
|
||||
radio {
|
||||
transform: scale(0.8);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.searchButton {
|
||||
height: 60rpx;
|
||||
width: 200rpx;
|
||||
border-radius: 10rpx;
|
||||
line-height: 60rpx;
|
||||
text-align: center;
|
||||
color: #fff;
|
||||
background-color: #00bbff;
|
||||
}
|
||||
|
|
@ -0,0 +1,90 @@
|
|||
<template>
|
||||
<view>
|
||||
<view @tap.stop="open">11111</view>
|
||||
<nut-popup v-model:visible="show" position="bottom" round="true">
|
||||
<view style="height: 1031rpx">
|
||||
<view class="uiwu-picker-search">
|
||||
<view class="uiwu-picker-search-btn uiwu-flex uiwu-flex-space">
|
||||
<text @tap.stop="show = false">取消</text>
|
||||
<text @tap.stop="determine">确定</text>
|
||||
</view>
|
||||
<view class="uiwu-picker-search-input uiwu-flex uiwu-flex-align">
|
||||
<input v-model="inputText.value" type="text" :placeholder="placeholder" confirm-type="search" @confirm="confirm_" />
|
||||
<view @click.stop="confirm" class="searchButton">搜索</view>
|
||||
</view>
|
||||
<scroll-view class="scroll-view" scroll-y>
|
||||
<!-- <radio-group class="radio-group" @change="change">
|
||||
<view class="radio-group-item uiwu-flex uiwu-flex-space" v-for="(item, index) in listData.value" :key="index">
|
||||
<text>{{ item.bank_name }}</text>
|
||||
<radio :value="item.bank_name" color="#687CFF" />
|
||||
</view>
|
||||
</radio-group> -->
|
||||
</scroll-view>
|
||||
</view>
|
||||
</view>
|
||||
</nut-popup>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import './picker-search.scss'
|
||||
import { ref, expose } from 'vue'
|
||||
// import { searchBankName } from '@/api/app'
|
||||
|
||||
const props = defineProps({
|
||||
placeholder: {
|
||||
type: String,
|
||||
default: '请输入银行名称',
|
||||
},
|
||||
})
|
||||
|
||||
// 定义响应式变量
|
||||
const show = ref(true)
|
||||
const listData = ref([])
|
||||
const currentBankName = ref('')
|
||||
const inputText = ref('')
|
||||
|
||||
// 搜索方法
|
||||
const confirm = () => {
|
||||
// searchBankName({ bank_name: inputText.value.trim() }).then((res) => {
|
||||
// console.log('searchBankName', res)
|
||||
// listData.value = res.data
|
||||
// })
|
||||
}
|
||||
|
||||
// 输入确认方法
|
||||
const confirm_ = ({ detail: { value } }) => {
|
||||
console.log('confirm', value)
|
||||
// searchBankName({ bank_name: value.trim() }).then((res) => {
|
||||
// console.log('searchBankName', res)
|
||||
// listData.value = res.data
|
||||
// })
|
||||
}
|
||||
|
||||
// 单选框切换方法
|
||||
const change = ({ detail: { value } }) => {
|
||||
console.log('change', value)
|
||||
currentBankName.value = value
|
||||
}
|
||||
|
||||
// 确定方法
|
||||
const determine = () => {
|
||||
if (currentBankName.value.trim() === '') {
|
||||
uni.showToast({
|
||||
title: '请选择银行',
|
||||
duration: 1500,
|
||||
icon: 'error',
|
||||
})
|
||||
return
|
||||
}
|
||||
// 触发父组件的事件，传递选择的银行名称
|
||||
emit('change', currentBankName.value.trim())
|
||||
show.value = false
|
||||
}
|
||||
|
||||
// 打开弹窗
|
||||
const open = () => {
|
||||
show.value = true
|
||||
}
|
||||
// expose({ open })
|
||||
</script>
|
||||
|
|
@ -0,0 +1,112 @@
|
|||
import Taro from "@tarojs/taro";
|
||||
import { ApiOptions } from "@/types/request";
|
||||
import { useUserStore } from "@/store/userStore";
|
||||
|
||||
|
||||
/**
|
||||
* 请求拦截器
|
||||
* @param chain
|
||||
*/
|
||||
const requestInterceptor = (chain: Taro.Chain) => {
|
||||
const requestParams = chain.requestParams
|
||||
const tokenInfo = useUserStore().getTokenInfo()
|
||||
const { header } = requestParams;
|
||||
const customHeader: Record<string, any> = {}
|
||||
//添加token
|
||||
tokenInfo && (customHeader[tokenInfo.name] = tokenInfo.value);
|
||||
requestParams.header = {
|
||||
...header,
|
||||
...customHeader
|
||||
}
|
||||
return chain.proceed(requestParams)
|
||||
}
|
||||
|
||||
//所有的拦截器
|
||||
const interceptors = [requestInterceptor];
|
||||
//注册拦截器
|
||||
interceptors.forEach((interceptorItem) => Taro.addInterceptor(interceptorItem));
|
||||
|
||||
class CustomRequest {
|
||||
BASE_API: string = process.env.TARO_APP_BASE_API;
|
||||
|
||||
private request<T>(url: string, method: keyof Taro.request.Method, options: ApiOptions, params?: object,): Promise<JsonResult<T>> {
|
||||
// console.log(this.BASE_API,'0000000')
|
||||
return new Promise<JsonResult<T>>((resolve, reject) => {
|
||||
if (options.loading) {
|
||||
Taro.showLoading({
|
||||
title: '请求中...',
|
||||
}).then()
|
||||
// Taro.showLoading({
|
||||
// title: '请求中...',
|
||||
// })
|
||||
}
|
||||
Taro.request<JsonResult<T>, object>({
|
||||
url: this.BASE_API + url,
|
||||
data: params,
|
||||
method,
|
||||
...options,
|
||||
success: (result) => {
|
||||
Taro.hideLoading()
|
||||
if (result.header['Content-Type'] === 'application/octet-stream') {
|
||||
resolve(result.data)
|
||||
return
|
||||
}
|
||||
const jsonResult = result.data
|
||||
if (jsonResult.code !== 200) {
|
||||
if ([401].includes(jsonResult.code)) {
|
||||
// 重新登录 跳转登录页 提示错误
|
||||
}
|
||||
Taro.showToast({
|
||||
title: jsonResult.message,
|
||||
icon: 'none',
|
||||
mask: true,
|
||||
duration: 2000
|
||||
}).then()
|
||||
reject(jsonResult);
|
||||
} else {
|
||||
resolve(jsonResult);
|
||||
}
|
||||
},
|
||||
fail: (res) => {
|
||||
Taro.hideLoading()
|
||||
Taro.showToast({
|
||||
title: res.errMsg,
|
||||
icon: 'none',
|
||||
mask: true,
|
||||
duration: 2000
|
||||
}).then()
|
||||
reject(res.errMsg);
|
||||
}
|
||||
})
|
||||
})
|
||||
}
|
||||
|
||||
get<T>(url: string, params?: object, options: ApiOptions = { loading: false }): Promise<JsonResult<T>> {
|
||||
options.header = {
|
||||
...options.header,
|
||||
"content-type": 'application/x-www-form-urlencoded'
|
||||
}
|
||||
return this.request<T>(url, "GET", options, params)
|
||||
}
|
||||
|
||||
post<T>(url: string, params?: object, options: ApiOptions = { loading: false }): Promise<JsonResult<T>> {
|
||||
return this.request<T>(url, "POST", options, params)
|
||||
}
|
||||
|
||||
delete<T>(url: string, params?: object, options: ApiOptions = { loading: false }): Promise<JsonResult<T>> {
|
||||
options.header = {
|
||||
...options.header,
|
||||
"content-type": 'application/x-www-form-urlencoded'
|
||||
}
|
||||
return this.request(url, "DELETE", options, params)
|
||||
}
|
||||
|
||||
put<T>(url: string, params?: object, options: ApiOptions = { loading: false }): Promise<JsonResult<T>> {
|
||||
return this.request(url, "PUT", options, params)
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
const api = new CustomRequest();
|
||||
|
||||
export default api
|
||||
|
|
@ -0,0 +1,37 @@
|
|||
import { defineStore } from 'pinia'
|
||||
|
||||
export const useDailyStore = defineStore('daily', {
|
||||
state: () => ({
|
||||
userdailyinspection: [],
|
||||
base64_1: '',
|
||||
base64_2: '',
|
||||
}),
|
||||
actions: {
|
||||
dailyinspectionList(data) {
|
||||
this.userdailyinspection = [...data]
|
||||
},
|
||||
change_base64_1(data) {
|
||||
this.base64_1 = data
|
||||
},
|
||||
change_base64_2(data) {
|
||||
this.base64_2 = data
|
||||
},
|
||||
clearSignData() {
|
||||
this.base64_1 = ''
|
||||
this.base64_2 = ''
|
||||
},
|
||||
|
||||
},
|
||||
getters: {
|
||||
getdailyinspection(state) {
|
||||
return state.userdailyinspection
|
||||
},
|
||||
get_base64_1(state) {
|
||||
return state.base64_1
|
||||
},
|
||||
get_base64_2(state) {
|
||||
return state.base64_2
|
||||
},
|
||||
|
||||
}
|
||||
})
|
||||
|
|
@ -0,0 +1,3 @@
|
|||
import {createPinia} from 'pinia'
|
||||
|
||||
export const pinia = createPinia()
|
||||
|
|
@ -0,0 +1,14 @@
|
|||
import {defineStore} from "pinia";
|
||||
import {ref} from "vue";
|
||||
|
||||
export const useTabBarStore = defineStore('tabBar', () => {
|
||||
const selected = ref<number>(0)
|
||||
const setSelected = (index: number) => {
|
||||
selected.value = index;
|
||||
}
|
||||
|
||||
return {
|
||||
selected,
|
||||
setSelected
|
||||
}
|
||||
})
|
||||
|
|
@ -0,0 +1,40 @@
|
|||
import {defineStore} from "pinia";
|
||||
import {ref} from "vue";
|
||||
import Taro from "@tarojs/taro";
|
||||
|
||||
export const useUserStore = defineStore('userStore', () => {
|
||||
/** 获取token信息 **/
|
||||
const getTokenInfo = (): TokenInfo | null => {
|
||||
const ti = Taro.getStorageSync('tokenInfo')
|
||||
// 如果 ti 存在且不是空字符串，则返回 ti，否则返回 null
|
||||
return (ti !== undefined && ti !== null && ti !== '') ? ti : null;
|
||||
}
|
||||
/** 用户token信息 **/
|
||||
const tokenInfo = ref<TokenInfo | null>(getTokenInfo())
|
||||
/** 保存token信息 **/
|
||||
const saveTokenInfo = (t: TokenInfo) => {
|
||||
tokenInfo.value = t;
|
||||
Taro.setStorageSync('tokenInfo', tokenInfo.value)
|
||||
}
|
||||
/** 清楚token信息 */
|
||||
const clearTokenInfo = () => {
|
||||
tokenInfo.value = null
|
||||
Taro.removeStorageSync('tokenInfo')
|
||||
}
|
||||
|
||||
|
||||
/**
|
||||
* 重置用户数据
|
||||
* 一般用于用户退出登录 重置所有相关数据
|
||||
*/
|
||||
const resetUserInfo = () => {
|
||||
clearTokenInfo()
|
||||
}
|
||||
|
||||
return {
|
||||
tokenInfo,
|
||||
saveTokenInfo,
|
||||
getTokenInfo,
|
||||
resetUserInfo
|
||||
}
|
||||
})
|
||||
|
|
@ -0,0 +1,149 @@
|
|||
page {
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.container {
|
||||
width: 100%;
|
||||
|
||||
}
|
||||
|
||||
.picker {
|
||||
padding: 30rpx 30rpx;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
}
|
||||
|
||||
.exit {
|
||||
height: 100rpx;
|
||||
line-height: 40px;
|
||||
border-bottom: solid 0.5px #ebebf7;
|
||||
box-sizing: border-box;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
|
||||
.exitItem {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.iconoscope {
|
||||
z-index: 9999;
|
||||
width: 8px;
|
||||
height: 8px;
|
||||
display: inline-block;
|
||||
border: solid 2px #c2c2c2;
|
||||
margin-left: 10px;
|
||||
transform: rotate(45deg);
|
||||
border-bottom: white;
|
||||
border-left: white;
|
||||
}
|
||||
}
|
||||
|
||||
.sigh_btns {
|
||||
transform: rotate(-90deg);
|
||||
transform-origin: center
|
||||
}
|
||||
|
||||
.sigh_btns_noRotate {}
|
||||
|
||||
|
||||
|
||||
.input_width {
|
||||
width: 400rpx;
|
||||
height: 40rpx;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
.uiwu-flex-align {
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.uiwu-flex {
|
||||
display: flex;
|
||||
}
|
||||
|
||||
.uiwu-flex-space {
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
}
|
||||
|
||||
.uiwu-picker-search {
|
||||
position: absolute;
|
||||
height: 1031rpx;
|
||||
left: 0;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
background: url('../../../assets/images/popuptiobg.png') no-repeat 0 0 #fff;
|
||||
background-size: 100% auto;
|
||||
border-radius: 30rpx 30rpx 0 0;
|
||||
|
||||
&-btn {
|
||||
padding: 20rpx 30rpx 40rpx;
|
||||
|
||||
text {
|
||||
&:nth-child(1) {
|
||||
color: #999;
|
||||
}
|
||||
|
||||
&:nth-child(2) {
|
||||
color: rgb(73, 143, 242);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
&-input {
|
||||
box-sizing: border-box;
|
||||
height: 80rpx;
|
||||
background: rgba(#f3f6fd, 0.6);
|
||||
border-radius: 16rpx;
|
||||
margin: 0 30rpx;
|
||||
padding-left: 24rpx;
|
||||
padding-right: 10rpx;
|
||||
|
||||
input {
|
||||
font-size: 28rpx;
|
||||
width: 100%;
|
||||
}
|
||||
}
|
||||
|
||||
.scroll-view {
|
||||
width: 100%;
|
||||
height: 800rpx;
|
||||
margin-top: 30rpx;
|
||||
}
|
||||
|
||||
.radio-group {
|
||||
padding: 0 50rpx 30rpx;
|
||||
overflow-y: scroll;
|
||||
|
||||
&-item {
|
||||
margin-bottom: 20rpx;
|
||||
|
||||
text {
|
||||
font-size: 28rpx;
|
||||
color: #666;
|
||||
}
|
||||
|
||||
radio {
|
||||
transform: scale(0.8);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.searchButton {
|
||||
height: 60rpx;
|
||||
width: 200rpx;
|
||||
border-radius: 10rpx;
|
||||
line-height: 60rpx;
|
||||
text-align: center;
|
||||
color: #fff;
|
||||
background-color: rgb(73, 143, 242);
|
||||
}
|
||||
|
|
@ -0,0 +1,3 @@
|
|||
export default definePageConfig({
|
||||
navigationBarTitleText: '监督考核',
|
||||
})
|
||||
|
|
@ -0,0 +1,404 @@
|
|||
<template>
|
||||
<view class="container">
|
||||
<nut-form labelWidth="320rpx" labelAlign="left" @click.stop="openSearch">
|
||||
<nut-form-item label="考核单位：">
|
||||
<view class="input_width">
|
||||
<input style="width: 300rpx" disabled="true" v-model="enterprisesName" placeholder="请选择考核单位：" />
|
||||
<IconFont name="arrow-down"></IconFont>
|
||||
</view>
|
||||
</nut-form-item>
|
||||
</nut-form>
|
||||
|
||||
<!-- <picker mode="selector" :range="selector" rangeKey="label" @change="onChange">
|
||||
<view class="picker">
|
||||
考核单位：
|
||||
<view style="display: flex; align-items: center">
|
||||
<view v-if="selectorChecked.length === 0" style="color: #606266">请选择考核单位：</view>
|
||||
<view> {{ selectorChecked }}</view>
|
||||
<IconFont name="arrow-right"></IconFont>
|
||||
</view>
|
||||
</view>
|
||||
</picker> -->
|
||||
|
||||
<picker v-if="(selectorType?.length ?? 0) > 0" mode="selector" :range="selectorType" rangeKey="label" @change="onChangeType">
|
||||
<view class="picker">
|
||||
当前考核项目：
|
||||
<view style="display: flex; align-items: center">
|
||||
<view v-if="selectorCheckedType.length === 0" style="color: #606266">请选择考核项目</view>
|
||||
<view> {{ selectorCheckedType }}</view>
|
||||
<IconFont name="arrow-right"></IconFont>
|
||||
</view>
|
||||
</view>
|
||||
</picker>
|
||||
|
||||
<view class="exit" v-for="item in starRating" :key="item.snowFlakeId" @click="Onrating(item.name, item.snowFlakeId)">
|
||||
<view class="exitItem">
|
||||
<text style="margin-left: 30rpx; font-size: 16px">
|
||||
<text>{{ item.name }}（{{ item?.totalScore }}分） </text>
|
||||
</text>
|
||||
</view>
|
||||
<view style="margin-right: 30rpx; display: flex; align-items: center">
|
||||
<view v-if="item.currentScore > 0" style="color: #ff0000"> -{{ item?.currentScore }}</view>
|
||||
<IconFont name="arrow-right"></IconFont>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view>
|
||||
<nut-form labelWidth="320rpx" labelAlign="left">
|
||||
<nut-form-item label="备注">
|
||||
<nut-input v-model="_form.remark" placeholder="请输入备注" type="text" />
|
||||
</nut-form-item>
|
||||
|
||||
<nut-form-item label="考核人员签名:">
|
||||
<navigator :url="`/subPages/select/signature/signature?index=${1}&name=考核人员签名`" hover-class="navigator-hover">
|
||||
<nut-button style="height: 50rpx" shape="square" type="info">考核人员签字</nut-button>
|
||||
</navigator>
|
||||
</nut-form-item>
|
||||
<view style="display: flex; justify-content: center">
|
||||
<image v-if="_form.assessmentUserSignature" :src="_form.assessmentUserSignature" mode="aspectFit" style="height: 300rpx"></image>
|
||||
</view>
|
||||
|
||||
<nut-form-item label="被考评学校签名:">
|
||||
<navigator :url="`/subPages/select/signature/signature?index=${2}&name=被考评学校签名`" hover-class="navigator-hover">
|
||||
<nut-button style="height: 50rpx" shape="square" type="info">被考评学校负责人</nut-button>
|
||||
</navigator>
|
||||
</nut-form-item>
|
||||
<view style="display: flex; justify-content: center">
|
||||
<image v-if="_form.byAssessmentEnterprisesUnitUserSignature" :src="_form.byAssessmentEnterprisesUnitUserSignature" mode="heightFix" style="height: 300rpx"></image>
|
||||
</view>
|
||||
</nut-form>
|
||||
</view>
|
||||
<view style="height: 150rpx"></view>
|
||||
<view style="display: flex; width: 100%; justify-content: center; position: fixed; bottom: 50rpx">
|
||||
<nut-button :loading="isLoading" shape="round" type="info" @click="onSubmit" style="height: 80rpx; width: 702rpx; margin: 10rpx auto">确认提交</nut-button>
|
||||
</view>
|
||||
|
||||
<nut-popup v-model:visible="show" position="bottom" :round="true">
|
||||
<view style="height: 1031rpx">
|
||||
<view class="uiwu-picker-search">
|
||||
<view class="uiwu-picker-search-btn uiwu-flex uiwu-flex-space">
|
||||
<text @tap.stop="show = false">取消</text>
|
||||
<text @tap.stop="determine">确定</text>
|
||||
</view>
|
||||
<view class="uiwu-picker-search-input uiwu-flex uiwu-flex-align">
|
||||
<input v-model="inputText" type="text" placeholder="请输入单位名称" confirm-type="search" @confirm="confirm_" />
|
||||
<view @click.stop="confirm" class="searchButton">搜索</view>
|
||||
</view>
|
||||
<scroll-view class="scroll-view" :scroll-y="true">
|
||||
<!-- <radio-group class="radio-group" @change="radioChange">
|
||||
<view class="radio-group-item uiwu-flex uiwu-flex-space" v-for="(item, index) in selector" :key="index">
|
||||
<text>{{ item.label }}</text>
|
||||
<radio :value="item.value" color="#687CFF" />
|
||||
</view>
|
||||
</radio-group> -->
|
||||
<nut-radio-group v-if="(selectorCopy?.length ?? 0) > 0" style="margin-left: 30rpx" v-model="selectedID">
|
||||
<nut-radio icon-size="20" v-for="(item, index) in selectorCopy" :key="index" :label="item.value"> {{ item.label }}</nut-radio>
|
||||
<view style="height: 40rpx"></view>
|
||||
</nut-radio-group>
|
||||
<nut-empty v-else description="暂无单位"></nut-empty>
|
||||
</scroll-view>
|
||||
</view>
|
||||
</view>
|
||||
</nut-popup>
|
||||
</view>
|
||||
<!-- <picker-search ref="picker_search" @change="changeSearch" /> -->
|
||||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
// import PickerSearch from '@/components/PickerSearch.vue'
|
||||
// import picker-search from
|
||||
import { IconFont } from '@nutui/icons-vue-taro'
|
||||
import Taro, { useLoad, useUnload } from '@tarojs/taro'
|
||||
import './dailyInspection.scss'
|
||||
import { ref, computed, reactive, watch } from 'vue'
|
||||
import api from '@/request/index'
|
||||
import { useDailyStore } from '@/store/daily'
|
||||
|
||||
const picker_search = ref()
|
||||
const starRating = ref<any[]>([])
|
||||
const store = useDailyStore()
|
||||
const daily = computed(() => store.getdailyinspection)
|
||||
const base64_1 = computed(() => store.get_base64_1)
|
||||
const base64_2 = computed(() => store.get_base64_2)
|
||||
|
||||
const currentCkProjectId = ref('')
|
||||
const submitData = ref<Item[]>([])
|
||||
const enterprisesName = ref('')
|
||||
const _form = reactive({
|
||||
enterprisesUnitId: '', //企事业单位id
|
||||
ckProjectId: '', //考核项目
|
||||
assessmentUserSignature: '', //考核人员签字
|
||||
byAssessmentEnterprisesUnitUserSignature: '', // 被考核单位人员签字
|
||||
remark: '', //考核备注
|
||||
})
|
||||
watch(
|
||||
[daily, base64_1, base64_2],
|
||||
([newDaily, newBase64_1, newBase64_2]) => {
|
||||
_form.assessmentUserSignature = newBase64_1
|
||||
_form.byAssessmentEnterprisesUnitUserSignature = newBase64_2
|
||||
|
||||
if (newDaily.length > 0) {
|
||||
starRating.value = newDaily
|
||||
}
|
||||
submitData.value = newDaily
|
||||
// console.log('watch_______________', _form, submitData.value)
|
||||
},
|
||||
{ immediate: true }
|
||||
)
|
||||
|
||||
useLoad(async () => {
|
||||
await getUnitEnterprisesUnitList()
|
||||
})
|
||||
|
||||
const Onrating = function (name: string, snowFlakeId: string) {
|
||||
let index = starRating.value.findIndex((item) => item.snowFlakeId === snowFlakeId)
|
||||
Taro.navigateTo({
|
||||
url: `/subPages/select/dailyLife/dailyLife?name=${name}&index=${index}`,
|
||||
})
|
||||
}
|
||||
|
||||
/**
|
||||
* @assessmentCriteriaRulesByCkProjectId 获取考核规则
|
||||
*/
|
||||
|
||||
const assessmentCriteriaRulesByCkProjectId = async function (ckProjectId) {
|
||||
// Taro.showLoading({
|
||||
// title: '加载中...',
|
||||
// mask: true,
|
||||
// })
|
||||
const res = await api.get<StarRating[]>(`/assessmentCriteria/assessmentCriteriaRulesByCkProjectId`, { ckProjectId })
|
||||
|
||||
res.data?.forEach((item) => {
|
||||
item.currentScore = 0
|
||||
|
||||
item.itemList.forEach((element: ItemList) => {
|
||||
element.standardList.forEach((ele) => {
|
||||
ele.isSelected = false
|
||||
})
|
||||
element.standardList.unshift({
|
||||
ckItemId: 'null',
|
||||
deductionPoints: 0,
|
||||
name: '达标',
|
||||
snowFlakeId: 'null',
|
||||
isSelected: true,
|
||||
})
|
||||
element.selectedID = element.standardList[0].snowFlakeId
|
||||
element.selected_points = 0 // 默认达标 默认扣 0 分
|
||||
// 多选
|
||||
if (element.type.value === 'multiple') {
|
||||
element.selectedGroup = [element.selectedID]
|
||||
}
|
||||
})
|
||||
})
|
||||
starRating.value = res.data ?? []
|
||||
// console.log('starRating.value______________________________', starRating.value)
|
||||
|
||||
store.dailyinspectionList(starRating.value)
|
||||
// Taro.hideLoading()
|
||||
}
|
||||
/**
|
||||
* @ckProjectListByType 根据类型获取考核标准列表
|
||||
*/
|
||||
|
||||
const selectorCheckedType = ref<string>('')
|
||||
const selectorType = ref<CkProjectListByType[]>()
|
||||
const ckProjectListByType = async function (type) {
|
||||
const res = await api.get<CkProjectListByType[]>(`/assessmentCriteria/ckProjectListByType`, { type })
|
||||
console.log(res.data)
|
||||
|
||||
if (res.data?.length === 0) {
|
||||
let timeID = setTimeout(() => {
|
||||
Taro.showToast({
|
||||
title: '该单位下面没有考核标准',
|
||||
icon: 'none',
|
||||
duration: 2000,
|
||||
})
|
||||
clearTimeout(timeID)
|
||||
}, 500)
|
||||
}
|
||||
selectorType.value = res.data
|
||||
}
|
||||
|
||||
const onChangeType = function (e: any) {
|
||||
let index = Number(e.detail.value)
|
||||
selectorCheckedType.value = selectorType.value?.[index].label as string
|
||||
currentCkProjectId.value = selectorType.value?.[index].value as string
|
||||
assessmentCriteriaRulesByCkProjectId(currentCkProjectId.value)
|
||||
_form.ckProjectId = selectorType.value?.[index].value as string
|
||||
}
|
||||
|
||||
const selector = ref<UnitEnterprisesUnitList[]>()
|
||||
const selectorCopy = ref<UnitEnterprisesUnitList[]>()
|
||||
const selectorChecked = ref<string>('')
|
||||
const onChange = function (e: any) {
|
||||
try {
|
||||
let index = Number(e.detail.value)
|
||||
selectorChecked.value = selector.value?.[index].label as string
|
||||
let type = selector.value?.[index].extData.type.value
|
||||
ckProjectListByType(type)
|
||||
_form.enterprisesUnitId = selector.value?.[index].value as string
|
||||
} catch (error) {
|
||||
console.log('🚀 ~ onChange ~ error:', error)
|
||||
}
|
||||
}
|
||||
|
||||
const getUnitEnterprisesUnitList = async function () {
|
||||
const res = await api.get<UnitEnterprisesUnitList[]>(`/policeIndex/getUnitEnterprisesUnitList`)
|
||||
|
||||
selector.value = res.data
|
||||
selectorCopy.value = res.data
|
||||
}
|
||||
|
||||
const _showToast = function (title) {
|
||||
Taro.showToast({
|
||||
title,
|
||||
icon: 'none',
|
||||
duration: 1500,
|
||||
mask: true,
|
||||
})
|
||||
}
|
||||
|
||||
/**
|
||||
* @onSubmit 提交
|
||||
* @assessmentRecordDetails 选择后的数据用于提交
|
||||
* @clearData 清空数据
|
||||
*/
|
||||
|
||||
const assessmentRecordDetails = ref<any[]>([])
|
||||
const clearData = function () {
|
||||
store.clearSignData()
|
||||
store.dailyinspectionList([])
|
||||
assessmentRecordDetails.value = []
|
||||
_form.assessmentUserSignature = ''
|
||||
_form.byAssessmentEnterprisesUnitUserSignature = ''
|
||||
_form.remark = ''
|
||||
assessmentCriteriaRulesByCkProjectId(currentCkProjectId.value) //重新获取数据
|
||||
}
|
||||
const isLoading = ref(false)
|
||||
const onSubmit = async function () {
|
||||
if (_form.enterprisesUnitId === '') {
|
||||
_showToast('请选择企事业单位')
|
||||
return
|
||||
}
|
||||
if (_form.ckProjectId === '') {
|
||||
_showToast('请选择考核项目')
|
||||
return
|
||||
}
|
||||
if (_form.assessmentUserSignature === '') {
|
||||
_showToast('请考核人员签字')
|
||||
return
|
||||
}
|
||||
if (_form.byAssessmentEnterprisesUnitUserSignature === '') {
|
||||
_showToast('请被考核单位人员签字')
|
||||
return
|
||||
}
|
||||
isLoading.value = true
|
||||
|
||||
submitData.value.forEach((element: StarRating) => {
|
||||
element?.itemList.forEach((item: ItemList) => {
|
||||
item.standardList.forEach((ele: StandardList) => {
|
||||
if (ele.snowFlakeId === item.selectedID && !item.hasOwnProperty('selectedGroup') && item.selectedID != 'null') {
|
||||
assessmentRecordDetails.value.push({
|
||||
ckGroupId: element.snowFlakeId, //选项的雪花Id
|
||||
ckItemId: ele.ckItemId, //已选择的ID
|
||||
ckStandardId: item.selectedID, //已选择的雪花ID
|
||||
})
|
||||
}
|
||||
})
|
||||
if (item.hasOwnProperty('selectedGroup')) {
|
||||
item.selectedGroup.forEach((selectedItem) => {
|
||||
item.standardList.forEach((standard_Element) => {
|
||||
if (selectedItem != 'null' && selectedItem === standard_Element.snowFlakeId) {
|
||||
assessmentRecordDetails.value.push({
|
||||
ckGroupId: element.snowFlakeId, //选项的雪花Id
|
||||
ckItemId: standard_Element.ckItemId, //已选择的ID
|
||||
ckStandardId: selectedItem, //已选择的雪花ID
|
||||
})
|
||||
}
|
||||
})
|
||||
})
|
||||
}
|
||||
})
|
||||
})
|
||||
|
||||
const assessmentRecordParams = {
|
||||
assessmentRecordDetails: [] as any[],
|
||||
}
|
||||
Object.assign(assessmentRecordParams, _form)
|
||||
assessmentRecordParams.assessmentRecordDetails = [...assessmentRecordDetails.value]
|
||||
const result = await api.post('/assessmentCriteria/submitAssessmentRecord', assessmentRecordParams)
|
||||
|
||||
clearData() //清空数据
|
||||
if (result.code === 200) {
|
||||
isLoading.value = false
|
||||
|
||||
let timeID = setTimeout(() => {
|
||||
Taro.showToast({
|
||||
title: result.message,
|
||||
icon: 'success',
|
||||
duration: 2000,
|
||||
mask: true,
|
||||
})
|
||||
clearTimeout(timeID)
|
||||
}, 500)
|
||||
} else {
|
||||
_showToast(result.message)
|
||||
}
|
||||
}
|
||||
|
||||
useUnload(() => {
|
||||
store.clearSignData()
|
||||
store.dailyinspectionList([])
|
||||
assessmentRecordDetails.value = []
|
||||
_form.assessmentUserSignature = ''
|
||||
_form.byAssessmentEnterprisesUnitUserSignature = ''
|
||||
_form.remark = ''
|
||||
})
|
||||
|
||||
const show = ref(false)
|
||||
const inputText = ref('')
|
||||
const selectedID = ref('')
|
||||
|
||||
const openSearch = () => {
|
||||
show.value = true
|
||||
}
|
||||
|
||||
const fuzzySearch = function (query) {
|
||||
selectorCopy.value = selector.value?.filter((item) => item.label.includes(query))
|
||||
}
|
||||
const confirm = () => {
|
||||
console.log(inputText.value)
|
||||
if (inputText.value.trim() === '') {
|
||||
selectorCopy.value = selector.value
|
||||
} else {
|
||||
fuzzySearch(inputText.value.trim())
|
||||
}
|
||||
}
|
||||
const confirm_ = ({ detail: { value } }) => {
|
||||
console.log('confirm', value)
|
||||
if (inputText.value.trim() === '') {
|
||||
selectorCopy.value = selector.value
|
||||
} else {
|
||||
fuzzySearch(inputText.value.trim())
|
||||
}
|
||||
}
|
||||
|
||||
const determine = () => {
|
||||
console.log(selectedID.value)
|
||||
if (selectedID.value === '' && (selector.value?.length as number) > 0) {
|
||||
Taro.showToast({
|
||||
title: '请选择单位',
|
||||
icon: 'none',
|
||||
duration: 1500,
|
||||
mask: true,
|
||||
})
|
||||
return
|
||||
}
|
||||
let index: number = selector.value?.findIndex((item) => item.value === selectedID.value) as number
|
||||
_form.enterprisesUnitId = selectedID.value
|
||||
let type = selector.value?.[index].extData.type.value
|
||||
enterprisesName.value = selector.value?.[index].label as string
|
||||
show.value = false
|
||||
ckProjectListByType(type)
|
||||
}
|
||||
</script>
|
||||
|
|
@ -0,0 +1,31 @@
|
|||
page {
|
||||
background-color: #f0f0f0;
|
||||
}
|
||||
|
||||
.myProject {
|
||||
.myProjectItem {
|
||||
margin: 20px;
|
||||
border-radius: 10px;
|
||||
background: #ffffff;
|
||||
padding: 15px;
|
||||
font-size: 28px;
|
||||
line-height: 50px;
|
||||
color: #333333;
|
||||
|
||||
.myProjectIndex {
|
||||
color: #9b9b9f;
|
||||
}
|
||||
|
||||
.project {
|
||||
//display: flex;
|
||||
//justify-content: space-between;
|
||||
//flex-flow: wrap;
|
||||
//text-align: center;
|
||||
|
||||
view {
|
||||
width: 100%;
|
||||
margin: 8px 0 8px 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
@ -0,0 +1,3 @@
|
|||
export default definePageConfig({
|
||||
navigationBarTitleText: '企事业单位',
|
||||
})
|
||||
|
|
@ -0,0 +1,62 @@
|
|||
<template>
|
||||
<view class="myProject">
|
||||
<view v-if="number !== 0" class="myProjectItem" v-for="(item, index) in myProjectList" :key="index">
|
||||
<view style="display: flex; justify-content: space-between">
|
||||
<text>{{ item?.name }}</text>
|
||||
<text>单位类型：{{ item?.type.label }}</text>
|
||||
</view>
|
||||
<view class="myProjectIndex"
|
||||
>地址：
|
||||
<text>{{ item?.provinceName }}{{ item.cityName }}{{ item.districtsName }}{{ item.streetName }}</text>
|
||||
</view>
|
||||
<view style="display: flex; justify-content: space-between">
|
||||
<text>联系人：{{ item?.contactPersonInfo.name }}</text>
|
||||
<text>电话：{{ item?.contactPersonInfo.telephone }}</text>
|
||||
</view>
|
||||
<view class="project">
|
||||
<view @click="projectClick(item?.name, serviceProject)" v-for="(serviceProject, index) in item.serviceProjectList" :key="index">
|
||||
<view style="border: 1px solid #cccccc;color: #9b9b9f">
|
||||
<view style="display: flex; justify-content: space-between">
|
||||
<text>项目名称：{{serviceProject.name}}</text>
|
||||
<text>项目类型：{{serviceProject.type.label}}</text>
|
||||
</view>
|
||||
<view style="display: flex; justify-content: space-between">
|
||||
<text>项目负责人：{{serviceProject.projectManagerMiniProgramUserInfo?.name?serviceProject.projectManagerMiniProgramUserInfo?.name:'无分配项目经理'}}</text>
|
||||
</view>
|
||||
<view>责任单位：{{serviceProject.securityUnitName}}</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view v-else class="myProject">
|
||||
<nut-empty image="empty" description="暂无项目">
|
||||
<div style="margin-top: 10px"></div>
|
||||
</nut-empty>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
import api from '@/request/index'
|
||||
import { onMounted, ref } from 'vue'
|
||||
import Taro from '@tarojs/taro'
|
||||
import './myEnterprisesUnit.scss'
|
||||
import { MyProjectList, ServiceProjectList } from '@/types/subPages/projectManager/myProject'
|
||||
|
||||
const myProjectList = ref<MyProjectList[]>()
|
||||
const number = ref(0)
|
||||
const getMyServiceProject = async () => {
|
||||
const resp = await api.get<MyProjectList[]>(`/policeIndex/getUnitServiceProjectList`)
|
||||
myProjectList.value = resp.data
|
||||
number.value = resp.data?.length || 0
|
||||
}
|
||||
|
||||
const projectClick = (enterprisesUnitName: string, serviceProject: ServiceProjectList) => {
|
||||
Taro.navigateTo({
|
||||
url: `/subPages/police/myEnterprisesUnit/projectDetails/projectDetails?enterprisesUnitName=${enterprisesUnitName}&serviceProject=${JSON.stringify(serviceProject)}`,
|
||||
})
|
||||
}
|
||||
onMounted(async () => {
|
||||
await getMyServiceProject()
|
||||
})
|
||||
</script>
|
||||
|
|
@ -0,0 +1,79 @@
|
|||
.projectDetails {
|
||||
height: 100vh;
|
||||
overflow: hidden;
|
||||
background: #f1f1f1;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
|
||||
.projectDetailsItem {
|
||||
margin: 10px 20px 10px 20px;
|
||||
border-radius: 10px;
|
||||
background: #ffffff;
|
||||
padding: 15px;
|
||||
font-size: 28px;
|
||||
line-height: 65px;
|
||||
color: #333333;
|
||||
|
||||
.projectDetailsIndex {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
line-height: 44rpx;
|
||||
margin-bottom: 20px;
|
||||
|
||||
.content {
|
||||
color: #9b9b9f;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.projectDetailsTableDrop {
|
||||
height: 80%;
|
||||
|
||||
.projectDetailsTable {
|
||||
margin: 20px;
|
||||
border-radius: 10px;
|
||||
background: #ffffff;
|
||||
padding: 15px;
|
||||
font-size: 28px;
|
||||
line-height: 50px;
|
||||
color: #333333;
|
||||
|
||||
.projectDetailsTableItem {
|
||||
//display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
flex-wrap: wrap;
|
||||
font-size: 24px;
|
||||
margin-bottom: 15px;
|
||||
|
||||
.projectDetailsTableIndex {
|
||||
display: flex;
|
||||
justify-content: flex-end;
|
||||
text-align: center;
|
||||
|
||||
view {
|
||||
width: 70px;
|
||||
margin-right: 20px;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.projectDetailsButton {
|
||||
position: fixed;
|
||||
bottom: 19px;
|
||||
display: flex;
|
||||
-webkit-justify-content: space-around;
|
||||
margin-bottom: 10rpx;
|
||||
right: 0;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.nutPopup {
|
||||
width: 300px;
|
||||
height: 100px;
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
}
|
||||
}
|
||||
|
|
@ -0,0 +1,3 @@
|
|||
export default definePageConfig({
|
||||
navigationBarTitleText: '项目详情',
|
||||
})
|
||||
|
|
@ -0,0 +1,142 @@
|
|||
<template>
|
||||
<view class="projectDetails">
|
||||
<view class="projectDetailsItem" style="line-height: 50rpx">
|
||||
<view>
|
||||
<view style="display: flex;justify-content: space-between">
|
||||
<text style="font-size: 18px">{{ enterprisesUnitName }}-----{{ serviceProject?.name }}项目</text>
|
||||
<!-- <text>进行中</text>-->
|
||||
</view>
|
||||
<view>
|
||||
<view style="float: left;width: 50%;" class="content">
|
||||
经理名称:{{ serviceProject?.projectManagerMiniProgramUserInfo.name }}
|
||||
</view>
|
||||
<view class="content">手机号:{{ serviceProject?.projectManagerMiniProgramUserInfo.telephone }}</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="projectDetailsItem">
|
||||
<view class="projectDetailsIndex">
|
||||
<nut-row>
|
||||
<nut-col :span="24">
|
||||
<view class="content">保安证件号：{{ serviceProject?.idNumber }}</view>
|
||||
</nut-col>
|
||||
</nut-row>
|
||||
<nut-row>
|
||||
<nut-col :span="12">
|
||||
<view class="content">工作人员数量:{{ serviceProject?.staffTotal }}</view>
|
||||
</nut-col>
|
||||
<nut-col :span="12">
|
||||
<view class="content">保安人员数量:{{ serviceProject?.securityUserTotal }}</view>
|
||||
</nut-col>
|
||||
</nut-row>
|
||||
<nut-row>
|
||||
<nut-col :span="12">
|
||||
<view class="content">服务区域面积:{{ serviceProject?.serviceArea }}</view>
|
||||
</nut-col>
|
||||
<nut-col :span="12">
|
||||
<view class="content">楼栋数量:{{ serviceProject?.buildingTotal }}</view>
|
||||
</nut-col>
|
||||
</nut-row>
|
||||
<nut-row>
|
||||
<nut-col :span="4">
|
||||
<view class="content">户数:{{ serviceProject?.houseTotal }}</view>
|
||||
</nut-col>
|
||||
</nut-row>
|
||||
</view>
|
||||
</view>
|
||||
<!--表格-->
|
||||
<view class="projectDetailsTableDrop">
|
||||
<view style="padding: 0 12px">项目人员</view>
|
||||
<scroll-view :scroll-y="true" style="height: 80%;" @scrolltoupper="upper" @scrolltolower="lower"
|
||||
:scroll-into-view="toView" :scroll-top="scrollTop" :refresherEnabled="true"
|
||||
@refresherrefresh="onRefresherRefresh" :refresher-triggered="isRefresher"
|
||||
>
|
||||
<view class="projectDetailsTable" v-for="(item,index) in securityUserList" :key="index">
|
||||
<view>
|
||||
<view class="projectDetailsTableItem">
|
||||
<view>
|
||||
<view style="display: flex;justify-content: space-between">
|
||||
<text>姓名:{{ item?.name ? item?.name : '创建者' }}</text>
|
||||
<text>性别:{{ item.sex?.label ? item.sex?.label : ' 隐藏' }}</text>
|
||||
<text>职位:{{ item.workPost ? item.workPost : '创建者' }}</text>
|
||||
</view>
|
||||
<view style="display: flex;justify-content: space-between">
|
||||
<text>保安证件:{{ item.securityNumber ? item.securityNumber : '无' }}</text>
|
||||
<text>出生年月:{{ dayjs(item.dateOfBirth).format('YYYY-MM-DD') }}</text>
|
||||
</view>
|
||||
<view style="display: flex;justify-content: space-between">
|
||||
<text>创建时间:{{ item.createTime }}</text>
|
||||
<text>身份证:{{ item.idCard }}</text>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</scroll-view>
|
||||
</view>
|
||||
|
||||
</view>
|
||||
</template>
|
||||
<script setup lang="ts">
|
||||
import Taro, {useLoad} from "@tarojs/taro";
|
||||
import './projectDetails.scss'
|
||||
import {ref} from "vue";
|
||||
import api from "@/request/index";
|
||||
import dayjs from 'dayjs'
|
||||
import {ServiceProjectSecurityUserPagerVo} from "@/types/subPages/projectManager/myProject";
|
||||
|
||||
const serviceProject = ref()
|
||||
const enterprisesUnitName = ref('')
|
||||
const securityUserList = ref<ServiceProjectSecurityUserPagerVo[]>([])
|
||||
useLoad(async (options) => {
|
||||
enterprisesUnitName.value = options.enterprisesUnitName
|
||||
serviceProject.value = JSON.parse(options.serviceProject)
|
||||
console.log(serviceProject.value);
|
||||
await projectDetailsTable()
|
||||
})
|
||||
const projectDetailsTable = async () => {
|
||||
Taro.showLoading({
|
||||
title: '加载中',
|
||||
})
|
||||
const queryParams = {
|
||||
params: {
|
||||
serviceProjectId: serviceProject.value.snowFlakeId,
|
||||
},
|
||||
page: {
|
||||
size: 4,
|
||||
current: current.value
|
||||
}
|
||||
}
|
||||
const resp = await api.post<PagerVo<ServiceProjectSecurityUserPagerVo>>('/miniProgramUser/securityUserPager', queryParams)
|
||||
securityUserList.value = [...securityUserList.value, ...resp.data!.records]
|
||||
total.value = resp.data!.total
|
||||
isRefresher.value = false
|
||||
Taro.hideLoading()
|
||||
}
|
||||
|
||||
const total = ref<any>(null)
|
||||
const current = ref(1)
|
||||
const isRefresher = ref(false)
|
||||
const scrollTop = ref(0)
|
||||
const toView = ref('demo2')
|
||||
const upper = (e) => {
|
||||
console.log('到顶了:', e)
|
||||
}
|
||||
// 滚动到底部/右边时触发
|
||||
const lower = () => {
|
||||
if (total.value === securityUserList.value.length) return
|
||||
if (total.value > securityUserList.value.length) {
|
||||
current.value = current.value + 1
|
||||
projectDetailsTable()
|
||||
}
|
||||
}
|
||||
// 自定义下拉刷新被触发
|
||||
const onRefresherRefresh = (e) => {
|
||||
securityUserList.value = []
|
||||
total.value = null
|
||||
current.value = 1 //重置
|
||||
isRefresher.value = true
|
||||
console.log('自定义下拉刷新被触发:', e)
|
||||
projectDetailsTable()
|
||||
}
|
||||
</script>
|
||||
|
|
@ -0,0 +1,35 @@
|
|||
.myProject {
|
||||
height: 100vh;
|
||||
overflow: hidden;
|
||||
background: #f1f1f1;
|
||||
|
||||
.myProjectItem {
|
||||
//height: 20%;
|
||||
margin: 20px;
|
||||
border-radius: 10px;
|
||||
background: #ffffff;
|
||||
padding: 15px;
|
||||
font-size: 28px;
|
||||
line-height: 50px;
|
||||
color: #333333;
|
||||
|
||||
.myProjectIndex {
|
||||
color: #9b9b9f;
|
||||
}
|
||||
|
||||
.project {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
flex-flow: wrap;
|
||||
text-align: center;
|
||||
|
||||
view {
|
||||
width: 45%;
|
||||
height: 100rpx;
|
||||
border: 1px solid #cccccc;
|
||||
line-height: 100rpx;
|
||||
margin: 8px 0 8px 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
@ -0,0 +1,3 @@
|
|||
export default definePageConfig({
|
||||
navigationBarTitleText: '我的项目',
|
||||
})
|
||||
|
|
@ -0,0 +1,56 @@
|
|||
<template>
|
||||
<view class="myProject">
|
||||
<view v-if="number !== 0">
|
||||
<view class="myProjectItem" v-for="(item,index) in myProjectList" :key="index">
|
||||
<view style="display: flex;justify-content: space-between">
|
||||
<text>{{ item?.name }}</text>
|
||||
</view>
|
||||
<view class="myProjectIndex">地址：
|
||||
<text>{{ item?.provinceName }}{{ item.cityName }}{{ item.districtsName }}{{ item.streetName }}</text>
|
||||
</view>
|
||||
<view style="display: flex;justify-content: space-between">
|
||||
<text>联系人：{{ item?.contactPersonInfo.name }}</text>
|
||||
<text>电话：{{ item?.contactPersonInfo.telephone }}</text>
|
||||
</view>
|
||||
<view class="project">
|
||||
<view @click="projectClick(item.name,serviceProject)"
|
||||
v-for="(serviceProject,index) in item.serviceProjectList" :key="index">
|
||||
{{ serviceProject.name }}
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view v-else class="myProject">
|
||||
<nut-empty image="empty" description="暂无项目">
|
||||
<div style="margin-top: 10px">
|
||||
</div>
|
||||
</nut-empty>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
import api from "@/request/index";
|
||||
import {onMounted, ref} from "vue";
|
||||
import Taro from "@tarojs/taro";
|
||||
import './myProject.scss'
|
||||
import {MyProjectList, ServiceProjectList} from "@/types/subPages/projectManager/myProject";
|
||||
|
||||
const myProjectList = ref<MyProjectList[]>()
|
||||
|
||||
const number = ref(0)
|
||||
const getMyServiceProject = async () => {
|
||||
const resp = await api.get<MyProjectList[]>(`/projectManageIndex/getMyServiceProject`)
|
||||
myProjectList.value = resp.data
|
||||
number.value = (resp.data?.length || 0)
|
||||
}
|
||||
|
||||
const projectClick = (enterprisesUnitName: string, serviceProject: ServiceProjectList) => {
|
||||
Taro.navigateTo({
|
||||
url: `/subPages/projectManager/myProject/projectDetails/projectDetails?enterprisesUnitName=${enterprisesUnitName}&serviceProject=${JSON.stringify(serviceProject)}`,
|
||||
})
|
||||
}
|
||||
onMounted(async () => {
|
||||
await getMyServiceProject()
|
||||
})
|
||||
</script>
|
||||
|
|
@ -0,0 +1,105 @@
|
|||
.projectDetails {
|
||||
height: 100vh;
|
||||
overflow: hidden;
|
||||
background: #f1f1f1;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
|
||||
.projectDetailsItem {
|
||||
margin: 10px 20px 10px 20px;
|
||||
border-radius: 10px;
|
||||
background: #ffffff;
|
||||
padding: 15px;
|
||||
font-size: 28px;
|
||||
line-height: 65px;
|
||||
color: #333333;
|
||||
|
||||
.projectDetailsIndex {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
line-height: 44rpx;
|
||||
margin-bottom: 20px;
|
||||
|
||||
.content {
|
||||
color: #9b9b9f;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.projectDetailsTableDrop {
|
||||
height: 80%;
|
||||
|
||||
.projectDetailsTable {
|
||||
margin: 20px;
|
||||
border-radius: 10px;
|
||||
background: #ffffff;
|
||||
padding: 15px;
|
||||
font-size: 28px;
|
||||
line-height: 50px;
|
||||
color: #333333;
|
||||
|
||||
.projectDetailsTableItem {
|
||||
//display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
flex-wrap: wrap;
|
||||
font-size: 24px;
|
||||
margin-bottom: 15px;
|
||||
|
||||
.projectDetailsTableIndex {
|
||||
display: flex;
|
||||
justify-content: flex-end;
|
||||
text-align: center;
|
||||
|
||||
view {
|
||||
width: 70px;
|
||||
margin-right: 20px;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.projectDetailsButton {
|
||||
position: fixed;
|
||||
bottom: 19px;
|
||||
display: flex;
|
||||
-webkit-justify-content: space-around;
|
||||
margin-bottom: 10rpx;
|
||||
right: 0;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.nutPopup {
|
||||
width: 300px;
|
||||
height: 100px;
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
}
|
||||
|
||||
.qrcodeVisibleUrl {
|
||||
margin-bottom: 5px;
|
||||
|
||||
image {
|
||||
width: 100%;
|
||||
}
|
||||
}
|
||||
|
||||
.warp {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
height: 100vh;
|
||||
|
||||
.warpItem {
|
||||
width: 90%;
|
||||
height: 50%;
|
||||
text-align: center;
|
||||
|
||||
.rect {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
@ -0,0 +1,3 @@
|
|||
export default definePageConfig({
|
||||
navigationBarTitleText: '项目详情',
|
||||
})
|
||||
|
|
@ -0,0 +1,270 @@
|
|||
<template>
|
||||
<view class="projectDetails">
|
||||
<view class="projectDetailsItem" style="line-height: 50rpx">
|
||||
<view>
|
||||
<view style="display: flex;justify-content: space-between">
|
||||
<text style="font-size: 18px">{{ enterprisesUnitName }}-----{{ serviceProject?.name }}
|
||||
</text>
|
||||
<!-- <text>进行中</text>-->
|
||||
</view>
|
||||
<view>
|
||||
<view style="float: left;width: 50%;" class="content">
|
||||
经理名称:{{ serviceProject?.projectManagerMiniProgramUserInfo.name }}
|
||||
</view>
|
||||
<view class="content">手机号:{{ serviceProject?.projectManagerMiniProgramUserInfo.telephone }}</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="projectDetailsItem">
|
||||
<view class="projectDetailsIndex">
|
||||
<nut-row>
|
||||
<nut-col :span="24">
|
||||
<view class="content">保安证件号：{{ serviceProject?.idNumber }}</view>
|
||||
</nut-col>
|
||||
</nut-row>
|
||||
<nut-row>
|
||||
<nut-col :span="12">
|
||||
<view class="content">工作人员数量:{{ serviceProject?.staffTotal }}</view>
|
||||
</nut-col>
|
||||
<nut-col :span="12">
|
||||
<view class="content">保安人员数量:{{ serviceProject?.securityUserTotal }}</view>
|
||||
</nut-col>
|
||||
</nut-row>
|
||||
<nut-row>
|
||||
<nut-col :span="12">
|
||||
<view class="content">服务区域面积:{{ serviceProject?.serviceArea }}</view>
|
||||
</nut-col>
|
||||
<nut-col :span="12">
|
||||
<view class="content">楼栋数量:{{ serviceProject?.buildingTotal }}</view>
|
||||
</nut-col>
|
||||
</nut-row>
|
||||
<nut-row>
|
||||
<nut-col :span="4">
|
||||
<view class="content">户数:{{ serviceProject?.houseTotal }}</view>
|
||||
</nut-col>
|
||||
</nut-row>
|
||||
</view>
|
||||
</view>
|
||||
<!--表格-->
|
||||
<view class="projectDetailsTableDrop">
|
||||
<view style="padding: 0 12px">项目人员({{ total }})</view>
|
||||
<scroll-view :scroll-y="true" style="height: 80%;" @scrolltolower="lower"
|
||||
:scroll-into-view="toView" :scroll-top="scrollTop" :refresherEnabled="true"
|
||||
@refresherrefresh="onRefresherRefresh" :refresher-triggered="isRefresher"
|
||||
>
|
||||
<view class="projectDetailsTable" v-for="(item,index) in securityUserList" :key="index">
|
||||
<view>
|
||||
<view class="projectDetailsTableItem">
|
||||
<view>
|
||||
<view style="display: flex;justify-content: space-between">
|
||||
<text>姓名:{{ item?.name ? item?.name : '创建者' }}</text>
|
||||
<text>性别:{{ item.sex?.label ? item.sex?.label : ' 隐藏' }}</text>
|
||||
<text>职位:{{ item.workPost ? item.workPost : '无' }}</text>
|
||||
</view>
|
||||
<view style="display: flex;justify-content: space-between">
|
||||
<text>保安证件:{{ item.securityNumber ? item.securityNumber : '无' }}</text>
|
||||
<text>出生年月:{{ dayjs(item.dateOfBirth).format('YYYY-MM-DD') }}</text>
|
||||
</view>
|
||||
<view style="display: flex;justify-content: space-between">
|
||||
<text>创建时间:{{ item.createTime }}</text>
|
||||
<text>身份证:{{ item.idCard }}</text>
|
||||
</view>
|
||||
</view>
|
||||
<view class="projectDetailsTableIndex">
|
||||
<view style="color: #3a6bbe" @click="detail(item)">详情</view>
|
||||
<view style="color: #ffa60d" @click="securityUserEdit(item)">编辑</view>
|
||||
<view style="color: red" @click="deleteUssrID(item.snowFlakeId)">删除</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
</view>
|
||||
</scroll-view>
|
||||
</view>
|
||||
<view class="projectDetailsButton">
|
||||
<nut-button style="width: 45%" type="info" @click="formAdd">项目人员录入</nut-button>
|
||||
<nut-button style="width: 45%" type="info" @click="generateMiniProgramQRCode">二维码录入</nut-button>
|
||||
</view>
|
||||
<view>
|
||||
<nut-dialog
|
||||
content="是否确认删除该用户?"
|
||||
:onOk="dialogOk"
|
||||
v-model:visible="confirmVisible"
|
||||
/>
|
||||
</view>
|
||||
<view>
|
||||
<nut-dialog no-cancel-btn content="详情" v-model:visible="detailVisible">
|
||||
<slot>
|
||||
<view style="margin-bottom: 5px">
|
||||
<view>籍贯：{{ securityUserDetail.nativePlace }}</view>
|
||||
<view>公司：{{ securityUserDetail.securityUnitName }}</view>
|
||||
<view>家庭地址：{{ securityUserDetail.homeAddress }}</view>
|
||||
<view>备注：{{ securityUserDetail.remark }}</view>
|
||||
</view>
|
||||
</slot>
|
||||
</nut-dialog>
|
||||
</view>
|
||||
<!-- 二维码-->
|
||||
<view>
|
||||
<nut-dialog no-cancel-btn content="二维码" v-model:visible="qrcodeVisible">
|
||||
<slot>
|
||||
<view class="qrcodeVisibleUrl" @click="showImage">
|
||||
<image style="width: 100%" show-menu-by-longpress='1' :lazy-load="true" :src="qrCodeImage"
|
||||
mode="aspectFit"/>
|
||||
</view>
|
||||
</slot>
|
||||
</nut-dialog>
|
||||
</view>
|
||||
<nut-overlay v-model:visible="showOverlay">
|
||||
<view class="warp">
|
||||
<view class="warpItem">
|
||||
<movable-area :scale-area="true">
|
||||
<movable-view direction="all" style="width: 348px; height: 300px;" :scale="true" :scale-min="1"
|
||||
:scale-max="4" :scale-value="1" :x="2" :y="10">
|
||||
<image class="rect" show-menu-by-longpress='1' :src="qrCodeImage" mode="widthFix"/>
|
||||
</movable-view>
|
||||
</movable-area>
|
||||
</view>
|
||||
</view>
|
||||
</nut-overlay>
|
||||
</view>
|
||||
</template>
|
||||
<script setup lang="ts">
|
||||
import Taro, {useDidShow, useLoad} from "@tarojs/taro";
|
||||
import './projectDetails.scss'
|
||||
import {ref} from "vue";
|
||||
import api from "@/request/index";
|
||||
import dayjs from 'dayjs'
|
||||
import {ServiceProjectSecurityUserPagerVo} from "@/types/subPages/projectManager/myProject";
|
||||
import {SecurityUserFormParams} from "@/types/subPages/projectManager/securityUserForm";
|
||||
|
||||
const serviceProject = ref()
|
||||
const enterprisesUnitName = ref('')
|
||||
const securityUserList = ref<ServiceProjectSecurityUserPagerVo[]>([])
|
||||
|
||||
const securityUserDetail = ref<ServiceProjectSecurityUserPagerVo>({} as any)
|
||||
// 控制模态框的显示状态
|
||||
const confirmVisible = ref(false);
|
||||
const detailVisible = ref(false)
|
||||
const qrcodeVisible = ref(false)
|
||||
const showOverlay = ref(false)
|
||||
|
||||
useLoad((options) => {
|
||||
enterprisesUnitName.value = options.enterprisesUnitName
|
||||
serviceProject.value = JSON.parse(options.serviceProject)
|
||||
})
|
||||
useDidShow(async () => {
|
||||
initServiceProjectSecurityUserList()
|
||||
})
|
||||
const projectDetailsTable = async () => {
|
||||
await Taro.showLoading({
|
||||
title: '加载中',
|
||||
})
|
||||
const queryParams = {
|
||||
params: {
|
||||
serviceProjectId: serviceProject.value.snowFlakeId,
|
||||
},
|
||||
page: {
|
||||
size: 4,
|
||||
current: current.value
|
||||
}
|
||||
}
|
||||
const resp = await api.post<PagerVo<ServiceProjectSecurityUserPagerVo>>('/miniProgramUser/securityUserPager', queryParams)
|
||||
securityUserList.value = [...securityUserList.value, ...resp.data!.records]
|
||||
total.value = resp.data!.total
|
||||
isRefresher.value = false
|
||||
Taro.hideLoading()
|
||||
}
|
||||
const formAdd = () => {
|
||||
const params = {
|
||||
snowFlakeId: undefined,
|
||||
serviceProjectId: serviceProject.value.snowFlakeId,
|
||||
securityUnitId: serviceProject.value.securityUnitId,
|
||||
name: '',
|
||||
workPost: '',
|
||||
sex: 0,
|
||||
nativePlace: '',
|
||||
idCard: '',
|
||||
dateOfBirth: null,
|
||||
securityNumber: '',
|
||||
remark: '',
|
||||
homeAddress: '',
|
||||
telephone: ''
|
||||
} as SecurityUserFormParams
|
||||
Taro.navigateTo({url: `/subPages/projectManager/securityUserForm/securityUserForm?securityUser=${JSON.stringify(params)}&&type=formInput`})
|
||||
}
|
||||
const total = ref<any>(null)
|
||||
const current = ref(1)
|
||||
const isRefresher = ref(false)
|
||||
const scrollTop = ref(0)
|
||||
const toView = ref('demo2')
|
||||
// 滚动到底部/右边时触发
|
||||
const lower = () => {
|
||||
if (total.value === securityUserList.value.length) return
|
||||
if (total.value > securityUserList.value.length) {
|
||||
current.value = current.value + 1
|
||||
projectDetailsTable()
|
||||
}
|
||||
}
|
||||
const initServiceProjectSecurityUserList = () => {
|
||||
securityUserList.value = []
|
||||
total.value = null
|
||||
current.value = 1 //重置
|
||||
isRefresher.value = true
|
||||
projectDetailsTable()
|
||||
|
||||
}
|
||||
// 自定义下拉刷新被触发
|
||||
const onRefresherRefresh = () => {
|
||||
initServiceProjectSecurityUserList()
|
||||
}
|
||||
|
||||
const securityUserId = ref<string>('')
|
||||
|
||||
// 删除
|
||||
const deleteUssrID = (snowFlakeId: string) => {
|
||||
confirmVisible.value = true
|
||||
securityUserId.value = snowFlakeId
|
||||
}
|
||||
// 二次删除
|
||||
const dialogOk = async () => {
|
||||
await api.delete(`/projectManageIndex/deleteSecurityUserByServiceProjectId`, {securityUserId: securityUserId.value})
|
||||
initServiceProjectSecurityUserList()
|
||||
}
|
||||
// 详情
|
||||
const detail = (item: ServiceProjectSecurityUserPagerVo) => {
|
||||
detailVisible.value = true
|
||||
securityUserDetail.value = item
|
||||
}
|
||||
const securityUserEdit = (item: ServiceProjectSecurityUserPagerVo) => {
|
||||
const params = {...item, sex: item.sex.value}
|
||||
Taro.navigateTo({url: `/subPages/projectManager/securityUserForm/securityUserForm?securityUser=${JSON.stringify(params)}&type=formInput`})
|
||||
}
|
||||
|
||||
const qrCodeImage = ref('')
|
||||
const generateMiniProgramQRCode = async () => {
|
||||
const paramsData = {
|
||||
path: `/subPages/projectManager/securityUserForm/securityUserForm?uid=${serviceProject.value.securityUnitId}&pid=${serviceProject.value.snowFlakeId}&type=QcCodeInput`,
|
||||
width: 200,
|
||||
}
|
||||
qrcodeVisible.value = true
|
||||
const resp = await api.get('/projectManageIndex/shareForm_QR_Code', paramsData, {
|
||||
header: {
|
||||
"content-type": 'application/x-www-form-urlencoded'
|
||||
},
|
||||
responseType: 'arraybuffer'
|
||||
})
|
||||
qrCodeImage.value = 'data:image/jpeg;base64,' + Taro.arrayBufferToBase64(resp as unknown as ArrayBuffer);
|
||||
|
||||
}
|
||||
|
||||
const showImage = () => {
|
||||
showOverlay.value = true
|
||||
qrcodeVisible.value = false
|
||||
}
|
||||
|
||||
|
||||
</script>
|
||||
|
||||
<style scoped lang="scss">
|
||||
</style>
|
||||
|
|
@ -0,0 +1,8 @@
|
|||
.form {
|
||||
.formButton {
|
||||
display: flex;
|
||||
margin-top: auto;
|
||||
justify-content: space-around;
|
||||
margin-bottom: 30px
|
||||
}
|
||||
}
|
||||
|
|
@ -0,0 +1,3 @@
|
|||
export default definePageConfig({
|
||||
navigationBarTitleText: '项目人员录入',
|
||||
})
|
||||
|
|
@ -0,0 +1,159 @@
|
|||
<template>
|
||||
<view class="form">
|
||||
<nut-form ref="formRef" :model-value="formData" :rules="rules">
|
||||
<nut-form-item label="姓名" prop="name">
|
||||
<nut-input v-model="formData.name" placeholder="请输入姓名" type="text"/>
|
||||
</nut-form-item>
|
||||
<nut-form-item label="性别" prop="sex">
|
||||
<nut-radio-group v-model="formData.sex" direction="horizontal">
|
||||
<nut-radio v-for="item in SEX" :key="item.value" :label="item.value"
|
||||
>{{ item.label }}
|
||||
</nut-radio>
|
||||
</nut-radio-group>
|
||||
</nut-form-item>
|
||||
<nut-form-item label="身份证" prop="idCard">
|
||||
<nut-input v-model="formData.idCard" placeholder="请填写身份证" type="text" @blur="idCardBlur"/>
|
||||
</nut-form-item>
|
||||
<nut-form-item label="出生日期" prop="dateOfBirth">
|
||||
<view @click="showPicker = true">
|
||||
{{
|
||||
formData.dateOfBirth ? dayjs(formData.dateOfBirth).format('YYYY-MM-DD') : '请选择出生年月'
|
||||
}}
|
||||
</view>
|
||||
</nut-form-item>
|
||||
<nut-form-item label="工作岗位" prop="workPost">
|
||||
<nut-input v-model="formData.workPost" placeholder="请输入工作岗位" type="text"/>
|
||||
</nut-form-item>
|
||||
|
||||
<nut-form-item label="手机号" prop="telephone">
|
||||
<nut-input v-model="formData.telephone" placeholder="请输入手机号" type="text"/>
|
||||
</nut-form-item>
|
||||
<nut-form-item label="籍贯" prop="nativePlace">
|
||||
<nut-input v-model="formData.nativePlace" placeholder="请输入籍贯" type="text"/>
|
||||
</nut-form-item>
|
||||
<nut-form-item label="地址" prop="homeAddress">
|
||||
<nut-input v-model="formData.homeAddress" placeholder="请输入地址" type="text"/>
|
||||
</nut-form-item>
|
||||
<nut-form-item label="保安证号" prop="securityNumber">
|
||||
<nut-input v-model="formData.securityNumber" placeholder="请输入保安证号" type="text"/>
|
||||
</nut-form-item>
|
||||
<nut-form-item label="备注" prop="remark">
|
||||
<nut-input v-model="formData.remark" placeholder="请填写备注" type="text"/>
|
||||
</nut-form-item>
|
||||
</nut-form>
|
||||
<view class="formButton">
|
||||
<nut-button style="width: 45%" type="success" size="small" @click="submit">提交</nut-button>
|
||||
<nut-button style="width: 45%" size="small" @click="formRef?.reset()">重置表单</nut-button>
|
||||
</view>
|
||||
<nut-popup v-model:visible="showPicker" position="bottom">
|
||||
<nut-date-picker
|
||||
v-model="formData.dateOfBirth"
|
||||
:three-dimensional="false"
|
||||
:min-date="new Date(1900,1,1)"
|
||||
:max-date="new Date(2100,1,1)"
|
||||
@confirm="showPicker = false"
|
||||
@cancel="showPicker = false"
|
||||
></nut-date-picker>
|
||||
</nut-popup>
|
||||
</view>
|
||||
</template>
|
||||
<script setup lang="ts">
|
||||
import {ref} from "vue";
|
||||
import {enumSelectNodes} from "@/enums";
|
||||
import {FormRules} from "@nutui/nutui-taro/dist/types/__VUE/form/types";
|
||||
import api from "@/request";
|
||||
import './securityUserForm.scss'
|
||||
import Taro, {useLoad} from "@tarojs/taro";
|
||||
import dayjs from "dayjs";
|
||||
import {SecurityUserFormParams} from "@/types/subPages/projectManager/securityUserForm";
|
||||
import {FormInstance} from "@nutui/nutui-taro";
|
||||
|
||||
const SEX = enumSelectNodes('Sex')
|
||||
|
||||
const showPicker = ref(false)
|
||||
|
||||
const type = ref<'formInput' | 'QcCodeInput'>(null!);
|
||||
|
||||
const formData = ref<SecurityUserFormParams>({} as any)
|
||||
const formRef = ref<FormInstance>(null!)
|
||||
|
||||
const rules: FormRules = {
|
||||
name: [
|
||||
{required: true, message: "请输入姓名"},
|
||||
],
|
||||
sex: [{required: true, message: "请选择性别"}],
|
||||
idCard: [
|
||||
{required: true, message: "请输入身份证号"},
|
||||
{
|
||||
regex: /^(^[1-9]\d{5}(18|19|([23]\d))\d{2}((0[1-9])|(10|11|12))((0[1-9])|([12][0-9])|(30|31))\d{3}(\d|X)$)/,
|
||||
message: "身份证格式错误",
|
||||
},
|
||||
],
|
||||
telephone: [
|
||||
{required: true, message: "请输入手机号"},
|
||||
]
|
||||
};
|
||||
|
||||
useLoad((options) => {
|
||||
type.value = options.type;
|
||||
if (type.value === 'QcCodeInput') {
|
||||
formData.value = {
|
||||
serviceProjectId: options.pid,
|
||||
securityUnitId: options.uid,
|
||||
sex: 0,
|
||||
idCard: '',
|
||||
dateOfBirth: null
|
||||
}
|
||||
} else {
|
||||
formData.value = JSON.parse(options.securityUser)
|
||||
}
|
||||
})
|
||||
|
||||
const idCardBlur = (e: any) => {
|
||||
const value = e.detail.value
|
||||
if (!value?.length || value.length < 18) {
|
||||
formData.value.dateOfBirth = null;
|
||||
return
|
||||
}
|
||||
const birthDate = value.substring(6, 14);
|
||||
const year = birthDate.substring(0, 4);
|
||||
const month = birthDate.substring(4, 6);
|
||||
const day = birthDate.substring(6, 8);
|
||||
formData.value.dateOfBirth = new Date(parseInt(year), parseInt(month) - 1, parseInt(day))
|
||||
}
|
||||
|
||||
const submit = () => {
|
||||
formRef.value?.validate().then(async ({valid}) => {
|
||||
if (valid) {
|
||||
let url: string;
|
||||
if (type.value === 'formInput') {
|
||||
url = '/projectManageIndex/saveOrUpdateSecurityUser'
|
||||
} else {
|
||||
url = '/miniProgramUser/qrCodeFormInputSecurityUser'
|
||||
}
|
||||
const resp = await api.post(url, formData.value)
|
||||
Taro.showToast({
|
||||
title: resp.message,
|
||||
icon: 'success',
|
||||
duration: 2000,
|
||||
mask: true,
|
||||
}).then()
|
||||
formData.value = {
|
||||
snowFlakeId: undefined,
|
||||
serviceProjectId: formData.value.serviceProjectId,
|
||||
securityUnitId: formData.value.securityUnitId,
|
||||
name: '',
|
||||
workPost: '',
|
||||
telephone: '',
|
||||
sex: 0,
|
||||
nativePlace: '',
|
||||
idCard: '',
|
||||
dateOfBirth: null,
|
||||
securityNumber: '',
|
||||
remark: '',
|
||||
homeAddress: ''
|
||||
}
|
||||
}
|
||||
})
|
||||
}
|
||||
</script>
|
||||
|
|
@ -0,0 +1,26 @@
|
|||
.userinform {
|
||||
height: 100%;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.userItem {
|
||||
color: #7b7b7b;
|
||||
font-size: 14px;
|
||||
margin-bottom: 8px;
|
||||
|
||||
.textIndex {
|
||||
margin-left: 20rpx;
|
||||
}
|
||||
}
|
||||
|
||||
.text {
|
||||
width: 96%;
|
||||
}
|
||||
|
||||
.singleChoice {
|
||||
width: 90%;
|
||||
}
|
||||
|
||||
.label {
|
||||
margin: 0 20px;
|
||||
}
|
||||
|
|
@ -0,0 +1,3 @@
|
|||
export default definePageConfig({
|
||||
navigationBarTitleText: '',
|
||||
})
|
||||
|
|
@ -0,0 +1,121 @@
|
|||
<template>
|
||||
<view class="userinform">
|
||||
<view class="userItem">
|
||||
<!-- v-model="item.snowFlakeId" 展开所有 -->
|
||||
<nut-collapse v-model="item.snowFlakeId" accordion v-for="(item, index) in starRating[findIndex].itemList" :key="item.snowFlakeId">
|
||||
<nut-collapse-item :name="item.snowFlakeId" :title="item.name">
|
||||
<view class="singleChoice">
|
||||
<nut-radio-group v-if="item.type.value === 'radio'" v-model="item.selectedID" @change="(modelValue) => onChange(modelValue, item.name)">
|
||||
<nut-radio v-for="(items, indexs) in item.standardList" size="40" :label="items.snowFlakeId" :key="indexs"> {{ items.name }}</nut-radio>
|
||||
</nut-radio-group>
|
||||
<!-- 不能直接去更改 v-model 绑定的 这个数据 ,否则会造成无限递归-->
|
||||
<nut-checkbox-group v-else v-model="item.selectedGroup" @change="(arr) => checkboxGroupChange(arr, index)" style="display: flex; flex-direction: column">
|
||||
<nut-checkbox
|
||||
v-model="items.isSelected"
|
||||
@change="(state, label) => checkboxChange(state, label, index, i)"
|
||||
v-for="(items, i) in item.standardList"
|
||||
size="40"
|
||||
:label="items.snowFlakeId"
|
||||
:key="i"
|
||||
style="margin-bottom: 20rpx"
|
||||
shape="button"
|
||||
>{{ items.name}}</nut-checkbox
|
||||
>
|
||||
</nut-checkbox-group>
|
||||
</view>
|
||||
</nut-collapse-item>
|
||||
</nut-collapse>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import Taro, { useLoad, useUnload } from '@tarojs/taro'
|
||||
import { ref, computed, watch, nextTick } from 'vue'
|
||||
|
||||
import { useDailyStore } from '@/store/daily.ts'
|
||||
const store = useDailyStore()
|
||||
const starRating = ref([])
|
||||
const findIndex = ref(0)
|
||||
const airdefenceEnumdata = ref([])
|
||||
useLoad((options) => {
|
||||
Taro.setNavigationBarTitle({
|
||||
title: options.name,
|
||||
})
|
||||
|
||||
findIndex.value = options.index
|
||||
})
|
||||
|
||||
const daily = computed(() => store.getdailyinspection)
|
||||
|
||||
watch(
|
||||
daily,
|
||||
(newData) => {
|
||||
starRating.value = newData
|
||||
},
|
||||
{ immediate: true }
|
||||
)
|
||||
|
||||
/**
|
||||
* @assessmentRecordDetails 选择后的数据用于提交
|
||||
*/
|
||||
const assessmentRecordDetails = ref([])
|
||||
|
||||
const onChange = (modelValue, name) => {
|
||||
starRating.value[findIndex.value].itemList.forEach((element) => {
|
||||
if (name === element.name) {
|
||||
element.selectedID = modelValue
|
||||
element.standardList.forEach((item) => {
|
||||
if (item.snowFlakeId == modelValue) {
|
||||
element.selected_points = item.deductionPoints //添加扣分项
|
||||
}
|
||||
})
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
const checkboxGroupChange = function (arr, index) {
|
||||
let points = 0
|
||||
|
||||
starRating.value[findIndex.value].itemList.forEach((element, i) => {
|
||||
if (i === index) {
|
||||
element.selectedGroup.forEach((selectedId) => {
|
||||
element.standardList.forEach((standardItem) => {
|
||||
if (selectedId === standardItem.snowFlakeId) {
|
||||
points += standardItem.deductionPoints
|
||||
}
|
||||
})
|
||||
})
|
||||
}
|
||||
})
|
||||
starRating.value[findIndex.value].itemList[index].selected_points = points
|
||||
}
|
||||
const checkboxChange = async function (state, label, index, i) {
|
||||
// DOM 还未更新
|
||||
await nextTick() //等待下一次 DOM 更新刷新的工具方法。
|
||||
// DOM 此时已经更新
|
||||
|
||||
let arr
|
||||
|
||||
if (label === '达标' && i === 0) {
|
||||
arr = ['null']
|
||||
} else {
|
||||
arr = starRating.value[findIndex.value].itemList[index].selectedGroup.filter((selectedId) => selectedId != 'null')
|
||||
}
|
||||
if (arr?.length === 0) {
|
||||
arr = ['null']
|
||||
}
|
||||
|
||||
if (JSON.stringify(arr) !== JSON.stringify(starRating.value[findIndex.value].itemList[index].selectedGroup)) {
|
||||
starRating.value[findIndex.value].itemList[index].selectedGroup = arr
|
||||
}
|
||||
}
|
||||
useUnload(() => {
|
||||
let points = 0
|
||||
starRating.value[findIndex.value].itemList.forEach((element) => {
|
||||
points += element.selected_points
|
||||
})
|
||||
starRating.value[findIndex.value].currentScore = points
|
||||
store.dailyinspectionList([...starRating.value])
|
||||
})
|
||||
</script>
|
||||
|
|
@ -0,0 +1,65 @@
|
|||
.sign-box {
|
||||
position: fixed;
|
||||
z-index: 100;
|
||||
top: 0;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
.fixedIcon {
|
||||
z-index: 1000;
|
||||
position: fixed;
|
||||
right: 20px;
|
||||
top: 20px;
|
||||
height: 100rpx;
|
||||
width: 100rpx;
|
||||
}
|
||||
|
||||
.sign-view {
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
.sigh_btns_false {
|
||||
position: absolute;
|
||||
bottom: 15rpx;
|
||||
right: 0;
|
||||
width: 100%;
|
||||
height: 100rpx;
|
||||
display: flex;
|
||||
justify-content: space-evenly;
|
||||
align-items: center;
|
||||
|
||||
}
|
||||
|
||||
.sigh_btns {
|
||||
transform: rotate(90deg);
|
||||
transform-origin: center
|
||||
}
|
||||
|
||||
.sigh_btns_noRotate {}
|
||||
|
||||
.sigh_btns_true {
|
||||
position: absolute;
|
||||
left: 0;
|
||||
top: 0;
|
||||
width: 20%;
|
||||
height: 100%;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: space-evenly;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
|
||||
.mycanvas {
|
||||
width: 100%;
|
||||
background-color: #ececec;
|
||||
}
|
||||
|
||||
.canvsborder {
|
||||
border: 1rpx solid #333;
|
||||
position: fixed;
|
||||
top: 0;
|
||||
left: 10000rpx;
|
||||
}
|
||||
|
|
@ -0,0 +1,4 @@
|
|||
export default definePageConfig({
|
||||
navigationBarTitleText: '签名',
|
||||
disableScroll: true
|
||||
})
|
||||
|
|
@ -0,0 +1,174 @@
|
|||
<template>
|
||||
<!-- 签字功能 -->
|
||||
<view catchtouchmove="true">
|
||||
<view class="sign-box">
|
||||
<view class="fixedIcon" @click.stop="changeDirection">
|
||||
<image style="height: 100rpx; width: 100rpx" :src="icon"></image>
|
||||
</view>
|
||||
|
||||
<canvas class="mycanvas" :style="{ height: height + 'px' }" canvas-id="mycanvas" @touchstart="touchstart" @touchmove="touchmove" @touchend="touchend"></canvas>
|
||||
<canvas canvas-id="camCacnvs" :style="{ height: width + 'px' }" class="canvsborder"></canvas>
|
||||
|
||||
<view :class="direction ? 'sigh_btns_true' : 'sigh_btns_false'">
|
||||
<nut-button :class="direction ? 'sigh_btns' : 'sigh_btns_noRotate'" style="height: 60rpx" shape="square" type="info" @click="handleCancel"> 取消 </nut-button>
|
||||
<nut-button :class="direction ? 'sigh_btns' : 'sigh_btns_noRotate'" style="height: 60rpx" shape="square" type="info" @click="handleReset"> 重写 </nut-button>
|
||||
<nut-button :class="direction ? 'sigh_btns' : 'sigh_btns_noRotate'" style="height: 60rpx" shape="square" type="info" @click="handleConfirm"> 确认 </nut-button>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import './signature.scss'
|
||||
import Taro, { useLoad, useUnload } from '@tarojs/taro'
|
||||
import { ref, onMounted, watch, computed } from 'vue'
|
||||
import icon from '@/assets/images/rotate1.png'
|
||||
const _index = ref(0)
|
||||
import { useDailyStore } from '@/store/daily'
|
||||
const store = useDailyStore()
|
||||
|
||||
const width = ref(0)
|
||||
const height = ref(300)
|
||||
const points = ref([]) // 画笔路径点集合
|
||||
const tempPoint = ref([]) // 当前签名路径
|
||||
let that
|
||||
let id
|
||||
let type
|
||||
useLoad((options) => {
|
||||
_index.value = Number(options.index)
|
||||
Taro.setNavigationBarTitle({
|
||||
title: options.name,
|
||||
})
|
||||
})
|
||||
const ctx = ref(null)
|
||||
onMounted(() => {
|
||||
that = this
|
||||
const { windowWidth, windowHeight } = Taro.getSystemInfoSync()
|
||||
width.value = windowWidth
|
||||
height.value = windowHeight * 0.98 // 控制画板的宽高
|
||||
|
||||
// 创建绘图上下文
|
||||
ctx.value = Taro.createCanvasContext('mycanvas', this)
|
||||
ctx.value.lineWidth = 2
|
||||
ctx.value.lineCap = 'round'
|
||||
ctx.value.lineJoin = 'round'
|
||||
})
|
||||
|
||||
const touchstart = (e) => {
|
||||
const startX = e.changedTouches[0].x
|
||||
const startY = e.changedTouches[0].y
|
||||
points.value.push({ X: startX, Y: startY })
|
||||
ctx.value.beginPath()
|
||||
}
|
||||
|
||||
const touchmove = (e) => {
|
||||
const moveX = e.changedTouches[0].x
|
||||
const moveY = e.changedTouches[0].y
|
||||
points.value.push({ X: moveX, Y: moveY })
|
||||
if (points.value.length >= 2) {
|
||||
draw()
|
||||
}
|
||||
tempPoint.value.push({ X: moveX, Y: moveY })
|
||||
}
|
||||
|
||||
const touchend = () => {
|
||||
points.value = []
|
||||
}
|
||||
|
||||
const draw = () => {
|
||||
const point1 = points.value[0]
|
||||
const point2 = points.value[1]
|
||||
points.value.shift()
|
||||
ctx.value.moveTo(point1.X, point1.Y)
|
||||
ctx.value.lineTo(point2.X, point2.Y)
|
||||
ctx.value.stroke()
|
||||
ctx.value.draw(true)
|
||||
}
|
||||
|
||||
const handleCancel = () => {
|
||||
Taro.navigateBack({ delta: 1 })
|
||||
}
|
||||
|
||||
const handleReset = () => {
|
||||
ctx.value.clearRect(0, 0, width.value, height.value)
|
||||
ctx.value.draw(true)
|
||||
tempPoint.value = []
|
||||
}
|
||||
|
||||
const handleConfirm = () => {
|
||||
if (tempPoint.value.length === 0) {
|
||||
Taro.showToast({ title: '请先签名', icon: 'none', duration: 2000 })
|
||||
return
|
||||
}
|
||||
|
||||
Taro.canvasToTempFilePath({
|
||||
canvasId: 'mycanvas',
|
||||
success: (res) => {
|
||||
console.log('canvasToTempFilePath______________', res)
|
||||
|
||||
const tempPath = res.tempFilePath
|
||||
const ctx = Taro.createCanvasContext('camCacnvs', that)
|
||||
const scale = 0.5
|
||||
var targetWidth
|
||||
var targetHeight
|
||||
// 前置图片旋转处理 ___________________________________________________________________
|
||||
if (direction.value) {
|
||||
targetWidth = height.value * scale
|
||||
targetHeight = width.value * scale
|
||||
// 计算旋转后的外接矩形尺寸
|
||||
const angle = (270 * Math.PI) / 180 // 逆时针旋转 270 度
|
||||
const rotatedWidth = Math.abs(width.value * Math.cos(angle)) + Math.abs(height.value * Math.sin(angle))
|
||||
const rotatedHeight = Math.abs(height.value * Math.cos(angle)) + Math.abs(width.value * Math.sin(angle))
|
||||
// 计算平移量
|
||||
const offsetX = 0 // 如果不需要水平偏移，则为 0
|
||||
const offsetY = rotatedHeight - targetHeight // 计算 y 轴的平移量
|
||||
// 将画布原点平移到适当位置
|
||||
ctx.translate(offsetX, offsetY)
|
||||
// 旋转画布
|
||||
ctx.rotate(angle)
|
||||
ctx.drawImage(tempPath, 0, 0, targetHeight, targetWidth)
|
||||
} else {
|
||||
targetWidth = width.value * scale
|
||||
targetHeight = height.value * scale
|
||||
ctx.drawImage(tempPath, 0, 0, targetWidth, targetHeight)
|
||||
}
|
||||
|
||||
ctx.draw(false, () => {
|
||||
Taro.canvasToTempFilePath({
|
||||
canvasId: 'camCacnvs',
|
||||
width: targetWidth,
|
||||
height: targetHeight,
|
||||
success: (compressedRes) => {
|
||||
Taro.getFileSystemManager().readFile({
|
||||
filePath: compressedRes.tempFilePath,
|
||||
encoding: 'base64',
|
||||
success: (res) => {
|
||||
const base64Image = 'data:image/jpeg;base64,' + res.data
|
||||
|
||||
console.log('base64Image_________________________', base64Image)
|
||||
|
||||
if (_index.value === 1) {
|
||||
store.change_base64_1(base64Image)
|
||||
Taro.navigateBack({ delta: 1 })
|
||||
} else {
|
||||
store.change_base64_2(base64Image)
|
||||
Taro.navigateBack({ delta: 1 })
|
||||
}
|
||||
},
|
||||
})
|
||||
},
|
||||
})
|
||||
})
|
||||
},
|
||||
})
|
||||
}
|
||||
/**
|
||||
* @direction false 竖屏，true 横屏
|
||||
*/
|
||||
|
||||
const direction = ref(true)
|
||||
const changeDirection = () => {
|
||||
direction.value = !direction.value
|
||||
Taro.vibrateShort({ type: 'medium' }).then()
|
||||
}
|
||||
</script>
|
||||
Some files were not shown because too many files have changed in this diff Show More
Loading…
Reference in New Issue