Compare commits
28 Commits
7058245cdf
...
master_lz
| Author | SHA1 | Date | |
|---|---|---|---|
| df67f63137 | |||
|
|
0f7efec0e1 | ||
|
|
2171c83d55 | ||
|
|
db40b1733b | ||
|
|
fe56422336 | ||
|
|
dc395406c3 | ||
|
|
41db731e40 | ||
|
|
35fcd40bd3 | ||
|
|
e27e44a3c3 | ||
|
|
47463c9b14 | ||
|
|
3f8b6e4695 | ||
| 2bf7b6872a | |||
|
|
a3cb2263fd | ||
|
|
d8273464c5 | ||
|
|
630a98af65 | ||
|
|
31178da436 | ||
|
|
323a641fa3 | ||
|
|
c858ace541 | ||
| f35d64bd91 | |||
|
|
006130b4b7 | ||
|
|
b4ebebe2a8 | ||
|
|
60933ee1a6 | ||
|
|
d014699b95 | ||
| 15ce1cfa13 | |||
|
|
0c40b20df7 | ||
|
|
1e64e776ce | ||
|
|
31b7d3237a | ||
|
|
85dd8102a3 |
24
package-lock.json
generated
24
package-lock.json
generated
@@ -28,6 +28,7 @@
|
|||||||
"crypto-js": "^4.2.0",
|
"crypto-js": "^4.2.0",
|
||||||
"dayjs": "^1.11.4",
|
"dayjs": "^1.11.4",
|
||||||
"echarts": "^5.4.2",
|
"echarts": "^5.4.2",
|
||||||
|
"flv.js": "^1.6.2",
|
||||||
"jsencrypt": "^3.3.2",
|
"jsencrypt": "^3.3.2",
|
||||||
"lint-staged": "^15.2.10",
|
"lint-staged": "^15.2.10",
|
||||||
"lodash-es": "^4.17.21",
|
"lodash-es": "^4.17.21",
|
||||||
@@ -765,7 +766,6 @@
|
|||||||
},
|
},
|
||||||
"node_modules/@clack/prompts/node_modules/is-unicode-supported": {
|
"node_modules/@clack/prompts/node_modules/is-unicode-supported": {
|
||||||
"version": "1.3.0",
|
"version": "1.3.0",
|
||||||
"extraneous": true,
|
|
||||||
"inBundle": true,
|
"inBundle": true,
|
||||||
"license": "MIT",
|
"license": "MIT",
|
||||||
"engines": {
|
"engines": {
|
||||||
@@ -6560,6 +6560,12 @@
|
|||||||
"es6-symbol": "^3.1.1"
|
"es6-symbol": "^3.1.1"
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
"node_modules/es6-promise": {
|
||||||
|
"version": "4.2.8",
|
||||||
|
"resolved": "https://registry.npmmirror.com/es6-promise/-/es6-promise-4.2.8.tgz",
|
||||||
|
"integrity": "sha512-HJDGx5daxeIvxdBxvG2cb9g4tEvwIk3i8+nhX0yGrYmZUzbkdg8QbDevheDB8gd0//uPj4c1EQua8Q+MViT0/w==",
|
||||||
|
"license": "MIT"
|
||||||
|
},
|
||||||
"node_modules/es6-symbol": {
|
"node_modules/es6-symbol": {
|
||||||
"version": "3.1.4",
|
"version": "3.1.4",
|
||||||
"resolved": "https://registry.npmmirror.com/es6-symbol/-/es6-symbol-3.1.4.tgz",
|
"resolved": "https://registry.npmmirror.com/es6-symbol/-/es6-symbol-3.1.4.tgz",
|
||||||
@@ -8254,6 +8260,16 @@
|
|||||||
"dev": true,
|
"dev": true,
|
||||||
"license": "ISC"
|
"license": "ISC"
|
||||||
},
|
},
|
||||||
|
"node_modules/flv.js": {
|
||||||
|
"version": "1.6.2",
|
||||||
|
"resolved": "https://registry.npmmirror.com/flv.js/-/flv.js-1.6.2.tgz",
|
||||||
|
"integrity": "sha512-xre4gUbX1MPtgQRKj2pxJENp/RnaHaxYvy3YToVVCrSmAWUu85b9mug6pTXF6zakUjNP2lFWZ1rkSX7gxhB/2A==",
|
||||||
|
"license": "Apache-2.0",
|
||||||
|
"dependencies": {
|
||||||
|
"es6-promise": "^4.2.8",
|
||||||
|
"webworkify-webpack": "^2.1.5"
|
||||||
|
}
|
||||||
|
},
|
||||||
"node_modules/follow-redirects": {
|
"node_modules/follow-redirects": {
|
||||||
"version": "1.15.9",
|
"version": "1.15.9",
|
||||||
"resolved": "https://registry.npmmirror.com/follow-redirects/-/follow-redirects-1.15.9.tgz",
|
"resolved": "https://registry.npmmirror.com/follow-redirects/-/follow-redirects-1.15.9.tgz",
|
||||||
@@ -16043,6 +16059,12 @@
|
|||||||
"node": ">=4.0"
|
"node": ">=4.0"
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
"node_modules/webworkify-webpack": {
|
||||||
|
"version": "2.1.5",
|
||||||
|
"resolved": "https://registry.npmmirror.com/webworkify-webpack/-/webworkify-webpack-2.1.5.tgz",
|
||||||
|
"integrity": "sha512-2akF8FIyUvbiBBdD+RoHpoTbHMQF2HwjcxfDvgztAX5YwbZNyrtfUMgvfgFVsgDhDPVTlkbb5vyasqDHfIDPQw==",
|
||||||
|
"license": "MIT"
|
||||||
|
},
|
||||||
"node_modules/which": {
|
"node_modules/which": {
|
||||||
"version": "2.0.2",
|
"version": "2.0.2",
|
||||||
"resolved": "https://registry.npmmirror.com/which/-/which-2.0.2.tgz",
|
"resolved": "https://registry.npmmirror.com/which/-/which-2.0.2.tgz",
|
||||||
|
|||||||
@@ -34,6 +34,7 @@
|
|||||||
"crypto-js": "^4.2.0",
|
"crypto-js": "^4.2.0",
|
||||||
"dayjs": "^1.11.4",
|
"dayjs": "^1.11.4",
|
||||||
"echarts": "^5.4.2",
|
"echarts": "^5.4.2",
|
||||||
|
"flv.js": "^1.6.2",
|
||||||
"jsencrypt": "^3.3.2",
|
"jsencrypt": "^3.3.2",
|
||||||
"lint-staged": "^15.2.10",
|
"lint-staged": "^15.2.10",
|
||||||
"lodash-es": "^4.17.21",
|
"lodash-es": "^4.17.21",
|
||||||
|
|||||||
@@ -25,6 +25,11 @@ export function socialLogin(req: any) {
|
|||||||
return http.post<T.LoginResp>(`${BASE_URL}/login`, req)
|
return http.post<T.LoginResp>(`${BASE_URL}/login`, req)
|
||||||
}
|
}
|
||||||
|
|
||||||
|
/** @desc 三方账号登录 */
|
||||||
|
export function cardLogin(req: any) {
|
||||||
|
return http.post<T.LoginResp>(`${BASE_URL}/login`, req)
|
||||||
|
}
|
||||||
|
|
||||||
/** @desc 三方账号登录授权 */
|
/** @desc 三方账号登录授权 */
|
||||||
export function socialAuth(source: string) {
|
export function socialAuth(source: string) {
|
||||||
return http.get<T.SocialAuthAuthorizeResp>(`${BASE_URL}/${source}`)
|
return http.get<T.SocialAuthAuthorizeResp>(`${BASE_URL}/${source}`)
|
||||||
|
|||||||
@@ -42,13 +42,14 @@ export interface RouteItem {
|
|||||||
}
|
}
|
||||||
|
|
||||||
/** 认证类型 */
|
/** 认证类型 */
|
||||||
export type AuthType = 'ACCOUNT' | 'PHONE' | 'EMAIL' | 'SOCIAL'
|
export type AuthType = 'ACCOUNT' | 'PHONE' | 'EMAIL' | 'SOCIAL' | 'CARD'
|
||||||
|
|
||||||
export const AuthTypeConstants = {
|
export const AuthTypeConstants = {
|
||||||
ACCOUNT: 'ACCOUNT',
|
ACCOUNT: 'ACCOUNT',
|
||||||
PHONE: 'PHONE',
|
PHONE: 'PHONE',
|
||||||
EMAIL: 'EMAIL',
|
EMAIL: 'EMAIL',
|
||||||
SOCIAL: 'SOCIAL',
|
SOCIAL: 'SOCIAL',
|
||||||
|
CARD: 'CARD',
|
||||||
} as const
|
} as const
|
||||||
|
|
||||||
/** 基础认证请求接口 */
|
/** 基础认证请求接口 */
|
||||||
@@ -77,6 +78,16 @@ export interface EmailLoginReq extends AuthReq {
|
|||||||
captcha: string
|
captcha: string
|
||||||
}
|
}
|
||||||
|
|
||||||
|
/** 刷卡登录请求参数 */
|
||||||
|
export interface CardLoginReq extends AuthReq {
|
||||||
|
cardNumber: string
|
||||||
|
}
|
||||||
|
|
||||||
|
/** 邮箱登录请求参数 */
|
||||||
|
export interface CardLoginReq extends AuthReq {
|
||||||
|
card: string
|
||||||
|
}
|
||||||
|
|
||||||
/** 登录响应类型 */
|
/** 登录响应类型 */
|
||||||
export interface LoginResp {
|
export interface LoginResp {
|
||||||
token: string
|
token: string
|
||||||
|
|||||||
@@ -78,7 +78,12 @@ export function importMaterial(data: any) {
|
|||||||
return http.post(`${BASE_URL}/import`, data)
|
return http.post(`${BASE_URL}/import`, data)
|
||||||
}
|
}
|
||||||
|
|
||||||
/** @desc 解析物料信息导入数据 */
|
/** @desc 物料照片批量导入数据 */
|
||||||
export function uploadMaterialPhotos(data: FormData) {
|
export function uploadMaterialPhotos(data: FormData) {
|
||||||
return http.post(`${BASE_URL}/import/uploadMaterialPhotos`, data)
|
return http.post(`${BASE_URL}/import/uploadMaterialPhotos`, data)
|
||||||
}
|
}
|
||||||
|
|
||||||
|
/** @desc 物料照片抓取数据 */
|
||||||
|
export function catchPhoto(data: FormData) {
|
||||||
|
return http.post(`${BASE_URL}/import/catch`, data)
|
||||||
|
}
|
||||||
|
|||||||
@@ -1,27 +1,37 @@
|
|||||||
import http from '@/utils/http'
|
import http from '@/utils/http'
|
||||||
|
|
||||||
const BASE_URL = '/weighManage/material'
|
const BASE_URL = '/weighManage/workOrder'
|
||||||
|
|
||||||
export interface WeighManageResp {
|
export interface WeighManageResp {
|
||||||
id: string
|
id: string
|
||||||
materialCode: string
|
encoding: string
|
||||||
materialName: string
|
materialName: string
|
||||||
materialSpec: string
|
materialSpec: string
|
||||||
weight: number
|
unitWeight: number
|
||||||
imageUrl: string
|
photoUrl: string
|
||||||
matchResult: string
|
matchResult: string
|
||||||
}
|
}
|
||||||
|
|
||||||
export interface WeighManageQuery {
|
export interface WeighManageQuery {
|
||||||
materialCode: string
|
encoding: string
|
||||||
}
|
}
|
||||||
|
|
||||||
/** @desc 查询物料信息 */
|
/** @desc 查询物料信息 */
|
||||||
export function getMaterialDetail(query: WeighManageQuery) {
|
export function getMaterialDetail(code: string) {
|
||||||
return http.get<WeighManageResp>(`${BASE_URL}/detail`, query)
|
return http.get<WeighManageResp>(`/admin/materialInfo/code/${code}`)
|
||||||
}
|
}
|
||||||
|
|
||||||
/** @desc 新增人员管理 */
|
/** @desc 校验称重信息 */
|
||||||
export function addPeople(data: any) {
|
export function validateWeighing(data: any) {
|
||||||
return http.post(`${BASE_URL}`, data)
|
return http.post(`${BASE_URL}/validateWeighing`, data)
|
||||||
|
}
|
||||||
|
|
||||||
|
/** @desc 校验称重信息 */
|
||||||
|
export function vmSend(code: string) {
|
||||||
|
return http.get<WeighManageResp>(`/vm/send?msg=${code}`)
|
||||||
|
}
|
||||||
|
|
||||||
|
/** @desc 获取图片 */
|
||||||
|
export function getImg() {
|
||||||
|
return http.get<string>(`/vm/latest-photo`)
|
||||||
}
|
}
|
||||||
|
|||||||
75
src/apis/workOrder/workOrder.ts
Normal file
75
src/apis/workOrder/workOrder.ts
Normal file
@@ -0,0 +1,75 @@
|
|||||||
|
import http from '@/utils/http'
|
||||||
|
|
||||||
|
const BASE_URL = '/weighManage/workOrder'
|
||||||
|
|
||||||
|
export interface WorkOrderResp {
|
||||||
|
id: string
|
||||||
|
title: string
|
||||||
|
orderNo: string
|
||||||
|
materialName: string
|
||||||
|
encoding: string
|
||||||
|
unitWeight: string
|
||||||
|
materialSpec: string
|
||||||
|
photoUrl: string
|
||||||
|
totalWeight: string
|
||||||
|
totalCalculatedWeight: string
|
||||||
|
totalCount: string
|
||||||
|
createUserString: string
|
||||||
|
updateUserString: string
|
||||||
|
matchResult: string
|
||||||
|
workOrderInfos: Array<WorkOrderInfoResp>
|
||||||
|
qrCodeData: string
|
||||||
|
}
|
||||||
|
|
||||||
|
export interface WorkOrderInfoResp {
|
||||||
|
id: string
|
||||||
|
workOrderId: string
|
||||||
|
materialId: string
|
||||||
|
weightTime: string
|
||||||
|
quantity: string
|
||||||
|
weight: string
|
||||||
|
imgUrl: string
|
||||||
|
calculatedWeight: string
|
||||||
|
}
|
||||||
|
|
||||||
|
export interface WorkOrderQuery {
|
||||||
|
orderNo: string | undefined
|
||||||
|
materialName: string | undefined
|
||||||
|
encoding: string | undefined
|
||||||
|
userName: string | undefined
|
||||||
|
carNo: string | undefined
|
||||||
|
startDate: string | undefined
|
||||||
|
endDate: string | undefined
|
||||||
|
sort: Array<string>
|
||||||
|
}
|
||||||
|
export interface WorkOrderPageQuery extends WorkOrderQuery, PageQuery {}
|
||||||
|
|
||||||
|
/** @desc 查询工作订单列表 */
|
||||||
|
export function listWorkOrder(query: WorkOrderPageQuery) {
|
||||||
|
return http.get<PageRes<WorkOrderResp[]>>(`${BASE_URL}`, query)
|
||||||
|
}
|
||||||
|
|
||||||
|
/** @desc 查询工作订单详情 */
|
||||||
|
export function getWorkOrderInfos(id: string) {
|
||||||
|
return http.get<Array<WorkOrderInfoResp>>(`${BASE_URL}/info/${id}`)
|
||||||
|
}
|
||||||
|
|
||||||
|
/** @desc 查询工作订单详情 */
|
||||||
|
export function getWorkOrder(id: string) {
|
||||||
|
return http.get<WorkOrderResp>(`${BASE_URL}/${id}`)
|
||||||
|
}
|
||||||
|
|
||||||
|
/** @desc 新增工作订单 */
|
||||||
|
export function addWorkOrder(data: any) {
|
||||||
|
return http.post(`${BASE_URL}`, data)
|
||||||
|
}
|
||||||
|
|
||||||
|
/** @desc 删除工作订单 */
|
||||||
|
export function deleteWorkOrder(ids: string | Array<string>) {
|
||||||
|
return http.del(`${BASE_URL}/${ids}`)
|
||||||
|
}
|
||||||
|
|
||||||
|
/** @desc 导出工作订单 */
|
||||||
|
export function exportWorkOrder(query: WorkOrderQuery) {
|
||||||
|
return http.download(`${BASE_URL}/export`, query)
|
||||||
|
}
|
||||||
@@ -4,10 +4,12 @@ import { resetRouter } from '@/router'
|
|||||||
import {
|
import {
|
||||||
type AccountLoginReq,
|
type AccountLoginReq,
|
||||||
AuthTypeConstants,
|
AuthTypeConstants,
|
||||||
|
type CardLoginReq,
|
||||||
type EmailLoginReq,
|
type EmailLoginReq,
|
||||||
type PhoneLoginReq,
|
type PhoneLoginReq,
|
||||||
type UserInfo,
|
type UserInfo,
|
||||||
accountLogin as accountLoginApi,
|
accountLogin as accountLoginApi,
|
||||||
|
cardLogin as cardLoginApi,
|
||||||
emailLogin as emailLoginApi,
|
emailLogin as emailLoginApi,
|
||||||
getUserInfo as getUserInfoApi,
|
getUserInfo as getUserInfoApi,
|
||||||
logout as logoutApi,
|
logout as logoutApi,
|
||||||
@@ -70,6 +72,13 @@ const storeSetup = () => {
|
|||||||
token.value = res.data.token
|
token.value = res.data.token
|
||||||
}
|
}
|
||||||
|
|
||||||
|
// 刷卡登录
|
||||||
|
const cardLogin = async (req: CardLoginReq) => {
|
||||||
|
const res = await cardLoginApi({ ...req, clientId: import.meta.env.VITE_CLIENT_ID, authType: AuthTypeConstants.CARD })
|
||||||
|
setToken(res.data.token)
|
||||||
|
token.value = res.data.token
|
||||||
|
}
|
||||||
|
|
||||||
// 三方账号登录
|
// 三方账号登录
|
||||||
const socialLogin = async (source: string, req: any) => {
|
const socialLogin = async (source: string, req: any) => {
|
||||||
const res = await socialLoginApi({ ...req, source, clientId: import.meta.env.VITE_CLIENT_ID, authType: AuthTypeConstants.SOCIAL })
|
const res = await socialLoginApi({ ...req, source, clientId: import.meta.env.VITE_CLIENT_ID, authType: AuthTypeConstants.SOCIAL })
|
||||||
@@ -120,6 +129,7 @@ const storeSetup = () => {
|
|||||||
accountLogin,
|
accountLogin,
|
||||||
emailLogin,
|
emailLogin,
|
||||||
phoneLogin,
|
phoneLogin,
|
||||||
|
cardLogin,
|
||||||
socialLogin,
|
socialLogin,
|
||||||
logout,
|
logout,
|
||||||
logoutCallBack,
|
logoutCallBack,
|
||||||
|
|||||||
11
src/types/components.d.ts
vendored
11
src/types/components.d.ts
vendored
@@ -13,11 +13,10 @@ declare module 'vue' {
|
|||||||
ABreadcrumb: typeof import('@arco-design/web-vue')['Breadcrumb']
|
ABreadcrumb: typeof import('@arco-design/web-vue')['Breadcrumb']
|
||||||
ABreadcrumbItem: typeof import('@arco-design/web-vue')['BreadcrumbItem']
|
ABreadcrumbItem: typeof import('@arco-design/web-vue')['BreadcrumbItem']
|
||||||
AButton: typeof import('@arco-design/web-vue')['Button']
|
AButton: typeof import('@arco-design/web-vue')['Button']
|
||||||
ACard: typeof import('@arco-design/web-vue')['Card']
|
|
||||||
ACheckbox: typeof import('@arco-design/web-vue')['Checkbox']
|
ACheckbox: typeof import('@arco-design/web-vue')['Checkbox']
|
||||||
ACheckboxGroup: typeof import('@arco-design/web-vue')['CheckboxGroup']
|
|
||||||
ACol: typeof import('@arco-design/web-vue')['Col']
|
ACol: typeof import('@arco-design/web-vue')['Col']
|
||||||
AConfigProvider: typeof import('@arco-design/web-vue')['ConfigProvider']
|
AConfigProvider: typeof import('@arco-design/web-vue')['ConfigProvider']
|
||||||
|
ADatePicker: typeof import('@arco-design/web-vue')['DatePicker']
|
||||||
ADescriptions: typeof import('@arco-design/web-vue')['Descriptions']
|
ADescriptions: typeof import('@arco-design/web-vue')['Descriptions']
|
||||||
ADescriptionsItem: typeof import('@arco-design/web-vue')['DescriptionsItem']
|
ADescriptionsItem: typeof import('@arco-design/web-vue')['DescriptionsItem']
|
||||||
ADivider: typeof import('@arco-design/web-vue')['Divider']
|
ADivider: typeof import('@arco-design/web-vue')['Divider']
|
||||||
@@ -36,17 +35,14 @@ declare module 'vue' {
|
|||||||
AInputPassword: typeof import('@arco-design/web-vue')['InputPassword']
|
AInputPassword: typeof import('@arco-design/web-vue')['InputPassword']
|
||||||
AInputSearch: typeof import('@arco-design/web-vue')['InputSearch']
|
AInputSearch: typeof import('@arco-design/web-vue')['InputSearch']
|
||||||
ALayout: typeof import('@arco-design/web-vue')['Layout']
|
ALayout: typeof import('@arco-design/web-vue')['Layout']
|
||||||
ALayoutContent: typeof import('@arco-design/web-vue')['LayoutContent']
|
|
||||||
ALayoutHeader: typeof import('@arco-design/web-vue')['LayoutHeader']
|
ALayoutHeader: typeof import('@arco-design/web-vue')['LayoutHeader']
|
||||||
ALayoutSider: typeof import('@arco-design/web-vue')['LayoutSider']
|
ALayoutSider: typeof import('@arco-design/web-vue')['LayoutSider']
|
||||||
ALink: typeof import('@arco-design/web-vue')['Link']
|
ALink: typeof import('@arco-design/web-vue')['Link']
|
||||||
AMenu: typeof import('@arco-design/web-vue')['Menu']
|
AMenu: typeof import('@arco-design/web-vue')['Menu']
|
||||||
AMenuItem: typeof import('@arco-design/web-vue')['MenuItem']
|
AMenuItem: typeof import('@arco-design/web-vue')['MenuItem']
|
||||||
AModal: typeof import('@arco-design/web-vue')['Modal']
|
AModal: typeof import('@arco-design/web-vue')['Modal']
|
||||||
AOption: typeof import('@arco-design/web-vue')['Option']
|
|
||||||
AOverflowList: typeof import('@arco-design/web-vue')['OverflowList']
|
AOverflowList: typeof import('@arco-design/web-vue')['OverflowList']
|
||||||
APagination: typeof import('@arco-design/web-vue')['Pagination']
|
APagination: typeof import('@arco-design/web-vue')['Pagination']
|
||||||
APopconfirm: typeof import('@arco-design/web-vue')['Popconfirm']
|
|
||||||
APopover: typeof import('@arco-design/web-vue')['Popover']
|
APopover: typeof import('@arco-design/web-vue')['Popover']
|
||||||
AProgress: typeof import('@arco-design/web-vue')['Progress']
|
AProgress: typeof import('@arco-design/web-vue')['Progress']
|
||||||
ARadio: typeof import('@arco-design/web-vue')['Radio']
|
ARadio: typeof import('@arco-design/web-vue')['Radio']
|
||||||
@@ -56,6 +52,7 @@ declare module 'vue' {
|
|||||||
AScrollbar: typeof import('@arco-design/web-vue')['Scrollbar']
|
AScrollbar: typeof import('@arco-design/web-vue')['Scrollbar']
|
||||||
ASelect: typeof import('@arco-design/web-vue')['Select']
|
ASelect: typeof import('@arco-design/web-vue')['Select']
|
||||||
ASpace: typeof import('@arco-design/web-vue')['Space']
|
ASpace: typeof import('@arco-design/web-vue')['Space']
|
||||||
|
ASpin: typeof import('@arco-design/web-vue')['Spin']
|
||||||
AStatistic: typeof import('@arco-design/web-vue')['Statistic']
|
AStatistic: typeof import('@arco-design/web-vue')['Statistic']
|
||||||
ASubMenu: typeof import('@arco-design/web-vue')['SubMenu']
|
ASubMenu: typeof import('@arco-design/web-vue')['SubMenu']
|
||||||
ASwitch: typeof import('@arco-design/web-vue')['Switch']
|
ASwitch: typeof import('@arco-design/web-vue')['Switch']
|
||||||
@@ -63,13 +60,9 @@ declare module 'vue' {
|
|||||||
ATabPane: typeof import('@arco-design/web-vue')['TabPane']
|
ATabPane: typeof import('@arco-design/web-vue')['TabPane']
|
||||||
ATabs: typeof import('@arco-design/web-vue')['Tabs']
|
ATabs: typeof import('@arco-design/web-vue')['Tabs']
|
||||||
ATag: typeof import('@arco-design/web-vue')['Tag']
|
ATag: typeof import('@arco-design/web-vue')['Tag']
|
||||||
ATextarea: typeof import('@arco-design/web-vue')['Textarea']
|
|
||||||
ATooltip: typeof import('@arco-design/web-vue')['Tooltip']
|
ATooltip: typeof import('@arco-design/web-vue')['Tooltip']
|
||||||
ATree: typeof import('@arco-design/web-vue')['Tree']
|
|
||||||
ATreeSelect: typeof import('@arco-design/web-vue')['TreeSelect']
|
ATreeSelect: typeof import('@arco-design/web-vue')['TreeSelect']
|
||||||
ATrigger: typeof import('@arco-design/web-vue')['Trigger']
|
|
||||||
ATypographyParagraph: typeof import('@arco-design/web-vue')['TypographyParagraph']
|
ATypographyParagraph: typeof import('@arco-design/web-vue')['TypographyParagraph']
|
||||||
ATypographyTitle: typeof import('@arco-design/web-vue')['TypographyTitle']
|
|
||||||
AUpload: typeof import('@arco-design/web-vue')['Upload']
|
AUpload: typeof import('@arco-design/web-vue')['Upload']
|
||||||
Avatar: typeof import('./../components/Avatar/index.vue')['default']
|
Avatar: typeof import('./../components/Avatar/index.vue')['default']
|
||||||
AWatermark: typeof import('@arco-design/web-vue')['Watermark']
|
AWatermark: typeof import('@arco-design/web-vue')['Watermark']
|
||||||
|
|||||||
484
src/views/barcodePrint/index.vue
Normal file
484
src/views/barcodePrint/index.vue
Normal file
@@ -0,0 +1,484 @@
|
|||||||
|
<template>
|
||||||
|
<div class="gi_page">
|
||||||
|
<div class="container">
|
||||||
|
<h2 class="page-title">标签打印</h2>
|
||||||
|
|
||||||
|
<!-- 标签参数设置 -->
|
||||||
|
<div class="form-section">
|
||||||
|
<a-form :model="formData" layout="vertical">
|
||||||
|
<div class="form-grid">
|
||||||
|
<div class="form-grid-item">
|
||||||
|
<a-form-item label="物料名称">
|
||||||
|
<a-input v-model="formData.materialName" placeholder="未获取到物料名称" :disabled="true" />
|
||||||
|
</a-form-item>
|
||||||
|
</div>
|
||||||
|
<div class="form-grid-item">
|
||||||
|
<a-form-item label="物料编码">
|
||||||
|
<a-input v-model="formData.encoding" placeholder="未获取到物料编码" :disabled="true" />
|
||||||
|
</a-form-item>
|
||||||
|
</div>
|
||||||
|
<div class="form-grid-item">
|
||||||
|
<a-form-item label="工单编号">
|
||||||
|
<a-input v-model="formData.orderNo" placeholder="未获取到工单编号" :disabled="true" />
|
||||||
|
</a-form-item>
|
||||||
|
</div>
|
||||||
|
<div class="form-grid-item">
|
||||||
|
<a-form-item label="生产批次" required>
|
||||||
|
<a-input v-model="formData.productionBatch" placeholder="请输入生产批次" />
|
||||||
|
</a-form-item>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="form-actions">
|
||||||
|
<a-button type="primary" @click="generateLabel" :disabled="!formData.productionBatch">生成标签</a-button>
|
||||||
|
</div>
|
||||||
|
</a-form>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<!-- 标签预览 -->
|
||||||
|
<div v-if="labelData.partName" class="label-preview-section">
|
||||||
|
<!-- <div class="label-preview-section">-->
|
||||||
|
<h3>标签预览</h3>
|
||||||
|
<div class="label-container" ref="labelContainer">
|
||||||
|
<div class="label" v-for="index in 1" :key="index">
|
||||||
|
<table class="label-table">
|
||||||
|
<tr>
|
||||||
|
<td class="label-cell">
|
||||||
|
<div class="label-row">
|
||||||
|
<div class="label-field">零件名称</div>
|
||||||
|
<div class="label-value">{{ labelData.partName }}</div>
|
||||||
|
</div>
|
||||||
|
</td>
|
||||||
|
<td class="label-cell">
|
||||||
|
<div class="label-row">
|
||||||
|
<div class="label-field">生产日期</div>
|
||||||
|
<div class="label-value">{{ labelData.productionDate }}</div>
|
||||||
|
</div>
|
||||||
|
</td>
|
||||||
|
<td class="label-cell qr-cell" rowspan="4">
|
||||||
|
<div class="qr-code">
|
||||||
|
<img :src="`https://api.qrserver.com/v1/create-qr-code/?size=120x120&data=${encodeURIComponent(labelData.qrCodeData)}`" alt="QR Code" />
|
||||||
|
</div>
|
||||||
|
</td>
|
||||||
|
</tr>
|
||||||
|
<tr>
|
||||||
|
<td class="label-cell">
|
||||||
|
<div class="label-row">
|
||||||
|
<div class="label-field">零件号</div>
|
||||||
|
<div class="label-value">{{ labelData.partNumber }}</div>
|
||||||
|
</div>
|
||||||
|
</td>
|
||||||
|
<td class="label-cell">
|
||||||
|
<div class="label-row">
|
||||||
|
<div class="label-field">数量</div>
|
||||||
|
<div class="label-value">{{ labelData.totalCount }}</div>
|
||||||
|
</div>
|
||||||
|
</td>
|
||||||
|
</tr>
|
||||||
|
<tr>
|
||||||
|
<td class="label-cell">
|
||||||
|
<div class="label-row">
|
||||||
|
<div class="label-field">标重(kg)</div>
|
||||||
|
<div class="label-value">{{ labelData.totalCalculatedWeight }}</div>
|
||||||
|
</div>
|
||||||
|
</td>
|
||||||
|
<td class="label-cell">
|
||||||
|
<div class="label-row">
|
||||||
|
<div class="label-field">包装签字</div>
|
||||||
|
<div class="label-value">{{ labelData.packingSignature || '' }}</div>
|
||||||
|
</div>
|
||||||
|
</td>
|
||||||
|
</tr>
|
||||||
|
<tr>
|
||||||
|
<td class="label-cell">
|
||||||
|
<div class="label-row">
|
||||||
|
<div class="label-field">实重(kg)</div>
|
||||||
|
<div class="label-value">{{ labelData.totalWeight || '' }}</div>
|
||||||
|
</div>
|
||||||
|
</td>
|
||||||
|
<td class="label-cell">
|
||||||
|
<div class="label-row">
|
||||||
|
<div class="label-field">检验签字</div>
|
||||||
|
<div class="label-value">{{ labelData.inspectionSignature || '' }}</div>
|
||||||
|
</div>
|
||||||
|
</td>
|
||||||
|
</tr>
|
||||||
|
</table>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="label-actions">
|
||||||
|
<a-button type="primary" @click="printLabel">打印标签</a-button>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script setup lang="ts">
|
||||||
|
import { ref, reactive, nextTick, onMounted } from 'vue'
|
||||||
|
import { Message } from '@arco-design/web-vue'
|
||||||
|
import { useRoute } from 'vue-router'
|
||||||
|
import {getWorkOrder} from "@/apis/workOrder/workOrder";
|
||||||
|
|
||||||
|
const route = useRoute()
|
||||||
|
|
||||||
|
// 表单数据
|
||||||
|
const formData = reactive({
|
||||||
|
workerOrderId: '',
|
||||||
|
encoding: '',
|
||||||
|
materialName: '',
|
||||||
|
orderNo: '',
|
||||||
|
totalCalculatedWeight: '',
|
||||||
|
totalWeight: '',
|
||||||
|
totalCount: '',
|
||||||
|
productionBatch: '',
|
||||||
|
qrCodeData: '',
|
||||||
|
})
|
||||||
|
|
||||||
|
// 标签数据
|
||||||
|
const labelData = reactive({
|
||||||
|
partName: '',
|
||||||
|
partNumber: '',
|
||||||
|
totalCalculatedWeight: '',
|
||||||
|
totalWeight: '',
|
||||||
|
productionDate: '',
|
||||||
|
totalCount: '',
|
||||||
|
packingSignature: '',
|
||||||
|
inspectionSignature: '',
|
||||||
|
qrCodeData: '',
|
||||||
|
})
|
||||||
|
|
||||||
|
// 标签数据
|
||||||
|
// const labelData = reactive({
|
||||||
|
// partName: '物料3',
|
||||||
|
// partNumber: '1',
|
||||||
|
// totalCalculatedWeight: '100',
|
||||||
|
// totalWeight: '100',
|
||||||
|
// productionDate: '202401010000',
|
||||||
|
// totalCount: '100',
|
||||||
|
// packingSignature: '',
|
||||||
|
// inspectionSignature: '',
|
||||||
|
// qrCodeData: '10#$$DY',
|
||||||
|
// })
|
||||||
|
|
||||||
|
// 标签容器引用
|
||||||
|
const labelContainer = ref<HTMLElement | null>(null)
|
||||||
|
|
||||||
|
// 生成标签
|
||||||
|
const generateLabel = async () => {
|
||||||
|
if (!formData.productionBatch) {
|
||||||
|
Message.error('请输入生产批次')
|
||||||
|
return
|
||||||
|
}
|
||||||
|
if (!formData.materialName) {
|
||||||
|
Message.error('未获取到物料信息')
|
||||||
|
return
|
||||||
|
}
|
||||||
|
|
||||||
|
try {
|
||||||
|
// 格式化生产日期为 yyyyMMddHHmm 格式
|
||||||
|
const now = new Date()
|
||||||
|
const formattedDate = now.getFullYear().toString() +
|
||||||
|
String(now.getMonth() + 1).padStart(2, '0') +
|
||||||
|
String(now.getDate()).padStart(2, '0') +
|
||||||
|
String(now.getHours()).padStart(2, '0') +
|
||||||
|
String(now.getMinutes()).padStart(2, '0')
|
||||||
|
|
||||||
|
const formattedDate2 = now.getFullYear().toString() +
|
||||||
|
String(now.getMonth() + 1).padStart(2, '0') +
|
||||||
|
String(now.getDate()).padStart(2, '0');
|
||||||
|
|
||||||
|
// 直接从 formData 中获取数据
|
||||||
|
Object.assign(labelData, {
|
||||||
|
partName: formData.materialName || '',
|
||||||
|
partNumber: formData.encoding || '',
|
||||||
|
totalCalculatedWeight: formData.totalCalculatedWeight || '',
|
||||||
|
totalWeight: formData.totalWeight || '',
|
||||||
|
productionDate: formattedDate,
|
||||||
|
totalCount: formData.totalCount || '',
|
||||||
|
packingSignature: '',
|
||||||
|
inspectionSignature: '',
|
||||||
|
//10#零件号$11#供应商代码$12#生产批次$17#数量$20#包装日期$31#唯一号$DY
|
||||||
|
qrCodeData: `10#${formData.materialName}$11#9DP$12#${formData.productionBatch}$17#${formData.totalCount}$20#${formattedDate2}$31#${formData.orderNo}$DY`
|
||||||
|
})
|
||||||
|
|
||||||
|
Message.success('标签生成成功')
|
||||||
|
} catch (error) {
|
||||||
|
console.error('生成标签失败:', error)
|
||||||
|
Message.error('生成标签失败')
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// 组件挂载时,检查是否有参数传递
|
||||||
|
onMounted(() => {
|
||||||
|
// 从路由参数中获取数据
|
||||||
|
const workerOrderId = route.query.workerOrderId as string
|
||||||
|
// 如果有参数传递,设置表单数据并标记为不可修改
|
||||||
|
if (workerOrderId) {
|
||||||
|
formData.workerOrderId = workerOrderId
|
||||||
|
getWorkOrder(workerOrderId).then(res => {
|
||||||
|
if (res.code == '0') {
|
||||||
|
formData.encoding = res.data.encoding
|
||||||
|
formData.materialName = res.data.materialName
|
||||||
|
formData.orderNo = res.data.orderNo
|
||||||
|
formData.totalCalculatedWeight = res.data.totalCalculatedWeight
|
||||||
|
formData.totalWeight = res.data.totalWeight
|
||||||
|
formData.totalCount = res.data.totalCount
|
||||||
|
} else {
|
||||||
|
Message.error('获取详情失败')
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
// 自动生成标签
|
||||||
|
generateLabel()
|
||||||
|
}
|
||||||
|
})
|
||||||
|
|
||||||
|
// 打印标签
|
||||||
|
const printLabel = async () => {
|
||||||
|
await nextTick()
|
||||||
|
if (labelContainer.value) {
|
||||||
|
// 创建打印窗口
|
||||||
|
const printWindow = window.open('', '_blank')
|
||||||
|
if (printWindow) {
|
||||||
|
// 直接构建打印内容,确保二维码图片正确生成
|
||||||
|
const printHTML = `
|
||||||
|
<html>
|
||||||
|
<head>
|
||||||
|
<title>标签打印</title>
|
||||||
|
<style>
|
||||||
|
body { margin: 0; padding: 10mm; font-family: Arial, sans-serif; }
|
||||||
|
.label-container { display: flex; flex-wrap: wrap; gap: 10mm; justify-content: center; }
|
||||||
|
.label { width: 90mm; height: 38.5mm; border: 1px solid #000; padding: 0; box-sizing: border-box; page-break-inside: avoid; }
|
||||||
|
.label-table { width: 100%; height: 100%; border-collapse: collapse; }
|
||||||
|
.label-cell { border: 1px solid #000; padding: 1mm; vertical-align: top; }
|
||||||
|
.qr-cell { width: 24mm; text-align: center; vertical-align: middle; border: 1px solid #000; }
|
||||||
|
.label-row { display: flex; align-items: center; }
|
||||||
|
.label-field { font-size: 7pt; font-weight: bold; margin-right: 2mm; min-width: 25pt; }
|
||||||
|
.label-value { font-size: 7pt; flex: 1; }
|
||||||
|
.qr-code img { width: 20mm; height: 20mm; margin: 1mm 0; }
|
||||||
|
.serial-number { font-size: 7pt; margin-top: 1mm; }
|
||||||
|
</style>
|
||||||
|
</head>
|
||||||
|
<body>
|
||||||
|
<div class="label-container">
|
||||||
|
<div class="label">
|
||||||
|
<table class="label-table">
|
||||||
|
<tr>
|
||||||
|
<td class="label-cell">
|
||||||
|
<div class="label-row">
|
||||||
|
<div class="label-field">零件名称</div>
|
||||||
|
<div class="label-value">${labelData.partName}</div>
|
||||||
|
</div>
|
||||||
|
</td>
|
||||||
|
<td class="label-cell">
|
||||||
|
<div class="label-row">
|
||||||
|
<div class="label-field">生产日期</div>
|
||||||
|
<div class="label-value">${labelData.productionDate}</div>
|
||||||
|
</div>
|
||||||
|
</td>
|
||||||
|
<td class="label-cell qr-cell" rowspan="4">
|
||||||
|
<div class="qr-code">
|
||||||
|
<img src="https://api.qrserver.com/v1/create-qr-code/?size=120x120&data=${encodeURIComponent(labelData.qrCodeData)}" alt="QR Code" />
|
||||||
|
</div>
|
||||||
|
</td>
|
||||||
|
</tr>
|
||||||
|
<tr>
|
||||||
|
<td class="label-cell">
|
||||||
|
<div class="label-row">
|
||||||
|
<div class="label-field">零件号</div>
|
||||||
|
<div class="label-value">${labelData.partNumber}</div>
|
||||||
|
</div>
|
||||||
|
</td>
|
||||||
|
<td class="label-cell">
|
||||||
|
<div class="label-row">
|
||||||
|
<div class="label-field">数量</div>
|
||||||
|
<div class="label-value">${labelData.totalCount}</div>
|
||||||
|
</div>
|
||||||
|
</td>
|
||||||
|
</tr>
|
||||||
|
<tr>
|
||||||
|
<td class="label-cell">
|
||||||
|
<div class="label-row">
|
||||||
|
<div class="label-field">标重(kg)</div>
|
||||||
|
<div class="label-value">${labelData.totalCalculatedWeight}</div>
|
||||||
|
</div>
|
||||||
|
</td>
|
||||||
|
<td class="label-cell">
|
||||||
|
<div class="label-row">
|
||||||
|
<div class="label-field">包装签字</div>
|
||||||
|
<div class="label-value">${labelData.packingSignature || ''}</div>
|
||||||
|
</div>
|
||||||
|
</td>
|
||||||
|
</tr>
|
||||||
|
<tr>
|
||||||
|
<td class="label-cell">
|
||||||
|
<div class="label-row">
|
||||||
|
<div class="label-field">实重(kg)</div>
|
||||||
|
<div class="label-value">${labelData.totalWeight || ''}</div>
|
||||||
|
</div>
|
||||||
|
</td>
|
||||||
|
<td class="label-cell">
|
||||||
|
<div class="label-row">
|
||||||
|
<div class="label-field">检验签字</div>
|
||||||
|
<div class="label-value">${labelData.inspectionSignature || ''}</div>
|
||||||
|
</div>
|
||||||
|
</td>
|
||||||
|
</tr>
|
||||||
|
</table>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
|
`
|
||||||
|
|
||||||
|
printWindow.document.write(printHTML)
|
||||||
|
printWindow.document.close()
|
||||||
|
|
||||||
|
// 等待图片加载完成后再打印
|
||||||
|
printWindow.onload = () => {
|
||||||
|
setTimeout(() => {
|
||||||
|
printWindow.focus()
|
||||||
|
printWindow.print()
|
||||||
|
printWindow.close()
|
||||||
|
}, 500)
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
defineOptions({ name: 'BarcodePrint' })
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style scoped lang="scss">
|
||||||
|
.container {
|
||||||
|
max-width: 1200px;
|
||||||
|
margin: 0 auto;
|
||||||
|
padding: 20px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.page-title {
|
||||||
|
margin-bottom: 30px;
|
||||||
|
text-align: center;
|
||||||
|
color: #333;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* 表单区域 */
|
||||||
|
.form-section {
|
||||||
|
background-color: var(--color-bg-2);
|
||||||
|
padding: 20px;
|
||||||
|
border-radius: 4px;
|
||||||
|
margin-bottom: 30px;
|
||||||
|
box-shadow: 0 2px 8px rgba(0, 0, 0, 0.06);
|
||||||
|
}
|
||||||
|
|
||||||
|
.form-grid {
|
||||||
|
display: grid;
|
||||||
|
grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
|
||||||
|
gap: 16px;
|
||||||
|
margin-bottom: 20px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.form-grid-item {
|
||||||
|
width: 100%;
|
||||||
|
}
|
||||||
|
|
||||||
|
.form-actions {
|
||||||
|
margin-top: 20px;
|
||||||
|
display: flex;
|
||||||
|
justify-content: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* 标签预览 */
|
||||||
|
.label-preview-section {
|
||||||
|
margin-top: 30px;
|
||||||
|
padding: 20px;
|
||||||
|
background-color: var(--color-bg-2);
|
||||||
|
border-radius: 4px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.label-preview-section h3 {
|
||||||
|
margin: 0 0 20px 0;
|
||||||
|
font-size: 16px;
|
||||||
|
font-weight: bold;
|
||||||
|
text-align: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
.label-container {
|
||||||
|
display: flex;
|
||||||
|
flex-wrap: wrap;
|
||||||
|
gap: 20px;
|
||||||
|
justify-content: center;
|
||||||
|
margin-bottom: 20px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.label {
|
||||||
|
width: 450px;
|
||||||
|
height: 180px;
|
||||||
|
border: 1px solid #000;
|
||||||
|
padding: 0;
|
||||||
|
box-sizing: border-box;
|
||||||
|
font-family: Arial, sans-serif;
|
||||||
|
}
|
||||||
|
|
||||||
|
.label-table {
|
||||||
|
width: 100%;
|
||||||
|
height: 100%;
|
||||||
|
border-collapse: collapse;
|
||||||
|
}
|
||||||
|
|
||||||
|
.label-cell {
|
||||||
|
border: 1px solid #000;
|
||||||
|
padding: 5px;
|
||||||
|
vertical-align: top;
|
||||||
|
}
|
||||||
|
|
||||||
|
.qr-cell {
|
||||||
|
width: 120px;
|
||||||
|
text-align: center;
|
||||||
|
vertical-align: middle;
|
||||||
|
}
|
||||||
|
|
||||||
|
.label-row {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
.label-field {
|
||||||
|
font-size: 12px;
|
||||||
|
font-weight: bold;
|
||||||
|
margin-right: 10px;
|
||||||
|
min-width: 60px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.label-value {
|
||||||
|
font-size: 12px;
|
||||||
|
flex: 1;
|
||||||
|
}
|
||||||
|
|
||||||
|
.qr-code img {
|
||||||
|
width: 100px;
|
||||||
|
height: 100px;
|
||||||
|
margin: 5px 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.serial-number {
|
||||||
|
font-size: 12px;
|
||||||
|
margin-top: 5px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.label-actions {
|
||||||
|
display: flex;
|
||||||
|
justify-content: center;
|
||||||
|
margin-top: 20px;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* 确保输入框宽度一致 */
|
||||||
|
:deep(.arco-input-wrapper) {
|
||||||
|
width: 100%;
|
||||||
|
height: 35px;
|
||||||
|
}
|
||||||
|
|
||||||
|
:deep(.arco-input) {
|
||||||
|
font-size: 16px;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
136
src/views/login/components/card/index.vue
Normal file
136
src/views/login/components/card/index.vue
Normal file
@@ -0,0 +1,136 @@
|
|||||||
|
<template>
|
||||||
|
<a-form
|
||||||
|
ref="formRef"
|
||||||
|
:model="form"
|
||||||
|
:rules="rules"
|
||||||
|
:label-col-style="{ display: 'none' }"
|
||||||
|
:wrapper-col-style="{ flex: 1 }"
|
||||||
|
size="large"
|
||||||
|
@submit="handleLogin"
|
||||||
|
>
|
||||||
|
<a-form-item field="cardNumber" hide-label>
|
||||||
|
<a-input v-model="form.cardNumber" placeholder="请刷卡" allow-clear @keyup.enter="handleLogin" />
|
||||||
|
</a-form-item>
|
||||||
|
<a-form-item>
|
||||||
|
<a-space direction="vertical" fill class="w-full">
|
||||||
|
<a-button type="primary" :loading="loading" html-type="submit" size="large" long>立即登录</a-button>
|
||||||
|
</a-space>
|
||||||
|
</a-form-item>
|
||||||
|
</a-form>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script setup lang="ts">
|
||||||
|
import { ref, reactive, onMounted, onUnmounted } from 'vue'
|
||||||
|
import { type FormInstance, Message } from '@arco-design/web-vue'
|
||||||
|
import { useTabsStore, useUserStore } from '@/stores'
|
||||||
|
|
||||||
|
const formRef = ref<FormInstance>()
|
||||||
|
const form = reactive({
|
||||||
|
cardNumber: '',
|
||||||
|
})
|
||||||
|
|
||||||
|
const rules: FormInstance['rules'] = {
|
||||||
|
cardNumber: [
|
||||||
|
{ required: true, message: '请刷卡或输入卡号' },
|
||||||
|
],
|
||||||
|
}
|
||||||
|
|
||||||
|
const userStore = useUserStore()
|
||||||
|
const tabsStore = useTabsStore()
|
||||||
|
const router = useRouter()
|
||||||
|
const loading = ref(false)
|
||||||
|
|
||||||
|
// 登录
|
||||||
|
const handleLogin = async () => {
|
||||||
|
// 检查用户是否已经登录
|
||||||
|
if (userStore.token) {
|
||||||
|
return
|
||||||
|
}
|
||||||
|
|
||||||
|
const isInvalid = await formRef.value?.validate()
|
||||||
|
if (isInvalid) return
|
||||||
|
try {
|
||||||
|
loading.value = true
|
||||||
|
// 调用后端接口校验卡号
|
||||||
|
await userStore.cardLogin(form)
|
||||||
|
|
||||||
|
// 登录成功后移除事件监听器
|
||||||
|
if (keyDownListener) {
|
||||||
|
document.removeEventListener('keydown', keyDownListener)
|
||||||
|
keyDownListener = null
|
||||||
|
}
|
||||||
|
|
||||||
|
tabsStore.reset()
|
||||||
|
const { redirect, ...othersQuery } = router.currentRoute.value.query
|
||||||
|
await router.push({
|
||||||
|
path: (redirect as string) || '/',
|
||||||
|
query: {
|
||||||
|
...othersQuery,
|
||||||
|
},
|
||||||
|
})
|
||||||
|
Message.success('欢迎使用')
|
||||||
|
} catch (error) {
|
||||||
|
// 登录失败处理
|
||||||
|
} finally {
|
||||||
|
loading.value = false
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// 键盘事件监听器引用
|
||||||
|
let keyDownListener: ((e: KeyboardEvent) => void) | null = null
|
||||||
|
|
||||||
|
// 监听键盘输入,实现自动识别卡号
|
||||||
|
onMounted(() => {
|
||||||
|
// 只监听Enter键,用于自动登录
|
||||||
|
keyDownListener = (e) => {
|
||||||
|
// 刷卡器通常会快速输入卡号并以Enter键结束
|
||||||
|
if (e.key === 'Enter') {
|
||||||
|
// 遇到Enter键,尝试登录
|
||||||
|
if (form.cardNumber.trim()) {
|
||||||
|
handleLogin()
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
document.addEventListener('keydown', keyDownListener)
|
||||||
|
})
|
||||||
|
|
||||||
|
// 组件卸载时移除事件监听器
|
||||||
|
onUnmounted(() => {
|
||||||
|
if (keyDownListener) {
|
||||||
|
document.removeEventListener('keydown', keyDownListener)
|
||||||
|
}
|
||||||
|
})
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style scoped lang="scss">
|
||||||
|
.arco-input-wrapper,
|
||||||
|
:deep(.arco-select-view-single) {
|
||||||
|
height: 40px;
|
||||||
|
border-radius: 4px;
|
||||||
|
font-size: 13px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.arco-input-wrapper.arco-input-error {
|
||||||
|
background-color: rgb(var(--danger-1));
|
||||||
|
border-color: rgb(var(--danger-3));
|
||||||
|
}
|
||||||
|
.arco-input-wrapper.arco-input-error:hover {
|
||||||
|
background-color: rgb(var(--danger-1));
|
||||||
|
border-color: rgb(var(--danger-6));
|
||||||
|
}
|
||||||
|
|
||||||
|
.arco-input-wrapper :deep(.arco-input) {
|
||||||
|
font-size: 13px;
|
||||||
|
color: var(--color-text-1);
|
||||||
|
}
|
||||||
|
.arco-input-wrapper:hover {
|
||||||
|
border-color: rgb(var(--arcoblue-6));
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
.btn {
|
||||||
|
height: 40px;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
@@ -15,28 +15,14 @@
|
|||||||
<a-col :xs="24" :sm="12" :md="11">
|
<a-col :xs="24" :sm="12" :md="11">
|
||||||
<div class="login-right">
|
<div class="login-right">
|
||||||
<h3 v-if="isEmailLogin" class="login-right__title">邮箱登录</h3>
|
<h3 v-if="isEmailLogin" class="login-right__title">邮箱登录</h3>
|
||||||
<EmailLogin v-if="isEmailLogin" />
|
|
||||||
<a-tabs v-else v-model:activeKey="activeTab" class="login-right__form">
|
<a-tabs v-else v-model:activeKey="activeTab" class="login-right__form">
|
||||||
<a-tab-pane key="1" title="账号登录">
|
<a-tab-pane key="1" title="账号登录">
|
||||||
<component :is="AccountLogin" v-if="activeTab === '1'" />
|
<component :is="AccountLogin" v-if="activeTab === '1'" />
|
||||||
</a-tab-pane>
|
</a-tab-pane>
|
||||||
<a-tab-pane key="2" title="手机号登录">
|
<a-tab-pane key="2" title="刷卡">
|
||||||
<component :is="PhoneLogin" v-if="activeTab === '2'" />
|
<component :is="CardLogin" v-if="activeTab === '2'" />
|
||||||
</a-tab-pane>
|
</a-tab-pane>
|
||||||
</a-tabs>
|
</a-tabs>
|
||||||
<!-- <div class="login-right__oauth">
|
|
||||||
<a-divider orientation="center">其他登录方式</a-divider>
|
|
||||||
<div class="list">
|
|
||||||
<div v-if="isEmailLogin" class="mode item" @click="toggleLoginMode"><icon-user /> 账号/手机号登录</div>
|
|
||||||
<div v-else class="mode item" @click="toggleLoginMode"><icon-email /> 邮箱登录</div>
|
|
||||||
<a class="item" title="使用 Gitee 账号登录" @click="onOauth('gitee')">
|
|
||||||
<GiSvgIcon name="gitee" :size="24" />
|
|
||||||
</a>
|
|
||||||
<a class="item" title="使用 GitHub 账号登录" @click="onOauth('github')">
|
|
||||||
<GiSvgIcon name="github" :size="24" />
|
|
||||||
</a>
|
|
||||||
</div>
|
|
||||||
</div>-->
|
|
||||||
</div>
|
</div>
|
||||||
</a-col>
|
</a-col>
|
||||||
</a-row>
|
</a-row>
|
||||||
@@ -51,51 +37,13 @@
|
|||||||
<Background />
|
<Background />
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div v-else class="login h5">
|
|
||||||
<div class="login-logo">
|
|
||||||
<img v-if="logo" :src="logo" alt="logo" />
|
|
||||||
<img v-else src="/logo.svg" alt="logo" />
|
|
||||||
<span>{{ title }}</span>
|
|
||||||
</div>
|
|
||||||
<a-row align="stretch" class="login-box">
|
|
||||||
<a-col :xs="24" :sm="12" :md="11">
|
|
||||||
<div class="login-right">
|
|
||||||
<h3 v-if="isEmailLogin" class="login-right__title">邮箱登录</h3>
|
|
||||||
<EmailLogin v-if="isEmailLogin" />
|
|
||||||
<a-tabs v-else v-model:activeKey="activeTab" class="login-right__form">
|
|
||||||
<a-tab-pane key="1" title="账号登录">
|
|
||||||
<component :is="AccountLogin" v-if="activeTab === '1'" />
|
|
||||||
</a-tab-pane>
|
|
||||||
<a-tab-pane key="2" title="手机号登录">
|
|
||||||
<component :is="PhoneLogin" v-if="activeTab === '2'" />
|
|
||||||
</a-tab-pane>
|
|
||||||
</a-tabs>
|
|
||||||
</div>
|
|
||||||
</a-col>
|
|
||||||
</a-row>
|
|
||||||
<div class="login-right__oauth">
|
|
||||||
<a-divider orientation="center">其他登录方式</a-divider>
|
|
||||||
<div class="list">
|
|
||||||
<div v-if="isEmailLogin" class="mode item" @click="toggleLoginMode"><icon-user /> 账号/手机号登录</div>
|
|
||||||
<div v-else class="mode item" @click="toggleLoginMode"><icon-email /> 邮箱登录</div>
|
|
||||||
<a class="item" title="使用 Gitee 账号登录" @click="onOauth('gitee')">
|
|
||||||
<GiSvgIcon name="gitee" :size="24" />
|
|
||||||
</a>
|
|
||||||
<a class="item" title="使用 GitHub 账号登录" @click="onOauth('github')">
|
|
||||||
<GiSvgIcon name="github" :size="24" />
|
|
||||||
</a>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script setup lang="ts">
|
<script setup lang="ts">
|
||||||
import { computed, ref } from 'vue'
|
import { computed, ref } from 'vue'
|
||||||
import Background from './components/background/index.vue'
|
import Background from './components/background/index.vue'
|
||||||
import AccountLogin from './components/account/index.vue'
|
import AccountLogin from './components/account/index.vue'
|
||||||
import PhoneLogin from './components/phone/index.vue'
|
import CardLogin from './components/card/index.vue'
|
||||||
import EmailLogin from './components/email/index.vue'
|
|
||||||
import { socialAuth } from '@/apis/auth'
|
|
||||||
import { useAppStore } from '@/stores'
|
import { useAppStore } from '@/stores'
|
||||||
import { useDevice } from '@/hooks'
|
import { useDevice } from '@/hooks'
|
||||||
|
|
||||||
@@ -109,16 +57,6 @@ const logo = computed(() => appStore.getLogo())
|
|||||||
const isEmailLogin = ref(false)
|
const isEmailLogin = ref(false)
|
||||||
const activeTab = ref('1')
|
const activeTab = ref('1')
|
||||||
|
|
||||||
// 切换登录模式
|
|
||||||
const toggleLoginMode = () => {
|
|
||||||
isEmailLogin.value = !isEmailLogin.value
|
|
||||||
}
|
|
||||||
|
|
||||||
// 第三方登录授权
|
|
||||||
const onOauth = async (source: string) => {
|
|
||||||
const { data } = await socialAuth(source)
|
|
||||||
window.location.href = data.authorizeUrl
|
|
||||||
}
|
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<style scoped lang="scss">
|
<style scoped lang="scss">
|
||||||
|
|||||||
@@ -12,6 +12,7 @@
|
|||||||
:disabled-column-keys="['name']"
|
:disabled-column-keys="['name']"
|
||||||
@refresh="search"
|
@refresh="search"
|
||||||
>
|
>
|
||||||
|
<!-- toolbar 部分保持不变 -->
|
||||||
<template #toolbar-left>
|
<template #toolbar-left>
|
||||||
<a-input-search v-model="queryForm.materialName" placeholder="请输入物料名称" allow-clear @search="search" />
|
<a-input-search v-model="queryForm.materialName" placeholder="请输入物料名称" allow-clear @search="search" />
|
||||||
<a-input-search v-model="queryForm.encoding" placeholder="请输入物料编码" allow-clear @search="search" />
|
<a-input-search v-model="queryForm.encoding" placeholder="请输入物料编码" allow-clear @search="search" />
|
||||||
@@ -38,18 +39,31 @@
|
|||||||
<template #default>照片批量导入</template>
|
<template #default>照片批量导入</template>
|
||||||
</a-button>
|
</a-button>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
|
<!-- 【修改点】照片列插槽 -->
|
||||||
<template #photoUrl="{ record }">
|
<template #photoUrl="{ record }">
|
||||||
<div class="photo-container">
|
<div class="photo-container">
|
||||||
|
<!-- 1. 正常显示图片:有地址 且 未标记为错误 -->
|
||||||
<img
|
<img
|
||||||
v-if="record.photoUrl"
|
v-if="record.photoUrl && !record.photoLoadError"
|
||||||
:src="record.photoUrl"
|
:src="record.photoUrl"
|
||||||
alt="物料照片"
|
alt="物料照片"
|
||||||
class="material-photo"
|
class="material-photo"
|
||||||
@error="handleImgError($event)"
|
@load="handleImgLoad(record)"
|
||||||
|
@error="handleImgError(record, $event)"
|
||||||
/>
|
/>
|
||||||
<span v-else class="no-photo">暂无照片</span>
|
|
||||||
|
<!-- 2. 无地址 -->
|
||||||
|
<span v-else-if="!record.photoUrl" class="no-photo">暂无照片</span>
|
||||||
|
|
||||||
|
<!-- 3. 地址存在但加载失败 -->
|
||||||
|
<span v-else class="photo-error">
|
||||||
|
<icon-exclamation-circle-fill class="error-icon" />
|
||||||
|
照片异常
|
||||||
|
</span>
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<template #action="{ record }">
|
<template #action="{ record }">
|
||||||
<a-space>
|
<a-space>
|
||||||
<a-link v-permission="['admin:materialInfo:update']" title="修改" @click="onUpdate(record)">修改</a-link>
|
<a-link v-permission="['admin:materialInfo:update']" title="修改" @click="onUpdate(record)">修改</a-link>
|
||||||
@@ -73,6 +87,7 @@
|
|||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script setup lang="ts">
|
<script setup lang="ts">
|
||||||
|
// ... 保持原有的 import 不变
|
||||||
import MaterialInfoAddModal from './MaterialInfoAddModal.vue'
|
import MaterialInfoAddModal from './MaterialInfoAddModal.vue'
|
||||||
import MaterialInfoImportDrawer from './MaterialInfoImportDrawer.vue'
|
import MaterialInfoImportDrawer from './MaterialInfoImportDrawer.vue'
|
||||||
import PhotosImport from '@/views/material/PhotosImport.vue';
|
import PhotosImport from '@/views/material/PhotosImport.vue';
|
||||||
@@ -84,6 +99,12 @@ import has from '@/utils/has'
|
|||||||
|
|
||||||
defineOptions({ name: 'MaterialInfo' })
|
defineOptions({ name: 'MaterialInfo' })
|
||||||
|
|
||||||
|
// 扩展类型定义,允许动态添加 photoLoadError 属性
|
||||||
|
// 如果 TS 报错,可以在 MaterialInfoResp 接口定义中添加 photoLoadError?: boolean;
|
||||||
|
interface MaterialInfoRespWithStatus extends MaterialInfoResp {
|
||||||
|
photoLoadError?: boolean;
|
||||||
|
}
|
||||||
|
|
||||||
const queryForm = reactive<MaterialInfoQuery>({
|
const queryForm = reactive<MaterialInfoQuery>({
|
||||||
materialName: undefined,
|
materialName: undefined,
|
||||||
encoding: undefined,
|
encoding: undefined,
|
||||||
@@ -97,6 +118,7 @@ const {
|
|||||||
search,
|
search,
|
||||||
handleDelete,
|
handleDelete,
|
||||||
} = useTable((page) => listMaterialInfo({ ...queryForm, ...page }), { immediate: true })
|
} = useTable((page) => listMaterialInfo({ ...queryForm, ...page }), { immediate: true })
|
||||||
|
|
||||||
const columns = ref<TableInstanceColumns[]>([
|
const columns = ref<TableInstanceColumns[]>([
|
||||||
{ title: '物料名称', dataIndex: 'materialName', slotName: 'materialName' },
|
{ title: '物料名称', dataIndex: 'materialName', slotName: 'materialName' },
|
||||||
{ title: '物料编码', dataIndex: 'encoding', slotName: 'encoding' },
|
{ title: '物料编码', dataIndex: 'encoding', slotName: 'encoding' },
|
||||||
@@ -116,14 +138,12 @@ const columns = ref<TableInstanceColumns[]>([
|
|||||||
},
|
},
|
||||||
])
|
])
|
||||||
|
|
||||||
// 重置
|
|
||||||
const reset = () => {
|
const reset = () => {
|
||||||
queryForm.materialName = undefined
|
queryForm.materialName = undefined
|
||||||
queryForm.encoding = undefined
|
queryForm.encoding = undefined
|
||||||
search()
|
search()
|
||||||
}
|
}
|
||||||
|
|
||||||
// 删除
|
|
||||||
const onDelete = (record: MaterialInfoResp) => {
|
const onDelete = (record: MaterialInfoResp) => {
|
||||||
return handleDelete(() => deleteMaterialInfo(record.id), {
|
return handleDelete(() => deleteMaterialInfo(record.id), {
|
||||||
content: `是否确定删除该条数据?`,
|
content: `是否确定删除该条数据?`,
|
||||||
@@ -131,25 +151,26 @@ const onDelete = (record: MaterialInfoResp) => {
|
|||||||
})
|
})
|
||||||
}
|
}
|
||||||
|
|
||||||
// 导出
|
|
||||||
const onExport = () => {
|
const onExport = () => {
|
||||||
useDownload(() => exportMaterialInfo(queryForm))
|
useDownload(() => exportMaterialInfo(queryForm))
|
||||||
}
|
}
|
||||||
|
|
||||||
// 图片加载失败处理函数(新增)
|
// 【修改点】图片加载处理逻辑
|
||||||
const handleImgError = (e: Event) => {
|
const handleImgLoad = (record: MaterialInfoRespWithStatus) => {
|
||||||
// 替换为你的默认图片地址(建议放在/static目录下)
|
record.photoLoadError = false
|
||||||
const target = e.target as HTMLImageElement
|
}
|
||||||
target.src = '/static/images/default-material.png'
|
|
||||||
|
const handleImgError = (record: MaterialInfoRespWithStatus, e: Event) => {
|
||||||
|
// 标记为加载错误,触发模板渲染 "照片异常"
|
||||||
|
record.photoLoadError = true
|
||||||
|
console.warn(`物料照片加载失败: ${record.photoUrl}`)
|
||||||
}
|
}
|
||||||
|
|
||||||
const MaterialInfoAddModalRef = ref<InstanceType<typeof MaterialInfoAddModal>>()
|
const MaterialInfoAddModalRef = ref<InstanceType<typeof MaterialInfoAddModal>>()
|
||||||
// 新增
|
|
||||||
const onAdd = () => {
|
const onAdd = () => {
|
||||||
MaterialInfoAddModalRef.value?.onAdd()
|
MaterialInfoAddModalRef.value?.onAdd()
|
||||||
}
|
}
|
||||||
|
|
||||||
// 修改
|
|
||||||
const onUpdate = (record: MaterialInfoResp) => {
|
const onUpdate = (record: MaterialInfoResp) => {
|
||||||
MaterialInfoAddModalRef.value?.onUpdate(record.id)
|
MaterialInfoAddModalRef.value?.onUpdate(record.id)
|
||||||
}
|
}
|
||||||
@@ -166,23 +187,43 @@ const onPhotosImport = () => {
|
|||||||
</script>
|
</script>
|
||||||
|
|
||||||
<style scoped lang="scss">
|
<style scoped lang="scss">
|
||||||
// 物料照片样式(新增)
|
|
||||||
.photo-container {
|
.photo-container {
|
||||||
display: flex;
|
display: flex;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
justify-content: center;
|
justify-content: center;
|
||||||
height: 80px;
|
height: 80px;
|
||||||
|
width: 100%;
|
||||||
|
overflow: hidden;
|
||||||
}
|
}
|
||||||
|
|
||||||
.material-photo {
|
.material-photo {
|
||||||
width: 80px;
|
width: 100%;
|
||||||
height: 80px;
|
height: 100%;
|
||||||
object-fit: cover; // 保持图片比例,避免拉伸
|
object-fit: cover;
|
||||||
border-radius: 4px;
|
border-radius: 4px;
|
||||||
|
transition: opacity 0.3s;
|
||||||
}
|
}
|
||||||
|
|
||||||
.no-photo {
|
.no-photo {
|
||||||
color: #999;
|
color: #999;
|
||||||
font-size: 12px;
|
font-size: 12px;
|
||||||
|
text-align: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
// 新增样式
|
||||||
|
.photo-error {
|
||||||
|
color: #ff4d4f; // 阿里红/危险色
|
||||||
|
font-size: 12px;
|
||||||
|
text-align: center;
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
line-height: 1.4;
|
||||||
|
|
||||||
|
.error-icon {
|
||||||
|
font-size: 18px;
|
||||||
|
margin-bottom: 2px;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
</style>
|
</style>
|
||||||
|
|||||||
@@ -49,7 +49,7 @@ const columns: ColumnItem[] = reactive([
|
|||||||
field: 'configKey',
|
field: 'configKey',
|
||||||
type: 'input',
|
type: 'input',
|
||||||
span: 24,
|
span: 24,
|
||||||
disabled: true,
|
disabled: isUpdate.value,
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
label: '参数键值',
|
label: '参数键值',
|
||||||
|
|||||||
@@ -102,7 +102,7 @@ import { DisEnableStatusList } from '@/constant/common'
|
|||||||
import { useDownload, useResetReactive, useTable } from '@/hooks'
|
import { useDownload, useResetReactive, useTable } from '@/hooks'
|
||||||
import { isMobile } from '@/utils'
|
import { isMobile } from '@/utils'
|
||||||
import has from '@/utils/has'
|
import has from '@/utils/has'
|
||||||
import type { ColumnItem } from '@/components/GiForm'
|
import type {ColumnItem} from "@/components/GiForm";
|
||||||
|
|
||||||
defineOptions({ name: 'SystemUser' })
|
defineOptions({ name: 'SystemUser' })
|
||||||
|
|
||||||
@@ -168,7 +168,7 @@ const columns: TableInstanceColumns[] = [
|
|||||||
fixed: !isMobile() ? 'left' : undefined,
|
fixed: !isMobile() ? 'left' : undefined,
|
||||||
},
|
},
|
||||||
{ title: '用户名', dataIndex: 'username', slotName: 'username', minWidth: 100, ellipsis: true, tooltip: true },
|
{ title: '用户名', dataIndex: 'username', slotName: 'username', minWidth: 100, ellipsis: true, tooltip: true },
|
||||||
{ title: '卡号', dataIndex: 'cardNo', slotName: 'cardNo' },
|
{ title:'卡号', dataIndex: 'cardNo', slotName: 'cardNo' },
|
||||||
{ title: '状态', dataIndex: 'status', slotName: 'status', align: 'center' },
|
{ title: '状态', dataIndex: 'status', slotName: 'status', align: 'center' },
|
||||||
{ title: '性别', dataIndex: 'gender', slotName: 'gender', align: 'center' },
|
{ title: '性别', dataIndex: 'gender', slotName: 'gender', align: 'center' },
|
||||||
{ title: '角色', dataIndex: 'roleNames', slotName: 'roleNames', minWidth: 165 },
|
{ title: '角色', dataIndex: 'roleNames', slotName: 'roleNames', minWidth: 165 },
|
||||||
@@ -204,7 +204,7 @@ const reset = () => {
|
|||||||
|
|
||||||
const onDelete = (record: UserResp) => {
|
const onDelete = (record: UserResp) => {
|
||||||
return handleDelete(() => deleteUser(record.id), {
|
return handleDelete(() => deleteUser(record.id), {
|
||||||
content: `是否确定删除用户「${record.username}」?`,
|
content: `是否确定删除用户「${record.nickname}(${record.username})」?`,
|
||||||
showModal: true,
|
showModal: true,
|
||||||
})
|
})
|
||||||
}
|
}
|
||||||
|
|||||||
File diff suppressed because it is too large
Load Diff
282
src/views/workOrder/index.vue
Normal file
282
src/views/workOrder/index.vue
Normal file
@@ -0,0 +1,282 @@
|
|||||||
|
<template>
|
||||||
|
<div class="gi_table_page">
|
||||||
|
<GiTable
|
||||||
|
row-key="id"
|
||||||
|
:data="dataList"
|
||||||
|
:columns="columns"
|
||||||
|
:loading="loading"
|
||||||
|
:scroll="{ x: '100%', y: '100%', minWidth: 1600 }"
|
||||||
|
:pagination="pagination"
|
||||||
|
:disabled-tools="['size']"
|
||||||
|
:disabled-column-keys="['name']"
|
||||||
|
:selected-keys="selectedKeys"
|
||||||
|
:row-selection="{ type: 'checkbox', showCheckedAll: true }"
|
||||||
|
@select-all="selectAll"
|
||||||
|
@select="select"
|
||||||
|
@refresh="search"
|
||||||
|
>
|
||||||
|
<template #toolbar-left>
|
||||||
|
<a-input-search v-model="queryForm.userName" placeholder="请输入姓名" allow-clear @search="search" />
|
||||||
|
<a-input-search v-model="queryForm.carNo" placeholder="请输入人员卡号" allow-clear @search="search" />
|
||||||
|
<a-input-search v-model="queryForm.orderNo" placeholder="请输入任务工单号" allow-clear @search="search" />
|
||||||
|
<a-input-search v-model="queryForm.materialName" placeholder="请输入物料名称" allow-clear @search="search" />
|
||||||
|
<a-input-search v-model="queryForm.encoding" placeholder="请输入物料编码" allow-clear @search="search" />
|
||||||
|
<a-date-picker
|
||||||
|
v-model="queryForm.startDate"
|
||||||
|
placeholder="请选择开始时间"
|
||||||
|
show-time
|
||||||
|
format="YYYY-MM-DD HH:mm:ss"
|
||||||
|
style="height: 32px"
|
||||||
|
@change="search"
|
||||||
|
/>
|
||||||
|
<a-date-picker
|
||||||
|
v-model="queryForm.endDate"
|
||||||
|
placeholder="请选择结束时间"
|
||||||
|
show-time
|
||||||
|
format="YYYY-MM-DD HH:mm:ss"
|
||||||
|
style="height: 32px"
|
||||||
|
@change="search"
|
||||||
|
/>
|
||||||
|
|
||||||
|
<a-button @click="reset">
|
||||||
|
<template #icon><icon-refresh /></template>
|
||||||
|
<template #default>重置</template>
|
||||||
|
</a-button>
|
||||||
|
</template>
|
||||||
|
<template #toolbar-right>
|
||||||
|
<a-button v-permission="['workOrder:record:delete']" type="outline" status="danger" @click="onDelete">
|
||||||
|
<template #icon><icon-delete /></template>
|
||||||
|
<template #default>删除</template>
|
||||||
|
</a-button>
|
||||||
|
<a-button v-permission="['workOrder:record:export']" @click="onExport">
|
||||||
|
<template #icon><icon-download /></template>
|
||||||
|
<template #default>导出</template>
|
||||||
|
</a-button>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<template #photoUrl="{ record }">
|
||||||
|
<a-image :src="record.photoUrl" width="55" />
|
||||||
|
</template>
|
||||||
|
<template #unitWeight="{ record }">
|
||||||
|
{{ record.unitWeight + 'g' }}
|
||||||
|
</template>
|
||||||
|
<template #totalWeight="{ record }">
|
||||||
|
{{ record.totalWeight + 'g' }}
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<template #action="{ record }">
|
||||||
|
<a-space>
|
||||||
|
<a-link v-permission="['workOrder:record:detail']" title="详情" @click="onDetail(record)">详情</a-link>
|
||||||
|
<a-link v-permission="['workOrder:record:print']" title="打印" @click="onPrint(record)">打印</a-link>
|
||||||
|
<a-link v-permission="['workOrder:record:delete']" status="danger" :title="'删除'" @click="onDeleteOne(record.id)">删除</a-link>
|
||||||
|
</a-space>
|
||||||
|
</template>
|
||||||
|
</GiTable>
|
||||||
|
|
||||||
|
<!-- 详情弹窗 -->
|
||||||
|
<a-modal
|
||||||
|
v-model:visible="detailModalVisible"
|
||||||
|
title="称重详情"
|
||||||
|
width="800px"
|
||||||
|
:loading="detailLoading"
|
||||||
|
>
|
||||||
|
<GiTable
|
||||||
|
v-if="detailData.length > 0"
|
||||||
|
row-key="id"
|
||||||
|
:data="detailData"
|
||||||
|
:columns="detailColumns"
|
||||||
|
:scroll="{ x: '100%', y: '100%', minWidth: 700 }"
|
||||||
|
>
|
||||||
|
<template #imgUrl="{ record }">
|
||||||
|
<a-image :src="record.imgUrl" width="50" />
|
||||||
|
</template>
|
||||||
|
<template #calculatedWeight="{ record }">
|
||||||
|
{{ record.calculatedWeight + 'g' }}
|
||||||
|
</template>
|
||||||
|
<template #weight="{ record }">
|
||||||
|
{{ record.weight + 'g' }}
|
||||||
|
</template>
|
||||||
|
</GiTable>
|
||||||
|
<div v-else class="no-data">
|
||||||
|
<icon-loading style="font-size: 48px; color: rgb(var(--arcoblue-6));" />
|
||||||
|
<p>暂无称重数据</p>
|
||||||
|
</div>
|
||||||
|
</a-modal>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script setup lang="ts">
|
||||||
|
import type { TableInstanceColumns } from '@/components/GiTable/type'
|
||||||
|
import { useDownload, useTable } from '@/hooks'
|
||||||
|
import { isMobile } from '@/utils'
|
||||||
|
import has from '@/utils/has'
|
||||||
|
import type GiTable from "@/components/GiTable/index.vue";
|
||||||
|
import {ref, reactive} from "vue";
|
||||||
|
import {Message} from "@arco-design/web-vue";
|
||||||
|
import { useRouter } from 'vue-router';
|
||||||
|
import {
|
||||||
|
deleteWorkOrder,
|
||||||
|
exportWorkOrder, getWorkOrderInfos,
|
||||||
|
listWorkOrder,
|
||||||
|
type WorkOrderQuery,
|
||||||
|
type WorkOrderResp
|
||||||
|
} from "@/apis/workOrder/workOrder";
|
||||||
|
|
||||||
|
defineOptions({ name: 'Record' })
|
||||||
|
|
||||||
|
const router = useRouter()
|
||||||
|
|
||||||
|
|
||||||
|
const queryForm = reactive<WorkOrderQuery>({
|
||||||
|
orderNo: undefined,
|
||||||
|
materialName: undefined,
|
||||||
|
encoding: undefined,
|
||||||
|
userName: undefined,
|
||||||
|
carNo: undefined,
|
||||||
|
startDate: undefined,
|
||||||
|
endDate: undefined,
|
||||||
|
sort: ['w.id,desc']
|
||||||
|
})
|
||||||
|
|
||||||
|
const {
|
||||||
|
tableData: dataList,
|
||||||
|
loading,
|
||||||
|
pagination,
|
||||||
|
selectedKeys,
|
||||||
|
select,
|
||||||
|
selectAll,
|
||||||
|
search,
|
||||||
|
handleDelete,
|
||||||
|
} = useTable((page) => listWorkOrder({ ...queryForm, ...page }), { immediate: true })
|
||||||
|
|
||||||
|
// 创建工具函数统一处理列配置
|
||||||
|
const processColumns = (columns: TableInstanceColumns[]): TableInstanceColumns[] => {
|
||||||
|
return columns.map(column => {
|
||||||
|
const defaultConfig = {
|
||||||
|
ellipsis: true,
|
||||||
|
tooltip: true
|
||||||
|
};
|
||||||
|
return { ...defaultConfig, ...column };
|
||||||
|
});
|
||||||
|
};
|
||||||
|
|
||||||
|
// 定义列配置,使用工具函数处理
|
||||||
|
const columns = ref<TableInstanceColumns[]>(processColumns([
|
||||||
|
{ title: '标题', dataIndex: 'title', width: 180 },
|
||||||
|
{ title: '创建人', dataIndex: 'createUserString' },
|
||||||
|
{ title: '人员卡号', dataIndex: 'cardNo' },
|
||||||
|
{ title: '任务工单号', dataIndex: 'orderNo' },
|
||||||
|
{ title: '物料图片', dataIndex: 'photoUrl', slotName: 'photoUrl', minWidth: 180, ellipsis: true, tooltip: true },
|
||||||
|
{ title: '物料名称', dataIndex: 'materialName' },
|
||||||
|
{ title: '物料编码', dataIndex: 'encoding' },
|
||||||
|
{ title: '单位克重', dataIndex: 'unitWeight' ,slotName: 'unitWeight'},
|
||||||
|
{ title: '总重量', dataIndex: 'totalWeight' ,slotName: 'totalWeight'},
|
||||||
|
{ title: '总数量', dataIndex: 'totalCount' },
|
||||||
|
{ title: '创建时间', dataIndex: 'createTime', width: 180 },
|
||||||
|
{
|
||||||
|
title: '操作',
|
||||||
|
dataIndex: 'action',
|
||||||
|
slotName: 'action',
|
||||||
|
width: 160,
|
||||||
|
align: 'center',
|
||||||
|
fixed: !isMobile() ? 'right' : undefined,
|
||||||
|
show: has.hasPermOr(['workOrder:record:detail', 'workOrder:record:update', 'workOrder:record:delete'])
|
||||||
|
}
|
||||||
|
]))
|
||||||
|
|
||||||
|
// 重置
|
||||||
|
const reset = () => {
|
||||||
|
queryForm.orderNo = undefined
|
||||||
|
queryForm.materialName = undefined
|
||||||
|
queryForm.encoding = undefined
|
||||||
|
queryForm.userName = undefined
|
||||||
|
queryForm.carNo = undefined
|
||||||
|
queryForm.startDate = undefined
|
||||||
|
queryForm.endDate = undefined
|
||||||
|
search()
|
||||||
|
}
|
||||||
|
|
||||||
|
// 详情弹窗状态
|
||||||
|
const detailModalVisible = ref(false)
|
||||||
|
const detailLoading = ref(false)
|
||||||
|
const detailData = ref<any[]>([])
|
||||||
|
|
||||||
|
// 详情列配置
|
||||||
|
const detailColumns = ref<TableInstanceColumns[]>([
|
||||||
|
{ title: '称重次数', dataIndex: 'weightTime' },
|
||||||
|
{ title: '物料名称', dataIndex: 'materialName' },
|
||||||
|
{ title: '数量', dataIndex: 'quantity' },
|
||||||
|
{ title: '重量', dataIndex: 'weight', slotName: 'weight' },
|
||||||
|
{ title: '计算重量', dataIndex: 'calculatedWeight', slotName: 'calculatedWeight' },
|
||||||
|
{ title: '抓拍图片', dataIndex: 'imgUrl', slotName: 'imgUrl' }
|
||||||
|
])
|
||||||
|
|
||||||
|
// 详情
|
||||||
|
const onDetail = async (record: WorkOrderResp) => {
|
||||||
|
detailLoading.value = true
|
||||||
|
detailModalVisible.value = true
|
||||||
|
detailData.value = []
|
||||||
|
|
||||||
|
getWorkOrderInfos(record.id).then(res => {
|
||||||
|
if (res.code == '0') {
|
||||||
|
detailData.value = res.data;
|
||||||
|
detailLoading.value = false
|
||||||
|
} else {
|
||||||
|
Message.error('获取详情失败')
|
||||||
|
}
|
||||||
|
});
|
||||||
|
};
|
||||||
|
|
||||||
|
// 删除
|
||||||
|
const onDeleteOne = (id) => {
|
||||||
|
return handleDelete(() => deleteWorkOrder(id), {
|
||||||
|
content: `是否确定删除该条数据?`,
|
||||||
|
showModal: true
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
// 删除
|
||||||
|
const onDelete = () => {
|
||||||
|
if (!selectedKeys.value.length) {
|
||||||
|
return Message.warning('请选择数据')
|
||||||
|
}
|
||||||
|
return handleDelete(() => deleteWorkOrder(selectedKeys.value), {
|
||||||
|
content: `是否确定删除选中的 ${selectedKeys.value.length} 条数据?`,
|
||||||
|
showModal: true
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
// 导出
|
||||||
|
const onExport = () => {
|
||||||
|
useDownload(() => exportWorkOrder(queryForm))
|
||||||
|
}
|
||||||
|
|
||||||
|
// 打印
|
||||||
|
const onPrint = (record: WorkOrderResp) => {
|
||||||
|
// 跳转到标签打印页面,并传递数据
|
||||||
|
router.push({
|
||||||
|
path: '/print',
|
||||||
|
query: {
|
||||||
|
workerOrderId: record.id,
|
||||||
|
}
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style scoped lang="scss">
|
||||||
|
.no-data {
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
padding: 40px 0;
|
||||||
|
color: var(--color-text-4);
|
||||||
|
|
||||||
|
p {
|
||||||
|
margin-top: 16px;
|
||||||
|
font-size: 14px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</style>
|
||||||
Reference in New Issue
Block a user