Merge branch 'dev' of ssh://git.online.zzfzyc.com:10022/mp/EShop into 样式对比
This commit is contained in:
Haiyi
commit
cafe1a6e84
77
package-lock.json
generated
77
package-lock.json
generated
@ -10,11 +10,12 @@
|
||||
"dependencies": {
|
||||
"@babel/runtime": "^7.7.7",
|
||||
"@tarojs/components": "3.3.10",
|
||||
"@tarojs/plugin-framework-react": "^3.4.11",
|
||||
"@tarojs/plugin-framework-react": "^3.4.12",
|
||||
"@tarojs/react": "3.3.10",
|
||||
"@tarojs/runtime": "3.3.10",
|
||||
"@tarojs/taro": "3.3.10",
|
||||
"big.js": "^6.1.1",
|
||||
"dayjs": "^1.11.3",
|
||||
"qs": "^6.10.3",
|
||||
"react": "^17.0.0",
|
||||
"react-dom": "^17.0.0",
|
||||
@ -3314,33 +3315,33 @@
|
||||
}
|
||||
},
|
||||
"node_modules/@tarojs/plugin-framework-react": {
|
||||
"version": "3.4.11",
|
||||
"resolved": "https://registry.npmmirror.com/@tarojs/plugin-framework-react/-/plugin-framework-react-3.4.11.tgz",
|
||||
"integrity": "sha512-eurnK1trU8JMkBlk3Mr0eKgLfiEF7dtkctnioyMgcuTfBIuI0TDXECidlhtSp5vJ2DkncuH1d+3abEgx8Nc8rw==",
|
||||
"version": "3.4.12",
|
||||
"resolved": "https://registry.npmmirror.com/@tarojs/plugin-framework-react/-/plugin-framework-react-3.4.12.tgz",
|
||||
"integrity": "sha512-kc03rvuotgQ2q7gYM9rjy7IV1tjT4ZcbdfdVs2e7olpdXcY9d4x1OqF3vYy+FT/f6WXgf/xs7cBa8Btw3J44iQ==",
|
||||
"dependencies": {
|
||||
"@pmmmwh/react-refresh-webpack-plugin": "0.4.3",
|
||||
"@prefresh/webpack": "^3.2.3",
|
||||
"@tarojs/runtime": "3.4.11",
|
||||
"@tarojs/shared": "3.4.11",
|
||||
"@tarojs/runtime": "3.4.12",
|
||||
"@tarojs/shared": "3.4.12",
|
||||
"acorn": "^8.0.4",
|
||||
"acorn-walk": "^8.0.0"
|
||||
}
|
||||
},
|
||||
"node_modules/@tarojs/plugin-framework-react/node_modules/@tarojs/runtime": {
|
||||
"version": "3.4.11",
|
||||
"resolved": "https://registry.npmmirror.com/@tarojs/runtime/-/runtime-3.4.11.tgz",
|
||||
"integrity": "sha512-vcr0Uo+K0rKR8LjXaFfqx9yYReejcvJ0HV6xly8KQxhP2Y4xmZrrhpeIYaOg97xqqtgKV+ama9NSgXa/kOeoBg==",
|
||||
"version": "3.4.12",
|
||||
"resolved": "https://registry.npmmirror.com/@tarojs/runtime/-/runtime-3.4.12.tgz",
|
||||
"integrity": "sha512-4bQIXoiMRQa0xzma4nm4MAmLpPtcZLOalmW/X8WtPjAVqENZ8o3FE2lZMHjhv62HhvyHf+XZWWk/V+VzAhjcGQ==",
|
||||
"dependencies": {
|
||||
"@tarojs/shared": "3.4.11",
|
||||
"@tarojs/shared": "3.4.12",
|
||||
"inversify": "5.1.1",
|
||||
"lodash-es": "4.17.15",
|
||||
"reflect-metadata": "^0.1.13"
|
||||
}
|
||||
},
|
||||
"node_modules/@tarojs/plugin-framework-react/node_modules/@tarojs/shared": {
|
||||
"version": "3.4.11",
|
||||
"resolved": "https://registry.npmmirror.com/@tarojs/shared/-/shared-3.4.11.tgz",
|
||||
"integrity": "sha512-fQ/XccyLQYBPmynIiW8lOm3xXX40uV3TnZZIPuiwGgpApurVabSRlCa5HBeoI3qnTH92tHJon86ojOduaLHVPQ=="
|
||||
"version": "3.4.12",
|
||||
"resolved": "https://registry.npmmirror.com/@tarojs/shared/-/shared-3.4.12.tgz",
|
||||
"integrity": "sha512-ELpEOA7Uzr5rQujfSmVS+ugTO22ZP8j3vi2AfrwJKg7zit1kZcBnDUIsN6+3Es3Vnp1oXsyQobWrgn30xYt2Ug=="
|
||||
},
|
||||
"node_modules/@tarojs/plugin-framework-react/node_modules/acorn": {
|
||||
"version": "8.7.1",
|
||||
@ -7585,6 +7586,11 @@
|
||||
"whatwg-url": "^7.0.0"
|
||||
}
|
||||
},
|
||||
"node_modules/dayjs": {
|
||||
"version": "1.11.3",
|
||||
"resolved": "https://registry.npmmirror.com/dayjs/-/dayjs-1.11.3.tgz",
|
||||
"integrity": "sha512-xxwlswWOlGhzgQ4TKzASQkUhqERI3egRNqgV4ScR8wlANA/A9tZ7miXa44vTTKEq5l7vWoL5G57bG3zA+Kow0A=="
|
||||
},
|
||||
"node_modules/debug": {
|
||||
"version": "2.6.9",
|
||||
"resolved": "https://registry.npmjs.org/debug/-/debug-2.6.9.tgz",
|
||||
@ -15250,9 +15256,9 @@
|
||||
"license": "MIT"
|
||||
},
|
||||
"node_modules/preact": {
|
||||
"version": "10.7.3",
|
||||
"resolved": "https://registry.npmmirror.com/preact/-/preact-10.7.3.tgz",
|
||||
"integrity": "sha512-giqJXP8VbtA1tyGa3f1n9wiN7PrHtONrDyE3T+ifjr/tTkg+2N4d/6sjC9WyJKv8wM7rOYDveqy5ZoFmYlwo4w==",
|
||||
"version": "10.8.2",
|
||||
"resolved": "https://registry.npmmirror.com/preact/-/preact-10.8.2.tgz",
|
||||
"integrity": "sha512-AKGt0BsDSiAYzVS78jZ9qRwuorY2CoSZtf1iOC6gLb/3QyZt+fLT09aYJBjRc/BEcRc4j+j3ggERMdNE43i1LQ==",
|
||||
"peer": true
|
||||
},
|
||||
"node_modules/prelude-ls": {
|
||||
@ -18592,7 +18598,7 @@
|
||||
},
|
||||
"node_modules/tarojs": {
|
||||
"version": "2.1.1",
|
||||
"resolved": "https://registry.npmmirror.com/tarojs/-/tarojs-2.1.1.tgz",
|
||||
"resolved": "https://registry.npmjs.org/tarojs/-/tarojs-2.1.1.tgz",
|
||||
"integrity": "sha512-5wJ2fuiA6Fk/9zr76ZPrsJAe6UXI66gHbtwOWaxjrJZetRurfxDZUUw6wkSZB/ZxAhVhWlv9PMuNc7DlB+rtsA=="
|
||||
},
|
||||
"node_modules/terser": {
|
||||
@ -23048,33 +23054,33 @@
|
||||
}
|
||||
},
|
||||
"@tarojs/plugin-framework-react": {
|
||||
"version": "3.4.11",
|
||||
"resolved": "https://registry.npmmirror.com/@tarojs/plugin-framework-react/-/plugin-framework-react-3.4.11.tgz",
|
||||
"integrity": "sha512-eurnK1trU8JMkBlk3Mr0eKgLfiEF7dtkctnioyMgcuTfBIuI0TDXECidlhtSp5vJ2DkncuH1d+3abEgx8Nc8rw==",
|
||||
"version": "3.4.12",
|
||||
"resolved": "https://registry.npmmirror.com/@tarojs/plugin-framework-react/-/plugin-framework-react-3.4.12.tgz",
|
||||
"integrity": "sha512-kc03rvuotgQ2q7gYM9rjy7IV1tjT4ZcbdfdVs2e7olpdXcY9d4x1OqF3vYy+FT/f6WXgf/xs7cBa8Btw3J44iQ==",
|
||||
"requires": {
|
||||
"@pmmmwh/react-refresh-webpack-plugin": "0.4.3",
|
||||
"@prefresh/webpack": "^3.2.3",
|
||||
"@tarojs/runtime": "3.4.11",
|
||||
"@tarojs/shared": "3.4.11",
|
||||
"@tarojs/runtime": "3.4.12",
|
||||
"@tarojs/shared": "3.4.12",
|
||||
"acorn": "^8.0.4",
|
||||
"acorn-walk": "^8.0.0"
|
||||
},
|
||||
"dependencies": {
|
||||
"@tarojs/runtime": {
|
||||
"version": "3.4.11",
|
||||
"resolved": "https://registry.npmmirror.com/@tarojs/runtime/-/runtime-3.4.11.tgz",
|
||||
"integrity": "sha512-vcr0Uo+K0rKR8LjXaFfqx9yYReejcvJ0HV6xly8KQxhP2Y4xmZrrhpeIYaOg97xqqtgKV+ama9NSgXa/kOeoBg==",
|
||||
"version": "3.4.12",
|
||||
"resolved": "https://registry.npmmirror.com/@tarojs/runtime/-/runtime-3.4.12.tgz",
|
||||
"integrity": "sha512-4bQIXoiMRQa0xzma4nm4MAmLpPtcZLOalmW/X8WtPjAVqENZ8o3FE2lZMHjhv62HhvyHf+XZWWk/V+VzAhjcGQ==",
|
||||
"requires": {
|
||||
"@tarojs/shared": "3.4.11",
|
||||
"@tarojs/shared": "3.4.12",
|
||||
"inversify": "5.1.1",
|
||||
"lodash-es": "4.17.15",
|
||||
"reflect-metadata": "^0.1.13"
|
||||
}
|
||||
},
|
||||
"@tarojs/shared": {
|
||||
"version": "3.4.11",
|
||||
"resolved": "https://registry.npmmirror.com/@tarojs/shared/-/shared-3.4.11.tgz",
|
||||
"integrity": "sha512-fQ/XccyLQYBPmynIiW8lOm3xXX40uV3TnZZIPuiwGgpApurVabSRlCa5HBeoI3qnTH92tHJon86ojOduaLHVPQ=="
|
||||
"version": "3.4.12",
|
||||
"resolved": "https://registry.npmmirror.com/@tarojs/shared/-/shared-3.4.12.tgz",
|
||||
"integrity": "sha512-ELpEOA7Uzr5rQujfSmVS+ugTO22ZP8j3vi2AfrwJKg7zit1kZcBnDUIsN6+3Es3Vnp1oXsyQobWrgn30xYt2Ug=="
|
||||
},
|
||||
"acorn": {
|
||||
"version": "8.7.1",
|
||||
@ -26201,6 +26207,11 @@
|
||||
"whatwg-url": "^7.0.0"
|
||||
}
|
||||
},
|
||||
"dayjs": {
|
||||
"version": "1.11.3",
|
||||
"resolved": "https://registry.npmmirror.com/dayjs/-/dayjs-1.11.3.tgz",
|
||||
"integrity": "sha512-xxwlswWOlGhzgQ4TKzASQkUhqERI3egRNqgV4ScR8wlANA/A9tZ7miXa44vTTKEq5l7vWoL5G57bG3zA+Kow0A=="
|
||||
},
|
||||
"debug": {
|
||||
"version": "2.6.9",
|
||||
"resolved": "https://registry.npmjs.org/debug/-/debug-2.6.9.tgz",
|
||||
@ -31757,9 +31768,9 @@
|
||||
"dev": true
|
||||
},
|
||||
"preact": {
|
||||
"version": "10.7.3",
|
||||
"resolved": "https://registry.npmmirror.com/preact/-/preact-10.7.3.tgz",
|
||||
"integrity": "sha512-giqJXP8VbtA1tyGa3f1n9wiN7PrHtONrDyE3T+ifjr/tTkg+2N4d/6sjC9WyJKv8wM7rOYDveqy5ZoFmYlwo4w==",
|
||||
"version": "10.8.2",
|
||||
"resolved": "https://registry.npmmirror.com/preact/-/preact-10.8.2.tgz",
|
||||
"integrity": "sha512-AKGt0BsDSiAYzVS78jZ9qRwuorY2CoSZtf1iOC6gLb/3QyZt+fLT09aYJBjRc/BEcRc4j+j3ggERMdNE43i1LQ==",
|
||||
"peer": true
|
||||
},
|
||||
"prelude-ls": {
|
||||
@ -34188,7 +34199,7 @@
|
||||
},
|
||||
"tarojs": {
|
||||
"version": "2.1.1",
|
||||
"resolved": "https://registry.npmmirror.com/tarojs/-/tarojs-2.1.1.tgz",
|
||||
"resolved": "https://registry.npmjs.org/tarojs/-/tarojs-2.1.1.tgz",
|
||||
"integrity": "sha512-5wJ2fuiA6Fk/9zr76ZPrsJAe6UXI66gHbtwOWaxjrJZetRurfxDZUUw6wkSZB/ZxAhVhWlv9PMuNc7DlB+rtsA=="
|
||||
},
|
||||
"terser": {
|
||||
|
||||
@ -37,11 +37,12 @@
|
||||
"dependencies": {
|
||||
"@babel/runtime": "^7.7.7",
|
||||
"@tarojs/components": "3.3.10",
|
||||
"@tarojs/plugin-framework-react": "^3.4.11",
|
||||
"@tarojs/plugin-framework-react": "^3.4.12",
|
||||
"@tarojs/react": "3.3.10",
|
||||
"@tarojs/runtime": "3.3.10",
|
||||
"@tarojs/taro": "3.3.10",
|
||||
"big.js": "^6.1.1",
|
||||
"dayjs": "^1.11.3",
|
||||
"qs": "^6.10.3",
|
||||
"react": "^17.0.0",
|
||||
"react-dom": "^17.0.0",
|
||||
|
||||
@ -23,14 +23,14 @@
|
||||
"useStaticServer": true,
|
||||
"showES6CompileOption": false,
|
||||
"checkInvalidKey": true,
|
||||
"compileHotReLoad": true,
|
||||
"babelSetting": {
|
||||
"ignore": [],
|
||||
"disablePlugins": [],
|
||||
"outputPath": ""
|
||||
},
|
||||
"disableUseStrict": false,
|
||||
"useCompilerPlugins": false,
|
||||
"minifyWXML": true
|
||||
"useCompilerPlugins": false
|
||||
},
|
||||
"compileType": "miniprogram",
|
||||
"libVersion": "2.24.5",
|
||||
|
||||
13
src/api/cdn.ts
Normal file
13
src/api/cdn.ts
Normal file
@ -0,0 +1,13 @@
|
||||
import { useRequest } from "@/use/useHttp"
|
||||
|
||||
|
||||
/**
|
||||
* 获取cdn 签名/密钥
|
||||
* @returns
|
||||
*/
|
||||
export const GetSignApi = () => {
|
||||
return useRequest({
|
||||
url: `/v1/mall/cdn/token`,
|
||||
method: "get"
|
||||
})
|
||||
}
|
||||
34
src/api/certification.ts
Normal file
34
src/api/certification.ts
Normal file
@ -0,0 +1,34 @@
|
||||
import { useRequest } from "@/use/useHttp"
|
||||
|
||||
/**
|
||||
* 企业认证信息获取
|
||||
* @returns
|
||||
*/
|
||||
export const certificationDetailApi = () => {
|
||||
return useRequest({
|
||||
url: `/v1/mall/company/authentication`,
|
||||
method: "get",
|
||||
})
|
||||
}
|
||||
|
||||
/**
|
||||
* 企业认证信息提交
|
||||
* @returns
|
||||
*/
|
||||
export const certificationSaveApi = () => {
|
||||
return useRequest({
|
||||
url: `/v1/mall/company/authentication`,
|
||||
method: "put",
|
||||
})
|
||||
}
|
||||
|
||||
/**
|
||||
* 企业认证类型枚举列表
|
||||
* @returns
|
||||
*/
|
||||
export const certificationTypeListApi = () => {
|
||||
return useRequest({
|
||||
url: `/v1/mall/enum/companyAuthenticationType`,
|
||||
method: "get",
|
||||
})
|
||||
}
|
||||
@ -21,36 +21,3 @@ import { useRequest } from "@/use/useHttp"
|
||||
method: "put",
|
||||
})
|
||||
}
|
||||
|
||||
/**
|
||||
* 地址详情
|
||||
* @returns
|
||||
*/
|
||||
export const addressDetailApi = () => {
|
||||
return useRequest({
|
||||
url: `/v1/mall/address`,
|
||||
method: "get",
|
||||
})
|
||||
}
|
||||
|
||||
/**
|
||||
* 地址编辑
|
||||
* @returns
|
||||
*/
|
||||
export const addressEditApi = () => {
|
||||
return useRequest({
|
||||
url: `/v1/mall/address`,
|
||||
method: "put",
|
||||
})
|
||||
}
|
||||
|
||||
/**
|
||||
* 地址删除
|
||||
* @returns
|
||||
*/
|
||||
export const addressDeleteApi = () => {
|
||||
return useRequest({
|
||||
url: `/v1/mall/address`,
|
||||
method: "delete",
|
||||
})
|
||||
}
|
||||
|
||||
@ -55,3 +55,14 @@ export const GetLabProductApi = () => {
|
||||
method: "get",
|
||||
})
|
||||
}
|
||||
|
||||
/**
|
||||
* 收藏面料
|
||||
* @returns
|
||||
*/
|
||||
// export const GetProductDetailApi = () => {
|
||||
// return useRequest({
|
||||
// url: `/v1/mall/product`,
|
||||
// method: "get",
|
||||
// })
|
||||
// }
|
||||
|
||||
12
src/api/mine.ts
Normal file
12
src/api/mine.ts
Normal file
@ -0,0 +1,12 @@
|
||||
import { useRequest } from "@/use/useHttp"
|
||||
|
||||
/**
|
||||
* 获取用户资产
|
||||
* @returns
|
||||
*/
|
||||
export const userassets = () => {
|
||||
return useRequest({
|
||||
url: `/v1/mall/user/assets`,
|
||||
method: "get",
|
||||
})
|
||||
}
|
||||
@ -90,3 +90,13 @@ export const SaleOrderApi = () => {
|
||||
method: "put",
|
||||
})
|
||||
}
|
||||
|
||||
/**
|
||||
* 确认收货
|
||||
*/
|
||||
export const ReceiveOrderApi = () => {
|
||||
return useRequest({
|
||||
url: `/v1/mall/saleOrder/receive`,
|
||||
method: "put",
|
||||
})
|
||||
}
|
||||
@ -1,7 +1,7 @@
|
||||
import { useRequest } from "@/use/useHttp"
|
||||
|
||||
/**
|
||||
* 获取订单支付方式信息
|
||||
* 获取应收单订单支付方式信息
|
||||
*/
|
||||
export const GetOrderPayApi = () => {
|
||||
return useRequest({
|
||||
@ -11,7 +11,7 @@ import { useRequest } from "@/use/useHttp"
|
||||
}
|
||||
|
||||
/**
|
||||
* 订单支付提交
|
||||
* 应收单订单支付提交
|
||||
*/
|
||||
export const SubmitOrderPayApi = () => {
|
||||
return useRequest({
|
||||
@ -19,3 +19,23 @@ import { useRequest } from "@/use/useHttp"
|
||||
method: "put",
|
||||
})
|
||||
}
|
||||
|
||||
/**
|
||||
* 获取预付单支付方式信息
|
||||
*/
|
||||
export const GetPrepayOrderPayApi = () => {
|
||||
return useRequest({
|
||||
url: `/v1/mall/orderPayment/preCollectOrder/orderPaymentMethodInfo`,
|
||||
method: "get",
|
||||
})
|
||||
}
|
||||
|
||||
/**
|
||||
* 预付单订单支付提交
|
||||
*/
|
||||
export const SubmitPrepayOrderPayApi = () => {
|
||||
return useRequest({
|
||||
url: `/v1/mall/orderPayment/preCollectOrder/orderPaymentSubmission`,
|
||||
method: "put",
|
||||
})
|
||||
}
|
||||
62
src/api/salesAfterOrder.ts
Normal file
62
src/api/salesAfterOrder.ts
Normal file
@ -0,0 +1,62 @@
|
||||
import { useRequest } from "@/use/useHttp"
|
||||
|
||||
/**
|
||||
* 售后订单列表
|
||||
*/
|
||||
export const GetSaleOrderListApi = () => {
|
||||
return useRequest({
|
||||
url: `/v1/mall/returnApplyOrder/list`,
|
||||
method: "get",
|
||||
})
|
||||
}
|
||||
|
||||
/**
|
||||
* 申请售后订单
|
||||
*/
|
||||
export const ReturnApplyOrderApi = () => {
|
||||
return useRequest({
|
||||
url: `/v1/mall/returnApplyOrder`,
|
||||
method: "post",
|
||||
})
|
||||
}
|
||||
|
||||
/**
|
||||
* 取消退货
|
||||
*/
|
||||
export const ReturnApplyOrderCancelApi = () => {
|
||||
return useRequest({
|
||||
url: `/v1/mall/returnApplyOrder/cancel`,
|
||||
method: "post",
|
||||
})
|
||||
}
|
||||
|
||||
/**
|
||||
* 售后订单详情
|
||||
*/
|
||||
export const SaleOrderOrderDetailApi = () => {
|
||||
return useRequest({
|
||||
url: `/v1/mall/returnApplyOrder`,
|
||||
method: "get",
|
||||
})
|
||||
}
|
||||
|
||||
/**
|
||||
* 物流上传
|
||||
*/
|
||||
export const ReturnApplyLogisticsApi = () => {
|
||||
return useRequest({
|
||||
url: `/v1/mall/returnApplyOrder/upload`,
|
||||
method: "put",
|
||||
})
|
||||
}
|
||||
|
||||
|
||||
/**
|
||||
* 售后货物状况
|
||||
*/
|
||||
export const ReturnGoodsStatusApi = () => {
|
||||
return useRequest({
|
||||
url: `/v1/mall/enum/return/goodsStatus`,
|
||||
method: "get",
|
||||
})
|
||||
}
|
||||
@ -32,3 +32,14 @@ export const DelShoppingCartApi = () => {
|
||||
method: "delete",
|
||||
})
|
||||
}
|
||||
|
||||
/**
|
||||
* 修改购物车数量
|
||||
* @returns
|
||||
*/
|
||||
export const UpdateShoppingCartApi = () => {
|
||||
return useRequest({
|
||||
url: `/v1/mall/shoppingCart/productColor`,
|
||||
method: "put",
|
||||
})
|
||||
}
|
||||
@ -39,3 +39,33 @@ import { useRequest } from "@/use/useHttp"
|
||||
method: "put",
|
||||
})
|
||||
}
|
||||
|
||||
/**
|
||||
* 公司类型|企业类型 下拉列表
|
||||
*/
|
||||
export const companyTypeApi = () => {
|
||||
return useRequest({
|
||||
url: `/v1/mall/enum/purchaserType`,
|
||||
method: "get",
|
||||
})
|
||||
}
|
||||
|
||||
/**
|
||||
* 头像更改
|
||||
*/
|
||||
export const portraitUpdateApi = () => {
|
||||
return useRequest({
|
||||
url: `/v1/mall/user/avatar`,
|
||||
method: "put",
|
||||
})
|
||||
}
|
||||
|
||||
/**
|
||||
* 绑定公司
|
||||
*/
|
||||
export const BindingCompanyApi = () => {
|
||||
return useRequest({
|
||||
url: `/v1/mall/user/binding/company`,
|
||||
method: "put",
|
||||
})
|
||||
}
|
||||
@ -96,7 +96,8 @@ export default {
|
||||
root: "pages/order",
|
||||
pages: [
|
||||
"index",
|
||||
"comfirm"
|
||||
"comfirm",
|
||||
"cutOrder/index",
|
||||
]
|
||||
},
|
||||
{
|
||||
@ -166,11 +167,16 @@ export default {
|
||||
]
|
||||
},
|
||||
{
|
||||
root: "pages/sampleComparison",
|
||||
root: "pages/applyAfterSales",
|
||||
pages: [
|
||||
"index",
|
||||
]
|
||||
},
|
||||
|
||||
{
|
||||
root: "pages/collection",
|
||||
pages: [
|
||||
"index",
|
||||
]
|
||||
}
|
||||
]
|
||||
}
|
||||
|
||||
@ -21,7 +21,6 @@ export const UPLOAD_CDN_URL = `https://v0.api.upyun.com/`
|
||||
// cdn
|
||||
export const IMG_CND_Prefix = CURRENT_ENV.includes('development')? "https://test.cdn.zzfzyc.com":"https://cdn.zzfzyc.com"
|
||||
|
||||
|
||||
// 上传图片视频
|
||||
export const CDN_UPLOAD_IMG = `${UPLOAD_CDN_URL || ''}`;
|
||||
|
||||
|
||||
@ -1,10 +1,12 @@
|
||||
|
||||
//订单状态枚举
|
||||
export const ORDER_STATUS = {
|
||||
SaleorderstatusWaitingPrePayment : {value:10, label:'预付款'}, // 预付款
|
||||
SaleOrderStatusBooking : {value:0, label:'待接单'}, // 待接单
|
||||
SaleOrderStatusArranging : {value:1, label:'配布中'}, // 配布中
|
||||
SaleOrderStatusArranged : {value:2, label:'已配布'}, // 已配布
|
||||
SaleOrderStatusWaitingPayment : {value:7, label:'待付款'}, // 待付款
|
||||
SaleOrderStatusTaking: {value: 11, label:'提货中'}, //提货中
|
||||
SaleOrderStatusWaitingDelivery : {value:3, label:'待发货'}, // 待发货
|
||||
SaleOrderStatusWaitingReceipt : {value:8, label:'待收货'}, // 待收货
|
||||
SaleOrderStatusAlreadyReceipt : {value:9, label:'已收货'}, // 已收货
|
||||
@ -15,24 +17,33 @@ export const ORDER_STATUS = {
|
||||
|
||||
//售后单状态枚举
|
||||
export const AFTER_ORDER_STATUS = {
|
||||
SaleOrderStatusBooking : {value:0, label:'申请中'},
|
||||
SaleOrderStatusArranging : {value:1, label:'退货中'},
|
||||
SaleOrderStatusArranged : {value:2, label:'待验布'},
|
||||
SaleOrderStatusWaitingPayment : {value:7, label:'退款中'},
|
||||
SaleOrderStatusWaitingDelivery : {value:3, label:'已退款'},
|
||||
SaleOrderStatusWaitingReceipt : {value:8, label:'已取消'},
|
||||
SaleOrderStatusAlreadyReceipt : {value:9, label:'已拒绝'},
|
||||
ReturnStageApplying : {value:0, label:'申请中'}, // 申请中
|
||||
ReturnStageWaitCheck : {value:1, label:'退货中'}, // 退货中
|
||||
ReturnStageChecked : {value:2, label:'待验布'}, // 待验布
|
||||
ReturnStageReturned : {value:3, label:'已退款'}, // 已退款
|
||||
ReturnStageCancel : {value:4, label:'已取消'}, // 已取消
|
||||
ReturnStageQualityCheckPendingRefund : {value:5, label:'待退款'}, // 待退款-质检
|
||||
ReturnStageServiceOrderPendingRefund : {value:6, label:'待退款'}, // 待退款
|
||||
ReturnStageRejected : {value:7, label:'已拒绝'}, // 已拒绝
|
||||
}
|
||||
|
||||
//支付方式
|
||||
export const PAYMENT_METHOD = {
|
||||
PaymentMethodPreDeposit: {value:1, label:'预存款'},
|
||||
PaymentMethodAccountPeriod : {value:2, label:'账期'},
|
||||
PaymentMethodofflineRemittance: {value:3, label:'线下汇款'},
|
||||
PaymentMethodScanCodeToPay: {value:4, label:'扫码支付'},
|
||||
PaymentMethodCashOnDelivery: {value:5, label:'货到付款'},
|
||||
PaymentMethodofflineRemittance: {value:0, label:'线下汇款'},
|
||||
PaymentMethodScanCodeToPay: {value:3, label:'扫码支付'},
|
||||
PaymentMethodCashOnDelivery: {value:4, label:'货到付款'},
|
||||
}
|
||||
export type PAYMENT_METHOD_PARAM = 0|1|2|3|4
|
||||
|
||||
|
||||
//订单类型
|
||||
export const SALE_MODE = {
|
||||
SaLeModeBulk: {value:0, label:'大货'},
|
||||
SaleModeLengthCut: {value:1, label:'剪版'},
|
||||
SaLeModeWeightCut: {value:2, label:'散剪'},
|
||||
}
|
||||
export type PAYMENT_METHOD_PARAM = 1|2|3|4|5
|
||||
|
||||
//分享场景枚举
|
||||
export const SHARE_SCENE = {
|
||||
|
||||
@ -142,5 +142,22 @@ export const toDecimal2 = (x) => {
|
||||
* @returns
|
||||
*/
|
||||
export const formatImgUrl = (url, suffix="!w200") => {
|
||||
return url?IMG_CND_Prefix + url + suffix:'https://cdn.zzfzyc.com/mall/no_img.png'
|
||||
return url?IMG_CND_Prefix + url + suffix:IMG_CND_Prefix +'/mall/no_img.png'
|
||||
}
|
||||
|
||||
/**
|
||||
*
|
||||
* @param {纹理图} imgurl
|
||||
* @param {rgb} rgb
|
||||
* @param {} suffix
|
||||
* @returns 1 有纹理图，2 有rgb 3默认图
|
||||
*/
|
||||
export const isLabImage = (imgurl, rgb, suffix="!w200") => {
|
||||
if(imgurl) {
|
||||
return {status:1, value: IMG_CND_Prefix+'/'+imgurl+suffix}
|
||||
} else if(rgb.r != 0 || rgb.g != 0 || rgb.b != 0) {
|
||||
return {status:2, value: rgb}
|
||||
} else {
|
||||
return {status:3, value: IMG_CND_Prefix+'/mall/no_img.png'}
|
||||
}
|
||||
}
|
||||
@ -1,150 +0,0 @@
|
||||
import Taro from '@tarojs/taro';
|
||||
import { GET_UPLOAD_SIGN, CDN_UPLOAD_IMG, UPLOAD_CDN_URL } from './constant'
|
||||
|
||||
import { GetSignApi } from '@/api/cdn'
|
||||
|
||||
|
||||
const { fetchData: GetSign, success, data: resData, msg, code } = GetSignApi()
|
||||
|
||||
|
||||
// 上传图片 获取auth，Policy
|
||||
/*
|
||||
scene 场景值，区分上传文件的根路径
|
||||
type 类型值，区分上传业务bucket
|
||||
*/
|
||||
const getSecret = (scene, type) => {
|
||||
return new Promise(async (resolve, reject) => {
|
||||
|
||||
const SAVE_PATH = `/${scene}/{filemd5}{day}{hour}{min}{sec}{.suffix}`;
|
||||
|
||||
|
||||
let params = {
|
||||
'method': 'post',
|
||||
'save_key': SAVE_PATH
|
||||
}
|
||||
|
||||
// 获取签名
|
||||
await GetSign(params)
|
||||
if (success.value) {
|
||||
// console.log('返回签名',resData.value);
|
||||
resolve(resData.value)
|
||||
} else {
|
||||
reject({
|
||||
code: code.value || '9999',
|
||||
msg: msg.value
|
||||
});
|
||||
}
|
||||
|
||||
})
|
||||
}
|
||||
const getFileType = (name) => {
|
||||
if (!name) return false;
|
||||
var imgType = ["gif", "jpeg", "jpg", "bmp", "png"];
|
||||
var videoType = ["avi", "wmv", "mkv", "mp4", "mov", "rm", "3gp", "flv", "mpg", "rmvb", "quicktime"];
|
||||
|
||||
if (RegExp("\.?(" + imgType.join("|") + ")$", "i").test(name.toLowerCase())) {
|
||||
return 'image';
|
||||
} else if (RegExp("\.(" + videoType.join("|") + ")$", "i").test(name.toLowerCase())) {
|
||||
return 'video';
|
||||
} else {
|
||||
return false;
|
||||
}
|
||||
}
|
||||
|
||||
const upYunbucket = (type) => {
|
||||
var bucket = ""
|
||||
switch (type) {
|
||||
case "product":
|
||||
bucket = "testzzfzyc"
|
||||
break;
|
||||
}
|
||||
return bucket
|
||||
}
|
||||
|
||||
|
||||
/**
|
||||
*
|
||||
* @param {*} file 传入文件
|
||||
* @param {String} secene 传入 'product'
|
||||
* @param {String} type 传入 'product'
|
||||
* @returns
|
||||
*/
|
||||
const uploadCDNImg = (file, secene, type) => {
|
||||
// var file = event.target.files[0];
|
||||
// var filetype = file.type
|
||||
let filetype = file.tempFilePath
|
||||
|
||||
if (!getFileType(filetype)) {
|
||||
Taro.showToast({
|
||||
title: "上传文件类型错误",
|
||||
icon: "none",
|
||||
duration: 3800
|
||||
})
|
||||
return false
|
||||
}
|
||||
return new Promise((resolve, reject, race) => {
|
||||
getSecret(secene, type)
|
||||
.then(result => {
|
||||
|
||||
console.log('bucket', result.bucket);
|
||||
var formdata = {
|
||||
'authorization': result.authorization,
|
||||
'policy': result.policy,
|
||||
// "file": file.tempFilePath,
|
||||
}
|
||||
|
||||
const uploadTask = Taro.uploadFile({
|
||||
url: `${UPLOAD_CDN_URL}${result.bucket}`,
|
||||
formData: formdata,
|
||||
filePath: file.tempFilePath,
|
||||
name: 'file',
|
||||
success: res => {
|
||||
resolve(JSON.parse(`${res.data}`))
|
||||
},
|
||||
fail: err => {
|
||||
console.log(err)
|
||||
reject(err)
|
||||
}
|
||||
})
|
||||
|
||||
uploadTask.progress(res => {
|
||||
console.log('上传进度', res.progress);
|
||||
if (res.progress < 100) {
|
||||
Taro.showLoading({
|
||||
title: '上传中...'
|
||||
})
|
||||
} else {
|
||||
Taro.hideLoading()
|
||||
}
|
||||
})
|
||||
})
|
||||
.catch(result => {
|
||||
reject(result)
|
||||
Taro.showToast({
|
||||
title: "获取密钥失败！",
|
||||
icon: "none",
|
||||
duration: 3800
|
||||
})
|
||||
})
|
||||
})
|
||||
}
|
||||
|
||||
const taroChooseImg = () => {
|
||||
Taro.chooseImage({
|
||||
count: 1,
|
||||
sizeType: ['original', 'compressed'], // 可以指定是原图还是压缩图，默认二者都有
|
||||
sourceType: ['album', 'camera'], // 可以指定来源是相册还是相机，默认二者都有
|
||||
success: (res) => {
|
||||
console.log('res:', res)
|
||||
Taro.chooseMessageFile({
|
||||
count: 1,
|
||||
|
||||
})
|
||||
},
|
||||
fail: (err) => {
|
||||
console.log('图片选择失败：', err)
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
export default uploadCDNImg
|
||||
@ -89,7 +89,7 @@
|
||||
font-weight: 400;
|
||||
color: #ffffff;
|
||||
display: flex;align-items: center;justify-content: center;
|
||||
position: absolute;bottom: 4%;left: 50%;
|
||||
position: absolute;bottom: 100px;left: 50%;
|
||||
transform: translateX(-50%);
|
||||
}
|
||||
.address-no-data{
|
||||
|
||||
@ -93,7 +93,7 @@ const AddressList = memo((props:Params)=>{
|
||||
{item.name}
|
||||
{
|
||||
item.is_default?<Text className="address-list-default">默认</Text>:
|
||||
<Text className="address-list-phone">{item.phone.replace(item.phone.substring(4,7), "****")}</Text>
|
||||
<Text className="address-list-phone">{item.phone.replace(item.phone.substring(3,7), "****")}</Text>
|
||||
}
|
||||
</View>
|
||||
<View className="address-list-bottom">
|
||||
@ -102,7 +102,7 @@ const AddressList = memo((props:Params)=>{
|
||||
{/* {item.address_detail} */}
|
||||
</View>
|
||||
{
|
||||
item.is_default&&<Text className="address-list-phone">{item.phone.replace(item.phone.substring(4,7), "****")}</Text>
|
||||
item.is_default&&<Text className="address-list-phone">{item.phone.replace(item.phone.substring(3,7), "****")}</Text>
|
||||
}
|
||||
</View>
|
||||
<Navigator onClick={e=>e.stopPropagation()} url={`/pages/addressAdd/index?type=edit&id=${item.id}`} hoverClass="none" className="address-edit">
|
||||
|
||||
@ -9,9 +9,9 @@
|
||||
font-size: 28px;
|
||||
font-weight: 400;
|
||||
color: #000000;
|
||||
margin-top: 20px;
|
||||
width: 150px;
|
||||
width: 200px;
|
||||
border-right: 1px solid #F0F0F0;
|
||||
display: flex;align-items: center;
|
||||
}
|
||||
.From-list-certification-label-required::before{
|
||||
content: "*";
|
||||
@ -19,12 +19,12 @@
|
||||
font-size: 28px;
|
||||
}
|
||||
.From-list-certification-right{
|
||||
width: 506px;
|
||||
min-width: 100px;
|
||||
flex: 1;
|
||||
font-size: 26px;
|
||||
font-weight: 400;
|
||||
}
|
||||
.From-list-certification-right-meet{
|
||||
width: 506px;
|
||||
min-height: 45px;
|
||||
border-radius: 20px;
|
||||
box-sizing: border-box;
|
||||
@ -69,6 +69,8 @@
|
||||
}
|
||||
.From-list-certification-right-placeholder{
|
||||
color: #ababab;
|
||||
text-overflow: ellipsis;overflow: hidden;white-space: nowrap;
|
||||
width: 100%;
|
||||
}
|
||||
.From-list-certification-right-enter .icon-a-moreback{
|
||||
font-size: 28px;
|
||||
|
||||
@ -14,12 +14,13 @@ interface ListParams{
|
||||
style?: object, //整行样式
|
||||
labelStyle?: object, // label样式
|
||||
contentStyle?: object,
|
||||
required?: boolean
|
||||
required?: boolean,
|
||||
showIcon?: boolean, // 是否显示右边的箭头，type=select
|
||||
}
|
||||
|
||||
// 表单列表
|
||||
const FromList = memo((props:ListParams)=>{
|
||||
const {type="input",value="",style={},labelStyle={},contentStyle={},required=false} = props;
|
||||
const {type="input",value="",style={},labelStyle={},contentStyle={},required=false,showIcon=true} = props;
|
||||
|
||||
return (
|
||||
<View style={style} className="From-list-certification">
|
||||
@ -44,7 +45,9 @@ const FromList = memo((props:ListParams)=>{
|
||||
{props.placeholder}
|
||||
</View>
|
||||
}
|
||||
<View className="From-list-certification-right-enter"><Text className="iconfont icon-a-moreback"></Text></View>
|
||||
<View className="From-list-certification-right-enter">
|
||||
{showIcon&&<Text className="iconfont icon-a-moreback"></Text>}
|
||||
</View>
|
||||
</>
|
||||
}
|
||||
</View>
|
||||
|
||||
@ -2,7 +2,7 @@
|
||||
import InfiniteScroll from "@/components/infiniteScroll"
|
||||
import { ReactNode, useEffect, useMemo, useRef, useState } from "react"
|
||||
import { dataLoadingStatus, getFilterData } from "@/common/util";
|
||||
import { isEmptyObject } from "@/common/common";
|
||||
import { alert, isEmptyObject } from "@/common/common";
|
||||
|
||||
interface Params{
|
||||
children?: ReactNode,
|
||||
@ -36,9 +36,9 @@ export default (props: Params)=>{
|
||||
page: tRefreshDataRef.page,
|
||||
size: tRefreshDataRef.size,
|
||||
});
|
||||
if(result.success){
|
||||
// 返回数据
|
||||
props.change&&props.change(result);
|
||||
if(result.success){
|
||||
if(result.data.total<=0){
|
||||
setRefreshData({
|
||||
...tRefreshDataRef,
|
||||
@ -59,6 +59,7 @@ export default (props: Params)=>{
|
||||
})
|
||||
}
|
||||
}else{
|
||||
alert.none(result.msg);
|
||||
setRefreshData({
|
||||
...tRefreshDataRef,
|
||||
refreshStatus: false,
|
||||
|
||||
17
src/components/LabAndImg/index.module.scss
Normal file
17
src/components/LabAndImg/index.module.scss
Normal file
@ -0,0 +1,17 @@
|
||||
|
||||
.labAndImg_main{
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
.boxColor{
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
border-radius: 20px;
|
||||
border:1PX solid #818181;
|
||||
}
|
||||
image{
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
border-radius: 20px;
|
||||
}
|
||||
|
||||
}
|
||||
30
src/components/LabAndImg/index.tsx
Normal file
30
src/components/LabAndImg/index.tsx
Normal file
@ -0,0 +1,30 @@
|
||||
import { formatImgUrl } from "@/common/fotmat";
|
||||
import { Image, View } from "@tarojs/components";
|
||||
import { memo, useMemo } from "react";
|
||||
import styles from './index.module.scss'
|
||||
|
||||
//该组件宽高为100%需调整外层元素宽高
|
||||
type Param = {
|
||||
value?: {
|
||||
texture_url?: string, //纹理图路径
|
||||
lab?: {l:number, a:number, b:number}, //lab
|
||||
rgb?: {r:number, g:number, b:number} //rgb
|
||||
}
|
||||
}
|
||||
export default memo(({value}:Param) => {
|
||||
//lab是否都是0
|
||||
const rgbStyle = useMemo(() => {
|
||||
if(value?.lab&&(value.lab.l||value.lab.a||value.lab.b)) {
|
||||
return {'backgroundColor':`rgb(${value.rgb?.r} ${value.rgb?.g} ${value.rgb?.b})`}
|
||||
} else {
|
||||
return null
|
||||
}
|
||||
}, [value])
|
||||
return (
|
||||
<View className={styles.labAndImg_main}>
|
||||
{value?.texture_url&&<Image mode="aspectFill" src={formatImgUrl(value?.texture_url)}></Image>}
|
||||
{(!value?.texture_url&&rgbStyle)&&<View className={styles.boxColor} style={{...rgbStyle}}></View>}
|
||||
{(!value?.texture_url&&!rgbStyle)&&<Image mode="aspectFill" src={formatImgUrl('')}></Image>}
|
||||
</View>
|
||||
)
|
||||
})
|
||||
202
src/components/afterOrderBtns/index copy.tsx
Normal file
202
src/components/afterOrderBtns/index copy.tsx
Normal file
@ -0,0 +1,202 @@
|
||||
import { CancelOrderApi, ReceiveOrderApi } from "@/api/order"
|
||||
import { alert } from "@/common/common"
|
||||
import { ORDER_STATUS, SALE_MODE } from "@/common/enum"
|
||||
import { ScrollView, Text, View } from "@tarojs/components"
|
||||
import Taro from "@tarojs/taro"
|
||||
import { useCallback, useRef, memo, useState, useEffect, useMemo } from "react"
|
||||
import styles from './index.module.scss'
|
||||
|
||||
type Param = {
|
||||
orderInfo: {
|
||||
status: number, //订单状态
|
||||
orderId: number, //订单id
|
||||
actual_amount: number, //实付金额
|
||||
wait_pay_amount: number, //待付金额
|
||||
sale_mode: number //订单类型
|
||||
}|null,
|
||||
onClick?: (val: number) => void //点击后触发的事件，返回订单状态
|
||||
}
|
||||
|
||||
export default memo(({orderInfo, onClick}:Param) => {
|
||||
//订单状态枚举
|
||||
const {
|
||||
SaleOrderStatusBooking,
|
||||
SaleOrderStatusArranging,
|
||||
SaleOrderStatusArranged,
|
||||
SaleOrderStatusWaitingDelivery,
|
||||
SaleOrderStatusComplete,
|
||||
SaleOrderStatusRefund,
|
||||
SaleOrderStatusWaitingPayment,
|
||||
SaleOrderStatusWaitingReceipt,
|
||||
SaleOrderStatusAlreadyReceipt,
|
||||
SaleorderstatusWaitingPrePayment
|
||||
} = ORDER_STATUS
|
||||
|
||||
//订单类型
|
||||
const {
|
||||
SaLeModeBulk,
|
||||
SaleModeLengthCut,
|
||||
SaLeModeWeightCut,
|
||||
} = SALE_MODE
|
||||
|
||||
//订单按钮按订单状态归类, value是该订单状态，可能该按钮会出现
|
||||
const orderBtnsList = useRef([
|
||||
{
|
||||
id: 1,
|
||||
value: [SaleOrderStatusBooking.value,
|
||||
SaleOrderStatusArranging.value,
|
||||
SaleOrderStatusArranged.value,
|
||||
SaleOrderStatusWaitingPayment.value,
|
||||
SaleOrderStatusWaitingDelivery.value], //取消订单按钮对应： 待接单，配布中，已配布, 待付款， 待发货
|
||||
label: '取消订单'
|
||||
},
|
||||
{
|
||||
id: 2,
|
||||
value: [SaleorderstatusWaitingPrePayment.value, SaleOrderStatusWaitingPayment.value, SaleOrderStatusWaitingDelivery.value, SaleOrderStatusWaitingReceipt.value, SaleOrderStatusAlreadyReceipt.value, SaleOrderStatusComplete.value], //去付款按钮对应：待付款， 待发货, 待收货, 已收货, 已完成
|
||||
label: '去付款'
|
||||
},
|
||||
{
|
||||
id: 3,
|
||||
value: [SaleOrderStatusWaitingDelivery.value], //申请退款按钮对应： 待发货
|
||||
label: '申请退款'
|
||||
},
|
||||
{
|
||||
id: 4,
|
||||
value: [SaleOrderStatusWaitingReceipt.value, SaleOrderStatusAlreadyReceipt.value, SaleOrderStatusComplete.value, SaleOrderStatusRefund.value], //取消订单按钮对应： 待收货, 已收货, 已完成, 已退款
|
||||
label: '查看物流'
|
||||
},
|
||||
{
|
||||
id: 5,
|
||||
value: [SaleOrderStatusWaitingReceipt.value, SaleOrderStatusAlreadyReceipt.value, SaleOrderStatusRefund.value], //申请退货按钮对应： 待收货, 已收货, 已退款
|
||||
label: '申请退货'
|
||||
},
|
||||
{
|
||||
id: 6,
|
||||
value: [SaleOrderStatusWaitingReceipt.value], //确认收货按钮对应： 待收货
|
||||
label: '确认收货'
|
||||
},
|
||||
{
|
||||
id: 7,
|
||||
value: [SaleOrderStatusWaitingReceipt.value,SaleOrderStatusAlreadyReceipt.value,SaleOrderStatusComplete.value,SaleOrderStatusRefund.value], //再次购买按钮对应： 待收货，已收货，已完成, 已退款
|
||||
label: '再次购买'
|
||||
},
|
||||
{
|
||||
id: 8,
|
||||
value: [SaleOrderStatusBooking.value], //按钮对应： 待接单
|
||||
label: '退款'
|
||||
},
|
||||
])
|
||||
|
||||
|
||||
//判断是否显示该按钮
|
||||
const orderBtnsShow = (item) => {
|
||||
if(orderInfo) {
|
||||
if(item.id == 1) {
|
||||
//取消订单按钮
|
||||
return( orderInfo.actual_amount == 0 && item.value.includes(orderInfo.status)) //在待发货之前没有付过款
|
||||
} else if (item.id == 2) {
|
||||
//去付款按钮
|
||||
return( orderInfo.wait_pay_amount != 0 && item.value.includes(orderInfo.status)) //只要没有付完款就显示
|
||||
} else if(item.id == 3 ) {
|
||||
//申请退款, 只有大货才有
|
||||
return (orderInfo.sale_mode == SaLeModeBulk.value && orderInfo.actual_amount != 0 && item.value.includes(orderInfo.status)) //大货在待发货付过款
|
||||
} else if( item.id == 8) {
|
||||
//退款按钮（直接退款不用申请）, 只有散剪和剪板有
|
||||
return (orderInfo.sale_mode != SaLeModeBulk.value && orderInfo.actual_amount != 0 && item.value.includes(orderInfo.status)) //散剪和剪板在待接单时付过款
|
||||
}
|
||||
else {
|
||||
//其他按钮
|
||||
return item.value.includes(orderInfo.status)
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
//显示的按钮数组
|
||||
const orderBtnsShowList: {id: number, value: any, label: string}[] = useMemo(() => {
|
||||
return orderBtnsList.current.filter(item => {
|
||||
return orderBtnsShow(item)
|
||||
})
|
||||
}, [orderInfo])
|
||||
|
||||
|
||||
|
||||
//点击按钮操作
|
||||
const submitBtns = (val, index) => {
|
||||
(val == 1)&&cancelOrder(); //取消订单按钮
|
||||
(val == 2)&&onClick?.(2); //去付款按钮
|
||||
(val == 6)&&receiveOrder(); //确认收货
|
||||
|
||||
}
|
||||
|
||||
//取消订单
|
||||
const {fetchData: cancelFetchData} = CancelOrderApi()
|
||||
const cancelOrder = () => {
|
||||
Taro.showModal({
|
||||
title: '要取消该订单吗？',
|
||||
success: async function (res) {
|
||||
if (res.confirm) {
|
||||
let res = await cancelFetchData({id: orderInfo?.orderId})
|
||||
if(res.success) {
|
||||
alert.success('取消成功')
|
||||
onClick?.(1)
|
||||
} else {
|
||||
alert.none(res.msg)
|
||||
}
|
||||
} else if (res.cancel) {
|
||||
console.log('用户点击取消')
|
||||
}
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
//确认订单
|
||||
const {fetchData: receiveOrderFetchData} = ReceiveOrderApi()
|
||||
const receiveOrder = async () => {
|
||||
console.log('123456')
|
||||
Taro.showModal({
|
||||
title: '确定收货？',
|
||||
success: async function (res) {
|
||||
if (res.confirm) {
|
||||
let res = await receiveOrderFetchData({sale_order_id: orderInfo?.orderId})
|
||||
if(res.success){
|
||||
onClick?.(6)
|
||||
alert.success('收货成功')
|
||||
} else {
|
||||
alert.error('收货失败')
|
||||
}
|
||||
} else if (res.cancel) {
|
||||
console.log('用户点击取消')
|
||||
}
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
//显示更多按钮
|
||||
const [showMore, setShowMore] = useState(false)
|
||||
const styleTop = useMemo(() => {
|
||||
return {top:`-${(orderBtnsShowList.length - 3)*70 + 10}rpx`, left: `-${10}rpx`}
|
||||
}, [orderBtnsShowList])
|
||||
|
||||
return (
|
||||
<View className={styles.btns_list}>
|
||||
{(orderBtnsShowList.length > 3)&&<View className={styles.more}>
|
||||
<Text onClick={() => setShowMore(true)}>更多</Text>
|
||||
{showMore&&<View className={styles.more_con}>
|
||||
<View className={styles.more_list} style={styleTop}>
|
||||
{orderBtnsShowList.map((item, index) => {
|
||||
return ((index >= 3) &&<View className={styles.more_item} key={item.id} onClick={() => submitBtns(item.id, index)}>{item.label}</View>)
|
||||
})}
|
||||
</View>
|
||||
<View className={styles.more_bg} catchMove onClick={() => setShowMore(false)}></View>
|
||||
</View>}
|
||||
</View>}
|
||||
|
||||
<View className={styles.list_scroll}>
|
||||
{orderBtnsShowList.map((item, index) =>
|
||||
(index < 3)&&<View key={item.id} className={styles.btns_item} onClick={() => submitBtns(item.id, index)}>{item.label}</View>
|
||||
)}
|
||||
</View>
|
||||
|
||||
</View>
|
||||
)
|
||||
})
|
||||
87
src/components/afterOrderBtns/index.module.scss
Normal file
87
src/components/afterOrderBtns/index.module.scss
Normal file
@ -0,0 +1,87 @@
|
||||
.btns_list{
|
||||
width: 100%;
|
||||
// margin-top: 30px;
|
||||
display: flex;
|
||||
align-content: center;
|
||||
.more{
|
||||
font-size: 28px;
|
||||
width: 143px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
color: $color_font_two;
|
||||
padding-left: 20px;
|
||||
position: relative;
|
||||
|
||||
.more_list{
|
||||
position: absolute;
|
||||
background-color: #fff;
|
||||
width: 226px;
|
||||
box-shadow: 0px 0px 20px 0px rgba(0,0,0,0.06);
|
||||
border-radius: 10px;
|
||||
padding: 0 20px;
|
||||
box-sizing: border-box;
|
||||
z-index:999;
|
||||
&::before{
|
||||
z-index: 1;
|
||||
position: absolute;
|
||||
bottom: -7px;
|
||||
left: 50px;
|
||||
width: 15px;
|
||||
height: 15px;
|
||||
content: " ";
|
||||
transform: rotate(45deg);
|
||||
background: #fff;
|
||||
box-sizing: border-box;
|
||||
box-shadow: 0px 0px 20px 0px rgba(0,0,0,0.1);
|
||||
}
|
||||
.more_item{
|
||||
font-size: 28px;
|
||||
height: 70px;
|
||||
line-height: 70px;
|
||||
text-align: center;
|
||||
&:nth-last-child(n+2) {
|
||||
border-bottom: 1PX solid #F0F0F0;
|
||||
}
|
||||
}
|
||||
}
|
||||
.more_bg{
|
||||
position:fixed;
|
||||
width: 100vw;
|
||||
height: 100vh;
|
||||
top: 0;
|
||||
left: 0;
|
||||
}
|
||||
}
|
||||
.scroll{
|
||||
white-space: nowrap;
|
||||
width: 100%;
|
||||
}
|
||||
.list_scroll{
|
||||
white-space: nowrap;
|
||||
width: 100%;
|
||||
text-align: right;
|
||||
}
|
||||
.btns_item{
|
||||
padding: 0 15px;
|
||||
width: 130px;
|
||||
border: 2px solid #dddddd;
|
||||
border-radius: 38px;
|
||||
text-align: center;
|
||||
line-height: 60px;
|
||||
font-size: $font_size;
|
||||
color: $color_font_three;
|
||||
display:inline-block;
|
||||
&:nth-child(n+2) {
|
||||
margin-left: 32px;
|
||||
}
|
||||
&:nth-last-child(1) {
|
||||
border: 2px solid $color_main;
|
||||
color: $color_main;
|
||||
}
|
||||
|
||||
}
|
||||
.end_btn{
|
||||
border: 2px solid $color_main;
|
||||
color: $color_main;
|
||||
}
|
||||
}
|
||||
193
src/components/afterOrderBtns/index.tsx
Normal file
193
src/components/afterOrderBtns/index.tsx
Normal file
@ -0,0 +1,193 @@
|
||||
import { CancelOrderApi, ReceiveOrderApi } from "@/api/order"
|
||||
import { alert } from "@/common/common"
|
||||
import { AFTER_ORDER_STATUS, ORDER_STATUS, SALE_MODE } from "@/common/enum"
|
||||
import {Text, View } from "@tarojs/components"
|
||||
import Taro from "@tarojs/taro"
|
||||
import {useRef, memo, useState, useMemo } from "react"
|
||||
import classnames from "classnames";
|
||||
import styles from './index.module.scss'
|
||||
import { ReturnApplyOrderCancelApi } from "@/api/salesAfterOrder"
|
||||
|
||||
type Param = {
|
||||
orderInfo: {
|
||||
stage: number, //售后状态
|
||||
orderId: number, //订单id
|
||||
sale_mode: number //订单类型
|
||||
type: number //1退货，2退款
|
||||
},
|
||||
onClick?: (val: number) => void //点击后触发的事件，返回订单状态
|
||||
}
|
||||
|
||||
export default memo(({orderInfo, onClick}:Param) => {
|
||||
//售后订单状态
|
||||
const {
|
||||
ReturnStageApplying,
|
||||
ReturnStageWaitCheck,
|
||||
ReturnStageChecked,
|
||||
ReturnStageReturned,
|
||||
ReturnStageCancel,
|
||||
ReturnStageQualityCheckPendingRefund,
|
||||
ReturnStageServiceOrderPendingRefund,
|
||||
ReturnStageRejected
|
||||
} = AFTER_ORDER_STATUS
|
||||
|
||||
//订单类型
|
||||
const {
|
||||
SaLeModeBulk,
|
||||
SaleModeLengthCut,
|
||||
SaLeModeWeightCut,
|
||||
} = SALE_MODE
|
||||
|
||||
//售后按钮按售后状态归类, value是该订单状态，可能该按钮会出现
|
||||
const orderBtnsList = useRef([
|
||||
{
|
||||
id: 1,
|
||||
value: [ReturnStageApplying.value, ReturnStageWaitCheck.value],
|
||||
label: '取消退货'
|
||||
},
|
||||
{
|
||||
id: 2,
|
||||
value: [ReturnStageWaitCheck.value],
|
||||
label: '退货物流'
|
||||
},
|
||||
{
|
||||
id: 3,
|
||||
value: [ReturnStageChecked.value, ReturnStageQualityCheckPendingRefund.value],
|
||||
label: '查看物流'
|
||||
},
|
||||
{
|
||||
id: 4,
|
||||
value: [ReturnStageQualityCheckPendingRefund.value, ReturnStageServiceOrderPendingRefund.value, ReturnStageReturned.value],
|
||||
label: '质检结果'
|
||||
},
|
||||
{
|
||||
id: 5,
|
||||
value: [ReturnStageServiceOrderPendingRefund.value, ReturnStageReturned.value],
|
||||
label: '退货码单'
|
||||
},
|
||||
{
|
||||
id: 6,
|
||||
value: [ReturnStageApplying.value, ReturnStageServiceOrderPendingRefund.value],
|
||||
label: '取消退款'
|
||||
},
|
||||
{
|
||||
id: 7,
|
||||
value: [ReturnStageServiceOrderPendingRefund.value, ReturnStageReturned.value],
|
||||
label: '退款码单'
|
||||
},
|
||||
{
|
||||
id: 8,
|
||||
value: [],
|
||||
label: '申请记录'
|
||||
},
|
||||
])
|
||||
|
||||
|
||||
//判断是否显示该按钮
|
||||
const orderBtnsShow = (item) => {
|
||||
if(!orderInfo) return false
|
||||
|
||||
if(item.id == 1) {
|
||||
//取消退货
|
||||
return (orderInfo.type == 1)&&item.value.includes(orderInfo.stage)
|
||||
} else if (item.id == 6) {
|
||||
//取消退款
|
||||
return (orderInfo.type == 2)&&item.value.includes(orderInfo.stage)
|
||||
} else {
|
||||
return item.value.includes(orderInfo.stage)
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
//显示的按钮数组
|
||||
const orderBtnsShowList: {id: number, value: any, label: string}[] = useMemo(() => {
|
||||
return orderBtnsList.current.filter(item => {
|
||||
return orderBtnsShow(item)
|
||||
})
|
||||
}, [orderInfo])
|
||||
|
||||
|
||||
|
||||
//点击按钮操作
|
||||
const submitBtns = (val, index) => {
|
||||
if (val == 1) {
|
||||
cancelOrder()
|
||||
} else if (val == 6) {
|
||||
receiveOrder()
|
||||
} else {
|
||||
onClick?.(val)
|
||||
}
|
||||
}
|
||||
|
||||
//取消退货
|
||||
const {fetchData: returnApplyOrderCancelFetchData} = ReturnApplyOrderCancelApi()
|
||||
const cancelOrder = () => {
|
||||
Taro.showModal({
|
||||
title: '要取消退货吗？',
|
||||
success: async function (res) {
|
||||
if (res.confirm) {
|
||||
let res = await returnApplyOrderCancelFetchData({id: orderInfo?.orderId})
|
||||
if(res.success) {
|
||||
alert.success('取消成功')
|
||||
onClick?.(1)
|
||||
} else {
|
||||
alert.none(res.msg)
|
||||
}
|
||||
} else if (res.cancel) {
|
||||
console.log('用户点击取消')
|
||||
}
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
//确认订单
|
||||
const {fetchData: receiveOrderFetchData} = ReceiveOrderApi()
|
||||
const receiveOrder = async () => {
|
||||
console.log('123456')
|
||||
Taro.showModal({
|
||||
title: '确定收货？',
|
||||
success: async function (res) {
|
||||
if (res.confirm) {
|
||||
let res = await receiveOrderFetchData({sale_order_id: orderInfo?.orderId})
|
||||
if(res.success){
|
||||
onClick?.(6)
|
||||
alert.success('收货成功')
|
||||
} else {
|
||||
alert.error('收货失败')
|
||||
}
|
||||
} else if (res.cancel) {
|
||||
console.log('用户点击取消')
|
||||
}
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
//显示更多按钮
|
||||
const [showMore, setShowMore] = useState(false)
|
||||
const styleTop = useMemo(() => {
|
||||
return {top:`-${(orderBtnsShowList.length - 3)*70 + 10}rpx`, left: `-${10}rpx`}
|
||||
}, [orderBtnsShowList])
|
||||
|
||||
return (
|
||||
<View className={styles.btns_list}>
|
||||
{(orderBtnsShowList.length > 3)&&<View className={styles.more}>
|
||||
<Text onClick={() => setShowMore(true)}>更多</Text>
|
||||
{showMore&&<View className={styles.more_con}>
|
||||
<View className={styles.more_list} style={styleTop}>
|
||||
{orderBtnsShowList.map((item, index) => {
|
||||
return ((index >= 3) &&<View className={styles.more_item} key={item.id} onClick={() => submitBtns(item.id, index)}>{item.label}</View>)
|
||||
})}
|
||||
</View>
|
||||
<View className={styles.more_bg} catchMove onClick={() => setShowMore(false)}></View>
|
||||
</View>}
|
||||
</View>}
|
||||
|
||||
<View className={styles.list_scroll}>
|
||||
{orderBtnsShowList.map((item, index) =>
|
||||
(index < 3)&&<View key={item.id} className={classnames(styles.btns_item)} onClick={() => submitBtns(item.id, index)}>{item.label}</View>
|
||||
)}
|
||||
</View>
|
||||
|
||||
</View>
|
||||
)
|
||||
})
|
||||
@ -4,19 +4,25 @@
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
width: 100%;
|
||||
.reduce, .plus{
|
||||
font-size: $font_size_big;
|
||||
.plus{
|
||||
color: $color_main;
|
||||
width: 46px;
|
||||
height: 46px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content:center;
|
||||
text-align: center;
|
||||
line-height: 43px;
|
||||
font-size: 50px;
|
||||
background-color: $color_main;
|
||||
color: #fff;
|
||||
border-radius: 8px;
|
||||
}
|
||||
.reduce {
|
||||
font-size: 50px;
|
||||
width: 46px;
|
||||
height: 46px;
|
||||
text-align: center;
|
||||
line-height: 43px;
|
||||
color:#007AFF;
|
||||
}
|
||||
.input{
|
||||
display: flex;
|
||||
align-items: flex-end;
|
||||
@ -25,10 +31,13 @@
|
||||
box-sizing: border-box;
|
||||
width: 106px;
|
||||
border-radius: 10px;
|
||||
}
|
||||
input{
|
||||
font-size: $font_size_medium;
|
||||
text-align: right;
|
||||
padding-right: 10px;
|
||||
}
|
||||
}
|
||||
|
||||
.unit{
|
||||
font-size: $font_size_min;
|
||||
color: $color_font_two;
|
||||
|
||||
@ -11,12 +11,14 @@ type params = {
|
||||
onChange?:(val:number) => void,
|
||||
onBlue?:(val:number) => void, //失去焦点触发
|
||||
onClickBtn?:(val:number) => void,
|
||||
unit?: string
|
||||
unit?: string,
|
||||
disable?: true|false, //是否禁用
|
||||
}
|
||||
export default ({minNum = 0, maxNum = 100, step=1, digits = 0, defaultNum = 0, onChange, onBlue, onClickBtn, unit = ''}: params) => {
|
||||
export default ({minNum = 0, maxNum = 10000, step=1, digits = 0, defaultNum = 0, onChange, onBlue, onClickBtn, unit = '', disable = false}: params) => {
|
||||
const [value, setValue] = useState<any>({count:defaultNum})
|
||||
|
||||
const onPlus = () => {
|
||||
if(disable) return false
|
||||
let {count} = value
|
||||
let num_res = Big(count).add(step).toNumber()
|
||||
num_res = num_res >= maxNum?maxNum:num_res
|
||||
@ -26,9 +28,10 @@ export default ({minNum = 0, maxNum = 100, step=1, digits = 0, defaultNum = 0, o
|
||||
onClickBtn?.(parseFloat(num_res))
|
||||
}
|
||||
const minus = () => {
|
||||
if(disable) return false
|
||||
let {count} = value
|
||||
let num_res = Big(count).minus(step).toNumber()
|
||||
num_res = num_res < minNum?0:num_res
|
||||
num_res = num_res < minNum?minNum:num_res
|
||||
setValue({...value, count:num_res})
|
||||
onChange?.(parseFloat(num_res))
|
||||
onClickBtn?.(parseFloat(num_res))
|
||||
@ -102,6 +105,7 @@ export default ({minNum = 0, maxNum = 100, step=1, digits = 0, defaultNum = 0, o
|
||||
onInput={onInputEven}
|
||||
onBlur={onBluerEven}
|
||||
type='digit'
|
||||
disabled={disable}
|
||||
/>
|
||||
<View className={styles.unit}>{unit}</View>
|
||||
</View>
|
||||
|
||||
37
src/components/counter/index1.module.scss
Normal file
37
src/components/counter/index1.module.scss
Normal file
@ -0,0 +1,37 @@
|
||||
|
||||
.main{
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
width: 100%;
|
||||
.reduce, .plus{
|
||||
font-size: $font_size_big;
|
||||
color: $color_main;
|
||||
width: 46px;
|
||||
height: 46px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content:center;
|
||||
font-size: 50px;
|
||||
background-color: $color_main;
|
||||
color: #fff;
|
||||
border-radius: 8px;
|
||||
}
|
||||
.input{
|
||||
display: flex;
|
||||
align-items: flex-end;
|
||||
background-color: #fff;
|
||||
padding: 5px 10px;
|
||||
box-sizing: border-box;
|
||||
width: 106px;
|
||||
border-radius: 10px;
|
||||
}
|
||||
input{
|
||||
font-size: $font_size_medium;
|
||||
}
|
||||
.unit{
|
||||
font-size: $font_size_min;
|
||||
color: $color_font_two;
|
||||
}
|
||||
|
||||
}
|
||||
111
src/components/counter/index1.tsx
Normal file
111
src/components/counter/index1.tsx
Normal file
@ -0,0 +1,111 @@
|
||||
import { Input, View } from "@tarojs/components"
|
||||
import { useEffect, useMemo, useRef, useState } from "react"
|
||||
import Big from 'big.js'
|
||||
import styles from "./index.module.scss"
|
||||
type params = {
|
||||
minNum?: number, //最小值
|
||||
maxNum?: number, //最大值
|
||||
step?: number, //步长
|
||||
defaultNum?: number, //默认值
|
||||
digits?: number //多少位小数
|
||||
onChange?:(val:number) => void,
|
||||
onBlue?:(val:number) => void, //失去焦点触发
|
||||
onClickBtn?:(val:number) => void,
|
||||
unit?: string
|
||||
}
|
||||
export default ({minNum = 0, maxNum = 100, step=1, digits = 0, defaultNum = 0, onChange, onBlue, onClickBtn, unit = ''}: params) => {
|
||||
const [value, setValue] = useState<any>({count:defaultNum})
|
||||
|
||||
const onPlus = () => {
|
||||
let {count} = value
|
||||
let num_res = Big(count).add(step).toNumber()
|
||||
num_res = num_res >= maxNum?maxNum:num_res
|
||||
num_res = formatDigits(num_res)
|
||||
setValue({...value, count:num_res})
|
||||
onChange?.(parseFloat(num_res))
|
||||
onClickBtn?.(parseFloat(num_res))
|
||||
}
|
||||
const minus = () => {
|
||||
let {count} = value
|
||||
let num_res = Big(count).minus(step).toNumber()
|
||||
num_res = num_res < minNum?0:num_res
|
||||
setValue({...value, count:num_res})
|
||||
onChange?.(parseFloat(num_res))
|
||||
onClickBtn?.(parseFloat(num_res))
|
||||
}
|
||||
|
||||
//保留小数
|
||||
const formatDigits = (num) => {
|
||||
num = num + ''
|
||||
if(num.includes('.')&&digits > 0) {
|
||||
console.log('num::',num.includes('.'))
|
||||
let res = num.split('.')
|
||||
let last_num = res[1].substr(0, digits)
|
||||
return res[0] + '.' + last_num
|
||||
}
|
||||
return parseFloat(num)
|
||||
}
|
||||
|
||||
//检查数据
|
||||
const checkData = (val) => {
|
||||
let num = parseFloat(val)
|
||||
if(num > maxNum) return maxNum
|
||||
if(num < minNum) return minNum
|
||||
return val
|
||||
}
|
||||
|
||||
|
||||
const onInputEven = (e) => {
|
||||
let res = e.detail.value
|
||||
if(res === '') {
|
||||
setValue({...value, count:minNum})
|
||||
onChange?.(minNum)
|
||||
}
|
||||
else if(!isNaN(Number(res))) {
|
||||
let count = formatDigits(res)
|
||||
count = checkData(count)
|
||||
setValue({...value, count})
|
||||
onChange?.(parseFloat(count as string))
|
||||
} else {
|
||||
let num = parseFloat(res)
|
||||
if(!isNaN(num)) {
|
||||
let count = formatDigits(num)
|
||||
count = checkData(count)
|
||||
setValue({...value, count})
|
||||
onChange?.(count as number)
|
||||
} else {
|
||||
setValue({...value, count:defaultNum})
|
||||
onChange?.(defaultNum)
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
const onBluerEven = () => {
|
||||
let num = parseFloat(value.count)
|
||||
if(!isNaN(num)) {
|
||||
let count = formatDigits(num)
|
||||
count = checkData(count)
|
||||
setValue({...value, count})
|
||||
onBlue?.(count as number)
|
||||
} else {
|
||||
setValue({...value, count:defaultNum})
|
||||
onBlue?.(defaultNum)
|
||||
}
|
||||
}
|
||||
return (
|
||||
<View className={styles.main}>
|
||||
<View className={styles.reduce} onClick={() => minus()}>-</View>
|
||||
<View className={styles.input}>
|
||||
<Input
|
||||
value={String(value.count)}
|
||||
onInput={onInputEven}
|
||||
onBlur={onBluerEven}
|
||||
type='digit'
|
||||
/>
|
||||
<View className={styles.unit}>{unit}</View>
|
||||
</View>
|
||||
<View className={styles.plus} onClick={() => onPlus()}>+</View>
|
||||
</View>
|
||||
)
|
||||
}
|
||||
@ -29,7 +29,7 @@ export default ({children = null, onClick}:param) => {
|
||||
return (
|
||||
<MovableArea className={styles.movableItem}>
|
||||
{children}
|
||||
{showMoveBtn&&<MovableView onClick={onClick} className={styles.moveBtn} direction="all" inertia={true} x="750rpx" y={screenHeight+'rpx'} onTouchEnd={(e) => dragEnd(e)}>
|
||||
{showMoveBtn&&<MovableView onClick={onClick} className={styles.moveBtn} direction="all" inertia={true} x="630rpx" y={screenHeight+'rpx'} onTouchEnd={(e) => dragEnd(e)}>
|
||||
<View className={classnames('iconfont','icon-gouwuche', styles.shop_icon) } ></View>
|
||||
</MovableView>}
|
||||
</MovableArea>
|
||||
|
||||
202
src/components/orderBtns/index copy.tsx
Normal file
202
src/components/orderBtns/index copy.tsx
Normal file
@ -0,0 +1,202 @@
|
||||
import { CancelOrderApi, ReceiveOrderApi } from "@/api/order"
|
||||
import { alert } from "@/common/common"
|
||||
import { ORDER_STATUS, SALE_MODE } from "@/common/enum"
|
||||
import { ScrollView, Text, View } from "@tarojs/components"
|
||||
import Taro from "@tarojs/taro"
|
||||
import { useCallback, useRef, memo, useState, useEffect, useMemo } from "react"
|
||||
import styles from './index.module.scss'
|
||||
|
||||
type Param = {
|
||||
orderInfo: {
|
||||
status: number, //订单状态
|
||||
orderId: number, //订单id
|
||||
actual_amount: number, //实付金额
|
||||
wait_pay_amount: number, //待付金额
|
||||
sale_mode: number //订单类型
|
||||
}|null,
|
||||
onClick?: (val: number) => void //点击后触发的事件，返回订单状态
|
||||
}
|
||||
|
||||
export default memo(({orderInfo, onClick}:Param) => {
|
||||
//订单状态枚举
|
||||
const {
|
||||
SaleOrderStatusBooking,
|
||||
SaleOrderStatusArranging,
|
||||
SaleOrderStatusArranged,
|
||||
SaleOrderStatusWaitingDelivery,
|
||||
SaleOrderStatusComplete,
|
||||
SaleOrderStatusRefund,
|
||||
SaleOrderStatusWaitingPayment,
|
||||
SaleOrderStatusWaitingReceipt,
|
||||
SaleOrderStatusAlreadyReceipt,
|
||||
SaleorderstatusWaitingPrePayment
|
||||
} = ORDER_STATUS
|
||||
|
||||
//订单类型
|
||||
const {
|
||||
SaLeModeBulk,
|
||||
SaleModeLengthCut,
|
||||
SaLeModeWeightCut,
|
||||
} = SALE_MODE
|
||||
|
||||
//订单按钮按订单状态归类, value是该订单状态，可能该按钮会出现
|
||||
const orderBtnsList = useRef([
|
||||
{
|
||||
id: 1,
|
||||
value: [SaleOrderStatusBooking.value,
|
||||
SaleOrderStatusArranging.value,
|
||||
SaleOrderStatusArranged.value,
|
||||
SaleOrderStatusWaitingPayment.value,
|
||||
SaleOrderStatusWaitingDelivery.value], //取消订单按钮对应： 待接单，配布中，已配布, 待付款， 待发货
|
||||
label: '取消订单'
|
||||
},
|
||||
{
|
||||
id: 2,
|
||||
value: [SaleorderstatusWaitingPrePayment.value, SaleOrderStatusWaitingPayment.value, SaleOrderStatusWaitingDelivery.value, SaleOrderStatusWaitingReceipt.value, SaleOrderStatusAlreadyReceipt.value, SaleOrderStatusComplete.value], //去付款按钮对应：待付款， 待发货, 待收货, 已收货, 已完成
|
||||
label: '去付款'
|
||||
},
|
||||
{
|
||||
id: 3,
|
||||
value: [SaleOrderStatusWaitingDelivery.value], //申请退款按钮对应： 待发货
|
||||
label: '申请退款'
|
||||
},
|
||||
{
|
||||
id: 4,
|
||||
value: [SaleOrderStatusWaitingReceipt.value, SaleOrderStatusAlreadyReceipt.value, SaleOrderStatusComplete.value, SaleOrderStatusRefund.value], //取消订单按钮对应： 待收货, 已收货, 已完成, 已退款
|
||||
label: '查看物流'
|
||||
},
|
||||
{
|
||||
id: 5,
|
||||
value: [SaleOrderStatusWaitingReceipt.value, SaleOrderStatusAlreadyReceipt.value, SaleOrderStatusRefund.value], //申请退货按钮对应： 待收货, 已收货, 已退款
|
||||
label: '申请退货'
|
||||
},
|
||||
{
|
||||
id: 6,
|
||||
value: [SaleOrderStatusWaitingReceipt.value], //确认收货按钮对应： 待收货
|
||||
label: '确认收货'
|
||||
},
|
||||
{
|
||||
id: 7,
|
||||
value: [SaleOrderStatusWaitingReceipt.value,SaleOrderStatusAlreadyReceipt.value,SaleOrderStatusComplete.value,SaleOrderStatusRefund.value], //再次购买按钮对应： 待收货，已收货，已完成, 已退款
|
||||
label: '再次购买'
|
||||
},
|
||||
{
|
||||
id: 8,
|
||||
value: [SaleOrderStatusBooking.value], //按钮对应： 待接单
|
||||
label: '退款'
|
||||
},
|
||||
])
|
||||
|
||||
|
||||
//判断是否显示该按钮
|
||||
const orderBtnsShow = (item) => {
|
||||
if(orderInfo) {
|
||||
if(item.id == 1) {
|
||||
//取消订单按钮
|
||||
return( orderInfo.actual_amount == 0 && item.value.includes(orderInfo.status)) //在待发货之前没有付过款
|
||||
} else if (item.id == 2) {
|
||||
//去付款按钮
|
||||
return( orderInfo.wait_pay_amount != 0 && item.value.includes(orderInfo.status)) //只要没有付完款就显示
|
||||
} else if(item.id == 3 ) {
|
||||
//申请退款, 只有大货才有
|
||||
return (orderInfo.sale_mode == SaLeModeBulk.value && orderInfo.actual_amount != 0 && item.value.includes(orderInfo.status)) //大货在待发货付过款
|
||||
} else if( item.id == 8) {
|
||||
//退款按钮（直接退款不用申请）, 只有散剪和剪板有
|
||||
return (orderInfo.sale_mode != SaLeModeBulk.value && orderInfo.actual_amount != 0 && item.value.includes(orderInfo.status)) //散剪和剪板在待接单时付过款
|
||||
}
|
||||
else {
|
||||
//其他按钮
|
||||
return item.value.includes(orderInfo.status)
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
//显示的按钮数组
|
||||
const orderBtnsShowList: {id: number, value: any, label: string}[] = useMemo(() => {
|
||||
return orderBtnsList.current.filter(item => {
|
||||
return orderBtnsShow(item)
|
||||
})
|
||||
}, [orderInfo])
|
||||
|
||||
|
||||
|
||||
//点击按钮操作
|
||||
const submitBtns = (val, index) => {
|
||||
(val == 1)&&cancelOrder(); //取消订单按钮
|
||||
(val == 2)&&onClick?.(2); //去付款按钮
|
||||
(val == 6)&&receiveOrder(); //确认收货
|
||||
|
||||
}
|
||||
|
||||
//取消订单
|
||||
const {fetchData: cancelFetchData} = CancelOrderApi()
|
||||
const cancelOrder = () => {
|
||||
Taro.showModal({
|
||||
title: '要取消该订单吗？',
|
||||
success: async function (res) {
|
||||
if (res.confirm) {
|
||||
let res = await cancelFetchData({id: orderInfo?.orderId})
|
||||
if(res.success) {
|
||||
alert.success('取消成功')
|
||||
onClick?.(1)
|
||||
} else {
|
||||
alert.none(res.msg)
|
||||
}
|
||||
} else if (res.cancel) {
|
||||
console.log('用户点击取消')
|
||||
}
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
//确认订单
|
||||
const {fetchData: receiveOrderFetchData} = ReceiveOrderApi()
|
||||
const receiveOrder = async () => {
|
||||
console.log('123456')
|
||||
Taro.showModal({
|
||||
title: '确定收货？',
|
||||
success: async function (res) {
|
||||
if (res.confirm) {
|
||||
let res = await receiveOrderFetchData({sale_order_id: orderInfo?.orderId})
|
||||
if(res.success){
|
||||
onClick?.(6)
|
||||
alert.success('收货成功')
|
||||
} else {
|
||||
alert.error('收货失败')
|
||||
}
|
||||
} else if (res.cancel) {
|
||||
console.log('用户点击取消')
|
||||
}
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
//显示更多按钮
|
||||
const [showMore, setShowMore] = useState(false)
|
||||
const styleTop = useMemo(() => {
|
||||
return {top:`-${(orderBtnsShowList.length - 3)*70 + 10}rpx`, left: `-${10}rpx`}
|
||||
}, [orderBtnsShowList])
|
||||
|
||||
return (
|
||||
<View className={styles.btns_list}>
|
||||
{(orderBtnsShowList.length > 3)&&<View className={styles.more}>
|
||||
<Text onClick={() => setShowMore(true)}>更多</Text>
|
||||
{showMore&&<View className={styles.more_con}>
|
||||
<View className={styles.more_list} style={styleTop}>
|
||||
{orderBtnsShowList.map((item, index) => {
|
||||
return ((index >= 3) &&<View className={styles.more_item} key={item.id} onClick={() => submitBtns(item.id, index)}>{item.label}</View>)
|
||||
})}
|
||||
</View>
|
||||
<View className={styles.more_bg} catchMove onClick={() => setShowMore(false)}></View>
|
||||
</View>}
|
||||
</View>}
|
||||
|
||||
<View className={styles.list_scroll}>
|
||||
{orderBtnsShowList.map((item, index) =>
|
||||
(index < 3)&&<View key={item.id} className={styles.btns_item} onClick={() => submitBtns(item.id, index)}>{item.label}</View>
|
||||
)}
|
||||
</View>
|
||||
|
||||
</View>
|
||||
)
|
||||
})
|
||||
@ -1,19 +1,84 @@
|
||||
.btns_list{
|
||||
display: flex;
|
||||
justify-content: flex-end;
|
||||
width: 100%;
|
||||
// margin-top: 30px;
|
||||
display: flex;
|
||||
align-content: center;
|
||||
.more{
|
||||
font-size: 28px;
|
||||
width: 143px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
color: $color_font_two;
|
||||
padding-left: 20px;
|
||||
position: relative;
|
||||
|
||||
.more_list{
|
||||
position: absolute;
|
||||
background-color: #fff;
|
||||
width: 226px;
|
||||
box-shadow: 0px 0px 20px 0px rgba(0,0,0,0.06);
|
||||
border-radius: 10px;
|
||||
padding: 0 20px;
|
||||
box-sizing: border-box;
|
||||
z-index:999;
|
||||
&::before{
|
||||
z-index: 1;
|
||||
position: absolute;
|
||||
bottom: -7px;
|
||||
left: 50px;
|
||||
width: 15px;
|
||||
height: 15px;
|
||||
content: " ";
|
||||
transform: rotate(45deg);
|
||||
background: #fff;
|
||||
box-sizing: border-box;
|
||||
box-shadow: 0px 0px 20px 0px rgba(0,0,0,0.1);
|
||||
}
|
||||
.more_item{
|
||||
font-size: 28px;
|
||||
height: 70px;
|
||||
line-height: 70px;
|
||||
text-align: center;
|
||||
&:nth-last-child(n+2) {
|
||||
border-bottom: 1PX solid #F0F0F0;
|
||||
}
|
||||
}
|
||||
}
|
||||
.more_bg{
|
||||
position:fixed;
|
||||
width: 100vw;
|
||||
height: 100vh;
|
||||
top: 0;
|
||||
left: 0;
|
||||
}
|
||||
}
|
||||
.scroll{
|
||||
white-space: nowrap;
|
||||
width: 100%;
|
||||
}
|
||||
.list_scroll{
|
||||
white-space: nowrap;
|
||||
width: 100%;
|
||||
text-align: right;
|
||||
}
|
||||
.btns_item{
|
||||
width: 152px;
|
||||
height: 72px;
|
||||
padding: 0 15px;
|
||||
width: 130px;
|
||||
border: 2px solid #dddddd;
|
||||
border-radius: 38px;
|
||||
text-align: center;
|
||||
line-height: 72px;
|
||||
line-height: 60px;
|
||||
font-size: $font_size;
|
||||
color: $color_font_three;
|
||||
display:inline-block;
|
||||
&:nth-child(n+2) {
|
||||
margin-left: 32px;
|
||||
}
|
||||
&:nth-last-child(1) {
|
||||
border: 2px solid $color_main;
|
||||
color: $color_main;
|
||||
}
|
||||
|
||||
}
|
||||
.end_btn{
|
||||
border: 2px solid $color_main;
|
||||
|
||||
@ -1,10 +1,12 @@
|
||||
import { CancelOrderApi } from "@/api/order"
|
||||
import { alert } from "@/common/common"
|
||||
import { ORDER_STATUS } from "@/common/enum"
|
||||
import { View } from "@tarojs/components"
|
||||
import { CancelOrderApi, ReceiveOrderApi } from "@/api/order"
|
||||
import { alert, goLink } from "@/common/common"
|
||||
import { ORDER_STATUS, SALE_MODE } from "@/common/enum"
|
||||
import {Text, View } from "@tarojs/components"
|
||||
import Taro from "@tarojs/taro"
|
||||
import { useCallback, useRef, memo } from "react"
|
||||
import {useRef, memo, useState, useMemo } from "react"
|
||||
import classnames from "classnames";
|
||||
import styles from './index.module.scss'
|
||||
import { AddShoppingCartApi } from "@/api/shopCart"
|
||||
|
||||
type Param = {
|
||||
orderInfo: {
|
||||
@ -12,84 +14,128 @@ type Param = {
|
||||
orderId: number, //订单id
|
||||
actual_amount: number, //实付金额
|
||||
wait_pay_amount: number, //待付金额
|
||||
sale_mode: number //订单类型
|
||||
}|null,
|
||||
onClick?: (val: number) => void //点击后触发的事件，返回订单状态
|
||||
}
|
||||
|
||||
// export const OrderBtnsemus = [{id:1, label:'取消订单'},{id:2, label:'去付款'},{id:3, label:'申请退款'},{id:4, label:'查看物流'}, {id:5, label:'申请退货'}, {id:6, label:'确认收货'}, {id:7, label:'再次购买'}]
|
||||
export default memo(({orderInfo, onClick}:Param) => {
|
||||
//订单状态枚举
|
||||
const {
|
||||
SaleOrderStatusBooking,
|
||||
SaleOrderStatusArranging,
|
||||
SaleOrderStatusArranged,
|
||||
SaleOrderStatusWaitingDelivery,
|
||||
SaleOrderStatusComplete,
|
||||
SaleOrderStatusCancel,
|
||||
SaleOrderStatusRefund,
|
||||
SaleOrderStatusWaitingPayment,
|
||||
SaleOrderStatusWaitingReceipt,
|
||||
SaleOrderStatusAlreadyReceipt
|
||||
SaleOrderStatusAlreadyReceipt,
|
||||
SaleorderstatusWaitingPrePayment,
|
||||
SaleOrderStatusTaking
|
||||
} = ORDER_STATUS
|
||||
//订单按钮按订单状态归类
|
||||
|
||||
//订单类型
|
||||
const {
|
||||
SaLeModeBulk,
|
||||
SaleModeLengthCut,
|
||||
SaLeModeWeightCut,
|
||||
} = SALE_MODE
|
||||
|
||||
//订单按钮按订单状态归类, value是该订单状态，可能该按钮会出现
|
||||
const orderBtnsList = useRef([
|
||||
|
||||
{
|
||||
id: 1,
|
||||
value: [SaleOrderStatusBooking.value, SaleOrderStatusArranging.value, SaleOrderStatusArranged.value, SaleOrderStatusWaitingPayment.value, SaleOrderStatusWaitingDelivery.value], //取消订单按钮对应： 待接单，配布中，已配布, 待付款， 待发货
|
||||
value: [SaleOrderStatusBooking.value,
|
||||
SaleOrderStatusArranging.value,
|
||||
SaleOrderStatusArranged.value,
|
||||
SaleOrderStatusWaitingPayment.value,
|
||||
SaleOrderStatusWaitingDelivery.value], //取消订单按钮对应： 待接单，配布中，已配布, 待付款， 待发货
|
||||
label: '取消订单'
|
||||
},
|
||||
{
|
||||
id: 2,
|
||||
value: [SaleOrderStatusWaitingPayment.value, SaleOrderStatusWaitingDelivery.value, SaleOrderStatusWaitingReceipt.value, SaleOrderStatusAlreadyReceipt.value, SaleOrderStatusComplete.value], //去付款按钮对应：待付款， 待发货, 待收货, 已收货, 已完成
|
||||
label: '去付款'
|
||||
},
|
||||
{
|
||||
id: 3,
|
||||
value: [SaleOrderStatusWaitingDelivery.value], //取消订单按钮对应： 待发货
|
||||
value: [SaleOrderStatusWaitingDelivery.value, SaleOrderStatusTaking.value], //申请退款按钮对应： 待发货, 提货中
|
||||
label: '申请退款'
|
||||
},
|
||||
{
|
||||
id: 4,
|
||||
value: [SaleOrderStatusWaitingReceipt.value, SaleOrderStatusAlreadyReceipt.value, SaleOrderStatusComplete.value, SaleOrderStatusRefund.value], //取消订单按钮对应： 待收货, 已收货, 已完成, 已退款
|
||||
label: '查看物流'
|
||||
},
|
||||
// {
|
||||
// id: 4,
|
||||
// value: [SaleOrderStatusWaitingReceipt.value, SaleOrderStatusAlreadyReceipt.value, SaleOrderStatusComplete.value, SaleOrderStatusRefund.value], //取消订单按钮对应： 待收货, 已收货, 已完成, 已退款
|
||||
// label: '查看物流'
|
||||
// },
|
||||
{
|
||||
id: 5,
|
||||
value: [SaleOrderStatusWaitingReceipt.value, SaleOrderStatusAlreadyReceipt.value, SaleOrderStatusRefund.value], //取消订单按钮对应： 待收货, 已收货, 已退款
|
||||
value: [SaleOrderStatusAlreadyReceipt.value, SaleOrderStatusRefund.value], //申请退货按钮对应：已收货, 已退款
|
||||
label: '申请退货'
|
||||
},
|
||||
{
|
||||
id: 6,
|
||||
value: [SaleOrderStatusWaitingReceipt.value], //取消订单按钮对应： 待收货
|
||||
value: [SaleOrderStatusWaitingReceipt.value], //确认收货按钮对应： 待收货
|
||||
label: '确认收货'
|
||||
},
|
||||
{
|
||||
id: 7,
|
||||
value: [SaleOrderStatusWaitingReceipt.value,SaleOrderStatusAlreadyReceipt.value,SaleOrderStatusComplete.value,SaleOrderStatusRefund.value], //取消订单按钮对应： 待收货，已收货，已完成, 已退款
|
||||
value: [SaleOrderStatusWaitingReceipt.value,SaleOrderStatusAlreadyReceipt.value,SaleOrderStatusComplete.value,SaleOrderStatusRefund.value], //再次购买按钮对应： 待收货，已收货，已完成, 已退款
|
||||
label: '再次购买'
|
||||
}
|
||||
},
|
||||
{
|
||||
id: 8,
|
||||
value: [SaleOrderStatusBooking.value], //按钮对应： 待接单
|
||||
label: '退款'
|
||||
},
|
||||
{
|
||||
id: 2,
|
||||
value: [SaleOrderStatusTaking.value, SaleorderstatusWaitingPrePayment.value, SaleOrderStatusWaitingPayment.value, SaleOrderStatusWaitingDelivery.value, SaleOrderStatusWaitingReceipt.value, SaleOrderStatusAlreadyReceipt.value, SaleOrderStatusComplete.value], //去付款按钮对应：待付款， 待发货, 待收货, 已收货, 已完成
|
||||
label: '去付款'
|
||||
},
|
||||
])
|
||||
|
||||
|
||||
//判断是否显示该按钮
|
||||
const orderBtnsShow = useCallback((item) => {
|
||||
const orderBtnsShow = (item) => {
|
||||
if(orderInfo) {
|
||||
if(item.id == 1) {
|
||||
//取消订单按钮
|
||||
return( orderInfo.actual_amount == 0 && item.value.includes(orderInfo.status)) //在代发货之前没有付过款
|
||||
return( orderInfo.actual_amount == 0 && item.value.includes(orderInfo.status)) //在待发货之前没有付过款
|
||||
} else if (item.id == 2) {
|
||||
//去付款按钮
|
||||
return( orderInfo.wait_pay_amount != 0 && item.value.includes(orderInfo.status)) //只要没有付完款就显示
|
||||
} else if(item.id == 3 ) {
|
||||
//申请退款
|
||||
return (orderInfo.actual_amount != 0 && item.value.includes(orderInfo.status)) //在代发货之前付过款
|
||||
//申请退款, 只有大货才有
|
||||
return (orderInfo.sale_mode == SaLeModeBulk.value && orderInfo.actual_amount != 0 && item.value.includes(orderInfo.status)) //大货在待发货付过款
|
||||
} else if( item.id == 8) {
|
||||
//退款按钮（直接退款不用申请）, 只有散剪和剪板有
|
||||
return (orderInfo.sale_mode != SaLeModeBulk.value && orderInfo.actual_amount != 0 && item.value.includes(orderInfo.status)) //散剪和剪板在待接单时付过款
|
||||
} else if (item.id == 7) {
|
||||
return true //再次购买按钮一直存在
|
||||
} else {
|
||||
//其他按钮
|
||||
return item.value.includes(orderInfo.status)
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
//显示的按钮数组
|
||||
const orderBtnsShowList: {id: number, value: any, label: string}[] = useMemo(() => {
|
||||
return orderBtnsList.current.filter(item => {
|
||||
return orderBtnsShow(item)
|
||||
})
|
||||
}, [orderInfo])
|
||||
|
||||
|
||||
|
||||
//点击按钮操作
|
||||
const submitBtns = (val) => {
|
||||
(val == 1)&&cancelOrder(); //取消订单按钮
|
||||
(val == 2)&&onClick?.(val); //去付款按钮
|
||||
const submitBtns = (val, index) => {
|
||||
if (val == 1) {
|
||||
cancelOrder()
|
||||
} else if (val == 6) {
|
||||
receiveOrder()
|
||||
} else if(val == 5) {
|
||||
goLink('/pages/applyAfterSales/index',{id:orderInfo?.orderId})
|
||||
} else {
|
||||
onClick?.(val)
|
||||
}
|
||||
}
|
||||
|
||||
//取消订单
|
||||
@ -113,11 +159,55 @@ export default memo(({orderInfo, onClick}:Param) => {
|
||||
})
|
||||
}
|
||||
|
||||
//确认订单
|
||||
const {fetchData: receiveOrderFetchData} = ReceiveOrderApi()
|
||||
const receiveOrder = async () => {
|
||||
console.log('123456')
|
||||
Taro.showModal({
|
||||
title: '确定收货？',
|
||||
success: async function (res) {
|
||||
if (res.confirm) {
|
||||
let res = await receiveOrderFetchData({sale_order_id: orderInfo?.orderId})
|
||||
if(res.success){
|
||||
onClick?.(6)
|
||||
alert.success('收货成功')
|
||||
} else {
|
||||
alert.error('收货失败')
|
||||
}
|
||||
} else if (res.cancel) {
|
||||
console.log('用户点击取消')
|
||||
}
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
|
||||
//显示更多按钮
|
||||
const [showMore, setShowMore] = useState(false)
|
||||
const styleTop = useMemo(() => {
|
||||
return {top:`-${(orderBtnsShowList.length - 3)*70 + 10}rpx`, left: `-${10}rpx`}
|
||||
}, [orderBtnsShowList])
|
||||
|
||||
return (
|
||||
<View className={styles.btns_list}>
|
||||
{orderBtnsList.current.map((item) =>
|
||||
orderBtnsShow(item)&&<View key={item.id} className={styles.btns_item} onClick={() => submitBtns(item.id)}>{item.label}</View>
|
||||
{(orderBtnsShowList.length > 3)&&<View className={styles.more}>
|
||||
<Text onClick={() => setShowMore(true)}>更多</Text>
|
||||
{showMore&&<View className={styles.more_con}>
|
||||
<View className={styles.more_list} style={styleTop}>
|
||||
{orderBtnsShowList.map((item, index) => {
|
||||
return ((index >= 3) &&<View className={styles.more_item} key={item.id} onClick={() => submitBtns(item.id, index)}>{item.label}</View>)
|
||||
})}
|
||||
</View>
|
||||
<View className={styles.more_bg} catchMove onClick={() => setShowMore(false)}></View>
|
||||
</View>}
|
||||
</View>}
|
||||
|
||||
<View className={styles.list_scroll}>
|
||||
{orderBtnsShowList.map((item, index) =>
|
||||
(index < 3)&&<View key={item.id} className={classnames(styles.btns_item)} onClick={() => submitBtns(item.id, index)}>{item.label}</View>
|
||||
)}
|
||||
</View>
|
||||
|
||||
</View>
|
||||
)
|
||||
})
|
||||
@ -62,7 +62,7 @@ export default memo((
|
||||
</View>}
|
||||
|
||||
<View className={style.drawer_container_context}>
|
||||
{children}
|
||||
{show&&children}
|
||||
</View>
|
||||
<View className="common_safe_area_y"></View>
|
||||
</View>
|
||||
|
||||
@ -25,7 +25,7 @@
|
||||
border-radius: 10px;
|
||||
}
|
||||
.num{
|
||||
padding: 5px 10px;
|
||||
padding: 5px 10px 5px 20px;
|
||||
font-size: $font_size_min;
|
||||
position: absolute;
|
||||
right:0;
|
||||
@ -51,7 +51,7 @@
|
||||
.tag_list{
|
||||
display: flex;
|
||||
margin-top: 16px;
|
||||
.tag{
|
||||
.tag, .tag_g{
|
||||
padding: 3px 10px;
|
||||
background-color: #CDE5FF;
|
||||
font-size: $font_size_min;
|
||||
@ -61,6 +61,10 @@
|
||||
margin-left: 10px;
|
||||
}
|
||||
}
|
||||
.tag_g{
|
||||
background-color: #FFE6CE;
|
||||
color: #EE7500;
|
||||
}
|
||||
}
|
||||
.introduce{
|
||||
font-size: $font_size_medium;
|
||||
|
||||
@ -3,6 +3,7 @@ import Taro from "@tarojs/taro"
|
||||
import { goLink } from "@/common/common"
|
||||
import styles from './index.module.scss'
|
||||
import { formatHashTag, formatImgUrl } from "@/common/fotmat"
|
||||
import LabAndImg from "../LabAndImg"
|
||||
|
||||
type Params = {
|
||||
desStatus?: true|false,
|
||||
@ -14,14 +15,14 @@ export default ({desStatus = true, productList = []}:Params) => {
|
||||
{productList?.map(item => {
|
||||
return <View className={styles.products_item} onClick={() => goLink(`/pages/details/index?id=${item.id}`)}>
|
||||
<View className={styles.item_img}>
|
||||
<Image src={formatImgUrl(item.texture_url)}/>
|
||||
<LabAndImg value={{lab:item.lab,rgb:item.rgb,texture_url:item.texture_url}}/>
|
||||
<View className={styles.num}>{item.product_color_count}色</View>
|
||||
</View>
|
||||
<View className={styles.item_con}>
|
||||
<View className={styles.title}><text>{formatHashTag(item.code, '')} </text>{item.name}</View>
|
||||
<View className={styles.tag_list}>
|
||||
<View className={styles.tag}>{item.width}</View>
|
||||
<View className={styles.tag}>{item.weight_density}</View>
|
||||
<View className={styles.tag_g}>{item.weight_density}</View>
|
||||
</View>
|
||||
<View className={styles.introduce}>{item.component}</View>
|
||||
{desStatus&&<View className={styles.des}>{item.describe}</View>}
|
||||
|
||||
@ -71,12 +71,12 @@ export default memo(forwardRef(({
|
||||
<View className={styles.search_main} >
|
||||
<View className={styles.search_con}>
|
||||
{showIcon&&<View className={classnames('iconfont', 'icon-sousuo', styles.icon_a_sousuo1_self, placeIcon=='inner'?styles.icon_inner:styles.icon_out)}></View>}
|
||||
<Input placeholderStyle='color:#ABABAB; font-size:26rpx' className={classnames(placeIcon=='out'&&styles.input_out)} disabled={disabled} value={inputCon} placeholder={placeholder} onInput={(e) => onInputEven(e)}></Input>
|
||||
<Input placeholderStyle='color:#ABABAB; font-size:26rpx' onConfirm={onSearch} className={classnames(placeIcon=='out'&&styles.input_out)} disabled={disabled} value={inputCon} placeholder={placeholder} onInput={(e) => onInputEven(e)}></Input>
|
||||
{!!inputCon&&<View className={styles.search_closeBtn}>
|
||||
<CloseBtn onClose={() => clearInput()} styleObj={{width: '20rpx', height:'20rpx', backgroundColor:'#fff', border:'0'}}/>
|
||||
</View>}
|
||||
</View>
|
||||
{showBtn&&<View style={btnStyle} className={styles.btn} onClick = {() => onSearch()}>{btnTitle}</View>}
|
||||
{showBtn&&<View style={btnStyle} className={styles.btn} onClick = {onSearch}>{btnTitle}</View>}
|
||||
</View>
|
||||
</>
|
||||
)
|
||||
|
||||
@ -17,6 +17,11 @@
|
||||
margin-right: 10px;
|
||||
}
|
||||
}
|
||||
.count_all{
|
||||
font-size: 22px;
|
||||
color: #ABABAB;
|
||||
padding: 30px 20px;
|
||||
}
|
||||
.search{
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
@ -104,6 +109,15 @@
|
||||
flex-direction: column;
|
||||
justify-content: space-between;
|
||||
align-items: flex-end;
|
||||
.btn_count{
|
||||
width: 235px;
|
||||
height: 64px;
|
||||
background-color: #ECF5FF;
|
||||
border-radius: 40px 0px 16px 0px;
|
||||
padding: 0 20px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
.price{
|
||||
font-size: $font_size;
|
||||
font-weight: 700;
|
||||
@ -150,6 +164,7 @@
|
||||
justify-content: center;
|
||||
padding-bottom: constant(safe-area-inset-bottom);
|
||||
padding-bottom: env(safe-area-inset-bottom);
|
||||
z-index: 999;
|
||||
.buy_con{
|
||||
width: 702px;
|
||||
height: 95px;
|
||||
@ -175,7 +190,7 @@
|
||||
.price_con{
|
||||
flex:1;
|
||||
.price_real{
|
||||
font-size: $font_size;
|
||||
font-size: $font_size_big;
|
||||
color: #fff;
|
||||
text{
|
||||
font-size: $font_size_min;
|
||||
@ -184,7 +199,6 @@
|
||||
.price_forecast{
|
||||
font-size: $font_size_min;
|
||||
color: $color_font_two;
|
||||
margin-top: 10px;
|
||||
}
|
||||
}
|
||||
.goPay{
|
||||
|
||||
@ -8,10 +8,11 @@ import styles from "./index.module.scss"
|
||||
import { useCallback, useEffect, useMemo, useRef, useState } from "react";
|
||||
import Taro from "@tarojs/taro";
|
||||
import { alert, goLink } from "@/common/common";
|
||||
import {GetShoppingCartApi, DelShoppingCartApi} from "@/api/shopCart"
|
||||
import {GetShoppingCartApi, DelShoppingCartApi, UpdateShoppingCartApi} from "@/api/shopCart"
|
||||
import { formatHashTag, formatImgUrl, formatPriceDiv } from "@/common/fotmat";
|
||||
import { setParam } from "@/common/system";
|
||||
import { debounce } from "@/common/util";
|
||||
import Counter from "../counter";
|
||||
|
||||
type param = {
|
||||
show?: true|false,
|
||||
@ -19,11 +20,9 @@ type param = {
|
||||
}
|
||||
export default ({show = false, onClose}: param) => {
|
||||
const selectList = [
|
||||
// {value:-1, title:'不限', unit:'', eunit:''},
|
||||
{value:0, title:'大货', unit:'件', eunit:'kg'},
|
||||
{value:1,title:'剪板', unit:'米', eunit:'m'},
|
||||
{value:2,title:'散剪', unit:'米', eunit:'kg'},
|
||||
|
||||
{value:0, title:'大货', unit:'条', eunit:'kg', step:1, digits:0, minNum:1, maxNum:100000, defaultNum:1},
|
||||
{value:1,title:'剪板', unit:'米', eunit:'m', step:1, digits:2, minNum:0.5, maxNum:9.99, defaultNum:1},
|
||||
{value:2,title:'散剪', unit:'米', eunit:'kg', step:1, digits:2, minNum:5, maxNum:100000, defaultNum:10},
|
||||
]
|
||||
|
||||
const [selectIndex, setSelectIndex] = useState(0)
|
||||
@ -53,7 +52,6 @@ export default ({show = false, onClose}: param) => {
|
||||
const [loading, setLoading] = useState(false)
|
||||
const {fetchData} = GetShoppingCartApi()
|
||||
const getShoppingCart = async () => {
|
||||
setLoading(true)
|
||||
const {data} = await fetchData()
|
||||
let color_list = data.color_list||[]
|
||||
initList(color_list)
|
||||
@ -65,6 +63,7 @@ export default ({show = false, onClose}: param) => {
|
||||
const initList = (color_list) => {
|
||||
color_list?.map(item => {
|
||||
if(selectIndex == item.sale_mode) item.select = true
|
||||
item.count = formatCount(item)
|
||||
})
|
||||
}
|
||||
|
||||
@ -74,6 +73,7 @@ export default ({show = false, onClose}: param) => {
|
||||
setList([])
|
||||
setSelectIndex(0)
|
||||
} else {
|
||||
setLoading(true)
|
||||
getShoppingCart()
|
||||
}
|
||||
}, [show])
|
||||
@ -117,8 +117,6 @@ export default ({show = false, onClose}: param) => {
|
||||
if(item.select) select_count++
|
||||
}
|
||||
})
|
||||
console.log('list_count::',list_count)
|
||||
console.log('select_count::',select_count)
|
||||
setSelectStatus(select_count == list_count)
|
||||
}
|
||||
|
||||
@ -138,11 +136,13 @@ export default ({show = false, onClose}: param) => {
|
||||
//删除购物车内容
|
||||
const {fetchData:delShopFetchData} = DelShoppingCartApi()
|
||||
const delSelect = () => {
|
||||
getSelectId()
|
||||
if(selectIds.current.length <= 0) return alert.none('请选择要删除的面料!')
|
||||
Taro.showModal({
|
||||
content: '删除所选商品？',
|
||||
success: async function (res) {
|
||||
if (res.confirm) {
|
||||
getSelectId()
|
||||
|
||||
const res = await delShopFetchData({id:selectIds.current})
|
||||
if(res.success) {
|
||||
getShoppingCart()
|
||||
@ -182,18 +182,34 @@ export default ({show = false, onClose}: param) => {
|
||||
|
||||
//格式化数量
|
||||
const formatCount = useCallback((item) => {
|
||||
return item.sale_mode == 0? item.roll + '件': (item.length/100) + 'm'
|
||||
console.log('item:::',item)
|
||||
return item.sale_mode == 0? item.roll : (item.length/100)
|
||||
}, [])
|
||||
|
||||
//预估金额
|
||||
//格式化单位
|
||||
const formatUnit = useCallback((item) => {
|
||||
return item.sale_mode == 0? '条':'米'
|
||||
}, [])
|
||||
|
||||
//预估金额和总条数
|
||||
const estimatePrice = useMemo(() => {
|
||||
let count = 0
|
||||
let estimate_amount = 0
|
||||
let product_list = new Set() //面料
|
||||
let color_count = 0 //颜色数量
|
||||
let all_count = 0 //总数量
|
||||
list.map(item => {
|
||||
if(item.select) count += item.estimate_amount
|
||||
if(item.select) {
|
||||
estimate_amount += item.estimate_amount
|
||||
product_list.add(item.product_id)
|
||||
color_count++
|
||||
all_count += item.sale_mode == 0?item.roll: (item.length)
|
||||
}
|
||||
})
|
||||
return Number(formatPriceDiv(count))
|
||||
let all_count_text = selectIndex == 0?all_count + '条': (all_count/100) + '米'
|
||||
return {price: Number(formatPriceDiv(estimate_amount)).toFixed(2), countText: `已选${product_list.size}种面料，${color_count}个颜色，共${all_count_text}`, color_count}
|
||||
},[list])
|
||||
|
||||
|
||||
//去结算
|
||||
const orderDetail = debounce(() => {
|
||||
getSelectId()
|
||||
@ -201,12 +217,26 @@ export default ({show = false, onClose}: param) => {
|
||||
alert.error('请选择面料')
|
||||
} else {
|
||||
let ids = selectIds.current.join('-')
|
||||
setParam({ids, sale_mode:selectIndex})
|
||||
setParam({ids, sale_mode:selectIndex}) //临时存储
|
||||
closePopup()
|
||||
goLink('/pages/order/comfirm')
|
||||
}
|
||||
}, 500)
|
||||
|
||||
//计数组件-当后端修改完成才修改前端显示
|
||||
const {fetchData: fetchDataUpdateShoppingCart} = UpdateShoppingCartApi()
|
||||
const [UpdateShoppingCartLoading, setUpdateShoppingCartLoading] = useState(false)
|
||||
const getInputValue = debounce(async (num, item) => {
|
||||
let roll = item.sale_mode == 0?parseFloat(num):0
|
||||
let length = item.sale_mode != 0?(parseFloat(num)*100):0
|
||||
setUpdateShoppingCartLoading(() => true)
|
||||
let res = await fetchDataUpdateShoppingCart({id: item.id, roll, length})
|
||||
setUpdateShoppingCartLoading(() => false)
|
||||
if(res.success) {
|
||||
getShoppingCart()
|
||||
}
|
||||
}, 300)
|
||||
|
||||
return (
|
||||
<View className={styles.shop_cart_main}>
|
||||
<Popup showTitle={false} show={showPopup} onClose={() => closePopup()} >
|
||||
@ -218,6 +248,7 @@ export default ({show = false, onClose}: param) => {
|
||||
删除所选
|
||||
</View>
|
||||
</View>
|
||||
<View className={styles.count_all}>{estimatePrice.countText}</View>
|
||||
<View className={styles.search}>
|
||||
{selectList.map((item) => {
|
||||
return <View key={item.value} onClick={() => selectProduct(item.value)} className={classnames(styles.search_item, (selectIndex==item.value)&&styles.search_item_select)}>{item.title}</View>
|
||||
@ -242,7 +273,20 @@ export default ({show = false, onClose}: param) => {
|
||||
</View>
|
||||
<View className={styles.count}>
|
||||
<View className={styles.price}><text>￥</text>{formatPirce(item.sale_price)}<text>/{selectList[selectIndex].eunit}</text></View>
|
||||
<View className={styles.long}>×{formatCount(item)}</View>
|
||||
{/* <View className={styles.long}>×{formatCount(item)}{selectList[selectIndex].unit}</View> */}
|
||||
<View className={styles.btn_count}>
|
||||
<Counter
|
||||
onBlue={(e) => getInputValue(e, item)}
|
||||
defaultNum={item.count}
|
||||
step={selectList[selectIndex].step}
|
||||
digits={selectList[selectIndex].digits}
|
||||
onClickBtn={(e) => getInputValue(e, item)}
|
||||
unit={formatUnit(item)}
|
||||
minNum={selectList[selectIndex].minNum}
|
||||
maxNum={selectList[selectIndex].maxNum}
|
||||
disable={UpdateShoppingCartLoading}
|
||||
/>
|
||||
</View>
|
||||
</View>
|
||||
</View>
|
||||
})}
|
||||
@ -260,11 +304,11 @@ export default ({show = false, onClose}: param) => {
|
||||
<View className={classnames('iconfont', 'icon-gouwuche', styles.miconfont)}></View>
|
||||
</View>
|
||||
<View className={styles.price_con}>
|
||||
<View className={styles.price_real}><text>￥</text>{estimatePrice}</View>
|
||||
<View className={styles.price_real}><text>￥</text>{estimatePrice.price}</View>
|
||||
<View className={styles.price_forecast}>预估金额</View>
|
||||
</View>
|
||||
<View className={styles.goPay} onClick={() => orderDetail()}>
|
||||
去结算
|
||||
去结算({estimatePrice.color_count})
|
||||
</View>
|
||||
</View>
|
||||
</View>
|
||||
|
||||
@ -29,8 +29,9 @@
|
||||
|
||||
}
|
||||
.sideBar_select_title_select{
|
||||
background-color: $color_bg_one;
|
||||
color: $color_font_one;
|
||||
background-color: #007AFF;
|
||||
color: #fff;
|
||||
border-radius: 0px 14px 14px 0px;
|
||||
}
|
||||
}
|
||||
.sideBar_con{
|
||||
|
||||
@ -104,7 +104,6 @@ export default memo(({list = [],
|
||||
)
|
||||
})
|
||||
}
|
||||
<View className="common_safe_area_y"></View>
|
||||
</ScrollView>
|
||||
<View className={styles.sideBar_con}>
|
||||
<InfiniteScroll statusMore={statusMore} hasMore={hasMore} selfonScrollToLower={() => selfOnScrolltolower?.()} refresherTriggered={refresherTriggered} refresherEnabled={true} selfOnRefresherRefresh={() => selfOnRefresherRefresh?.()}>
|
||||
|
||||
36
src/components/textareaEnhance/index.module.scss
Normal file
36
src/components/textareaEnhance/index.module.scss
Normal file
@ -0,0 +1,36 @@
|
||||
.other_desc{
|
||||
// padding: 0 20px;
|
||||
box-sizing: border-box;
|
||||
.title{
|
||||
font-size: $font_size;
|
||||
font-weight: 700;
|
||||
}
|
||||
.textarea{
|
||||
position: relative;
|
||||
height: 165.4px;
|
||||
.descDataNum{
|
||||
position: absolute;
|
||||
right: 10px;
|
||||
bottom: 10px;
|
||||
font-size: 22px;
|
||||
color: #ABABAB;
|
||||
}
|
||||
}
|
||||
.textarea_con, .textarea_con_pretend{
|
||||
background-color: #f3f3f3;
|
||||
border: 2px solid #e6e6e6;
|
||||
border-radius: 10px;
|
||||
width: 100%;
|
||||
font-size: 25px;
|
||||
height: 165.4px;
|
||||
padding: 20px 20px 30px 20px;
|
||||
box-sizing: border-box;
|
||||
margin-top: 20px;
|
||||
}
|
||||
.textarea_con_pretend{
|
||||
color: $color_font_two;
|
||||
}
|
||||
.textarea_con_pretend_ed{
|
||||
color: #000;
|
||||
}
|
||||
}
|
||||
43
src/components/textareaEnhance/index.tsx
Normal file
43
src/components/textareaEnhance/index.tsx
Normal file
@ -0,0 +1,43 @@
|
||||
import {Textarea, View } from "@tarojs/components";
|
||||
import { memo, useMemo, useState } from "react";
|
||||
import styles from './index.module.scss'
|
||||
import classnames from "classnames";
|
||||
|
||||
//其他说明
|
||||
type Param = {
|
||||
title?: string,
|
||||
onChange?: (val: string) => void,
|
||||
placeholder?: string
|
||||
}
|
||||
export default memo(({onChange, title = '', placeholder = '请输入'}:Param) => {
|
||||
const [descData, setDescData] = useState({
|
||||
number: 0,
|
||||
value: '',
|
||||
count: 200,
|
||||
show: false
|
||||
})
|
||||
const getDesc = (e) => {
|
||||
let value = e.detail.value
|
||||
let res = value
|
||||
if(value.length > descData.count) {
|
||||
res = value.slice(0, descData.count)
|
||||
}
|
||||
setDescData({...descData, number:res.length, value: res})
|
||||
onChange?.(res)
|
||||
}
|
||||
|
||||
const toggleShowRealTextarea = (show) => {
|
||||
setDescData({...descData, show:show})
|
||||
}
|
||||
return (
|
||||
<View className={styles.other_desc}>
|
||||
<View className={styles.title}>{title}</View>
|
||||
<View className={styles.textarea}>
|
||||
{descData.show&&<Textarea autoFocus value={descData.value} onBlur={() => toggleShowRealTextarea(false)} className={styles.textarea_con} cursorSpacing={100} maxlength={descData.count} onInput={(e) => getDesc(e)}></Textarea>||
|
||||
<View className={classnames(styles.textarea_con_pretend, descData.value&&styles.textarea_con_pretend_ed)} onClick={() => toggleShowRealTextarea(true)}>{descData.value||placeholder}</View>
|
||||
}
|
||||
<View className={styles.descDataNum}>{descData.number +'/'+ descData.count}</View>
|
||||
</View>
|
||||
</View>
|
||||
)
|
||||
})
|
||||
55
src/components/uploadImage/index.module.scss
Normal file
55
src/components/uploadImage/index.module.scss
Normal file
@ -0,0 +1,55 @@
|
||||
.image_main{
|
||||
display: flex;
|
||||
align-items: center;
|
||||
flex-wrap: wrap;
|
||||
.uploadImg{
|
||||
width: 202px;
|
||||
height: 150px;
|
||||
background: #f0f0f0;
|
||||
border: 2px dashed #cccccc;
|
||||
border-radius: 10px;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
position: relative;
|
||||
margin: 0 0 20px 20px;
|
||||
position: relative;
|
||||
.miconfont{
|
||||
font-size: 50px;
|
||||
}
|
||||
.uploadText{
|
||||
font-size: 26px;
|
||||
color: $color_font_three;
|
||||
}
|
||||
|
||||
|
||||
}
|
||||
.ImgItem{
|
||||
width: 202px;
|
||||
height: 150px;
|
||||
background: #f0f0f0;
|
||||
margin-left: 20px;
|
||||
margin-bottom: 20px;
|
||||
position: relative;
|
||||
border-radius: 10px;
|
||||
image{
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
border-radius: 10px;
|
||||
}
|
||||
.miconfont_close{
|
||||
width: 43px;
|
||||
height: 43px;
|
||||
background-color: #ccc;
|
||||
border-radius: 50%;
|
||||
position: absolute;
|
||||
right: -10px;
|
||||
top: -10px;
|
||||
text-align: center;
|
||||
line-height: 43px;
|
||||
color: #fff;
|
||||
font-size: 30px;
|
||||
}
|
||||
}
|
||||
}
|
||||
59
src/components/uploadImage/index.tsx
Normal file
59
src/components/uploadImage/index.tsx
Normal file
@ -0,0 +1,59 @@
|
||||
import Taro, { FC } from "@tarojs/taro"
|
||||
import { memo, useEffect, useState } from "react"
|
||||
import useUploadCDNImg from "@/use/useUploadImage";
|
||||
import { Image, Text, View } from "@tarojs/components";
|
||||
import { formatImgUrl } from "@/common/fotmat";
|
||||
import classnames from "classnames";
|
||||
import styles from './index.module.scss'
|
||||
|
||||
//图片列表
|
||||
type ImageParam = {
|
||||
onChange?:(val: string[]) => void
|
||||
}
|
||||
const PictureItem:FC<ImageParam> = memo(({onChange}) => {
|
||||
const {getWxPhoto} = useUploadCDNImg()
|
||||
const [imageList, setImageLise] = useState<string[]>([])
|
||||
//上传图片
|
||||
const uploadImage = async () => {
|
||||
let res:any = await getWxPhoto('after-sale')
|
||||
if(res.code == 200) {
|
||||
setImageLise([...imageList, res.url])
|
||||
}
|
||||
}
|
||||
//删除图片
|
||||
const delImage = (index) => {
|
||||
imageList.splice(index,1)
|
||||
setImageLise(() => [...imageList])
|
||||
}
|
||||
//监听上传的图片变化
|
||||
useEffect(() => {
|
||||
onChange?.(imageList||[])
|
||||
}, [imageList])
|
||||
|
||||
//预览图片
|
||||
const showImage = () => {
|
||||
let list = imageList.map(item => {
|
||||
return formatImgUrl(item)
|
||||
})
|
||||
Taro.previewImage({
|
||||
current: list[0], // 当前显示
|
||||
urls: list // 需要预览的图片http链接列表
|
||||
})
|
||||
}
|
||||
|
||||
return (
|
||||
<View className={styles.image_main}>
|
||||
{imageList.map((item, index) =>
|
||||
<View className={styles.ImgItem}>
|
||||
<Image mode="aspectFill" src={formatImgUrl(item)} onClick={showImage}></Image>
|
||||
<View onClick={() => delImage(index)} className={classnames(styles.miconfont_close, 'iconfont icon-qingkong')}></View>
|
||||
</View>)}
|
||||
<View className={styles.uploadImg } onClick={uploadImage}>
|
||||
<Text className={classnames(styles.miconfont, 'iconfont icon-saomazhifu')}></Text>
|
||||
<Text className={styles.uploadText}>上传照片</Text>
|
||||
</View>
|
||||
</View>
|
||||
)
|
||||
})
|
||||
|
||||
export default PictureItem
|
||||
@ -55,9 +55,9 @@ export default ()=>{
|
||||
const rules = {
|
||||
name: [{
|
||||
message: "请输入正确收货人姓名",
|
||||
validator: (value:any, rule:any)=>{ // 自定义验证，返回true表示匹配到了(错误)
|
||||
return value.length>5;
|
||||
}
|
||||
// validator: (value:any, rule:any)=>{ // 自定义验证，返回true表示匹配到了(错误)
|
||||
// return value.length>5;
|
||||
// }
|
||||
}],
|
||||
phone: [{
|
||||
message: "请输入正确的电话号码", regex: /^1[3|5|6|9|2|8|7]\d{9}$/
|
||||
|
||||
@ -0,0 +1,64 @@
|
||||
.apply_after_sales_list{
|
||||
padding: 0 20px;
|
||||
.apply_after_sales_item{
|
||||
margin-bottom: 50px;
|
||||
.apply_after_sales_title{
|
||||
display: flex;
|
||||
align-items: center;
|
||||
.tag{
|
||||
font-size: $font_size_min;
|
||||
background-color: #CDE5FF;
|
||||
padding: 5px 10px;
|
||||
border-radius: 6px;
|
||||
color: $color_main;
|
||||
}
|
||||
.title{
|
||||
font-weight: 700;
|
||||
font-size: $font_size;
|
||||
margin-left: 20px;
|
||||
flex:1;
|
||||
}
|
||||
}
|
||||
.color_list {
|
||||
.color_item{
|
||||
display: flex;
|
||||
align-items: center;
|
||||
margin: 30px 0;
|
||||
}
|
||||
.image{
|
||||
width: 70px;
|
||||
height: 70px;
|
||||
image{
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
border-radius: 50%;
|
||||
}
|
||||
}
|
||||
.name_and_number{
|
||||
padding-left: 30px;
|
||||
flex:1;
|
||||
text{
|
||||
&:nth-child(1) {
|
||||
font-weight: 700;
|
||||
font-size: $font_size;
|
||||
}
|
||||
&:nth-child(2) {
|
||||
color: $color_font_two;
|
||||
font-size: $font_size;
|
||||
margin-left: 20px;
|
||||
}
|
||||
}
|
||||
}
|
||||
.btn_count{
|
||||
width: 216px;
|
||||
height: 64px;
|
||||
background-color: #ECF5FF;
|
||||
border-radius: 40px 0px 16px 0px;
|
||||
padding: 0 20px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
71
src/pages/applyAfterSales/components/kindList/index.tsx
Normal file
71
src/pages/applyAfterSales/components/kindList/index.tsx
Normal file
@ -0,0 +1,71 @@
|
||||
import { formatHashTag, formatImgUrl } from "@/common/fotmat";
|
||||
import Counter from "@/components/counter";
|
||||
import MCheckbox from "@/components/checkbox";
|
||||
import { Image, Text, View } from "@tarojs/components";
|
||||
import { FC, memo, useCallback } from "react";
|
||||
import styles from './index.module.scss'
|
||||
|
||||
type OrderParam = {
|
||||
list?: any[],
|
||||
sale_mode?: number,
|
||||
sale_mode_name?: string,
|
||||
unit?: string,
|
||||
total_colors?: number,
|
||||
total_fabrics?: number,
|
||||
total_number?: number,
|
||||
status?: number, //订单状态
|
||||
}
|
||||
|
||||
type Param = {
|
||||
order: OrderParam,
|
||||
onNumChange?: (val:any) => void
|
||||
onSelectChange?: (val: {color_id:number, length: number, status: true|false}) => void
|
||||
}
|
||||
|
||||
const kindeList:FC<Param> = memo(({order, onNumChange, onSelectChange}) => {
|
||||
//对应数量
|
||||
const formatCount = useCallback((item) => {
|
||||
return (order?.sale_mode == 0? item.roll : Number(item.length / 100)) + order?.unit
|
||||
}, [order])
|
||||
|
||||
//计步器失返回值
|
||||
const getCounterChange = useCallback((colorItem) => {
|
||||
return (number) => {
|
||||
onNumChange?.({number, color_id: colorItem.id})
|
||||
}
|
||||
}, [])
|
||||
|
||||
//checkbox选中回调
|
||||
const selectCallBack = (colorItem) => {
|
||||
console.log('colorItem::',colorItem)
|
||||
onSelectChange?.({color_id:colorItem.id, length:colorItem.length, status: true})
|
||||
}
|
||||
|
||||
//checkbox关闭回调
|
||||
const colseCallBack = (colorItem) => {
|
||||
onSelectChange?.({color_id:colorItem.id, length:colorItem.length, status: false})
|
||||
}
|
||||
|
||||
return (
|
||||
<View className={styles.apply_after_sales_list}>
|
||||
{order?.list?.map(item => <View className={styles.apply_after_sales_item}>
|
||||
<View className={styles.apply_after_sales_title}>
|
||||
<View className={styles.tag}>{order.sale_mode_name}</View>
|
||||
<View className={styles.title}>{formatHashTag(item.code, item.name)}</View>
|
||||
</View>
|
||||
<View className={styles.color_list}>
|
||||
{item.product_colors.map(colorItem => <View className={styles.color_item}>
|
||||
<View className={styles.image}><Image src={formatImgUrl('')}/></View>
|
||||
<View className={styles.name_and_number}><Text>{colorItem.code + ' ' + colorItem.name}</Text><Text>x {formatCount(colorItem)}</Text></View>
|
||||
{(order.sale_mode == 0)&&<View className={styles.btn_count}>
|
||||
<Counter maxNum={colorItem.roll} onChange={getCounterChange(colorItem)}/>
|
||||
</View>||
|
||||
<MCheckbox status={item.select} onSelect={() => selectCallBack(colorItem)} onClose={() => colseCallBack(colorItem)}/>}
|
||||
</View>)}
|
||||
</View>
|
||||
</View>)}
|
||||
</View>
|
||||
)
|
||||
})
|
||||
|
||||
export default kindeList
|
||||
@ -0,0 +1,36 @@
|
||||
.other_desc{
|
||||
padding: 0 20px;
|
||||
box-sizing: border-box;
|
||||
.title{
|
||||
font-size: $font_size;
|
||||
font-weight: 700;
|
||||
}
|
||||
.textarea{
|
||||
position: relative;
|
||||
height: 165.4px;
|
||||
.descDataNum{
|
||||
position: absolute;
|
||||
right: 10px;
|
||||
bottom: 10px;
|
||||
font-size: 22px;
|
||||
color: #ABABAB;
|
||||
}
|
||||
}
|
||||
.textarea_con, .textarea_con_pretend{
|
||||
background-color: #f3f3f3;
|
||||
border: 2px solid #e6e6e6;
|
||||
border-radius: 10px;
|
||||
width: 100%;
|
||||
font-size: 25px;
|
||||
height: 165.4px;
|
||||
padding: 20px 20px 30px 20px;
|
||||
box-sizing: border-box;
|
||||
margin-top: 20px;
|
||||
}
|
||||
.textarea_con_pretend{
|
||||
color: $color_font_two;
|
||||
}
|
||||
.textarea_con_pretend_ed{
|
||||
color: #000;
|
||||
}
|
||||
}
|
||||
41
src/pages/applyAfterSales/components/otherReason/index.tsx
Normal file
41
src/pages/applyAfterSales/components/otherReason/index.tsx
Normal file
@ -0,0 +1,41 @@
|
||||
import {Textarea, View } from "@tarojs/components";
|
||||
import { memo, useMemo, useState } from "react";
|
||||
import styles from './index.module.scss'
|
||||
import classnames from "classnames";
|
||||
|
||||
//其他说明
|
||||
type Param = {
|
||||
onChange: (val: string) => void
|
||||
}
|
||||
export default memo(({onChange}:Param) => {
|
||||
const [descData, setDescData] = useState({
|
||||
number: 0,
|
||||
value: '',
|
||||
count: 200,
|
||||
show: false
|
||||
})
|
||||
const getDesc = (e) => {
|
||||
let value = e.detail.value
|
||||
let res = value
|
||||
if(value.length > descData.count) {
|
||||
res = value.slice(0, descData.count)
|
||||
}
|
||||
setDescData({...descData, number:res.length, value: res})
|
||||
onChange?.(res)
|
||||
}
|
||||
|
||||
const toggleShowRealTextarea = (show) => {
|
||||
setDescData({...descData, show:show})
|
||||
}
|
||||
return (
|
||||
<View className={styles.other_desc}>
|
||||
<View className={styles.title}>其他说明</View>
|
||||
<View className={styles.textarea}>
|
||||
{descData.show&&<Textarea autoFocus value={descData.value} onBlur={() => toggleShowRealTextarea(false)} className={styles.textarea_con} cursorSpacing={100} maxlength={descData.count} onInput={(e) => getDesc(e)}></Textarea>||
|
||||
<View className={classnames(styles.textarea_con_pretend, descData.value&&styles.textarea_con_pretend_ed)} onClick={() => toggleShowRealTextarea(true)}>{descData.value||'一般情况下选填，当退货说明=“其它问题”时，必填'}</View>
|
||||
}
|
||||
<View className={styles.descDataNum}>{descData.number +'/'+ descData.count}</View>
|
||||
</View>
|
||||
</View>
|
||||
)
|
||||
})
|
||||
@ -0,0 +1,27 @@
|
||||
.reason_return_con{
|
||||
height: 50vh;
|
||||
.reason_title{
|
||||
padding: 10px 20px 0 20px;
|
||||
height: 60px;
|
||||
border-bottom: 1PX solid #F3F3F3;
|
||||
box-sizing: border-box;
|
||||
Text{
|
||||
font-size: 26px;
|
||||
border-bottom: 3px solid #000;
|
||||
padding: 10px;
|
||||
font-weight: 400;
|
||||
}
|
||||
|
||||
}
|
||||
.reason_scroll{
|
||||
height: calc(100% - 70px);
|
||||
.reason_list{
|
||||
font-size: 26px;
|
||||
padding: 30px 20px 0 20px;
|
||||
color: #707070;
|
||||
.reason_item{
|
||||
margin-bottom: 36px;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
27
src/pages/applyAfterSales/components/reasonPopup/index.tsx
Normal file
27
src/pages/applyAfterSales/components/reasonPopup/index.tsx
Normal file
@ -0,0 +1,27 @@
|
||||
import Popup from "@/components/popup";
|
||||
import { ScrollView, Text, View } from "@tarojs/components";
|
||||
import { memo, useMemo } from "react";
|
||||
import styles from './index.module.scss'
|
||||
|
||||
//原因选择
|
||||
type ReasonInfoParam = {
|
||||
show?: boolean,
|
||||
onClose?: () => void,
|
||||
title?: string,
|
||||
list?: {id:number, name:string}[]
|
||||
}
|
||||
export default memo(({show = false, onClose, title = '', list= []}: ReasonInfoParam) => {
|
||||
|
||||
return (
|
||||
<Popup showIconButton={false} show={show} title={title} onClose={onClose} >
|
||||
<View className={styles.reason_return_con}>
|
||||
<View className={styles.reason_title}><Text>{title}</Text></View>
|
||||
<ScrollView scrollY className={styles.reason_scroll}>
|
||||
<View className={styles.reason_list}>
|
||||
{list.map(item => <View key={item.id} className={styles.reason_item}>{item.name}</View> )}
|
||||
</View>
|
||||
</ScrollView>
|
||||
</View>
|
||||
</Popup>
|
||||
)
|
||||
})
|
||||
4
src/pages/applyAfterSales/index.config.ts
Normal file
4
src/pages/applyAfterSales/index.config.ts
Normal file
@ -0,0 +1,4 @@
|
||||
export default {
|
||||
navigationBarTitleText: '申请售后',
|
||||
enableShareAppMessage: true,
|
||||
}
|
||||
107
src/pages/applyAfterSales/index.module.scss
Normal file
107
src/pages/applyAfterSales/index.module.scss
Normal file
@ -0,0 +1,107 @@
|
||||
|
||||
.apply_after_sales_main{
|
||||
.apply_after_sales_head{
|
||||
font-size: 30px;
|
||||
text-align: center;
|
||||
padding: 20px 0;
|
||||
font-weight: 700;
|
||||
}
|
||||
.kind_number{
|
||||
width: 100%;
|
||||
padding: 20px;
|
||||
box-sizing: border-box;
|
||||
border-bottom: 1PX solid #f3f3f3;
|
||||
text{
|
||||
background-color: #F6F6F6;
|
||||
border-radius: 10px;
|
||||
font-size: $font_size_medium;
|
||||
padding: 5px 0;
|
||||
text-align: center;
|
||||
width: 100%;
|
||||
display: block;
|
||||
color: $color_font_three;
|
||||
}
|
||||
}
|
||||
.apply_after_sales_con{
|
||||
.scroll{
|
||||
height: calc(100% - 170px);
|
||||
}
|
||||
.scroll_con{
|
||||
padding: 20px 0 150px 0;
|
||||
}
|
||||
.returnSaleInput{
|
||||
margin: 0 20px;
|
||||
padding-top: 30px;
|
||||
border-top: 1px solid #F6F6F6;
|
||||
.returnSaleInput_item{
|
||||
display: flex;
|
||||
align-items: center;
|
||||
padding-bottom: 30px;
|
||||
flex-wrap: wrap;
|
||||
.title{
|
||||
font-size: $font_size;
|
||||
font-weight: 700;
|
||||
width: 119px;
|
||||
}
|
||||
.select{
|
||||
flex:1;
|
||||
height: 60px;
|
||||
border: 2px solid #e6e6e6;
|
||||
border-radius: 10px;
|
||||
margin-left: 20px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
padding: 0 20px;
|
||||
font-size: 26px;
|
||||
color: $color_font_two;
|
||||
.miconfont{
|
||||
font-size: 30px;
|
||||
}
|
||||
}
|
||||
.upload_image{
|
||||
flex:1;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
|
||||
.btns_con{
|
||||
width: 100%;
|
||||
position: fixed;
|
||||
bottom:0;
|
||||
padding: 0 20px;
|
||||
box-sizing: border-box;
|
||||
padding-bottom: constant(safe-area-inset-bottom);
|
||||
padding-bottom: env(safe-area-inset-bottom);
|
||||
.btns_two{
|
||||
display: flex;
|
||||
height: 82px;
|
||||
// border: 1PX solid #007aff;
|
||||
font-size: $font_size_big;
|
||||
border-radius: 40px;
|
||||
margin-bottom: 20px;
|
||||
.rest_btn{
|
||||
flex:1;
|
||||
border: 1PX solid #007aff;
|
||||
border-radius: 40px 0 0 40px;
|
||||
text-align: center;
|
||||
line-height: 82px;
|
||||
color: $color_main;
|
||||
background-color: #fff;
|
||||
|
||||
}
|
||||
.verify_btn{
|
||||
flex:1;
|
||||
border-radius: 0 40px 40px 0;
|
||||
background: #007aff;
|
||||
text-align: center;
|
||||
line-height: 82px;
|
||||
color: #fff;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
211
src/pages/applyAfterSales/index.tsx
Normal file
211
src/pages/applyAfterSales/index.tsx
Normal file
@ -0,0 +1,211 @@
|
||||
import { Image, ScrollView, Text, View } from "@tarojs/components";
|
||||
import { FC, memo, useCallback, useEffect, useMemo, useRef, useState } from "react";
|
||||
import classnames from "classnames";
|
||||
import styles from './index.module.scss'
|
||||
import ReasonPopup from "./components/reasonPopup";
|
||||
import OtherReason from "./components/otherReason";
|
||||
import { useDidShow, useRouter } from "@tarojs/taro";
|
||||
import { GetSaleOrderDetailApi } from "@/api/order";
|
||||
import KindList from "./components/kindList"
|
||||
import { ReturnApplyOrderApi, ReturnGoodsStatusApi } from "@/api/salesAfterOrder";
|
||||
import { alert, goLink } from "@/common/common";
|
||||
import UploadImage from "@/components/uploadImage"
|
||||
import TextareaEnhance from "@/components/textareaEnhance";
|
||||
|
||||
type ReasonParam = 1|2|3 //1 退货原因 2 货物状况 3 退货说明
|
||||
export default () => {
|
||||
|
||||
useDidShow(() => {
|
||||
getSaleOrderPreView()
|
||||
})
|
||||
|
||||
const router = useRouter()
|
||||
const orderId = useRef<number>(Number(router.params.id))
|
||||
|
||||
//需要提交的数据
|
||||
const [submitData, setSubmitData] = useState<any>({
|
||||
fabric_piece_accessory_url: [],
|
||||
goods_status: 0,
|
||||
reason_describe: '',
|
||||
return_explain: 0,
|
||||
return_reason: 1,
|
||||
roll: 0,
|
||||
roll_list: [],
|
||||
sale_order_id: orderId.current
|
||||
})
|
||||
|
||||
//获取订单数据
|
||||
const [orderDetail, setOrderDetail] = useState<any>() //获取到的原始数据
|
||||
const {fetchData: getOrderFetchData} = GetSaleOrderDetailApi()
|
||||
const getSaleOrderPreView = async () => {
|
||||
if(orderId.current) {
|
||||
let res = await getOrderFetchData({id: orderId.current})
|
||||
setOrderDetail(res.data)
|
||||
}
|
||||
}
|
||||
|
||||
//监听获取到的数据
|
||||
useEffect(() => {
|
||||
if(orderDetail) {
|
||||
formatData()
|
||||
}
|
||||
}, [orderDetail])
|
||||
|
||||
//格式化数据格式
|
||||
const [formatDetailOrder, setFormatDetailOrder] = useState<any>() //格式化后的数据
|
||||
const formatData = () => {
|
||||
setFormatDetailOrder({
|
||||
sale_mode: orderDetail.sale_mode,
|
||||
sale_mode_name: orderDetail.sale_mode_name,
|
||||
total_colors: orderDetail.total_colors, //总颜色数量
|
||||
total_number: orderDetail.total_number, //总数量
|
||||
total_fabrics: orderDetail.total_fabrics, //面料数量
|
||||
unit: orderDetail.sale_mode == 0?'条':'m', //单位
|
||||
list: orderDetail.product_list,
|
||||
status: orderDetail.status, //订单状态
|
||||
|
||||
})
|
||||
}
|
||||
|
||||
//数据总量
|
||||
const dataCount = useMemo(() => {
|
||||
if(formatDetailOrder) {
|
||||
return `${formatDetailOrder.total_fabrics}种面料，${formatDetailOrder.total_colors}种颜色，共${formatDetailOrder.total_number}条`
|
||||
}
|
||||
}, [formatDetailOrder])
|
||||
|
||||
|
||||
//退货选择弹窗
|
||||
const [showReason, setShowReason] = useState<{show:true|false, title: string}>({show:false, title: ''})
|
||||
const closeReason = useCallback(() => setShowReason({...showReason, show:false}), [])
|
||||
const onShowReason = (status) => {
|
||||
setShowReason({...showReason, show:true})
|
||||
}
|
||||
|
||||
//面料数据
|
||||
let roll_list = useRef({})
|
||||
|
||||
//大货时获取计步器数据
|
||||
const getNumChange = useCallback((val) => {
|
||||
if(parseInt(val.number) > 0) {
|
||||
roll_list.current[val.color_id] = {product_color_id: val.color_id, product_roll: val.number}
|
||||
} else {
|
||||
delete roll_list.current[val.color_id]
|
||||
}
|
||||
|
||||
let count = 0
|
||||
Object.values(roll_list.current).map((item: any) => {
|
||||
count += item.product_roll
|
||||
})
|
||||
setSubmitData((e) => ({...e, roll_list:Object.values(roll_list.current), roll: count}))
|
||||
}, [])
|
||||
|
||||
//散剪和剪板
|
||||
const getSelectChange = useCallback((val) => {
|
||||
console.log('val::', val)
|
||||
if(val.status) {
|
||||
roll_list.current[val.color_id] = {product_color_id: val.color_id, product_roll: val.length}
|
||||
} else {
|
||||
delete roll_list.current[val.color_id]
|
||||
}
|
||||
let count = 0
|
||||
Object.values(roll_list.current).map((item: any) => {
|
||||
count += item.product_roll
|
||||
})
|
||||
setSubmitData((e) => ({...e, roll_list:Object.values(roll_list.current), roll: count}))
|
||||
}, [])
|
||||
|
||||
//获取图片列表
|
||||
const getImageList = useCallback((list) => {
|
||||
setSubmitData((e) => ({...e, fabric_piece_accessory_url:list}))
|
||||
}, [])
|
||||
|
||||
//其他说明
|
||||
const getOtherReason = useCallback((val) => {
|
||||
setSubmitData((e) => ({...e, reason_describe: val}))
|
||||
}, [])
|
||||
|
||||
//提交数据
|
||||
const {fetchData: fetchDataReturnApply} = ReturnApplyOrderApi()
|
||||
const onSubmitData = async () => {
|
||||
if(submitData.roll_list.length <= 0) return alert.error('请选择退货颜色')
|
||||
let res = await fetchDataReturnApply(submitData)
|
||||
if(res.success) {
|
||||
alert.success('申请成功')
|
||||
goLink('/pages/salesAfterList/index',{}, 'reLaunch')
|
||||
} else {
|
||||
alert.error('申请失败')
|
||||
}
|
||||
console.log('提交：：',submitData)
|
||||
}
|
||||
|
||||
//底部按钮
|
||||
const onSubmit = (val) => {
|
||||
if(val == 2) {
|
||||
onSubmitData()
|
||||
}
|
||||
}
|
||||
|
||||
const [returnGoodsInfo, setReturnGoodsInfo] = useState<{title:string, list: any[]}>({title:'', list:[]})
|
||||
//售后货物状况
|
||||
const {fetchData: fetchDataGoodsStatus} = ReturnGoodsStatusApi()
|
||||
const getReturnGoodsStatus = async () => {
|
||||
let res = await fetchDataGoodsStatus()
|
||||
setReturnGoodsInfo((e) => ({...e, title: '售后货物状况', list:res.data?.list||[]}))
|
||||
}
|
||||
useEffect(() => {
|
||||
getReturnGoodsStatus()
|
||||
}, [])
|
||||
|
||||
return (
|
||||
<View className={styles.apply_after_sales_main}>
|
||||
<View className={styles.apply_after_sales_con}>
|
||||
<View className={styles.kind_number}><Text>{dataCount}</Text></View>
|
||||
<ScrollView scrollY className={styles.scroll}>
|
||||
<View className={styles.scroll_con}>
|
||||
<KindList order={formatDetailOrder} onNumChange={getNumChange} onSelectChange={getSelectChange}/>
|
||||
<View className={styles.returnSaleInput}>
|
||||
<View className={styles.returnSaleInput_item}>
|
||||
<View className={styles.title}>退货原因</View>
|
||||
<View className={styles.select} onClick={() => onShowReason(1)}>
|
||||
<Text>请选择</Text>
|
||||
<Text className={classnames(styles.miconfont, 'iconfont icon-a-moreback')}></Text>
|
||||
</View>
|
||||
</View>
|
||||
<View className={styles.returnSaleInput_item}>
|
||||
<View className={styles.title}>货物状况</View>
|
||||
<View className={styles.select} onClick={() => onShowReason(2)}>
|
||||
<Text>请选择</Text>
|
||||
<Text className={classnames(styles.miconfont, 'iconfont icon-a-moreback')}></Text>
|
||||
</View>
|
||||
</View>
|
||||
<View className={styles.returnSaleInput_item}>
|
||||
<View className={styles.title}>退货说明</View>
|
||||
<View className={styles.select} onClick={() => onShowReason(3)}>
|
||||
<Text>请选择</Text>
|
||||
<Text className={classnames(styles.miconfont, 'iconfont icon-a-moreback')}></Text>
|
||||
</View>
|
||||
</View>
|
||||
<View className={styles.returnSaleInput_item}>
|
||||
<View className={styles.title}>拍照上传</View>
|
||||
<View className={styles.upload_image}>
|
||||
<UploadImage onChange={getImageList}/>
|
||||
</View>
|
||||
</View>
|
||||
<TextareaEnhance onChange={getOtherReason} title='其他说明'/>
|
||||
</View>
|
||||
|
||||
</View>
|
||||
</ScrollView>
|
||||
<View className="common_safe_area_y"></View>
|
||||
</View>
|
||||
<View className={styles.btns_con}>
|
||||
<View className={styles.btns_two}>
|
||||
<View className={styles.rest_btn} onClick={() => onSubmit(1)}>取消</View>
|
||||
<View className={styles.verify_btn } onClick={() => onSubmit(2)}>确认</View>
|
||||
</View >
|
||||
</View >
|
||||
<ReasonPopup show={showReason.show} onClose={closeReason} title={returnGoodsInfo.title} list={returnGoodsInfo.list}/>
|
||||
</View>
|
||||
)
|
||||
}
|
||||
22
src/pages/certification/components/SelectEnterpriseType.scss
Normal file
22
src/pages/certification/components/SelectEnterpriseType.scss
Normal file
@ -0,0 +1,22 @@
|
||||
.select-enterprise-type{
|
||||
.select-enterprise-type-btn{
|
||||
color: #ABABAB;
|
||||
font-size: 28px;
|
||||
padding: 20px;
|
||||
display: flex;justify-content: space-between;
|
||||
border-bottom: 1rpx solid #eaeaea;
|
||||
}
|
||||
.select-enterprise-type-content{
|
||||
padding: 0 20px;
|
||||
padding-bottom: 120px;
|
||||
}
|
||||
.select-enterprise-type-content view{
|
||||
padding: 20px 0;
|
||||
font-size: 28px;
|
||||
display: flex;justify-content: space-between;
|
||||
}
|
||||
.select-enterprise-type-content view text:last-child{
|
||||
color: #007AFF;
|
||||
font-size: 35px;
|
||||
}
|
||||
}
|
||||
56
src/pages/certification/components/SelectEnterpriseType.tsx
Normal file
56
src/pages/certification/components/SelectEnterpriseType.tsx
Normal file
@ -0,0 +1,56 @@
|
||||
import { Text, View } from "@tarojs/components"
|
||||
import Popup from "@/components/popup";
|
||||
import "./SelectEnterpriseType.scss"
|
||||
import { forwardRef, useEffect, useImperativeHandle, useState } from "react";
|
||||
import {certificationTypeListApi} from "@/api/certification"
|
||||
|
||||
interface Params{
|
||||
confirm?: (selected:any)=>void, // 确定
|
||||
}
|
||||
|
||||
export default forwardRef((props: Params, ref)=>{
|
||||
const [modalShow, setModalShow] = useState(false)
|
||||
// 获取认证信息
|
||||
const {fetchData, state} = certificationTypeListApi();
|
||||
useEffect(()=>{
|
||||
fetchData();
|
||||
}, [])
|
||||
const [selected, setSelected] = useState({});
|
||||
// 确定
|
||||
const handleSelect = (item)=>{
|
||||
setSelected(item);
|
||||
}
|
||||
// 设置弹窗是否显示
|
||||
const setShow = (ev)=>{
|
||||
setModalShow(ev);
|
||||
}
|
||||
useImperativeHandle(ref,()=>({
|
||||
setShow
|
||||
}))
|
||||
// 确定
|
||||
const handleConfirm = ()=>{
|
||||
props.confirm&&props.confirm(selected);
|
||||
setModalShow(false);
|
||||
}
|
||||
|
||||
return (
|
||||
<View className="select-enterprise-type">
|
||||
<Popup showTitle={false} show={modalShow} onClose={() => setModalShow(false)}>
|
||||
<View className="select-enterprise-type-btn">
|
||||
<View onClick={() => setModalShow(false)}>取消</View>
|
||||
<View onClick={handleConfirm}>确定</View>
|
||||
</View>
|
||||
<View className="select-enterprise-type-content">
|
||||
{
|
||||
state.data?.list?.map((item,index)=>{
|
||||
return <View onClick={()=>handleSelect(item)} key={index}>
|
||||
<Text>{item.name}</Text>
|
||||
{item.id==(selected as any).id?<Text className="iconfont icon-tick"/>:<Text/>}
|
||||
</View>
|
||||
})
|
||||
}
|
||||
</View>
|
||||
</Popup>
|
||||
</View>
|
||||
)
|
||||
})
|
||||
@ -16,6 +16,7 @@
|
||||
margin-left: 30px;
|
||||
padding-top: 40px;
|
||||
color: #000000;
|
||||
padding-bottom: 20px;
|
||||
// border-top: 18px solid #F0F0F0;
|
||||
}
|
||||
.certification-upload{
|
||||
@ -38,6 +39,10 @@
|
||||
.certification-upload-no{
|
||||
display: flex;flex-direction: column;align-items: center;
|
||||
}
|
||||
.certification-upload image{
|
||||
position: absolute;width: 100%;height: 100%;
|
||||
object-fit: cover;border-radius: 30px;
|
||||
}
|
||||
.certification-upload-no-icon{
|
||||
width: 104px;
|
||||
height: 104px;
|
||||
@ -56,10 +61,11 @@
|
||||
}
|
||||
.certification-button{
|
||||
position: absolute;bottom: -10px;left: -10px;right: -10px;
|
||||
background-color: #858A8F;
|
||||
background-color: rgba(0,0,0,0.65);
|
||||
display: flex;
|
||||
height: 86px;
|
||||
border-radius: 0 0 30px 30px;
|
||||
z-index: 1;
|
||||
}
|
||||
.certification-button view{
|
||||
flex: 1;
|
||||
@ -79,6 +85,7 @@
|
||||
position: fixed;bottom: 0;left: 0;right: 0;
|
||||
width: 100%;
|
||||
display: flex;align-items: center;justify-content: center;
|
||||
z-index: 2;
|
||||
}
|
||||
.certification-footer-button{
|
||||
width: 696px;
|
||||
@ -90,12 +97,16 @@
|
||||
box-sizing: border-box;
|
||||
overflow: hidden;
|
||||
}
|
||||
.certification-footer-button view{
|
||||
.certification-footer-button view,.certification-footer-button navigator{
|
||||
flex: 1;
|
||||
display: flex;align-items: center;justify-content: center;
|
||||
font-size: 32px;
|
||||
font-weight: 400;
|
||||
color: #007aff;
|
||||
border: 0;border-radius: none;
|
||||
}
|
||||
.certification-footer-button navigator::after{
|
||||
border: 0;border-radius: none;
|
||||
}
|
||||
.certification-footer-button view:last-child{
|
||||
color: white;
|
||||
|
||||
@ -1,72 +1,79 @@
|
||||
|
||||
import FromListCertification from "@/components/FromListCertification"
|
||||
import { Button, Input, Text, Textarea, View } from "@tarojs/components"
|
||||
import { Button, Image, Input, NavigationBar, Navigator, Text, Textarea, View } from "@tarojs/components"
|
||||
import Taro, { setNavigationBarTitle, useRouter } from "@tarojs/taro"
|
||||
import {weightAddApi, weightDetailApi,weightEditApi} from "@/api/weightList"
|
||||
import { useEffect, useState } from "react"
|
||||
import { certificationSaveApi, certificationDetailApi } from "@/api/certification"
|
||||
import { useEffect, useRef, useState } from "react"
|
||||
import { alert, retrieval } from "@/common/common"
|
||||
import "./index.scss"
|
||||
import useUploadCDNImg from "@/use/useUploadImage";
|
||||
import Message from "@/components/Message"
|
||||
import { IMG_CND_Prefix } from "@/common/constant";
|
||||
import SelectEnterpriseType from "./components/SelectEnterpriseType"
|
||||
import { useSelector } from "@/reducers/hooks";
|
||||
import useLogin from "@/use/useLogin";
|
||||
|
||||
export default () => {
|
||||
const {type,id} = useRouter().params;
|
||||
const { getAdminUserInfo } = useLogin();
|
||||
const { adminUserInfo } = useSelector(state => state.userInfo);
|
||||
useEffect(() => {
|
||||
if(type=="add"){
|
||||
setNavigationBarTitle({title:"添加码单信息"})
|
||||
}else{
|
||||
initalFormData();
|
||||
setNavigationBarTitle({title:"修改码单信息"})
|
||||
}
|
||||
}, []);
|
||||
// 获取编辑码单信息
|
||||
const {fetchData: getFromData} = weightDetailApi()
|
||||
// 获取认证信息
|
||||
const { fetchData: getFromData } = certificationDetailApi()
|
||||
const initalFormData = async () => {
|
||||
const detail = await getFromData({id});
|
||||
const detail = await getFromData();
|
||||
setFormData({
|
||||
title: detail.data.title,
|
||||
purchaser_name: detail.data.purchaser_name,
|
||||
phone: detail.data.phone,
|
||||
is_default: detail.data.is_default,
|
||||
id: detail.data.id,
|
||||
})
|
||||
...detail.data ?? {},
|
||||
legal_person_identity_url: detail?.data?.legal_person_identity_url ?? [],
|
||||
// business_license_url: "https://test.cdn.zzfzyc.com/mall/827082e888860dd9da10f0fbb0ac3cf023081456.png"
|
||||
} as any)
|
||||
}
|
||||
// 保存
|
||||
const [formData, setFormData] = useState({
|
||||
title: "",
|
||||
purchaser_name: "",
|
||||
phone: "",
|
||||
is_default: false,
|
||||
id: 0
|
||||
})
|
||||
authentication_type: 0,
|
||||
authentication_type_name: "",
|
||||
business_license_url: "",
|
||||
legal_person: "",
|
||||
legal_person_identity: "",
|
||||
businessLicense: '',
|
||||
legal_person_identity_url: [],
|
||||
name: ""
|
||||
});
|
||||
const rules = {
|
||||
title: [{
|
||||
message: "请输入抬头"
|
||||
authentication_type: [{
|
||||
message: "请选择认证类型"
|
||||
}],
|
||||
purchaser_name: [{
|
||||
message: "请输入客户名称"
|
||||
name: [{
|
||||
message: "请输入企业名称"
|
||||
}],
|
||||
phone: [{
|
||||
message: "请输入正确的电话号码", regex: /^1[3|5|6|9|2|8|7]\d{9}$/
|
||||
}]
|
||||
business_license_url: [{
|
||||
message: "请上传营业执照"
|
||||
}],
|
||||
legal_person: [{
|
||||
message: "请输入法人名称"
|
||||
}],
|
||||
legal_person_identity: [{
|
||||
message: "请输入正确法人身份证",
|
||||
regex: /^[1-9]\d{5}(18|19|20|(3\d))\d{2}((0[1-9])|(1[0-2]))(([0-2][1-9])|10|20|30|31)\d{3}[0-9Xx]$/
|
||||
}],
|
||||
legal_person_identity_url: [{
|
||||
message: "请上传法人身份证",
|
||||
validator: (value: any, rule: any) => {
|
||||
if (!value[0] || !value[1]) {
|
||||
return true;
|
||||
}
|
||||
const {fetchData} = weightAddApi()
|
||||
const {fetchData: editFetch} = weightEditApi()
|
||||
return false;
|
||||
}
|
||||
}],
|
||||
}
|
||||
const { fetchData } = certificationSaveApi()
|
||||
const handleSave = () => {
|
||||
retrieval(formData, rules).then(async () => {
|
||||
const result = type=="add"?await fetchData({
|
||||
title: formData.title,
|
||||
purchaser_name: formData.purchaser_name,
|
||||
phone: formData.phone,
|
||||
is_default: formData.is_default,
|
||||
}):await editFetch({
|
||||
title: formData.title,
|
||||
purchaser_name: formData.purchaser_name,
|
||||
phone: formData.phone,
|
||||
is_default: formData.is_default,
|
||||
id: formData.id
|
||||
});
|
||||
const result = await fetchData({ ...formData, authentication_type: 2 })
|
||||
if (result.success) {
|
||||
Taro.eventCenter.trigger("weightList:refresh");
|
||||
// Taro.eventCenter.trigger("weightList:refresh");
|
||||
getAdminUserInfo();
|
||||
Taro.navigateBack();
|
||||
alert.success("保存成功");
|
||||
} else {
|
||||
@ -83,51 +90,107 @@ export default ()=>{
|
||||
retrieval(formData).then(() => setHozon(true)).catch(() => setHozon(false))
|
||||
}
|
||||
}, [formData])
|
||||
// 选择类型弹窗显示
|
||||
const selectTypeRef = useRef(null)
|
||||
const handleSelectTypeModalShow = () => {
|
||||
(selectTypeRef.current as any).setShow(true)
|
||||
}
|
||||
// 选择类型确定
|
||||
const handleSelectTypeConfirm = (item) => {
|
||||
setFormData({
|
||||
...formData,
|
||||
authentication_type: item.id,
|
||||
authentication_type_name: item.name
|
||||
});
|
||||
}
|
||||
// 上传图片
|
||||
const { getWxPhoto } = useUploadCDNImg();
|
||||
const handleUploadImage = async (text: any) => {
|
||||
let result = await getWxPhoto('mall');
|
||||
if (text == "business_license_url") {
|
||||
formData.business_license_url = IMG_CND_Prefix + (result as any).url;
|
||||
} else {
|
||||
formData.legal_person_identity_url[text] = IMG_CND_Prefix + (result as any).url as never;
|
||||
}
|
||||
setFormData({ ...formData });
|
||||
}
|
||||
// 查看图片
|
||||
const handleViewImage = (event, url) => {
|
||||
event.stopPropagation();
|
||||
Taro.previewImage({
|
||||
current: url,
|
||||
urls: [url]
|
||||
})
|
||||
}
|
||||
|
||||
return (
|
||||
<View className="certification">
|
||||
<Message text="认证不通过，原因：xxx，请重新认证"/>
|
||||
{(adminUserInfo as any)?.authentication_status == 3 && <Message text={`认证不通过，原因：${(formData as any).authentication_feedback}，请重新认证`} />}
|
||||
<View className="certification-content">
|
||||
<View className="certification-title">企业认证</View>
|
||||
<FromListCertification type="select" onInput={(ev:any)=>setFormData({...formData,title:ev.detail.value})}
|
||||
value={formData["title"]} label="认证类型" placeholder="企业认证"/>
|
||||
<FromListCertification onInput={(ev:any)=>setFormData({...formData,title:ev.detail.value})} value={formData["title"]} label="企业名称" placeholder="请输入营业执照上的企业名称" required/>
|
||||
<FromListCertification style={{border: "0"}} onInput={(ev:any)=>setFormData({...formData,title:ev.detail.value})} value={formData["title"]} label="企业营业" placeholder="注册号、统一社会信用代码、组织机构代码" required/>
|
||||
<View className="certification-upload">
|
||||
{/* <Text>营业执照正面</Text>
|
||||
{/* <FromListCertification type="select" onClick={handleSelectTypeModalShow} value={(formData as any)?.authentication_type_name} label="认证类型" placeholder="企业认证"/> */}
|
||||
<SelectEnterpriseType ref={selectTypeRef} confirm={handleSelectTypeConfirm} />
|
||||
<FromListCertification onInput={(ev: any) => setFormData({ ...formData, name: ev.detail.value })} value={formData["name"]} label="企业名称" placeholder="请输入营业执照上的企业名称" required />
|
||||
{/* <FromListCertification type="select" style={{border: "0"}}label="企业营业执照" placeholder="注册号、统一社会信用代码、组织机构代码" required showIcon={false}/> */}
|
||||
<FromListCertification onInput={(ev: any) => setFormData({ ...formData, businessLicense: ev.detail.value })} value={formData["businessLicense"]} style={{ border: "0" }} label="企业营业执照" placeholder="注册号、统一社会信用代码、组织机构代码" required />
|
||||
<View onClick={() => handleUploadImage("business_license_url")} className="certification-upload">
|
||||
{(formData as any)?.business_license_url ?
|
||||
<>
|
||||
<Text>营业执照正面</Text>
|
||||
<View className="certification-button">
|
||||
<View>查看证件</View>
|
||||
<View onClick={(e) => handleViewImage(e, (formData as any)?.business_license_url)}>查看证件</View>
|
||||
<View>重新上传</View>
|
||||
</View> */}
|
||||
</View>
|
||||
<Image mode="aspectFit" src={(formData as any)?.business_license_url} />
|
||||
</> :
|
||||
<View className="certification-upload-no">
|
||||
<View className="certification-upload-no-icon">+</View>
|
||||
<View className="certification-upload-no-tips">上传营业执照下面</View>
|
||||
<View className="certification-upload-no-tips">上传营业执照正面</View>
|
||||
</View>
|
||||
}
|
||||
</View>
|
||||
</View>
|
||||
<View className="certification-content">
|
||||
<View className="certification-title">法人认证</View>
|
||||
<FromListCertification onInput={(ev:any)=>setFormData({...formData,title:ev.detail.value})} value={formData["title"]} label="法人代表" placeholder="填写法人名称" required/>
|
||||
<FromListCertification style={{border: "0"}} onInput={(ev:any)=>setFormData({...formData,title:ev.detail.value})} value={formData["title"]} label="法人身份" placeholder="填写法人代表身份证号" required/>
|
||||
<View className="certification-upload">
|
||||
<Text>身份证正面</Text>
|
||||
<FromListCertification onInput={(ev: any) => setFormData({ ...formData, legal_person: ev.detail.value })} value={formData["legal_person"]} label="法人代表" placeholder="填写法人名称" required />
|
||||
<FromListCertification style={{ border: "0" }} onInput={(ev: any) => setFormData({ ...formData, legal_person_identity: ev.detail.value })} value={formData["legal_person_identity"]} label="法人身份" placeholder="填写法人代表身份证号" required />
|
||||
<View onClick={() => handleUploadImage(0)} className="certification-upload">
|
||||
{(formData as any)?.legal_person_identity_url[0] ?
|
||||
<>
|
||||
<Text>营业执照正面</Text>
|
||||
<View className="certification-button">
|
||||
<View>查看证件</View>
|
||||
<View onClick={(e) => handleViewImage(e, (formData as any)?.legal_person_identity_url[0])}>查看证件</View>
|
||||
<View>重新上传</View>
|
||||
</View>
|
||||
<Image mode="aspectFit" src={(formData as any)?.legal_person_identity_url[0]} />
|
||||
</> :
|
||||
<View className="certification-upload-no">
|
||||
<View className="certification-upload-no-icon">+</View>
|
||||
<View className="certification-upload-no-tips">上传身份证正面</View>
|
||||
</View>
|
||||
<View className="certification-upload">
|
||||
<Text>身份证反面</Text>
|
||||
}
|
||||
</View>
|
||||
<View onClick={() => handleUploadImage(1)} className="certification-upload">
|
||||
{(formData as any)?.legal_person_identity_url[1] ?
|
||||
<>
|
||||
<Text>营业执照正面</Text>
|
||||
<View className="certification-button">
|
||||
<View>查看证件</View>
|
||||
<View onClick={(e) => handleViewImage(e, (formData as any)?.legal_person_identity_url[1])}>查看证件</View>
|
||||
<View>重新上传</View>
|
||||
</View>
|
||||
<Image mode="aspectFit" src={(formData as any)?.legal_person_identity_url[1]} />
|
||||
</> :
|
||||
<View className="certification-upload-no">
|
||||
<View className="certification-upload-no-icon">+</View>
|
||||
<View className="certification-upload-no-tips">上传身份证正面</View>
|
||||
</View>
|
||||
}
|
||||
</View>
|
||||
</View>
|
||||
<View className="certification-footer">
|
||||
<View className="certification-footer-button">
|
||||
<View>取消</View>
|
||||
<View>提交</View>
|
||||
<Navigator openType="navigateBack">取消</Navigator>
|
||||
<View onClick={handleSave}>{[3, 4].includes((adminUserInfo as any)?.authentication_status) ? "重新认证" : "提交"}</View>
|
||||
</View>
|
||||
</View>
|
||||
</View>
|
||||
|
||||
4
src/pages/collection/index.config.ts
Normal file
4
src/pages/collection/index.config.ts
Normal file
@ -0,0 +1,4 @@
|
||||
export default {
|
||||
navigationBarTitleText: '我的收藏',
|
||||
enableShareAppMessage: true,
|
||||
}
|
||||
0
src/pages/collection/index.module.scss
Normal file
0
src/pages/collection/index.module.scss
Normal file
12
src/pages/collection/index.tsx
Normal file
12
src/pages/collection/index.tsx
Normal file
@ -0,0 +1,12 @@
|
||||
import Search from "@/components/search"
|
||||
import { View } from "@tarojs/components"
|
||||
import styles from './index.module.scss'
|
||||
export default () => {
|
||||
return (
|
||||
<View className={styles.main}>
|
||||
<View className={styles.search}>
|
||||
<Search style={{width: '100%'}} debounceTime={300} changeOnSearch={(e) => console.log(e)} placeholder="请输入面料关键词" placeIcon="out" showBtn={true} />
|
||||
</View>
|
||||
</View>
|
||||
)
|
||||
}
|
||||
@ -5,22 +5,6 @@
|
||||
width: 238px;
|
||||
height: 238px;
|
||||
}
|
||||
|
||||
.credit-line-tips{
|
||||
width: 100%;
|
||||
height: 66px;
|
||||
background: #FFE6CE;
|
||||
border: 2px solid #ffe6ce;
|
||||
padding: 0 30px;
|
||||
display: flex;align-items: center;
|
||||
font-size: 24px;
|
||||
font-weight: 400;
|
||||
color: #EE7500;
|
||||
}
|
||||
.credit-line-tips text{
|
||||
margin-right: 10px;
|
||||
font-size: 30px;
|
||||
}
|
||||
.credit-line-card{
|
||||
width: 702px;
|
||||
background: #ffffff;
|
||||
|
||||
@ -7,6 +7,7 @@ import {creditInfoApi} from "@/api/creditLine"
|
||||
import "./index.scss"
|
||||
import { useSelector } from "@/reducers/hooks";
|
||||
import { formatDateTime, formatPriceDiv } from "@/common/fotmat"
|
||||
import Message from "@/components/Message"
|
||||
|
||||
export default ()=>{
|
||||
|
||||
@ -41,7 +42,8 @@ export default ()=>{
|
||||
const credit_quota_used_line = convertPrice(formatPriceDiv(result.data.credit_quota_used_line));
|
||||
const credit_quota_line = convertPrice(formatPriceDiv(result.data.credit_quota_line));
|
||||
const credit_quota_available_line = convertPrice(formatPriceDiv(result.data.credit_quota_available_line));
|
||||
const progress = ((credit_quota_available_line[0]??0) / (credit_quota_line[0]??0) * 100).toFixed(0);
|
||||
const progress = credit_quota_available_line[0]==0&&credit_quota_line[0]==0?100:((credit_quota_available_line[0]??0) / (credit_quota_line[0]??0) * 100).toFixed(0);
|
||||
|
||||
|
||||
switch(Number(result.data.quota_status)){
|
||||
case 0://暂未开通
|
||||
@ -120,9 +122,7 @@ export default ()=>{
|
||||
|
||||
return (
|
||||
<View className="credit-line">
|
||||
<View className="credit-line-tips">
|
||||
<Text className="iconfont icon-zhuyi"></Text> 暂不支持线上申请授权，请联系平台客服。
|
||||
</View>
|
||||
<Message text="暂不支持线上申请授权，请联系平台客服。"/>
|
||||
<View className="credit-line-card">
|
||||
<View className="credit-line-card-top">
|
||||
<View><Progress progress={data.progress} style={style} /></View>
|
||||
|
||||
@ -4,7 +4,7 @@ import Taro, { useReady } from "@tarojs/taro"
|
||||
import { useCallback, useEffect, useMemo, useRef, useState } from "react"
|
||||
import {creditListApi} from "@/api/creditLine"
|
||||
import "./index.scss"
|
||||
import { formatDateTime } from "@/common/fotmat"
|
||||
import { formatDateTime, formatPriceDiv, toDecimal2 } from "@/common/fotmat"
|
||||
import { dataLoadingStatus, getFilterData } from "@/common/util";
|
||||
|
||||
export default ()=>{
|
||||
@ -30,7 +30,9 @@ export default ()=>{
|
||||
<View key={index} className="credit-used-list">
|
||||
<View className="credit-used-list-top">
|
||||
<View className="credit-used-list-type">下单</View>
|
||||
<View className={`credit-used-list-price ${item.amount>0?'green':item.amount<0?'red':''}`}>{item.amount.toLocaleString()}</View>
|
||||
<View className={`credit-used-list-price ${item.amount>0?'green':item.amount<0?'red':''}`}>
|
||||
{item.trans_type==2?"-":"+"}{toDecimal2(formatPriceDiv(item.amount)).toLocaleString()}
|
||||
</View>
|
||||
</View>
|
||||
<View className="credit-used-list-bottom">
|
||||
<View className="credit-used-list-date">{formatDateTime(item.order_pay_time)}</View>
|
||||
|
||||
@ -3,22 +3,6 @@
|
||||
background-color: #f3f3f3;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
.deposit-beforehand-tips{
|
||||
width: 100%;
|
||||
height: 66px;
|
||||
background: #FFE6CE;
|
||||
border: 2px solid #ffe6ce;
|
||||
padding: 0 30px;
|
||||
display: flex;align-items: center;
|
||||
font-size: 24px;
|
||||
font-weight: 400;
|
||||
color: #EE7500;
|
||||
margin: 0;
|
||||
}
|
||||
.deposit-beforehand-tips text{
|
||||
margin-right: 10px;
|
||||
font-size: 30px;
|
||||
}
|
||||
|
||||
.deposit-beforehand-card{
|
||||
width: 702px;
|
||||
|
||||
@ -6,6 +6,7 @@ import { depositInfoApi } from "@/api/deposit"
|
||||
import { useEffect } from "react";
|
||||
import { formatPriceDiv, toDecimal2 } from "@/common/fotmat";
|
||||
import { setClipboardData } from "@tarojs/taro";
|
||||
import Message from "@/components/Message";
|
||||
|
||||
export default ()=>{
|
||||
const {fetchData, state} = depositInfoApi();
|
||||
@ -23,9 +24,7 @@ export default ()=>{
|
||||
|
||||
return (
|
||||
<View className="deposit-beforehand">
|
||||
<View className="deposit-beforehand-tips">
|
||||
<Text className="iconfont icon-zhuyi"></Text> 汇款成功后，1-5分钟自动到账。
|
||||
</View>
|
||||
<Message text="汇款成功后，1-5分钟自动到账。"/>
|
||||
<View className="deposit-beforehand-card">
|
||||
<View className="deposit-beforehand-balance">
|
||||
<View className="deposit-beforehand-balance-title">余额 (元)</View>
|
||||
|
||||
@ -18,11 +18,12 @@
|
||||
.credit-used-list-price{
|
||||
font-size: 28px;
|
||||
font-weight: 400;
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
.credit-used-list-right{
|
||||
display: flex;align-items: center;
|
||||
text-align: right;
|
||||
}
|
||||
.credit-used-list-right-price view{
|
||||
display: flex;align-items: center;
|
||||
}
|
||||
.credit-used-list-right text{
|
||||
font-size: 30px;
|
||||
@ -36,6 +37,7 @@
|
||||
.credit-used-list-orderno{
|
||||
font-size: 20px;
|
||||
font-weight: 400;
|
||||
margin-top: 20px;
|
||||
color: #ababab;
|
||||
}
|
||||
.green{
|
||||
|
||||
@ -36,11 +36,11 @@ export default ()=>{
|
||||
|
||||
</View>
|
||||
<View className="credit-used-list-right">
|
||||
<View>
|
||||
<View className={`credit-used-list-price ${(item as any).amount_received_this_time>0?'red':'green'}`}>
|
||||
{(item as any).amount_received_this_time>0&&"+"}{formatPriceDiv((item as any).amount_received_this_time)}
|
||||
<View className="credit-used-list-right-price">
|
||||
<View className={`credit-used-list-price ${[1,2,3].includes((item as any).type as never)?'red':'green'}`}>
|
||||
{[1,2,3].includes((item as any).type as never)?"+":"-"}{formatPriceDiv((item as any).amount_received_this_time)}
|
||||
</View>
|
||||
<View className="credit-used-list-orderno">处理中</View>
|
||||
{/* <View className="credit-used-list-orderno">处理中</View> */}
|
||||
</View>
|
||||
<Text className="iconfont icon-a-moreback"></Text>
|
||||
</View>
|
||||
|
||||
@ -4,19 +4,25 @@
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
width: 100%;
|
||||
.reduce, .plus{
|
||||
font-size: $font_size_big;
|
||||
.plus{
|
||||
color: $color_main;
|
||||
width: 46px;
|
||||
height: 46px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content:center;
|
||||
text-align: center;
|
||||
line-height: 43px;
|
||||
font-size: 50px;
|
||||
background-color: $color_main;
|
||||
color: #fff;
|
||||
border-radius: 8px;
|
||||
}
|
||||
.reduce {
|
||||
font-size: 50px;
|
||||
width: 46px;
|
||||
height: 46px;
|
||||
text-align: center;
|
||||
line-height: 43px;
|
||||
color:#007AFF;
|
||||
}
|
||||
.input{
|
||||
display: flex;
|
||||
align-items: flex-end;
|
||||
@ -25,10 +31,13 @@
|
||||
box-sizing: border-box;
|
||||
width: 106px;
|
||||
border-radius: 10px;
|
||||
}
|
||||
input{
|
||||
font-size: $font_size_medium;
|
||||
text-align: right;
|
||||
padding-right: 10px;
|
||||
}
|
||||
}
|
||||
|
||||
.unit{
|
||||
font-size: $font_size_min;
|
||||
color: $color_font_two;
|
||||
|
||||
@ -72,6 +72,9 @@
|
||||
padding-bottom:151px;
|
||||
}
|
||||
.color_con{
|
||||
.virtual_list{
|
||||
padding-bottom: 300px;
|
||||
}
|
||||
.item {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
@ -81,12 +84,7 @@
|
||||
width: 156.5px;
|
||||
height: 156.5px;
|
||||
border-radius: 20px;
|
||||
background-color: red;
|
||||
image{
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
border-radius: 20px;
|
||||
}
|
||||
|
||||
}
|
||||
.item_con{
|
||||
flex:1;
|
||||
|
||||
@ -15,6 +15,8 @@ import Taro, { useRouter } from "@tarojs/taro";
|
||||
import UseLogin from "@/use/useLogin"
|
||||
import { formatHashTag, formatPriceDiv } from "@/common/fotmat";
|
||||
import { debounce, getFilterData } from "@/common/util";
|
||||
import LabAndImg from "@/components/LabAndImg";
|
||||
import VirtualList from '@tarojs/components/virtual-list'
|
||||
|
||||
|
||||
|
||||
@ -48,21 +50,14 @@ export default memo(({show = false, onClose, title = '', productId = 0}: param)
|
||||
//获取面料颜色列表
|
||||
const {fetchData:colorFetchData, state: colorState} = GetColorList()
|
||||
const [list, setList] = useState<any[]>([])
|
||||
const [loading, setLoading] = useState(false)
|
||||
const condition = useRef({physical_warehouse:adminUserInfo?.physical_warehouse, sale_mode:selectIndex, product_id:0, code_or_name:null})
|
||||
const getColorList = async () => {
|
||||
setLoading(() => true)
|
||||
console.log('数据:::',getFilterData(condition.current))
|
||||
let {data} = await colorFetchData(getFilterData(condition.current))
|
||||
let lists = initList(data.list)
|
||||
setList(() => [...lists])
|
||||
setLoading(() => false)
|
||||
}
|
||||
const [showPopup, setShowPopup] = useState(false)
|
||||
|
||||
useEffect(() => {
|
||||
console.log('colorState::',colorState)
|
||||
}, [colorState])
|
||||
|
||||
//显示获取
|
||||
useEffect(() => {
|
||||
@ -127,7 +122,10 @@ export default memo(({show = false, onClose, title = '', productId = 0}: param)
|
||||
if(num == 0) item.show = false
|
||||
setList([...list])
|
||||
console.log(num)
|
||||
|
||||
}
|
||||
|
||||
|
||||
const onAdd = (item) => {
|
||||
item.show = true
|
||||
item.count = selectList[selectIndex].defaultNum
|
||||
@ -153,7 +151,6 @@ export default memo(({show = false, onClose, title = '', productId = 0}: param)
|
||||
})
|
||||
return false
|
||||
}
|
||||
|
||||
if(selectCount.sumCount == 0) {
|
||||
Taro.showToast({
|
||||
icon:'none',
|
||||
@ -161,6 +158,7 @@ export default memo(({show = false, onClose, title = '', productId = 0}: param)
|
||||
})
|
||||
return false
|
||||
}
|
||||
|
||||
const state = await addFetchData({
|
||||
"sale_mode": selectIndex,
|
||||
color_list: selectCount.color_list
|
||||
@ -198,10 +196,44 @@ export default memo(({show = false, onClose, title = '', productId = 0}: param)
|
||||
return <View className={styles.priceText}><Text>¥</Text>{price}<Text> /{selectList[selectIndex].eunit}</Text></View>
|
||||
}, [selectIndex])
|
||||
|
||||
//虚拟滚动
|
||||
const Rows = memo(({id, index, style, data}:any) => {
|
||||
let item = data[index]
|
||||
return (
|
||||
<>
|
||||
{item&&<View className={styles.item} key={item.id}>
|
||||
<View className={styles.item_color}>
|
||||
<LabAndImg value={{lab:item.lab,rgb:item.rgb,texture_url:item.texture_url}}/>
|
||||
</View>
|
||||
<View className={styles.item_con}>
|
||||
<View className={styles.title}>{formatHashTag(item.code, item.name)}</View>
|
||||
<View className={styles.num}>
|
||||
{formatPrice(item)}
|
||||
</View>
|
||||
</View>
|
||||
<View className={styles.btn_con}>
|
||||
{!item.show&&<View className={styles.btn} onClick={() => onAdd(item)}>添加</View>
|
||||
||<View className={styles.btn_count}>
|
||||
<Counter
|
||||
onBlue={(e) => getInputValue(e, item)}
|
||||
defaultNum={item.count}
|
||||
step={selectList[selectIndex].step}
|
||||
digits={selectList[selectIndex].digits}
|
||||
onClickBtn={(e) => getInputValue(e, item)}
|
||||
unit={selectList[selectIndex].unit}
|
||||
minNum={selectList[selectIndex].minNum}
|
||||
maxNum={selectList[selectIndex].maxNum}
|
||||
/>
|
||||
</View>}
|
||||
</View>
|
||||
</View>||<View className={styles.item}></View>
|
||||
}
|
||||
</>
|
||||
)
|
||||
})
|
||||
|
||||
return (
|
||||
<View className={styles.shop_cart_main}>
|
||||
|
||||
<Popup showTitle={false} show={showPopup} onClose={() => closePopup()} >
|
||||
<View className={styles.popup_con}>
|
||||
<View className={styles.header}>{title}</View>
|
||||
@ -227,39 +259,53 @@ export default memo(({show = false, onClose, title = '', productId = 0}: param)
|
||||
<View className={styles.product_color_con}>
|
||||
{(list.length <= 0 && colorState.loading)&&<LoadingCard/>}
|
||||
{(list.length > 0&& !colorState.loading)&&
|
||||
|
||||
<InfiniteScroll moreStatus={false}>
|
||||
// <InfiniteScroll moreStatus={false}>
|
||||
// <View className={styles.color_con}>
|
||||
// {list.map(item => {
|
||||
// return <View className={styles.item} key={item.id}>
|
||||
// <View className={styles.item_color}>
|
||||
// <LabAndImg value={{lab:item.lab,rgb:item.rgb,texture_url:item.texture_url}}/>
|
||||
// </View>
|
||||
// <View className={styles.item_con}>
|
||||
// <View className={styles.title}>{formatHashTag(item.code, item.name)}</View>
|
||||
// <View className={styles.num}>
|
||||
// {formatPrice(item)}
|
||||
// </View>
|
||||
// </View>
|
||||
// <View className={styles.btn_con}>
|
||||
// {!item.show&&<View className={styles.btn} onClick={() => onAdd(item)}>添加</View>
|
||||
// ||<View className={styles.btn_count}>
|
||||
// <Counter
|
||||
// onBlue={(e) => getInputValue(e, item)}
|
||||
// defaultNum={item.count}
|
||||
// step={selectList[selectIndex].step}
|
||||
// digits={selectList[selectIndex].digits}
|
||||
// onClickBtn={(e) => getInputValue(e, item)}
|
||||
// unit={selectList[selectIndex].unit}
|
||||
// minNum={selectList[selectIndex].minNum}
|
||||
// maxNum={selectList[selectIndex].maxNum}
|
||||
// />
|
||||
// </View>}
|
||||
// </View>
|
||||
// </View>
|
||||
// })}
|
||||
// </View>
|
||||
// </InfiniteScroll>}
|
||||
<View className={styles.color_con}>
|
||||
{list.map(item => {
|
||||
return <View className={styles.item} key={item.id}>
|
||||
<View className={styles.item_color}>
|
||||
<Image src={item.texture_url}/>
|
||||
</View>
|
||||
<View className={styles.item_con}>
|
||||
<View className={styles.title}>{formatHashTag(item.code, item.name)}</View>
|
||||
<View className={styles.num}>
|
||||
{formatPrice(item)}
|
||||
</View>
|
||||
</View>
|
||||
<View className={styles.btn_con}>
|
||||
{!item.show&&<View className={styles.btn} onClick={() => onAdd(item)}>添加</View>
|
||||
||<View className={styles.btn_count}>
|
||||
<Counter
|
||||
onBlue={(e) => getInputValue(e, item)}
|
||||
defaultNum={item.count}
|
||||
step={selectList[selectIndex].step}
|
||||
digits={selectList[selectIndex].digits}
|
||||
onClickBtn={(e) => getInputValue(e, item)}
|
||||
unit={selectList[selectIndex].unit}
|
||||
minNum={selectList[selectIndex].minNum}
|
||||
maxNum={selectList[selectIndex].maxNum}
|
||||
/>
|
||||
<VirtualList
|
||||
className={styles.virtual_list}
|
||||
height={400} /* 列表的高度 */
|
||||
width='100%' /* 列表的宽度 */
|
||||
itemData={list} /* 渲染列表的数据 */
|
||||
itemCount={list.length + 1} /* 渲染列表的长度 */
|
||||
itemSize={100} /* 列表单项的高度 */
|
||||
overscanCount={1}
|
||||
>
|
||||
{Rows}
|
||||
</VirtualList>
|
||||
<View className="common_safe_area_y"></View>
|
||||
</View>}
|
||||
</View>
|
||||
</View>
|
||||
})}
|
||||
</View>
|
||||
</InfiniteScroll>}
|
||||
|
||||
{(list.length <= 0 && !colorState.loading)&&<View className={styles.noData}>暂无此商品</View>}
|
||||
</View>
|
||||
<View className={styles.buy_btn}>
|
||||
@ -274,3 +320,4 @@ export default memo(({show = false, onClose, title = '', productId = 0}: param)
|
||||
</View>
|
||||
)
|
||||
})
|
||||
|
||||
|
||||
@ -14,6 +14,8 @@ import useLogin from '@/use/useLogin';
|
||||
import { AnalysisShortCodeApi, BindShortCodeApi, GetShortCodeApi } from '@/api/share';
|
||||
import { SHARE_SCENE } from '@/common/enum';
|
||||
import useUserInfo from '@/use/useUserInfo';
|
||||
import LabAndImg from '@/components/LabAndImg';
|
||||
import { alert } from '@/common/common';
|
||||
|
||||
type item = {title:string, img:string, url:string, id:number}
|
||||
|
||||
@ -78,9 +80,10 @@ export default (props:Params) => {
|
||||
|
||||
const [showCart, setShowCart] = useState(false)
|
||||
const [showOrderCount, setShowOrderCount] = useState(false)
|
||||
const html = `
|
||||
<img style="width:100%" src="https://gimg2.baidu.com/image_search/src=http%3A%2F%2Fpic24.nipic.com%2F20121021%2F10910884_100200815001_2.jpg&refer=http%3A%2F%2Fpic24.nipic.com&app=2002&size=f9999,10000&q=a80&n=0&g=0n&fmt=auto?sec=1652257920&t=9353dda34f18ae2fe6803f3da35954bb">
|
||||
`
|
||||
// const html = `
|
||||
// <img style="width:100%" src="https://gimg2.baidu.com/image_search/src=http%3A%2F%2Fpic24.nipic.com%2F20121021%2F10910884_100200815001_2.jpg&refer=http%3A%2F%2Fpic24.nipic.com&app=2002&size=f9999,10000&q=a80&n=0&g=0n&fmt=auto?sec=1652257920&t=9353dda34f18ae2fe6803f3da35954bb">
|
||||
// `
|
||||
const html = ``
|
||||
|
||||
//弹窗提示
|
||||
const [colorInfo, setColorInfo] = useState<colorItem>()
|
||||
@ -113,8 +116,11 @@ export default (props:Params) => {
|
||||
setSortCode({... userObj.sort_code, shareShortDetail: {title: productName as string, code: resDetail.md5_key, img:''}})
|
||||
}
|
||||
|
||||
//开始下单
|
||||
const placeOrder = async (e:any) => {
|
||||
//授权手机号和下单
|
||||
const placeOrder = async (status = 'to_phone',e:any = {}) => {
|
||||
if(!productInfo.id) return false
|
||||
if(status == 'to_phone') {
|
||||
if(!e.detail.code) return alert.error('请授权手机号')
|
||||
try {
|
||||
await getPhoneNumber(e.detail.code)
|
||||
} catch(msg) {
|
||||
@ -124,6 +130,7 @@ export default (props:Params) => {
|
||||
})
|
||||
return false
|
||||
}
|
||||
}
|
||||
setShowOrderCount(true)
|
||||
}
|
||||
|
||||
@ -162,12 +169,12 @@ export default (props:Params) => {
|
||||
</View>
|
||||
</View>
|
||||
<View className={styles.product_color}>
|
||||
<View className={styles.title}>色号 (10)</View>
|
||||
<View className={styles.title}>色号 ({productInfo?.product_color_list?.length})</View>
|
||||
<View className={styles.list}>
|
||||
{productInfo?.product_color_list?.map(item => {
|
||||
return <View className={styles.item} onClick={() => getColorItem(item)}>
|
||||
<View className={styles.item_color}>
|
||||
<Image src={formatImgUrl(item.texture_url)}></Image>
|
||||
<LabAndImg value={{lab:item.lab,rgb:item.rgb,texture_url:item.texture_url}}/>
|
||||
</View>
|
||||
<View className={styles.item_name}>{item.code}</View>
|
||||
</View>
|
||||
@ -183,11 +190,11 @@ export default (props:Params) => {
|
||||
<View className={styles.text}>购物车</View>
|
||||
</View>
|
||||
{
|
||||
!userInfo.adminUserInfo?.is_authorize_phone&&<View className={styles.buy_btn} >
|
||||
<Button className={styles.phoneBtn} open-type="getPhoneNumber" onGetPhoneNumber={(e) => placeOrder(e)}></Button>
|
||||
(!userInfo.adminUserInfo?.is_authorize_phone)&&<View className={styles.buy_btn} >
|
||||
<Button className={styles.phoneBtn} open-type="getPhoneNumber" onGetPhoneNumber={(e) => placeOrder('to_phone',e)}></Button>
|
||||
开始下单
|
||||
</View>
|
||||
|| <View className={styles.buy_btn} onClick={(e) => placeOrder(e)}>开始下单</View>
|
||||
|| <View className={styles.buy_btn} onClick={() => placeOrder('to_order')}>开始下单</View>
|
||||
}
|
||||
</View>
|
||||
<CustomWrapper>
|
||||
|
||||
@ -8,6 +8,7 @@ import ShopCart from '@/components/shopCart'
|
||||
import { goLink } from '@/common/common'
|
||||
import styles from './index.module.scss'
|
||||
import React, { useCallback, useEffect, useMemo, useRef, useState } from 'react'
|
||||
import { useSelector } from "@/reducers/hooks";
|
||||
import Taro, { Events, useDidShow, usePullDownRefresh } from '@tarojs/taro'
|
||||
import { GetProductKindListApi, GetProductListApi } from '@/api/material'
|
||||
import useLogin from '@/use/useLogin'
|
||||
@ -50,6 +51,7 @@ export default () => {
|
||||
}
|
||||
//监听查询条件
|
||||
useEffect(() => {
|
||||
|
||||
if (filtrate.product_kind_id)
|
||||
getProductList()
|
||||
}, [filtrate])
|
||||
@ -98,8 +100,67 @@ export default () => {
|
||||
return dataLoadingStatus({ list: productData.list, total: productData.total, status: productState.loading })
|
||||
}, [productData, productState.loading])
|
||||
|
||||
useEffect(() => {
|
||||
getShow()
|
||||
}, [])
|
||||
// const [time, setShow] = useState(false)
|
||||
//拿状态存储的东西判断
|
||||
const { adminUserInfo } = useSelector(state => state.userInfo);
|
||||
const getShow = () => {
|
||||
if (adminUserInfo?.authentication_status === 0 || adminUserInfo?.authentication_status === 1 || adminUserInfo?.authentication_status === 2 || adminUserInfo?.authentication_status === 3) {
|
||||
//倒计时弹出去认证
|
||||
const countTime: any = 60
|
||||
//获取倒计时的变量
|
||||
var time = parseInt(countTime);
|
||||
const countDown = setInterval(() => {
|
||||
if (time == 0) {
|
||||
Taro.showModal({
|
||||
title: '提示',
|
||||
content: '你还未认证,认证后解锁更多功能',
|
||||
cancelText: '稍后认证',
|
||||
confirmText: '去认证',
|
||||
success: function (res) {
|
||||
if (res.confirm) {
|
||||
Taro.navigateTo({ url: '/pages/certification/index' })
|
||||
} else if (res.cancel) {
|
||||
console.log('用户点击取消')
|
||||
}
|
||||
}
|
||||
})
|
||||
//清除定时器
|
||||
clearInterval(countDown);
|
||||
} else {
|
||||
time--;
|
||||
}
|
||||
}, 1000)
|
||||
}
|
||||
}
|
||||
|
||||
//检查认证是否认证
|
||||
const checkShow = () => {
|
||||
if (adminUserInfo.authentication_status === 0 || adminUserInfo.authentication_status === 1 || adminUserInfo.authentication_status === 2 || adminUserInfo.authentication_status === 3) {
|
||||
Taro.showModal({
|
||||
title: '提示',
|
||||
content: '你还未认证,认证后解锁更多功能',
|
||||
cancelText: '稍后认证',
|
||||
confirmText: '去认证',
|
||||
success: function (res) {
|
||||
if (res.confirm) {
|
||||
Taro.navigateTo({ url: '/pages/certification/index' })
|
||||
} else if (res.cancel) {
|
||||
console.log('用户点击取消')
|
||||
}
|
||||
}
|
||||
})
|
||||
} else {
|
||||
setShowShopCart(!showShopCart)
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
|
||||
return (
|
||||
<MoveBtn onClick={() => setShowShopCart(!showShopCart)}>
|
||||
<MoveBtn onClick={() => checkShow()}>
|
||||
<View className={styles.main}>
|
||||
<Banner />
|
||||
<View className={styles.search}>
|
||||
|
||||
@ -80,6 +80,9 @@
|
||||
box-sizing: border-box;
|
||||
padding-bottom: constant(safe-area-inset-bottom);
|
||||
padding-bottom: env(safe-area-inset-bottom);
|
||||
.submit_order_number{
|
||||
padding: 20px 0;
|
||||
}
|
||||
.order_btn {
|
||||
width: 250px;
|
||||
height: 90px;
|
||||
|
||||
@ -1,15 +1,12 @@
|
||||
import { SaleOrderPreViewApi, SaleOrderApi } from "@/api/order";
|
||||
import { formatPriceDiv } from "@/common/fotmat";
|
||||
import Popup from "@/components/popup";
|
||||
import SearchInput from "@/components/searchInput";
|
||||
import { Text, Textarea, View } from "@tarojs/components"
|
||||
import Taro, { useDidShow, useRouter } from "@tarojs/taro";
|
||||
import { View } from "@tarojs/components"
|
||||
import Taro, { useDidShow, usePullDownRefresh} from "@tarojs/taro";
|
||||
import classnames from "classnames";
|
||||
import { useCallback, useEffect, useMemo, useRef, useState } from "react";
|
||||
import AddressInfo,{AddressInfoParam} from "./components/addressInfo";
|
||||
import EstimatedAmount from "./components/estimatedAmount";
|
||||
import AddressInfo from "./components/addressInfo";
|
||||
import KindList from "./components/kindList";
|
||||
import OrderState from "./components/orderState";
|
||||
import Remark from "./components/remark";
|
||||
import styles from './comfirm.module.scss'
|
||||
import { getParam } from "@/common/system";
|
||||
@ -17,9 +14,9 @@ import useLogin from "@/use/useLogin";
|
||||
import { alert, goLink } from "@/common/common";
|
||||
import ShipmentMode from "../editOrder/components/shipmentMode";
|
||||
import SubmitOrderBtn from "./components/submitOrderBtn";
|
||||
import AddressInfoDetail from "./components/addressInfoDetail";
|
||||
|
||||
export default () => {
|
||||
const {checkLogin} = useLogin()
|
||||
|
||||
const [showDesc, setShowDesc] = useState(false)
|
||||
//下单信息
|
||||
@ -57,8 +54,7 @@ import SubmitOrderBtn from "./components/submitOrderBtn";
|
||||
if(preViewOrder) {
|
||||
formatData()
|
||||
getDataList()
|
||||
//当有默认地址时设置默认地址id
|
||||
preViewOrder.default_address&&setSubmitOrderData((val) => ({...val, address_id:preViewOrder.default_address.id}))
|
||||
setSubmitOrderData((val) => ({...val, address_id:preViewOrder.default_address.id, shipment_mode:preViewOrder.shipment_mode||2}))
|
||||
}
|
||||
}, [preViewOrder])
|
||||
|
||||
@ -73,7 +69,9 @@ import SubmitOrderBtn from "./components/submitOrderBtn";
|
||||
total_number: preViewOrder.total_number, //总数量
|
||||
total_fabrics: preViewOrder.total_fabrics, //面料数量
|
||||
unit: preViewOrder.sale_mode == 0?'条':'m', //单位
|
||||
list: preViewOrder.product_list
|
||||
list: preViewOrder.product_list,
|
||||
total_should_collect_money: preViewOrder.total_should_collect_money, //应收金额
|
||||
total_sale_price: preViewOrder.total_sale_price //合计金额
|
||||
})
|
||||
}
|
||||
const formatPreViewOrderMemo = useMemo(() => {
|
||||
@ -83,18 +81,16 @@ import SubmitOrderBtn from "./components/submitOrderBtn";
|
||||
//格式化初始地址
|
||||
const defaultAddress = useMemo(() => {
|
||||
const address = preViewOrder?.default_address
|
||||
if(address) {
|
||||
return {
|
||||
province_name: address.province_name,
|
||||
city_name: address.city_name,
|
||||
district_name: address.district_name,
|
||||
address_detail: address.address_detail,
|
||||
id: address.id,
|
||||
name: address.name,
|
||||
phone: address.phone
|
||||
province_name: address?.province_name,
|
||||
city_name: address?.city_name,
|
||||
district_name: address?.district_name,
|
||||
address_detail: address?.address_detail,
|
||||
id: address?.id,
|
||||
name: address?.name,
|
||||
phone: address?.phone,
|
||||
shipment_mode: address?.shipment_mode
|
||||
}
|
||||
}
|
||||
return null
|
||||
}, [preViewOrder])
|
||||
|
||||
//获取提交格式数据列表
|
||||
@ -125,24 +121,29 @@ import SubmitOrderBtn from "./components/submitOrderBtn";
|
||||
|
||||
//提交按钮是否可用
|
||||
const btnStatus = useMemo(() => {
|
||||
if( submitOrderData?.list?.length == 0 || !submitOrderData?.shipment_mode || (submitOrderData?.shipment_mode == 2 && !submitOrderData?.address_id)) {
|
||||
return false
|
||||
} else {
|
||||
return true
|
||||
}
|
||||
return submitOrderData?.shipment_mode == 1 || (submitOrderData?.shipment_mode == 2 && submitOrderData?.address_id)
|
||||
}, [submitOrderData])
|
||||
|
||||
//数量格式
|
||||
const numText = useMemo(() => {
|
||||
if(formatPreViewOrder) {
|
||||
let total_number = formatPreViewOrder?.sale_mode == 0?formatPreViewOrder?.total_number:(formatPreViewOrder?.total_number/100)
|
||||
return `${formatPreViewOrder?.total_fabrics}种面料，${formatPreViewOrder?.total_colors}种颜色，共${total_number}${formatPreViewOrder?.unit}`
|
||||
}
|
||||
}, [formatPreViewOrder])
|
||||
|
||||
//提交订单
|
||||
const {fetchData: saleOrderFetchData} = SaleOrderApi()
|
||||
const submitOrderEven = () => {
|
||||
if(!submitOrderData?.address_id) {
|
||||
alert.error('请选择地址')
|
||||
return false
|
||||
}
|
||||
if(!submitOrderData?.shipment_mode) {
|
||||
alert.error('请选择收货方式')
|
||||
return false
|
||||
}
|
||||
if(!submitOrderData?.address_id&&submitOrderData?.shipment_mode == 2) {
|
||||
alert.error('请选择地址')
|
||||
return false
|
||||
}
|
||||
|
||||
Taro.showModal({
|
||||
title: '确定提交？',
|
||||
success: async function (res) {
|
||||
@ -159,10 +160,14 @@ import SubmitOrderBtn from "./components/submitOrderBtn";
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
//页面下拉刷新
|
||||
usePullDownRefresh(() => {
|
||||
getSaleOrderPreView()
|
||||
})
|
||||
return (
|
||||
<View className={styles.order_main}>
|
||||
<ShipmentMode onSelect={selectShipmentMode}/>
|
||||
<AddressInfo onSelect={(e) => getAddress(e)} defaultValue={defaultAddress}/>
|
||||
<AddressInfoDetail orderInfo={defaultAddress} onSelect={getAddress} onChangeShipmentMode={selectShipmentMode} status={1}/>
|
||||
<KindList order={formatPreViewOrderMemo} comfirm={true}/>
|
||||
<View className={styles.order_desc} onClick={() => setShowDesc(true)}>
|
||||
<View className={styles.order_desc_con}>订单备注</View>
|
||||
@ -174,8 +179,8 @@ import SubmitOrderBtn from "./components/submitOrderBtn";
|
||||
</View>
|
||||
<View className={styles.submit_order}>
|
||||
<View className={styles.submit_order_number}>
|
||||
<SubmitOrderBtn style={{color:'#007AFF'}} number={formatPriceDiv(formatPreViewOrder?.estimate_amount)}/>
|
||||
<View className={styles.order_number_desc}>{`${formatPreViewOrder?.total_fabrics}种面料，${formatPreViewOrder?.total_colors}种颜色，共${formatPreViewOrder?.total_number + formatPreViewOrder?.unit}`}</View>
|
||||
<SubmitOrderBtn style={{color:'#007AFF'}} number={formatPriceDiv(preViewOrder?.sale_mode == 1?formatPreViewOrder?.total_should_collect_money:formatPreViewOrder?.estimate_amount)} priceTitle={preViewOrder?.sale_mode == 1?'合计金额':'预估金额'}/>
|
||||
<View className={styles.order_number_desc}>{numText}</View>
|
||||
</View>
|
||||
<View className={classnames(styles.order_btn, btnStatus&&styles.ok_order_btn)} onClick={() => submitOrderEven()}>提交订单</View>
|
||||
</View>
|
||||
|
||||
163
src/pages/order/components/addressInfoDetail/index copy.tsx
Normal file
163
src/pages/order/components/addressInfoDetail/index copy.tsx
Normal file
@ -0,0 +1,163 @@
|
||||
import { EditSaleOrderAddressApi, EditSaleOrderShipmentModeApi } from "@/api/order";
|
||||
import { alert } from "@/common/common";
|
||||
import { ORDER_STATUS } from "@/common/enum";
|
||||
import { debounce } from "@/common/util";
|
||||
import AddressList from "@/components/AddressList";
|
||||
import Popup from "@/components/popup";
|
||||
import { Text, View } from "@tarojs/components"
|
||||
import classnames from "classnames";
|
||||
import { forwardRef, memo, useEffect, useImperativeHandle, useMemo, useState } from "react";
|
||||
import styles from './index.module.scss'
|
||||
|
||||
export type AddressInfoParam = {
|
||||
province_name: string,
|
||||
city_name: string,
|
||||
district_name: string,
|
||||
address_detail: string,
|
||||
id?: number,
|
||||
name: string,
|
||||
phone: string,
|
||||
}
|
||||
type Param = {
|
||||
onSelect?: (val:any) => void, //选择地址
|
||||
defaultValue?: AddressInfoParam|null, //默认值
|
||||
disabled?: false|true, //true禁用后只用于展示
|
||||
onChangeShipmentMode?: (val: number) => void, //返回收货方式
|
||||
status?: 1|2, //1确认订单时使用， 2订单流程
|
||||
orderInfo?: {
|
||||
orderId: number //订单id
|
||||
shipment_mode: 1|2, //1自提 2物流
|
||||
status: number //订单状态
|
||||
}
|
||||
}
|
||||
|
||||
export default memo(forwardRef(({onSelect, onChangeShipmentMode, defaultValue = null, orderInfo, status = 2}: Param, ref) => {
|
||||
const [showAddressList, setShowAddressList] = useState(false)
|
||||
|
||||
useEffect(() => {
|
||||
setUserInfo(() => defaultValue)
|
||||
}, [defaultValue])
|
||||
|
||||
const [userInfo, setUserInfo] = useState<any>()
|
||||
|
||||
//地址格式
|
||||
const formatAddress = useMemo(() => {
|
||||
if(userInfo)
|
||||
return userInfo.province_name + userInfo.city_name + userInfo.district_name + userInfo.address_detail
|
||||
}, [userInfo])
|
||||
|
||||
const changeShow = () => {
|
||||
if(receivingStatus == 2 && !logisticsShow)
|
||||
setShowAddressList(() => true)
|
||||
}
|
||||
|
||||
useEffect(() => {
|
||||
if(orderInfo)
|
||||
setReceivingStatus(() => orderInfo.shipment_mode||2)
|
||||
}, [orderInfo])
|
||||
|
||||
//把内部方法提供给外部
|
||||
useImperativeHandle(ref, () => ({
|
||||
changeShow
|
||||
}))
|
||||
|
||||
//收货方法,1:自提，2物流
|
||||
const [receivingStatus, setReceivingStatus] = useState(2)
|
||||
const {fetchData: shipmentModeFetchData} = EditSaleOrderShipmentModeApi()
|
||||
const onReceivingStatus = (value, e) => {
|
||||
e.stopPropagation()
|
||||
changeReceivingStatus(value)
|
||||
}
|
||||
const changeReceivingStatus = debounce(async (value) => {
|
||||
if(!orderInfo) return false
|
||||
if(status == 1) {
|
||||
onChangeShipmentMode?.(value)
|
||||
setReceivingStatus(value)
|
||||
return false
|
||||
}
|
||||
alert.loading('正在修改')
|
||||
const res = await shipmentModeFetchData({id: orderInfo.orderId, shipment_mode:value})
|
||||
if(res.success) {
|
||||
alert.success('收货方式修改成功')
|
||||
onChangeShipmentMode?.(value)
|
||||
setReceivingStatus(value)
|
||||
} else {
|
||||
alert.none(res.msg)
|
||||
}
|
||||
}, 10)
|
||||
|
||||
//修改地址
|
||||
const [addressId, setAddressId] = useState(0)
|
||||
const {fetchData: addressFetchData} = EditSaleOrderAddressApi()
|
||||
const getAddress = async (value) => {
|
||||
if(!orderInfo) return false
|
||||
if(status == 1) {
|
||||
setShowAddressList(() => false)
|
||||
setAddressId(value.id)
|
||||
setUserInfo(() => value)
|
||||
return false
|
||||
}
|
||||
alert.loading('正在修改')
|
||||
const res = await addressFetchData({id: orderInfo.orderId, address_id: value.id})
|
||||
if(res.success) {
|
||||
alert.success('地址修改成功')
|
||||
onSelect?.(value)
|
||||
setShowAddressList(() => false)
|
||||
setAddressId(value.id)
|
||||
setUserInfo(() => value)
|
||||
} else {
|
||||
alert.none(res.msg)
|
||||
}
|
||||
}
|
||||
|
||||
//订单状态
|
||||
const {
|
||||
SaleOrderStatusWaitingReceipt,
|
||||
SaleOrderStatusAlreadyReceipt,
|
||||
SaleOrderStatusComplete,
|
||||
SaleOrderStatusRefund,
|
||||
SaleOrderStatusCancel
|
||||
} = ORDER_STATUS
|
||||
|
||||
//根据订单状态判断是否显示物流
|
||||
const logisticsShowList = [SaleOrderStatusWaitingReceipt.value, SaleOrderStatusAlreadyReceipt.value, SaleOrderStatusComplete.value, SaleOrderStatusRefund.value, SaleOrderStatusCancel.value]
|
||||
const logisticsShow = useMemo(() => {
|
||||
return logisticsShowList.includes(orderInfo?.status as number)
|
||||
}, [orderInfo])
|
||||
|
||||
return (
|
||||
<View>
|
||||
<View className={styles.order_address} onClick={() => changeShow()}>
|
||||
<View className={classnames(styles.order_address_icon, 'iconfont', receivingStatus == 2?'icon-daohang':'icon-fahuo')}></View>
|
||||
<View className={styles.order_address_text_con}>
|
||||
<View className={styles.order_address_text_title}>
|
||||
<Text className={styles.address_text}>{formatAddress}</Text>
|
||||
{(receivingStatus == 2 && !logisticsShow)&&<Text className={classnames(styles.moreIconfont,'iconfont icon-a-moreback')}></Text>}
|
||||
</View>
|
||||
<View className={styles.order_address_text_name}>
|
||||
<Text>{userInfo?.name}</Text>
|
||||
<Text>{userInfo?.phone}</Text>
|
||||
</View>
|
||||
</View>
|
||||
{!logisticsShow&&<View className={styles.updateBtn}>
|
||||
<View className={styles.updateBtn_list}>
|
||||
<View className={classnames(styles.updateBtn_item, receivingStatus==1&&styles.updateBtn_item_select)} onClick={(e) => onReceivingStatus(1,e)}>自提</View>
|
||||
<View className={classnames(styles.updateBtn_item, receivingStatus==2&&styles.updateBtn_item_select)} onClick={(e) => onReceivingStatus(2,e)}>物流</View>
|
||||
</View>
|
||||
<View style={{transform: receivingStatus==1?'translateX(0)':'translateX(100%)'}} className={classnames(styles.updateBtn_select)}></View>
|
||||
</View>||
|
||||
<View className={styles.logisticsBtn}>
|
||||
查看物流
|
||||
</View>}
|
||||
</View>
|
||||
<Popup show={showAddressList} showTitle={false} onClose={() => setShowAddressList(false)}>
|
||||
<View className={styles.order_address_list}>
|
||||
<View className={styles.order_address_title}>请选择收货地址</View>
|
||||
<View className={styles.addressList_con}>
|
||||
<AddressList onSelect={getAddress} id={addressId}/>
|
||||
</View>
|
||||
</View>
|
||||
</Popup>
|
||||
</View>
|
||||
)
|
||||
}))
|
||||
@ -1,5 +1,4 @@
|
||||
.order_address{
|
||||
height: 178px;
|
||||
background: #ffffff;
|
||||
border-radius: 20px;
|
||||
display: flex;
|
||||
@ -26,16 +25,23 @@
|
||||
.order_address_text_title{
|
||||
font-size: $font_size_medium;
|
||||
margin-top: 10px;
|
||||
@include common_ellipsis;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
.moreIconfont{
|
||||
font-size: 20px;
|
||||
padding-top: 10px;
|
||||
}
|
||||
.address_text{
|
||||
word-break:break-all;
|
||||
|
||||
}
|
||||
.address_text_no{
|
||||
font-weight: 700;
|
||||
padding-left: 20px;
|
||||
}
|
||||
}
|
||||
.order_address_text_name{
|
||||
|
||||
margin-top: 30px;
|
||||
align-items: center;
|
||||
text{
|
||||
&:nth-child(1) {
|
||||
@ -88,6 +94,21 @@
|
||||
}
|
||||
|
||||
}
|
||||
.logisticsBtn{
|
||||
width: 152px;
|
||||
height: 72px;
|
||||
background: #ffffff;
|
||||
border: 2px solid #dddddd;
|
||||
border-radius: 38px;
|
||||
position: absolute;
|
||||
bottom: 10px;
|
||||
right: 10px;
|
||||
z-index: 999;
|
||||
font-size: 28px;
|
||||
color: #707070;
|
||||
text-align: center;
|
||||
line-height: 72px;
|
||||
}
|
||||
.order_address_text_no{
|
||||
flex: 1;
|
||||
font-size: $font_size;
|
||||
@ -101,12 +122,17 @@
|
||||
|
||||
}
|
||||
.order_address_list {
|
||||
height: 900px;
|
||||
height:80vh;
|
||||
.order_address_title{
|
||||
font-size: $font_size;
|
||||
font-weight: 700;
|
||||
width: 100%;
|
||||
text-align: center;
|
||||
padding: 20px 0 30px 0;
|
||||
height: 100px;
|
||||
}
|
||||
.addressList_con{
|
||||
padding-bottom: 20px;
|
||||
height: calc(100% - 160px);
|
||||
}
|
||||
}
|
||||
@ -1,11 +1,12 @@
|
||||
import { EditSaleOrderAddressApi, EditSaleOrderShipmentModeApi } from "@/api/order";
|
||||
import { alert } from "@/common/common";
|
||||
import { ORDER_STATUS } from "@/common/enum";
|
||||
import { debounce } from "@/common/util";
|
||||
import AddressList from "@/components/AddressList";
|
||||
import Popup from "@/components/popup";
|
||||
import { Text, View } from "@tarojs/components"
|
||||
import classnames from "classnames";
|
||||
import { forwardRef, memo, useCallback, useEffect, useImperativeHandle, useMemo, useState } from "react";
|
||||
import { forwardRef, memo, useEffect, useImperativeHandle, useMemo, useState } from "react";
|
||||
import styles from './index.module.scss'
|
||||
|
||||
export type AddressInfoParam = {
|
||||
@ -18,53 +19,70 @@ export type AddressInfoParam = {
|
||||
phone: string,
|
||||
}
|
||||
type Param = {
|
||||
onSelect?: (val:any) => void, //选择
|
||||
defaultValue?: AddressInfoParam|null, //默认值
|
||||
onSelect?: (val:any) => void, //选择地址
|
||||
disabled?: false|true, //true禁用后只用于展示
|
||||
shipment_mode?: 1|2, //1自提 2物流
|
||||
onChangeShipmentMode?: (val: number) => void, //返回收货方式
|
||||
orderId?: number //订单id
|
||||
onLogistics?: () => void, //查看物流
|
||||
status?: 1|2, //1确认订单时使用， 2订单流程
|
||||
orderInfo?: {
|
||||
id?: number //订单id
|
||||
shipment_mode?: 1|2, //1自提 2物流
|
||||
status?: number //订单状态
|
||||
province_name: string,
|
||||
city_name: string,
|
||||
district_name: string,
|
||||
address_detail: string
|
||||
}
|
||||
}
|
||||
|
||||
export default memo(forwardRef(({onSelect, onChangeShipmentMode, defaultValue = null, orderId = 0, shipment_mode = 1}: Param, ref) => {
|
||||
const [showAddressList, setShowAddressList] = useState(false)
|
||||
export default memo(forwardRef(({onSelect, onChangeShipmentMode, orderInfo, status = 2, disabled = false, onLogistics}: Param, ref) => {
|
||||
|
||||
const [addressInfo, setAddressInfo] = useState<any>()
|
||||
useEffect(() => {
|
||||
setUserInfo(() => defaultValue)
|
||||
}, [defaultValue])
|
||||
if(orderInfo) {
|
||||
setReceivingStatus(() => orderInfo.shipment_mode||2)
|
||||
setAddressInfo(() => orderInfo)
|
||||
}
|
||||
}, [orderInfo])
|
||||
|
||||
const [userInfo, setUserInfo] = useState<any>()
|
||||
|
||||
//地址格式
|
||||
const formatAddress = useMemo(() => {
|
||||
if(userInfo)
|
||||
return userInfo.province_name + userInfo.city_name + userInfo.district_name + userInfo.address_detail
|
||||
}, [userInfo])
|
||||
if(addressInfo?.province_name) {
|
||||
return addressInfo.province_name + addressInfo.city_name + addressInfo.district_name + addressInfo.address_detail
|
||||
} else {
|
||||
return ''
|
||||
}
|
||||
}, [addressInfo])
|
||||
|
||||
//打开地址列表
|
||||
const [showAddressList, setShowAddressList] = useState(false)
|
||||
const changeShow = () => {
|
||||
if(receivingStatus == 2)
|
||||
if(receivingStatus == 2 && !logisticsShow)
|
||||
setShowAddressList(() => true)
|
||||
}
|
||||
|
||||
useEffect(() => {
|
||||
setReceivingStatus(() => shipment_mode)
|
||||
}, [shipment_mode])
|
||||
|
||||
//把内部方法提供给外部
|
||||
useImperativeHandle(ref, () => ({
|
||||
changeShow
|
||||
}))
|
||||
|
||||
//收货方法,1:自提，2物流
|
||||
const [receivingStatus, setReceivingStatus] = useState(1)
|
||||
const [receivingStatus, setReceivingStatus] = useState(2)
|
||||
const {fetchData: shipmentModeFetchData} = EditSaleOrderShipmentModeApi()
|
||||
const onReceivingStatus = (value, e) => {
|
||||
e.stopPropagation()
|
||||
changeReceivingStatus(value)
|
||||
}
|
||||
const changeReceivingStatus = debounce(async (value) => {
|
||||
if(!orderInfo) return false
|
||||
if(status == 1) {
|
||||
onChangeShipmentMode?.(value)
|
||||
setReceivingStatus(value)
|
||||
return false
|
||||
}
|
||||
alert.loading('正在修改')
|
||||
const res = await shipmentModeFetchData({id: orderId, shipment_mode:value})
|
||||
const res = await shipmentModeFetchData({id: orderInfo.id, shipment_mode:value})
|
||||
if(res.success) {
|
||||
alert.success('收货方式修改成功')
|
||||
onChangeShipmentMode?.(value)
|
||||
@ -75,48 +93,79 @@ export default memo(forwardRef(({onSelect, onChangeShipmentMode, defaultValue =
|
||||
}, 10)
|
||||
|
||||
//修改地址
|
||||
const [addressId, setAddressId] = useState(0)
|
||||
const {fetchData: addressFetchData} = EditSaleOrderAddressApi()
|
||||
const getAddress = async (value) => {
|
||||
if(!orderInfo) return false
|
||||
if(status == 1) {
|
||||
setShowAddressList(() => false)
|
||||
setAddressId(value.id)
|
||||
setAddressInfo(() => value)
|
||||
onSelect?.(value)
|
||||
return false
|
||||
}
|
||||
alert.loading('正在修改')
|
||||
const res = await addressFetchData({id: orderId, address_id: value.id})
|
||||
const res = await addressFetchData({id: orderInfo.id, address_id: value.id})
|
||||
if(res.success) {
|
||||
alert.success('地址修改成功')
|
||||
onSelect?.(value)
|
||||
setShowAddressList(() => false)
|
||||
setUserInfo(() => value)
|
||||
setAddressId(value.id)
|
||||
setAddressInfo(() => value)
|
||||
} else {
|
||||
alert.none(res.msg)
|
||||
}
|
||||
}
|
||||
|
||||
//订单状态
|
||||
const {
|
||||
SaleOrderStatusWaitingReceipt,
|
||||
SaleOrderStatusAlreadyReceipt,
|
||||
SaleOrderStatusComplete,
|
||||
SaleOrderStatusRefund,
|
||||
SaleOrderStatusCancel,
|
||||
} = ORDER_STATUS
|
||||
|
||||
|
||||
//根据订单状态判断是否显示物流
|
||||
const logisticsShowList = [SaleOrderStatusWaitingReceipt.value, SaleOrderStatusAlreadyReceipt.value, SaleOrderStatusComplete.value, SaleOrderStatusRefund.value, SaleOrderStatusCancel.value]
|
||||
const logisticsShow = useMemo(() => {
|
||||
console.log('aa:',orderInfo?.status)
|
||||
return logisticsShowList.includes(orderInfo?.status as number)
|
||||
}, [orderInfo])
|
||||
|
||||
return (
|
||||
<View>
|
||||
<View className={styles.order_address} onClick={() => changeShow()}>
|
||||
<View className={classnames(styles.order_address_icon, 'iconfont', receivingStatus == 2?'icon-daohang':'icon-fahuo')}></View>
|
||||
<View className={styles.order_address_text_con}>
|
||||
<View className={styles.order_address_text_title}>
|
||||
<Text>{formatAddress}</Text>
|
||||
{(receivingStatus == 2)&&<Text className={classnames(styles.moreIconfont,'iconfont icon-a-moreback')}></Text>}
|
||||
<Text className={classnames(styles.address_text, styles.address_text_no)}>{formatAddress||'请选择收货地址及信息'}</Text>
|
||||
{(receivingStatus == 2 && !logisticsShow)&&<Text className={classnames(styles.moreIconfont,'iconfont icon-a-moreback')}></Text>}
|
||||
</View>
|
||||
<View className={styles.order_address_text_name}>
|
||||
<Text>{userInfo?.name}</Text>
|
||||
<Text>{userInfo?.phone}</Text>
|
||||
<Text>{addressInfo?.name}</Text>
|
||||
<Text>{addressInfo?.phone}</Text>
|
||||
</View>
|
||||
</View>
|
||||
<View className={styles.updateBtn}>
|
||||
{!logisticsShow&&<View className={styles.updateBtn}>
|
||||
<View className={styles.updateBtn_list}>
|
||||
<View className={classnames(styles.updateBtn_item, receivingStatus==1&&styles.updateBtn_item_select)} onClick={(e) => onReceivingStatus(1,e)}>自提</View>
|
||||
<View className={classnames(styles.updateBtn_item, receivingStatus==2&&styles.updateBtn_item_select)} onClick={(e) => onReceivingStatus(2,e)}>物流</View>
|
||||
</View>
|
||||
<View style={{transform: receivingStatus==1?'translateX(0)':'translateX(100%)'}} className={classnames(styles.updateBtn_select)}></View>
|
||||
</View>
|
||||
</View>||
|
||||
<View className={styles.logisticsBtn} onClick={onLogistics}>
|
||||
查看物流
|
||||
</View>}
|
||||
</View>
|
||||
<Popup show={showAddressList} showTitle={false} onClose={() => setShowAddressList(false)}>
|
||||
<View className={styles.order_address_list}>
|
||||
<View className={styles.order_address_title}>请选择收货地址</View>
|
||||
<AddressList onSelect={getAddress}/>
|
||||
<View className={styles.addressList_con}>
|
||||
<AddressList onSelect={getAddress} id={addressId}/>
|
||||
</View>
|
||||
</View>
|
||||
<View className="common_safe_area_y"></View>
|
||||
</Popup>
|
||||
</View>
|
||||
)
|
||||
|
||||
@ -1,176 +0,0 @@
|
||||
|
||||
.apply_after_sales_main{
|
||||
.apply_after_sales_head{
|
||||
font-size: 30px;
|
||||
text-align: center;
|
||||
padding: 20px 0;
|
||||
font-weight: 700;
|
||||
}
|
||||
.kind_number{
|
||||
width: 100%;
|
||||
padding: 20px;
|
||||
box-sizing: border-box;
|
||||
text{
|
||||
background-color: #F6F6F6;
|
||||
border-radius: 10px;
|
||||
font-size: $font_size_medium;
|
||||
padding: 5px 0;
|
||||
text-align: center;
|
||||
width: 100%;
|
||||
display: block;
|
||||
color: $color_font_three;
|
||||
}
|
||||
}
|
||||
.apply_after_sales_con{
|
||||
height: 80vh;
|
||||
.scroll{
|
||||
height: calc(100% - 80px);
|
||||
}
|
||||
.returnSaleInput{
|
||||
margin: 0 20px;
|
||||
padding-top: 30px;
|
||||
border-top: 1px solid #F6F6F6;
|
||||
.returnSaleInput_item{
|
||||
display: flex;
|
||||
align-items: center;
|
||||
padding-bottom: 20px;
|
||||
.title{
|
||||
font-size: $font_size;
|
||||
font-weight: 700;
|
||||
}
|
||||
.select{
|
||||
flex:1;
|
||||
height: 60px;
|
||||
border: 2px solid #e6e6e6;
|
||||
border-radius: 10px;
|
||||
margin-left: 20px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
padding: 0 20px;
|
||||
font-size: 26px;
|
||||
color: $color_font_two;
|
||||
.miconfont{
|
||||
font-size: 30px;
|
||||
}
|
||||
}
|
||||
|
||||
.uploadImg{
|
||||
width: 202px;
|
||||
height: 150px;
|
||||
background: #f0f0f0;
|
||||
border: 2px dashed #cccccc;
|
||||
margin-left: 20px;
|
||||
border-radius: 10px;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
position: relative;
|
||||
.miconfont{
|
||||
font-size: 50px;
|
||||
}
|
||||
.uploadText{
|
||||
font-size: 26px;
|
||||
color: $color_font_three;
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
}
|
||||
.other_desc{
|
||||
padding: 0 20px;
|
||||
box-sizing: border-box;
|
||||
.title{
|
||||
font-size: $font_size;
|
||||
font-weight: 700;
|
||||
}
|
||||
.uploadImg{
|
||||
position: relative;
|
||||
.descDataNum{
|
||||
position: absolute;
|
||||
right: 10px;
|
||||
bottom: 10px;
|
||||
font-size: 22px;
|
||||
color: #ABABAB;
|
||||
}
|
||||
}
|
||||
Textarea{
|
||||
background-color: #f3f3f3;
|
||||
border: 2px solid #e6e6e6;
|
||||
border-radius: 10px;
|
||||
width: 100%;
|
||||
font-size: 25px;
|
||||
height: 165.4px;
|
||||
padding: 20px 20px 30px 20px;
|
||||
box-sizing: border-box;
|
||||
margin-top: 20px;
|
||||
}
|
||||
}
|
||||
}
|
||||
.apply_after_sales_list{
|
||||
padding: 0 20px;
|
||||
.apply_after_sales_item{
|
||||
margin-bottom: 30px;
|
||||
.apply_after_sales_title{
|
||||
display: flex;
|
||||
align-items: center;
|
||||
.tag{
|
||||
font-size: $font_size_min;
|
||||
background-color: #CDE5FF;
|
||||
padding: 5px 10px;
|
||||
border-radius: 6px;
|
||||
color: $color_main;
|
||||
}
|
||||
.title{
|
||||
font-weight: 700;
|
||||
font-size: $font_size;
|
||||
margin-left: 20px;
|
||||
flex:1;
|
||||
}
|
||||
}
|
||||
.color_list {
|
||||
.color_item{
|
||||
display: flex;
|
||||
align-items: center;
|
||||
margin: 20px 0;
|
||||
}
|
||||
.image{
|
||||
width: 70px;
|
||||
height: 70px;
|
||||
image{
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
border-radius: 50%;
|
||||
}
|
||||
}
|
||||
.name_and_number{
|
||||
padding-left: 30px;
|
||||
flex:1;
|
||||
text{
|
||||
&:nth-child(1) {
|
||||
font-weight: 700;
|
||||
font-size: $font_size;
|
||||
}
|
||||
&:nth-child(2) {
|
||||
color: $color_font_two;
|
||||
font-size: $font_size;
|
||||
margin-left: 20px;
|
||||
}
|
||||
}
|
||||
}
|
||||
.btn_count{
|
||||
width: 235px;
|
||||
height: 64px;
|
||||
background-color: #ECF5FF;
|
||||
border-radius: 40px 0px 16px 0px;
|
||||
padding: 0 20px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
@ -1,108 +0,0 @@
|
||||
import { Image, ScrollView, Text, Textarea, View } from "@tarojs/components";
|
||||
import { memo, useState } from "react";
|
||||
import classnames from "classnames";
|
||||
import styles from './index.module.scss'
|
||||
import Popup from "@/components/popup";
|
||||
import { formatImgUrl } from "@/common/fotmat";
|
||||
import Counter from "@/components/counter";
|
||||
|
||||
export default memo(() => {
|
||||
const [showDesc, setShowDesc] = useState(true)
|
||||
return (
|
||||
<View className={styles.apply_after_sales_main}>
|
||||
<Popup showIconButton={true} show={showDesc} showTitle={false} onClose={() => setShowDesc(false)} >
|
||||
<View className={styles.apply_after_sales_con}>
|
||||
<View className={styles.apply_after_sales_head}>申请退货</View>
|
||||
<View className={styles.kind_number}><Text>2种面料，3种颜色，共6条</Text></View>
|
||||
<ScrollView scrollY className={styles.scroll}>
|
||||
<View className={styles.apply_after_sales_list}>
|
||||
<View className={styles.apply_after_sales_item}>
|
||||
<View className={styles.apply_after_sales_title}>
|
||||
<View className={styles.tag}>大货</View>
|
||||
<View className={styles.title}>0770# 21S单面平纹(食毛)</View>
|
||||
</View>
|
||||
<View className={styles.color_list}>
|
||||
<View className={styles.color_item}>
|
||||
<View className={styles.image}><Image src={formatImgUrl('')}/></View>
|
||||
<View className={styles.name_and_number}><Text>1# 薄荷绿</Text><Text>x1</Text></View>
|
||||
<View className={styles.btn_count}>
|
||||
<Counter/>
|
||||
</View>
|
||||
</View>
|
||||
<View className={styles.color_item}>
|
||||
<View className={styles.image}><Image src={formatImgUrl('')}/></View>
|
||||
<View className={styles.name_and_number}><Text>1# 薄荷绿</Text><Text>x1</Text></View>
|
||||
<View className={styles.btn_count}>
|
||||
<Counter/>
|
||||
</View>
|
||||
</View>
|
||||
</View>
|
||||
</View>
|
||||
<View className={styles.apply_after_sales_item}>
|
||||
<View className={styles.apply_after_sales_title}>
|
||||
<View className={styles.tag}>大货</View>
|
||||
<View className={styles.title}>0770# 21S单面平纹(食毛)</View>
|
||||
</View>
|
||||
<View className={styles.color_list}>
|
||||
<View className={styles.color_item}>
|
||||
<View className={styles.image}><Image src={formatImgUrl('')}/></View>
|
||||
<View className={styles.name_and_number}><Text>1# 薄荷绿</Text><Text>x1</Text></View>
|
||||
<View className={styles.btn_count}>
|
||||
<Counter/>
|
||||
</View>
|
||||
</View>
|
||||
<View className={styles.color_item}>
|
||||
<View className={styles.image}><Image src={formatImgUrl('')}/></View>
|
||||
<View className={styles.name_and_number}><Text>1# 薄荷绿</Text><Text>x1</Text></View>
|
||||
<View className={styles.btn_count}>
|
||||
<Counter/>
|
||||
</View>
|
||||
</View>
|
||||
</View>
|
||||
</View>
|
||||
</View>
|
||||
<View className={styles.returnSaleInput}>
|
||||
<View className={styles.returnSaleInput_item}>
|
||||
<View className={styles.title}>退货原因</View>
|
||||
<View className={styles.select}>
|
||||
<Text>请选择</Text>
|
||||
<Text className={classnames(styles.miconfont, 'iconfont icon-a-moreback')}></Text>
|
||||
</View>
|
||||
</View>
|
||||
<View className={styles.returnSaleInput_item}>
|
||||
<View className={styles.title}>货物状况</View>
|
||||
<View className={styles.select}>
|
||||
<Text>请选择</Text>
|
||||
<Text className={classnames(styles.miconfont, 'iconfont icon-a-moreback')}></Text>
|
||||
</View>
|
||||
</View>
|
||||
<View className={styles.returnSaleInput_item}>
|
||||
<View className={styles.title}>退货说明</View>
|
||||
<View className={styles.select}>
|
||||
<Text>请选择</Text>
|
||||
<Text className={classnames(styles.miconfont, 'iconfont icon-a-moreback')}></Text>
|
||||
</View>
|
||||
</View>
|
||||
<View className={styles.returnSaleInput_item}>
|
||||
<View className={styles.title}>拍照上传</View>
|
||||
<View className={styles.uploadImg}>
|
||||
<Text className={classnames(styles.miconfont, 'iconfont icon-saomazhifu')}></Text>
|
||||
<Text className={styles.uploadText}>上传照片</Text>
|
||||
</View>
|
||||
</View>
|
||||
|
||||
</View>
|
||||
<View className={styles.other_desc}>
|
||||
<View className={styles.title}>其他说明</View>
|
||||
<View className={styles.uploadImg}>
|
||||
<Textarea placeholder="一般情况下选填，当退货说明=“其它问题”时，必填" cursorSpacing={100}></Textarea>
|
||||
<View className={styles.descDataNum}>0/100</View>
|
||||
</View>
|
||||
</View>
|
||||
<View className="common_safe_area_y"></View>
|
||||
</ScrollView>
|
||||
</View>
|
||||
</Popup>
|
||||
</View>
|
||||
)
|
||||
})
|
||||
66
src/pages/order/components/applyRefund/index.module.scss
Normal file
66
src/pages/order/components/applyRefund/index.module.scss
Normal file
@ -0,0 +1,66 @@
|
||||
|
||||
.apply_after_sales_con{
|
||||
padding: 20px;
|
||||
.returnSaleInput_item{
|
||||
display: flex;
|
||||
align-items: center;
|
||||
padding-bottom: 50px;
|
||||
flex-wrap: wrap;
|
||||
.title{
|
||||
font-size: $font_size;
|
||||
font-weight: 700;
|
||||
width: 119px;
|
||||
}
|
||||
.select{
|
||||
flex:1;
|
||||
height: 60px;
|
||||
border: 2px solid #e6e6e6;
|
||||
border-radius: 10px;
|
||||
margin-left: 20px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
padding: 0 20px;
|
||||
font-size: 26px;
|
||||
color: $color_font_two;
|
||||
.miconfont{
|
||||
font-size: 30px;
|
||||
}
|
||||
}
|
||||
.upload_image{
|
||||
flex:1;
|
||||
}
|
||||
}
|
||||
.btns_con{
|
||||
width: 100%;
|
||||
bottom:0;
|
||||
box-sizing: border-box;
|
||||
margin-top: 50px;
|
||||
.btns_two{
|
||||
display: flex;
|
||||
height: 82px;
|
||||
// border: 1PX solid #007aff;
|
||||
font-size: $font_size_big;
|
||||
border-radius: 40px;
|
||||
margin-bottom: 20px;
|
||||
.rest_btn{
|
||||
flex:1;
|
||||
border: 1PX solid #007aff;
|
||||
border-radius: 40px 0 0 40px;
|
||||
text-align: center;
|
||||
line-height: 82px;
|
||||
color: $color_main;
|
||||
background-color: #fff;
|
||||
|
||||
}
|
||||
.verify_btn{
|
||||
flex:1;
|
||||
border-radius: 0 40px 40px 0;
|
||||
background: #007aff;
|
||||
text-align: center;
|
||||
line-height: 82px;
|
||||
color: #fff;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
57
src/pages/order/components/applyRefund/index.tsx
Normal file
57
src/pages/order/components/applyRefund/index.tsx
Normal file
@ -0,0 +1,57 @@
|
||||
import Popup from "@/components/popup";
|
||||
import TextareaEnhance from "@/components/textareaEnhance";
|
||||
import { ScrollView, Text, View } from "@tarojs/components";
|
||||
import { memo, useCallback, useState } from "react";
|
||||
import ReasonPopup from "../reasonPopup";
|
||||
import styles from './index.module.scss'
|
||||
import classnames from "classnames";
|
||||
|
||||
type Param = {
|
||||
show?: true|false,
|
||||
onClose?: () => void
|
||||
}
|
||||
export default memo(({show, onClose}:Param) => {
|
||||
|
||||
|
||||
const getOtherReason = useCallback(() => {
|
||||
|
||||
}, [])
|
||||
|
||||
const onSubmit = (val) => {
|
||||
|
||||
}
|
||||
|
||||
//显示说明
|
||||
const [showReason, setShowReason] = useState(false)
|
||||
const closeReason = useCallback(() => {
|
||||
setShowReason(false)
|
||||
}, [])
|
||||
|
||||
const onShowReason = () => {
|
||||
setShowReason(true)
|
||||
}
|
||||
|
||||
return (
|
||||
<>
|
||||
<Popup show={show} title="申请退款" onClose={onClose} >
|
||||
<View className={styles.apply_after_sales_con}>
|
||||
<View className={styles.returnSaleInput_item}>
|
||||
<View className={styles.title}>退款说明</View>
|
||||
<View className={styles.select} onClick={() => onShowReason()}>
|
||||
<Text>请选择</Text>
|
||||
<Text className={classnames(styles.miconfont, 'iconfont icon-a-moreback')}></Text>
|
||||
</View>
|
||||
</View>
|
||||
<TextareaEnhance onChange={getOtherReason} title='备注' placeholder="请输入退款备注"/>
|
||||
<View className={styles.btns_con}>
|
||||
<View className={styles.btns_two}>
|
||||
<View className={styles.rest_btn} onClick={() => onSubmit(1)}>取消</View>
|
||||
<View className={styles.verify_btn } onClick={() => onSubmit(2)}>确认</View>
|
||||
</View >
|
||||
</View>
|
||||
</View>
|
||||
</Popup>
|
||||
<ReasonPopup show={showReason} onClose={closeReason} />
|
||||
</>
|
||||
)
|
||||
})
|
||||
190
src/pages/order/components/kindList/index copy.tsx
Normal file
190
src/pages/order/components/kindList/index copy.tsx
Normal file
@ -0,0 +1,190 @@
|
||||
import { ORDER_STATUS } from "@/common/enum"
|
||||
import { formatHashTag, formatPriceDiv } from "@/common/fotmat"
|
||||
import LabAndImg from "@/components/LabAndImg"
|
||||
import { View } from "@tarojs/components"
|
||||
import { memo, useCallback, useMemo } from "react"
|
||||
import EstimatedAmount from "../estimatedAmount"
|
||||
import styles from './index.module.scss'
|
||||
|
||||
type OrderParam = {
|
||||
estimate_amount: number, //预估金额
|
||||
list: any[],
|
||||
sale_mode: number,
|
||||
sale_mode_name: string,
|
||||
unit: string,
|
||||
total_colors: number,
|
||||
total_fabrics: number,
|
||||
total_number: number,
|
||||
status: number, //订单状态
|
||||
total_sale_price: number, //销售金额
|
||||
total_should_collect_money: number, //应收金额
|
||||
total_weight_error_discount: number, //空差优惠
|
||||
the_previous_status: number, //取消订单时的订单状态
|
||||
actual_amount: number //实付金额
|
||||
}
|
||||
|
||||
type Param = {
|
||||
order: OrderParam,
|
||||
comfirm?: boolean //是否是确认订单页面使用
|
||||
}
|
||||
|
||||
export default memo(({order, comfirm = false}:Param) => {
|
||||
//对应数量
|
||||
const formatCount = useCallback((item) => {
|
||||
return order?.sale_mode == 0? item.roll : Number(item.length / 100)
|
||||
}, [order])
|
||||
//对应单价
|
||||
const standardPrice = useCallback(price => {
|
||||
return formatPriceDiv(price).toLocaleString() + '/' + (order?.sale_mode == 1?'m':'kg')
|
||||
}, [order])
|
||||
|
||||
//数量格式
|
||||
const numText = useMemo(() => {
|
||||
if(order) {
|
||||
let total_number = order?.sale_mode == 0?order?.total_number:(order?.total_number/100)
|
||||
return `${order?.total_fabrics}种面料，${order?.total_colors}种颜色，共${total_number}${order?.unit}`
|
||||
}
|
||||
}, [order])
|
||||
|
||||
const {
|
||||
SaleOrderStatusBooking, // 待接单
|
||||
SaleOrderStatusArranging, // 配布中
|
||||
SaleOrderStatusArranged, // 已配布
|
||||
SaleOrderStatusWaitingPayment, // 待付款
|
||||
SaleOrderStatusWaitingDelivery, // 待发货
|
||||
SaleOrderStatusWaitingReceipt, // 待收货
|
||||
SaleOrderStatusAlreadyReceipt, // 已收货
|
||||
SaleOrderStatusComplete, // 已完成
|
||||
SaleOrderStatusRefund, // 已退款
|
||||
SaleOrderStatusCancel, // 已取消
|
||||
SaleorderstatusWaitingPrePayment // 预付款
|
||||
} = ORDER_STATUS
|
||||
|
||||
//金额列表枚举
|
||||
const priceList = [
|
||||
{
|
||||
id:1,
|
||||
value:[SaleorderstatusWaitingPrePayment.value, SaleOrderStatusBooking.value, SaleOrderStatusArranging.value, ],
|
||||
label:'预估金额',
|
||||
field: 'estimate_amount'
|
||||
},
|
||||
{
|
||||
id:2,
|
||||
value:[SaleorderstatusWaitingPrePayment.value, SaleOrderStatusArranged.value, SaleOrderStatusWaitingPayment.value, SaleOrderStatusWaitingDelivery.value, SaleOrderStatusWaitingReceipt.value, SaleOrderStatusAlreadyReceipt.value, SaleOrderStatusComplete.value, SaleOrderStatusRefund.value, SaleOrderStatusCancel.value],
|
||||
label:'合计金额',
|
||||
field: 'total_sale_price'
|
||||
},
|
||||
{
|
||||
id:3,
|
||||
value:[SaleOrderStatusWaitingPayment.value, SaleOrderStatusWaitingDelivery.value, SaleOrderStatusWaitingReceipt.value, SaleOrderStatusAlreadyReceipt.value, SaleOrderStatusComplete.value, SaleOrderStatusRefund.value, SaleOrderStatusCancel.value],
|
||||
label:'空差优惠',
|
||||
field: 'total_weight_error_discount'
|
||||
},
|
||||
{
|
||||
id:4,
|
||||
value:[ SaleOrderStatusWaitingPayment.value],
|
||||
label:'应付金额',
|
||||
field: 'total_should_collect_money'
|
||||
},
|
||||
{
|
||||
id:5,
|
||||
value:[SaleOrderStatusWaitingDelivery.value, SaleOrderStatusWaitingReceipt.value, SaleOrderStatusAlreadyReceipt.value, SaleOrderStatusComplete.value, SaleOrderStatusRefund.value, SaleOrderStatusCancel.value],
|
||||
label:'实付金额',
|
||||
field: 'actual_amount'
|
||||
}
|
||||
]
|
||||
|
||||
//是否显示价格
|
||||
const showPrice = useCallback((priceInfo, status) => {
|
||||
return priceInfo.value.includes(status)
|
||||
}, [order])
|
||||
|
||||
//金额展示大货
|
||||
const priceConDom = useMemo(() => {
|
||||
if(!order) return
|
||||
if(comfirm == true) {
|
||||
//确认订单时
|
||||
return <EstimatedAmount number={formatPriceDiv(order.estimate_amount)} title="预估金额" />
|
||||
}
|
||||
|
||||
if(order?.status == SaleOrderStatusCancel.value) {
|
||||
//订单状态为取消订单时
|
||||
return (
|
||||
<>
|
||||
{
|
||||
priceList.map(item => {
|
||||
return <>{showPrice(item, order?.the_previous_status)&&<EstimatedAmount key={item.id} number={formatPriceDiv(order[item.field])} title={item.label} />}</>
|
||||
})
|
||||
}
|
||||
</>
|
||||
)
|
||||
} else {
|
||||
//其他订单状态
|
||||
return (
|
||||
<>
|
||||
{
|
||||
priceList.map(item => {
|
||||
return <>{showPrice(item, order?.status)&&<EstimatedAmount key={item.id} number={formatPriceDiv(order[item.field])} title={item.label} />}</>
|
||||
})
|
||||
}
|
||||
</>
|
||||
)
|
||||
}
|
||||
}, [order])
|
||||
|
||||
//金额展示剪板
|
||||
const cutPriceConDom = useMemo(() => {
|
||||
if(!order) return
|
||||
return <EstimatedAmount number={formatPriceDiv(order.total_should_collect_money)} title="合计金额" />
|
||||
}, [order])
|
||||
|
||||
const showPriceAll = useMemo(() => {
|
||||
if(order?.sale_mode == 1) {
|
||||
return cutPriceConDom //剪板
|
||||
} else {
|
||||
return priceConDom //大货
|
||||
}
|
||||
}, [order])
|
||||
|
||||
|
||||
return (
|
||||
<>
|
||||
<View className={styles.orders_list_title}>{numText}</View>
|
||||
<View className={styles.orders_list_con}>
|
||||
{
|
||||
order?.list?.map(item => {
|
||||
return <View key={item.product_code} className={styles.order_list}>
|
||||
<View className={styles.order_list_title}>
|
||||
<View className={styles.tag}>{order.sale_mode_name}</View>
|
||||
<View className={styles.title}>{formatHashTag(item.code, item.name)}</View>
|
||||
<View className={styles.num}>共{item?.product_colors.length}种</View>
|
||||
</View>
|
||||
<View className={styles.order_list_scroll}>
|
||||
{item?.product_colors?.map(colorItem => {
|
||||
return <View key={colorItem.id} className={styles.order_list_item}>
|
||||
<View className={styles.order_list_item_img}>
|
||||
<LabAndImg value={{lab:item.lab,rgb:item.rgb,texture_url:item.texture_url}}/>
|
||||
</View>
|
||||
<View className={styles.order_list_item_con}>
|
||||
<View className={styles.order_list_item_des}>
|
||||
<View className={styles.order_list_item_title}>{colorItem.code + ' ' + colorItem.name}</View>
|
||||
<View className={styles.order_list_item_price}>¥{standardPrice(colorItem.sale_price)}</View>
|
||||
</View>
|
||||
<View className={styles.order_list_item_count}>
|
||||
<View className={styles.count_num}>×{formatCount(colorItem)}<text>{order.unit}</text></View>
|
||||
<View className={styles.count_price}><text>¥</text>{formatPriceDiv(colorItem.estimate_amount).toLocaleString()}</View>
|
||||
</View>
|
||||
</View>
|
||||
</View>
|
||||
})}
|
||||
</View>
|
||||
</View>
|
||||
})
|
||||
}
|
||||
<View className={styles.order_estimated_amount}>
|
||||
{showPriceAll}
|
||||
</View>
|
||||
</View>
|
||||
</>
|
||||
)
|
||||
})
|
||||
@ -40,14 +40,13 @@
|
||||
|
||||
.order_list_item {
|
||||
display: flex;
|
||||
&:nth-child(2) {
|
||||
&:nth-child(n + 2) {
|
||||
margin-top: 30px;
|
||||
}
|
||||
.order_list_item_img{
|
||||
width: 126px;
|
||||
height: 126px;
|
||||
border-radius: 20px;
|
||||
background-color: red;
|
||||
}
|
||||
.order_list_item_con{
|
||||
display: flex;
|
||||
@ -67,9 +66,14 @@
|
||||
font-size: $font_size;
|
||||
margin-bottom: 15px;
|
||||
}
|
||||
.order_list_item_price{
|
||||
.order_list_item_price, .order_list_item_price_dg{
|
||||
font-size: 26px;
|
||||
color: $color_font_three;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
Text{
|
||||
padding-left: 13px;
|
||||
}
|
||||
}
|
||||
}
|
||||
.order_list_item_count{
|
||||
|
||||
@ -1,6 +1,7 @@
|
||||
import { ORDER_STATUS } from "@/common/enum"
|
||||
import { formatHashTag, formatPriceDiv } from "@/common/fotmat"
|
||||
import { View } from "@tarojs/components"
|
||||
import { formatHashTag, formatPriceDiv, formatWeightDiv } from "@/common/fotmat"
|
||||
import LabAndImg from "@/components/LabAndImg"
|
||||
import { Text, View } from "@tarojs/components"
|
||||
import { memo, useCallback, useMemo } from "react"
|
||||
import EstimatedAmount from "../estimatedAmount"
|
||||
import styles from './index.module.scss'
|
||||
@ -15,7 +16,7 @@ type OrderParam = {
|
||||
total_fabrics: number,
|
||||
total_number: number,
|
||||
status: number, //订单状态
|
||||
total_sale_price: number, //销售金额
|
||||
total_sale_price: number, //合计金额
|
||||
total_should_collect_money: number, //应收金额
|
||||
total_weight_error_discount: number, //空差优惠
|
||||
the_previous_status: number, //取消订单时的订单状态
|
||||
@ -39,8 +40,10 @@ export default memo(({order, comfirm = false}:Param) => {
|
||||
|
||||
//数量格式
|
||||
const numText = useMemo(() => {
|
||||
if(order)
|
||||
return `${order?.total_fabrics}种面料，${order?.total_colors}种颜色，共${order?.total_number}${order?.unit}`
|
||||
if(order) {
|
||||
let total_number = order?.sale_mode == 0?order?.total_number:(order?.total_number/100)
|
||||
return `${order?.total_fabrics}种面料，${order?.total_colors}种颜色，共${total_number}${order?.unit}`
|
||||
}
|
||||
}, [order])
|
||||
|
||||
const {
|
||||
@ -54,19 +57,21 @@ export default memo(({order, comfirm = false}:Param) => {
|
||||
SaleOrderStatusComplete, // 已完成
|
||||
SaleOrderStatusRefund, // 已退款
|
||||
SaleOrderStatusCancel, // 已取消
|
||||
SaleorderstatusWaitingPrePayment, // 预付款
|
||||
SaleOrderStatusTaking //提货
|
||||
} = ORDER_STATUS
|
||||
|
||||
//金额列表枚举
|
||||
const priceList = [
|
||||
{
|
||||
id:1,
|
||||
value:[SaleOrderStatusBooking.value, SaleOrderStatusArranging.value],
|
||||
value:[SaleorderstatusWaitingPrePayment.value, SaleOrderStatusBooking.value, SaleOrderStatusArranging.value],
|
||||
label:'预估金额',
|
||||
field: 'estimate_amount'
|
||||
},
|
||||
{
|
||||
id:2,
|
||||
value:[SaleOrderStatusArranged.value, SaleOrderStatusWaitingPayment.value, SaleOrderStatusWaitingDelivery.value, SaleOrderStatusWaitingReceipt.value, SaleOrderStatusAlreadyReceipt.value, SaleOrderStatusComplete.value, SaleOrderStatusRefund.value, SaleOrderStatusCancel.value],
|
||||
value:[SaleOrderStatusTaking.value, SaleOrderStatusArranged.value, SaleOrderStatusWaitingPayment.value, SaleOrderStatusWaitingDelivery.value, SaleOrderStatusWaitingReceipt.value, SaleOrderStatusAlreadyReceipt.value, SaleOrderStatusComplete.value, SaleOrderStatusRefund.value, SaleOrderStatusCancel.value],
|
||||
label:'合计金额',
|
||||
field: 'total_sale_price'
|
||||
},
|
||||
@ -84,45 +89,60 @@ export default memo(({order, comfirm = false}:Param) => {
|
||||
},
|
||||
{
|
||||
id:5,
|
||||
value:[SaleOrderStatusWaitingDelivery.value, SaleOrderStatusWaitingReceipt.value, SaleOrderStatusAlreadyReceipt.value, SaleOrderStatusComplete.value, SaleOrderStatusRefund.value, SaleOrderStatusCancel.value],
|
||||
value:[SaleOrderStatusTaking.value, SaleOrderStatusWaitingDelivery.value, SaleOrderStatusWaitingReceipt.value, SaleOrderStatusAlreadyReceipt.value, SaleOrderStatusComplete.value, SaleOrderStatusRefund.value, SaleOrderStatusCancel.value],
|
||||
label:'实付金额',
|
||||
field: 'actual_amount'
|
||||
}
|
||||
]
|
||||
|
||||
//是否显示价格
|
||||
const showPrice = useCallback((priceInfo, status) => {
|
||||
return priceInfo.value.includes(status)
|
||||
}, [order])
|
||||
//订单流程是否显示价格
|
||||
const showPrice = (item) => {
|
||||
if (item.id == 2) {
|
||||
//合计金额 (剪板特殊请情况)
|
||||
return (item.value.includes(order.status)|| order.sale_mode == 1)
|
||||
} else if (item.id == 3) {
|
||||
//空差优惠只有大货才有
|
||||
return (item.value.includes(order.status) && order.sale_mode == 1 )
|
||||
} else {
|
||||
return (item.value.includes(order.status) && order.sale_mode != 1 )
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
//订单流程金额展示
|
||||
const priceConDom = useMemo(() => {
|
||||
if(!order) return
|
||||
//确认订单
|
||||
if(comfirm == true) {
|
||||
return <EstimatedAmount number={formatPriceDiv(order.estimate_amount)} title="预估金额" />
|
||||
}
|
||||
//订单为取消订单状态
|
||||
if(order?.status == SaleOrderStatusCancel.value) {
|
||||
return (
|
||||
<>
|
||||
{
|
||||
priceList.map(item => {
|
||||
return <>{showPrice(item, order?.the_previous_status)&&<EstimatedAmount key={item.id} number={formatPriceDiv(order[item.field])} title={item.label} />}</>
|
||||
})
|
||||
}
|
||||
</>
|
||||
)
|
||||
} else {
|
||||
return (
|
||||
<>
|
||||
{
|
||||
priceList.map(item => {
|
||||
return <>{showPrice(item, order?.status)&&<EstimatedAmount key={item.id} number={formatPriceDiv(order[item.field])} title={item.label} />}</>
|
||||
return <>{showPrice(item)&&<EstimatedAmount key={item.id} number={formatPriceDiv(order[item.field])} title={item.label} />}</>
|
||||
})
|
||||
}
|
||||
</>
|
||||
)
|
||||
}, [order])
|
||||
|
||||
//确认订单金额展示
|
||||
const comfirmPriceConDom = useMemo(() => {
|
||||
if(!order) return
|
||||
let item = order.sale_mode == 1?priceList[1]:priceList[0]
|
||||
return<EstimatedAmount key={item.id} number={formatPriceDiv(order[item.field])} title={item.label} />
|
||||
}, [order])
|
||||
|
||||
//金额展示
|
||||
const showPriceConDom = useMemo(() => {
|
||||
return comfirm?comfirmPriceConDom:priceConDom
|
||||
}, [order])
|
||||
|
||||
|
||||
//散剪大约重量
|
||||
const aboutWeight = useCallback((weight) => {
|
||||
if(order.sale_mode == 2 ) {
|
||||
let showWeight = [SaleorderstatusWaitingPrePayment.value, SaleOrderStatusBooking.value, SaleOrderStatusArranging.value].includes(order.status)
|
||||
return showWeight?<View className={styles.order_list_item_price_dg}>; <Text>≈{formatWeightDiv(weight)}kg</Text></View>:<></>
|
||||
}
|
||||
return <></>
|
||||
}, [order])
|
||||
|
||||
return (
|
||||
@ -140,11 +160,17 @@ export default memo(({order, comfirm = false}:Param) => {
|
||||
<View className={styles.order_list_scroll}>
|
||||
{item?.product_colors?.map(colorItem => {
|
||||
return <View key={colorItem.id} className={styles.order_list_item}>
|
||||
<View className={styles.order_list_item_img}></View>
|
||||
<View className={styles.order_list_item_img}>
|
||||
<LabAndImg value={{lab:item.lab,rgb:item.rgb,texture_url:item.texture_url}}/>
|
||||
</View>
|
||||
<View className={styles.order_list_item_con}>
|
||||
<View className={styles.order_list_item_des}>
|
||||
<View className={styles.order_list_item_title}>{colorItem.code + ' ' + colorItem.name}</View>
|
||||
<View className={styles.order_list_item_price}>¥{standardPrice(colorItem.sale_price)}</View>
|
||||
<View className={styles.order_list_item_price}>
|
||||
¥{standardPrice(colorItem.sale_price)}
|
||||
{aboutWeight(colorItem.estimate_weight)}
|
||||
</View>
|
||||
|
||||
</View>
|
||||
<View className={styles.order_list_item_count}>
|
||||
<View className={styles.count_num}>×{formatCount(colorItem)}<text>{order.unit}</text></View>
|
||||
@ -158,7 +184,7 @@ export default memo(({order, comfirm = false}:Param) => {
|
||||
})
|
||||
}
|
||||
<View className={styles.order_estimated_amount}>
|
||||
{priceConDom}
|
||||
{showPriceConDom}
|
||||
</View>
|
||||
</View>
|
||||
</>
|
||||
|
||||
@ -15,7 +15,6 @@
|
||||
}
|
||||
.order_status_item{
|
||||
position: relative;
|
||||
padding-left: 50px;
|
||||
&:nth-last-child(n+2) {
|
||||
padding-bottom: 30px;
|
||||
}
|
||||
@ -44,6 +43,7 @@
|
||||
.order_status_content{
|
||||
display: flex;
|
||||
align-items: center;
|
||||
padding: 0 30px;
|
||||
.order_status_title{
|
||||
color: $color_font_two;
|
||||
font-size: $font_size;
|
||||
@ -75,6 +75,24 @@
|
||||
.order_status_des_select{
|
||||
color: $color_font_one;
|
||||
}
|
||||
.pay_time{
|
||||
height: 56px;
|
||||
background: #f6f6f6;
|
||||
border-radius: 20px;
|
||||
color: #3C3C3C;
|
||||
font-size: 24px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
font-weight: 700;
|
||||
margin-top: 20px;
|
||||
text{
|
||||
font-size: 28px;
|
||||
color: $color_main;
|
||||
padding: 0 10px;
|
||||
|
||||
}
|
||||
}
|
||||
}
|
||||
.more{
|
||||
width: 100%;
|
||||
@ -102,4 +120,20 @@
|
||||
top: -10px;
|
||||
right: -10px;
|
||||
}
|
||||
.refresh{
|
||||
position: absolute;
|
||||
top: 23px;
|
||||
right: 20px;
|
||||
display: flex;
|
||||
color: #707070;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
|
||||
.mconfont{
|
||||
font-size: 30px;
|
||||
}
|
||||
.refresh_text{
|
||||
font-size: 23px;
|
||||
}
|
||||
}
|
||||
}
|
||||
@ -1,42 +1,59 @@
|
||||
import { Image, Text, View } from "@tarojs/components"
|
||||
import { memo, useMemo, useState } from "react"
|
||||
import { memo, useEffect, useMemo, useRef, useState } from "react"
|
||||
import styles from './index.module.scss'
|
||||
import classnames from "classnames";
|
||||
import { formatDateTime, formatImgUrl } from "@/common/fotmat";
|
||||
import { PAYMENT_METHOD, PAYMENT_METHOD_PARAM } from "@/common/enum";
|
||||
import { ORDER_STATUS, PAYMENT_METHOD, PAYMENT_METHOD_PARAM } from "@/common/enum";
|
||||
import * as dayjs from 'dayjs'
|
||||
|
||||
|
||||
|
||||
type Param = {
|
||||
list: {
|
||||
type List = {
|
||||
status: string,
|
||||
time: string,
|
||||
tag: string,
|
||||
desc: string
|
||||
}[],
|
||||
payment_method: 0|PAYMENT_METHOD_PARAM,
|
||||
|
||||
desc: string,
|
||||
expire_time: string
|
||||
}
|
||||
|
||||
type Param = {
|
||||
onRefresh?: () => void,
|
||||
orderInfo?: {
|
||||
logistics_details:List[], //订单状态列表
|
||||
payment_method: 0|PAYMENT_METHOD_PARAM, //支付方式
|
||||
status: number, //订单状态
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
|
||||
export default memo(({orderInfo = {logistics_details: [],payment_method: 0, status: 0}, onRefresh}:Param) => {
|
||||
|
||||
const [showMore, setShowMore] = useState(false)
|
||||
const changeMore = () => {
|
||||
setShowMore(() => !showMore)
|
||||
}
|
||||
const dataList = useMemo(() => {
|
||||
return orderInfo.logistics_details?orderInfo?.logistics_details.reverse():[]
|
||||
}, [orderInfo.logistics_details])
|
||||
|
||||
//订单状态枚举
|
||||
const {SaleorderstatusWaitingPrePayment} = ORDER_STATUS
|
||||
|
||||
//支付方式枚举
|
||||
const {
|
||||
PaymentMethodAccountPeriod,
|
||||
PaymentMethodCashOnDelivery,
|
||||
} = PAYMENT_METHOD
|
||||
|
||||
export default memo(({list = [], payment_method = 0}:Param) => {
|
||||
|
||||
const [showMore, setShowMore] = useState(false)
|
||||
const changeMore = () => {
|
||||
setShowMore(() => !showMore)
|
||||
//获取预付款最后时间
|
||||
const endTime = useMemo(() => {
|
||||
if(orderInfo.status == SaleorderstatusWaitingPrePayment.value && orderInfo.logistics_details.length > 0) {
|
||||
return orderInfo.logistics_details[0].expire_time
|
||||
}
|
||||
const dataList = useMemo(() => {
|
||||
return list.reverse()
|
||||
}, [list])
|
||||
|
||||
return ''
|
||||
}, [orderInfo])
|
||||
return (
|
||||
<>
|
||||
{(dataList.length > 0)&&<View className={styles.order_flow_state}>
|
||||
{(dataList?.length > 0)&&<View className={styles.order_flow_state}>
|
||||
<View className={classnames(styles.order_status_list, showMore&&styles.order_status_list_show)}>
|
||||
{dataList.map((item, index) => <View className={styles.order_status_item}>
|
||||
{(dataList.length > 1)&&<View className={classnames(styles.order_status_tail, (index == 0)&&styles.order_status_tail_end)}></View>}
|
||||
@ -44,9 +61,9 @@ export default memo(({list = [], payment_method = 0}:Param) => {
|
||||
<View className={styles.order_status_content}>
|
||||
<View className={classnames(styles.order_status_title, (index == 0)&&styles.order_status_select)}>{item.status}</View>
|
||||
<View className={classnames(styles.order_status_time, (index == 0)&&styles.order_status_select)}>{formatDateTime(item.time)}</View>
|
||||
{/* <View className={classnames(styles.order_status_tag, (index == 0)&&styles.order_status_tag_select)}>{item.tag}</View> */}
|
||||
</View>
|
||||
<Text className={classnames(styles.order_status_des, (index == 0)&&styles.order_status_des_select)}>{item.desc}</Text>
|
||||
{(orderInfo.status == SaleorderstatusWaitingPrePayment.value)&&<CountDown onFinish={onRefresh} endTime={endTime}/>}
|
||||
</View>)}
|
||||
</View>
|
||||
{(dataList.length > 2) && <View className={styles.more} onClick={() => changeMore()}>
|
||||
@ -54,10 +71,62 @@ export default memo(({list = [], payment_method = 0}:Param) => {
|
||||
<Text className={classnames('iconfont icon-a-moreback', styles.miconfonts, showMore&&styles.open_miconfonts)}></Text>
|
||||
</View>}
|
||||
<View className={styles.image_tag}>
|
||||
{(payment_method == PaymentMethodCashOnDelivery.value)&&<Image mode="aspectFit" src={formatImgUrl('/mall/order_pay_status.png')} className={styles.image}/>}
|
||||
{(payment_method == PaymentMethodAccountPeriod.value)&&<Image mode="aspectFit" src={formatImgUrl('/mall/order_pay_status_7day.png')} className={styles.image}/>}
|
||||
{(orderInfo.payment_method == PaymentMethodCashOnDelivery.value)&&<Image mode="aspectFit" src={formatImgUrl('/mall/order_pay_status.png')} className={styles.image}/>}
|
||||
{(orderInfo.payment_method == PaymentMethodAccountPeriod.value)&&<Image mode="aspectFit" src={formatImgUrl('/mall/order_pay_status_7day.png')} className={styles.image}/>}
|
||||
</View>
|
||||
{(orderInfo.status == SaleorderstatusWaitingPrePayment.value)&&<View className={styles.refresh} onClick={onRefresh}>
|
||||
<Text className={classnames(styles.mconfont, 'iconfont icon-xianxiahuikuan')}></Text>
|
||||
<Text className={classnames(styles.refresh_text)}>刷新</Text>
|
||||
</View>}
|
||||
</View>}
|
||||
</>
|
||||
)
|
||||
})
|
||||
|
||||
//倒计时
|
||||
const CountDown = ({endTime = '', onFinish}:{endTime:string, onFinish?:() => void}) => {
|
||||
const [showTime, setShowTime] = useState('')
|
||||
const timeObj:any = useRef()
|
||||
useEffect(() => {
|
||||
if(endTime) {
|
||||
clearInterval(timeObj.current)
|
||||
timeObj.current = setInterval(() => {
|
||||
count_down()
|
||||
}, 1000)
|
||||
}
|
||||
return () => {
|
||||
clearInterval(timeObj.current)
|
||||
}
|
||||
}, [endTime])
|
||||
const count_down = () => {
|
||||
var startData = dayjs();
|
||||
var endDate = dayjs(endTime);
|
||||
if(startData >= endDate) {
|
||||
clearInterval(timeObj.current)
|
||||
onFinish?.()
|
||||
setShowTime(() => '00:00:00')
|
||||
return false
|
||||
}
|
||||
var _dd = endDate.diff(startData,'day');
|
||||
var _hh = endDate.diff(startData,'hour');
|
||||
var _mm = endDate.diff(startData,'minute');
|
||||
var _ss = endDate.diff(startData,'second');
|
||||
// 转换
|
||||
var hh = _hh - (_dd*24);
|
||||
var mm = _mm - (_hh*60);
|
||||
var ss = _ss - (_mm*60);
|
||||
// 格式化
|
||||
var DD = ('00'+_dd).slice(-2);
|
||||
var HH = ('00'+hh).slice(-2);
|
||||
var MM = ('00'+mm).slice(-2);
|
||||
var SS = ('00'+ss).slice(-2);
|
||||
setShowTime(() => ` ${HH}:${MM}:${SS}`)
|
||||
}
|
||||
return (
|
||||
<>
|
||||
<View className={styles.pay_time}>
|
||||
剩<Text>{showTime||'--:--:--'}</Text>支付关闭，订单自动取消
|
||||
</View>
|
||||
</>
|
||||
)
|
||||
}
|
||||
@ -35,9 +35,9 @@ $top:190px;
|
||||
border-radius: 10px;
|
||||
padding-bottom: 100px;
|
||||
position: relative;
|
||||
background: radial-gradient(circle 20px at left $top, transparent 20px, #fff 20px + 3px) left 0px/60% no-repeat ,
|
||||
radial-gradient(circle 20px at right $top, transparent 20px, #fff 20px + 3px) right 0px/60% no-repeat;
|
||||
filter: drop-shadow(2px 2px 6px rgba(0, 0, 0, .16));
|
||||
// background: radial-gradient(circle 20px at left $top, transparent 20px, #fff 20px + 3px) left 0px/60% no-repeat ,
|
||||
// radial-gradient(circle 20px at right $top, transparent 20px, #fff 20px + 3px) right 0px/60% no-repeat;
|
||||
// filter: drop-shadow(2px 2px 6px rgba(0, 0, 0, .16));
|
||||
position: relative;
|
||||
&::before{
|
||||
content: '';
|
||||
|
||||
@ -8,26 +8,34 @@ import MCheckbox from "@/components/checkbox";
|
||||
import Popup from "@/components/popup";
|
||||
import OfflinePay from "../offlinePay";
|
||||
import ScanPay from "../scanPay";
|
||||
import { GetOrderPayApi, SubmitOrderPayApi } from "@/api/orderPay";
|
||||
import { GetOrderPayApi, SubmitOrderPayApi, GetPrepayOrderPayApi, SubmitPrepayOrderPayApi } from "@/api/orderPay";
|
||||
import { formatPriceDiv } from "@/common/fotmat";
|
||||
import {alert} from "@/common/common"
|
||||
import { PAYMENT_METHOD, PAYMENT_METHOD_PARAM } from "@/common/enum";
|
||||
import { ORDER_STATUS, PAYMENT_METHOD, PAYMENT_METHOD_PARAM } from "@/common/enum";
|
||||
|
||||
type Param = {
|
||||
show?: true|false,
|
||||
onClose?: () => void,
|
||||
onSubmitSuccess?: () => void, //支付成功
|
||||
orderInfo?: OrderInfo
|
||||
orderInfo?: OrderInfo,
|
||||
}
|
||||
|
||||
type OrderInfo = {
|
||||
orderId: number, //应付单id
|
||||
payment_method: 0|PAYMENT_METHOD_PARAM //支付方式
|
||||
should_collect_order_id?: number, //应付单id
|
||||
pre_collect_order_id?: number, //预付单id
|
||||
status?: number, //订单状态
|
||||
payment_method?: 0|PAYMENT_METHOD_PARAM //支付方式
|
||||
sale_mode?: number //订单类型 0：大货 1剪板 2散剪
|
||||
}
|
||||
|
||||
type PayStatus = 1|2|3|4|5|null //1:预存款， 2:账期，3：线下汇款， 4：扫码支付, 5:货到付款
|
||||
export default memo(({show = false, onClose, orderInfo, onSubmitSuccess}:Param) => {
|
||||
|
||||
//支付方式枚举
|
||||
const {PaymentMethodPreDeposit, PaymentMethodAccountPeriod, PaymentMethodCashOnDelivery} = PAYMENT_METHOD
|
||||
//订单状态枚举
|
||||
const {SaleorderstatusWaitingPrePayment} = ORDER_STATUS
|
||||
|
||||
//提交参数
|
||||
const [submitData, setSubmitData] = useState<{id:number, payment_method: PayStatus}>({
|
||||
id:0,
|
||||
@ -38,7 +46,7 @@ export default memo(({show = false, onClose, orderInfo, onSubmitSuccess}:Param)
|
||||
const [offlinePayShow, setofflinePayShow] = useState(false)
|
||||
const onShowOfflinePay = () => {
|
||||
setofflinePayShow(true)
|
||||
onClose?.()
|
||||
// onClose?.()
|
||||
}
|
||||
|
||||
//扫码支付
|
||||
@ -51,13 +59,22 @@ export default memo(({show = false, onClose, orderInfo, onSubmitSuccess}:Param)
|
||||
//获取支付方式数据
|
||||
const [payInfo, setPayInfo] = useState<any>()
|
||||
const {fetchData: orderFetchData} = GetOrderPayApi()
|
||||
const {fetchData: prepayOrderFetchData} = GetPrepayOrderPayApi()
|
||||
const getOrderPay = async () => {
|
||||
let {data} = await orderFetchData({id: orderInfo?.orderId})
|
||||
if(orderInfo&&orderInfo.should_collect_order_id) {
|
||||
//有应收单id时用应收单获取数据
|
||||
let {data} = await orderFetchData({id: orderInfo?.should_collect_order_id})
|
||||
setPayInfo(() => data)
|
||||
} else {
|
||||
//用预付单id获取支付信息
|
||||
let {data} = await prepayOrderFetchData({id: orderInfo?.pre_collect_order_id})
|
||||
setPayInfo(() => data)
|
||||
}
|
||||
}
|
||||
useEffect(() => {
|
||||
if(show&&orderInfo?.orderId) {
|
||||
setSubmitData((val) => ({...val, id:orderInfo.orderId}))
|
||||
if(show&&orderInfo&&(orderInfo?.should_collect_order_id||orderInfo?.pre_collect_order_id)) {
|
||||
let id = orderInfo.should_collect_order_id||orderInfo.pre_collect_order_id
|
||||
setSubmitData((val) => ({...val, id:id as number}))
|
||||
getOrderPay()
|
||||
}
|
||||
}, [show, orderInfo])
|
||||
@ -73,14 +90,20 @@ export default memo(({show = false, onClose, orderInfo, onSubmitSuccess}:Param)
|
||||
}
|
||||
|
||||
//提交支付
|
||||
const {fetchData: submitFetchData} = SubmitOrderPayApi()
|
||||
const {fetchData: submitFetchData} = SubmitOrderPayApi() //应收单提交
|
||||
const {fetchData: submitPrepayOrderFetchData} = SubmitPrepayOrderPayApi() //预付单提交
|
||||
const submitPay = async () => {
|
||||
if(submitData.payment_method === null) {
|
||||
alert.error('请选择支付方式')
|
||||
return false
|
||||
}
|
||||
alert.loading('正在支付')
|
||||
let res = await submitFetchData(submitData)
|
||||
let res:any = null
|
||||
if(orderInfo?.should_collect_order_id) {
|
||||
res = await submitFetchData(submitData)
|
||||
} else {
|
||||
res = await submitPrepayOrderFetchData(submitData)
|
||||
}
|
||||
if(res.success) {
|
||||
alert.success('支付成功')
|
||||
onSubmitSuccess?.()
|
||||
@ -97,6 +120,20 @@ export default memo(({show = false, onClose, orderInfo, onSubmitSuccess}:Param)
|
||||
)
|
||||
}, [payInfo])
|
||||
|
||||
//是否显示七天账期
|
||||
const show_account_payment = useMemo(() => {
|
||||
console.log('orderInfo?.status::',orderInfo)
|
||||
//剪板合散剪不显示
|
||||
if(orderInfo?.sale_mode != 0) return false
|
||||
//支付方式是账期支付,不显示
|
||||
if(orderInfo?.payment_method == PaymentMethodAccountPeriod.value) return false
|
||||
//支付方式是货到付款,不显示
|
||||
if(orderInfo?.payment_method == PaymentMethodCashOnDelivery.value) return false
|
||||
//订单状态是预付款,不显示
|
||||
if(orderInfo?.status == SaleorderstatusWaitingPrePayment.value) return false
|
||||
return true
|
||||
}, [orderInfo])
|
||||
|
||||
//账期
|
||||
const account_peyment = useMemo(() => {
|
||||
const price = payInfo?.should_collect_money - payInfo?.amount_paid
|
||||
@ -105,8 +142,9 @@ export default memo(({show = false, onClose, orderInfo, onSubmitSuccess}:Param)
|
||||
)
|
||||
}, [payInfo])
|
||||
|
||||
//支付方式枚举
|
||||
const {PaymentMethodPreDeposit, PaymentMethodAccountPeriod} = PAYMENT_METHOD
|
||||
//选择改变
|
||||
const changeSelect = () => {
|
||||
}
|
||||
|
||||
return (
|
||||
<View className={styles.payment_main}>
|
||||
@ -133,7 +171,7 @@ export default memo(({show = false, onClose, orderInfo, onSubmitSuccess}:Param)
|
||||
</View>
|
||||
</View>
|
||||
<View className={styles.payment_list_con}>
|
||||
<View className={styles.payment_list_item}>
|
||||
<View className={styles.payment_list_item} onClick={changeSelect}>
|
||||
<View className={styles.payment_list_item_left}>
|
||||
<View className={styles.payment_list_item_left_name}>
|
||||
<View className={classnames('iconfont icon-a-tuikuanshouhou', styles.miconfont)}></View>
|
||||
@ -143,13 +181,12 @@ export default memo(({show = false, onClose, orderInfo, onSubmitSuccess}:Param)
|
||||
</View>
|
||||
<MCheckbox status={submitData.payment_method == PaymentMethodPreDeposit.value} onSelect={() => advanceSelectData(PaymentMethodPreDeposit.value)} onClose={() => advanceSelectData(null)}/>
|
||||
</View>
|
||||
{(orderInfo?.payment_method != PaymentMethodAccountPeriod.value)&&<View className={styles.payment_list_item}>
|
||||
{show_account_payment&&<View className={styles.payment_list_item}>
|
||||
<View className={styles.payment_list_item_left}>
|
||||
<View className={styles.payment_list_item_left_name}>
|
||||
<View className={classnames('iconfont icon-a-tuikuanshouhou', styles.miconfont)}></View>
|
||||
<View className={styles.payment_list_item_left_text}>{payInfo?.account_period}天账期</View>
|
||||
</View>
|
||||
{/* <View className={styles.payment_list_item_left_price}>可用额度 ¥{formatPriceDiv(payInfo?.account_period_credit_available_line)}</View> */}
|
||||
{account_peyment}
|
||||
</View>
|
||||
<MCheckbox status={submitData.payment_method == PaymentMethodAccountPeriod.value} onSelect={() => periodSelectData(PaymentMethodAccountPeriod.value)} onClose={() => periodSelectData(null)}/>
|
||||
|
||||
27
src/pages/order/components/reasonPopup/index.module.scss
Normal file
27
src/pages/order/components/reasonPopup/index.module.scss
Normal file
@ -0,0 +1,27 @@
|
||||
.reason_return_con{
|
||||
height: 50vh;
|
||||
.reason_title{
|
||||
padding: 10px 20px 0 20px;
|
||||
height: 60px;
|
||||
border-bottom: 1PX solid #F3F3F3;
|
||||
box-sizing: border-box;
|
||||
Text{
|
||||
font-size: 26px;
|
||||
border-bottom: 3px solid #000;
|
||||
padding: 10px;
|
||||
font-weight: 400;
|
||||
}
|
||||
|
||||
}
|
||||
.reason_scroll{
|
||||
height: calc(100% - 70px);
|
||||
.reason_list{
|
||||
font-size: 26px;
|
||||
padding: 30px 20px 0 20px;
|
||||
color: #707070;
|
||||
.reason_item{
|
||||
margin-bottom: 36px;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
37
src/pages/order/components/reasonPopup/index.tsx
Normal file
37
src/pages/order/components/reasonPopup/index.tsx
Normal file
@ -0,0 +1,37 @@
|
||||
import Popup from "@/components/popup";
|
||||
import { ScrollView, Text, View } from "@tarojs/components";
|
||||
import { memo, useMemo } from "react";
|
||||
import styles from './index.module.scss'
|
||||
|
||||
//原因选择
|
||||
type ReasonInfoParam = {
|
||||
show?: boolean,
|
||||
onClose?: () => void,
|
||||
}
|
||||
export default memo(({show = false, onClose}: ReasonInfoParam) => {
|
||||
return (
|
||||
<Popup showIconButton={false} show={show} title="退款说明" onClose={onClose} >
|
||||
<View className={styles.reason_return_con}>
|
||||
<View className={styles.reason_title}><Text>退款说明</Text></View>
|
||||
<ScrollView scrollY className={styles.reason_scroll}>
|
||||
<View className={styles.reason_list}>
|
||||
<View className={styles.reason_item}>完好无损带原标签</View>
|
||||
<View className={styles.reason_item}>完好无损带原标签</View>
|
||||
<View className={styles.reason_item}>完好无损带原标签</View>
|
||||
<View className={styles.reason_item}>完好无损带原标签</View>
|
||||
<View className={styles.reason_item}>完好无损带原标签</View>
|
||||
<View className={styles.reason_item}>完好无损带原标签</View>
|
||||
<View className={styles.reason_item}>完好无损带原标签</View>
|
||||
<View className={styles.reason_item}>完好无损带原标签</View>
|
||||
<View className={styles.reason_item}>完好无损带原标签</View>
|
||||
<View className={styles.reason_item}>完好无损带原标签</View>
|
||||
<View className={styles.reason_item}>完好无损带原标签</View>
|
||||
<View className={styles.reason_item}>完好无损带原标签</View>
|
||||
<View className={styles.reason_item}>完好无损带原标签</View>
|
||||
<View className={styles.reason_item}>完好无损带原标签</View>
|
||||
</View>
|
||||
</ScrollView>
|
||||
</View>
|
||||
</Popup>
|
||||
)
|
||||
})
|
||||
@ -1,20 +1,25 @@
|
||||
import Popup from "@/components/popup"
|
||||
import { Textarea, View } from "@tarojs/components"
|
||||
import { useCallback, useState } from "react"
|
||||
import { useCallback, useEffect, useState } from "react"
|
||||
import styles from './index.module.scss'
|
||||
|
||||
type Param = {
|
||||
onBlur?: (val:any) => void
|
||||
onSave?: (val: string) => void
|
||||
defaultValue?: string
|
||||
}
|
||||
export default ({onBlur, onSave}:Param) => {
|
||||
export default ({onBlur, onSave, defaultValue = ''}:Param) => {
|
||||
const [descData, setDescData] = useState({
|
||||
number: 0,
|
||||
value: '',
|
||||
count: 200
|
||||
})
|
||||
const getDesc = useCallback((e) => {
|
||||
let value = e.detail.value
|
||||
|
||||
useEffect(() => {
|
||||
getDesc(defaultValue)
|
||||
}, [defaultValue])
|
||||
|
||||
const getDesc = useCallback((value) => {
|
||||
let res = value
|
||||
if(value.length > descData.count) {
|
||||
res = value.slice(0, descData.count)
|
||||
@ -29,7 +34,7 @@ export default ({onBlur, onSave}:Param) => {
|
||||
<View className={styles.order_popup}>
|
||||
<View className={styles.order_popup_title}>编辑备注</View>
|
||||
<View className={styles.order_popup_input}>
|
||||
<Textarea placeholder="请添加备注" maxlength={descData.count} cursorSpacing={100} onInput={(e) => getDesc(e)} onBlur={(e) => onBlur?.(e)}></Textarea>
|
||||
<Textarea placeholder="请添加备注" maxlength={descData.count} cursorSpacing={100} onInput={(e) => getDesc(e.detail.value)} onBlur={(e) => onBlur?.(e)}></Textarea>
|
||||
<View className={styles.descDataNum}>{descData.number}/{descData.count}</View>
|
||||
</View>
|
||||
<View className={styles.order_save_address} onClick={() => setSave()}>保存</View>
|
||||
|
||||
@ -1,11 +1,9 @@
|
||||
.order_price{
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
// justify-content: space-between;
|
||||
width: 100%;
|
||||
&:nth-last-child(n+2) {
|
||||
margin-bottom: 30px;
|
||||
}
|
||||
|
||||
.order_price_text{
|
||||
font-size: $font_size_medium;
|
||||
// margin-right: 10px;
|
||||
@ -41,7 +39,7 @@
|
||||
}
|
||||
}
|
||||
.emphasis{
|
||||
font-weight: 700;
|
||||
// font-weight: 700;
|
||||
}
|
||||
.order_price_num{
|
||||
color: $color_main;
|
||||
@ -51,7 +49,7 @@
|
||||
font-size: $font_size_min;
|
||||
}
|
||||
&:nth-child(2) {
|
||||
font-size: 26px;
|
||||
font-size: 44px;
|
||||
}
|
||||
&:nth-child(3) {
|
||||
font-size: $font_size_medium;
|
||||
@ -61,7 +59,7 @@
|
||||
.emphasis_num{
|
||||
text{
|
||||
&:nth-child(2) {
|
||||
font-size: $font_size_big;
|
||||
font-size: 44px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@ -5,9 +5,11 @@ import classnames from "classnames";
|
||||
import styles from './index.module.scss'
|
||||
type Param = {
|
||||
style?: Object,
|
||||
number?: number
|
||||
number?: number, //数量
|
||||
priceTitle: string //描述
|
||||
|
||||
}
|
||||
export default memo(({style, number = 0}:Param) => {
|
||||
export default memo(({style, number = 0, priceTitle = ''}:Param) => {
|
||||
const priceDom = useCallback(() => {
|
||||
let res = number.toFixed(2).split('.')
|
||||
let int_num = parseInt(res[0]) + ''
|
||||
@ -24,11 +26,7 @@ export default memo(({style, number = 0}:Param) => {
|
||||
<>
|
||||
<View className={styles.order_price}>
|
||||
<View className={classnames(styles.order_price_text, styles.emphasis)}>
|
||||
<Text>应付金额</Text>
|
||||
<View className={styles.iconfont_msg}>
|
||||
<Text className={classnames(styles.miconfont, 'iconfont icon-a-tuikuanshouhou')}></Text>
|
||||
{/* <View className={classnames(styles.message)}>123123123121212312312312312</View> */}
|
||||
</View>
|
||||
<Text>{priceTitle}：</Text>
|
||||
</View>
|
||||
<View className={classnames(styles.order_price_num, styles.emphasis_num)} style={style}>
|
||||
{priceDom()}
|
||||
|
||||
6
src/pages/order/cutOrder/index.config.ts
Normal file
6
src/pages/order/cutOrder/index.config.ts
Normal file
@ -0,0 +1,6 @@
|
||||
export default {
|
||||
navigationBarTitleText: '订单详情',
|
||||
enablePullDownRefresh: true,
|
||||
backgroundTextStyle: 'dark',
|
||||
enableShareAppMessage: true,
|
||||
}
|
||||
133
src/pages/order/cutOrder/index.module.scss
Normal file
133
src/pages/order/cutOrder/index.module.scss
Normal file
@ -0,0 +1,133 @@
|
||||
.order_main{
|
||||
min-height: 100%;
|
||||
background-color:$color_bg_one;
|
||||
padding: 20px;
|
||||
padding-bottom: 190px;
|
||||
box-sizing: border-box;
|
||||
|
||||
.order_title{
|
||||
display: flex;
|
||||
align-items: center;
|
||||
padding: 20px 30px;
|
||||
box-sizing: border-box;
|
||||
background-color: #fff;
|
||||
height: 116px;
|
||||
border-radius: 20px;
|
||||
margin-top: 20px;
|
||||
text{
|
||||
flex:1;
|
||||
font-size: $font_size;
|
||||
font-weight: 700;
|
||||
}
|
||||
.order_status{
|
||||
background-color: #F0F0F0;
|
||||
width: 148px;
|
||||
height: 55px;
|
||||
color: $color_font_three;
|
||||
text-align: center;
|
||||
line-height: 55px;
|
||||
font-size: $font_size_medium;
|
||||
border-radius: 30px;
|
||||
&:nth-last-child(1) {
|
||||
margin-left: 20px;
|
||||
}
|
||||
}
|
||||
}
|
||||
.order_desc{
|
||||
display: flex;
|
||||
align-items: center;
|
||||
background-color: #fff;
|
||||
padding: 20px;
|
||||
min-height: 116px;
|
||||
border-radius: 20px;
|
||||
margin-top: 20px;
|
||||
box-sizing: border-box;
|
||||
.order_desc_con{
|
||||
width: 150px;
|
||||
font-size: $font_size;
|
||||
font-weight: 700;
|
||||
}
|
||||
.order_desc_text, .order_desc_text_hint{
|
||||
font-size: $font_size_medium;
|
||||
color: $color_font_two;
|
||||
margin-right: 10px;
|
||||
flex:1;
|
||||
word-break:break-all;
|
||||
}
|
||||
.order_desc_text_hint{
|
||||
text-align: right;
|
||||
}
|
||||
.miconfont{
|
||||
font-size: 20px;
|
||||
color: $color_font_two;
|
||||
}
|
||||
}
|
||||
.submit_order{
|
||||
display: flex;
|
||||
position: fixed;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
justify-content: flex-end;
|
||||
width: 100%;
|
||||
align-items: center;
|
||||
background-color: #fff;
|
||||
box-shadow: 6px 0px 12px 0px rgba(0,0,0,0.16);
|
||||
padding: 20px 20px;
|
||||
box-sizing: border-box;
|
||||
padding-bottom: constant(safe-area-inset-bottom);
|
||||
padding-bottom: env(safe-area-inset-bottom);
|
||||
.order_btn {
|
||||
width: 152px;
|
||||
height: 72px;
|
||||
border: 2px solid #dddddd;
|
||||
border-radius: 46px;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
color: $color_font_three;
|
||||
&:nth-child(n+2) {
|
||||
margin-left: 34px;
|
||||
}
|
||||
}
|
||||
.order_btn_select{
|
||||
color: $color_main;
|
||||
border: 2px solid $color_main;
|
||||
}
|
||||
.order_number_desc{
|
||||
font-size: $font_size_medium;
|
||||
color: $color_font_two;
|
||||
}
|
||||
}
|
||||
.order_info{
|
||||
background-color: #fff;
|
||||
margin-top: 20px;
|
||||
border-radius: 20px;
|
||||
padding: 20px;
|
||||
.order_info_title{
|
||||
font-size: $font_size;
|
||||
font-weight: 700;
|
||||
margin-bottom: 20px;
|
||||
|
||||
}
|
||||
.order_num{
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
.order_num_btn{
|
||||
font-size: $font_size_medium;
|
||||
padding: 5px 10px;
|
||||
border: 2px solid #007cf7;
|
||||
border-radius: 10px;
|
||||
color: $color_main;
|
||||
}
|
||||
}
|
||||
text{
|
||||
font-size: $font_size;
|
||||
}
|
||||
|
||||
}
|
||||
.weight_memo_con{
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
|
||||
}
|
||||
Some files were not shown because too many files have changed in this diff Show More
Loading…
x
Reference in New Issue
Block a user