向文可
4 years ago
parent
615e1fc04c
commit
26c96680d6
@ -1,64 +1,65 @@
|
||||
{
|
||||
"name": "msb-shop-admin",
|
||||
"author": {
|
||||
"name": "向文可",
|
||||
"email": "1041367524@qq.com"
|
||||
},
|
||||
"private": true,
|
||||
"version": "0.0.1",
|
||||
"scripts": {
|
||||
"dev": "vite",
|
||||
"build:test": "vite build --mode test",
|
||||
"build:beta": "vite build --mode beta",
|
||||
"build:prod": "vite build --mode prod",
|
||||
"preview": "vite preview",
|
||||
"prepare": "husky install",
|
||||
"lint": "eslint src/**/*.{vue,js,jsx} --fix"
|
||||
},
|
||||
"dependencies": {
|
||||
"@element-plus/icons": "^0.0.11",
|
||||
"@vueup/vue-quill": "^1.0.0-beta.8",
|
||||
"axios": "^0.26.1",
|
||||
"dayjs": "^1.11.0",
|
||||
"element-plus": "^2.1.7",
|
||||
"lodash": "^4.17.21",
|
||||
"qs": "^6.10.3",
|
||||
"quill-image-uploader": "^1.2.2",
|
||||
"sortablejs": "^1.14.0",
|
||||
"vue": "^3.2.25",
|
||||
"vue-router": "^4.0.14",
|
||||
"vuex": "^4.0.2",
|
||||
"vuex-persistedstate": "^4.1.0"
|
||||
},
|
||||
"devDependencies": {
|
||||
"@commitlint/cli": "^13.2.1",
|
||||
"@commitlint/config-conventional": "^13.2.0",
|
||||
"@nabla/vite-plugin-eslint": "^1.4.0",
|
||||
"@originjs/vite-plugin-global-style": "^1.0.2",
|
||||
"@types/node": "^17.0.21",
|
||||
"@vitejs/plugin-legacy": "^1.7.1",
|
||||
"@vitejs/plugin-vue": "^2.2.0",
|
||||
"@vitejs/plugin-vue-jsx": "^1.3.8",
|
||||
"airbnb": "^0.0.2",
|
||||
"consola": "^2.15.3",
|
||||
"eslint": "^8.11.0",
|
||||
"eslint-config-prettier": "^8.5.0",
|
||||
"eslint-plugin-prettier": "^4.0.0",
|
||||
"eslint-plugin-vue": "^8.5.0",
|
||||
"husky": "^7.0.4",
|
||||
"less": "^4.1.2",
|
||||
"lint-staged": "^12.3.7",
|
||||
"prettier": "^2.6.0",
|
||||
"unplugin-auto-import": "^0.6.4",
|
||||
"unplugin-vue-components": "^0.18.0",
|
||||
"vite": "^2.8.0",
|
||||
"vite-plugin-remove-console": "^0.0.6",
|
||||
"vite-svg-loader": "^3.1.2"
|
||||
},
|
||||
"lint-staged": {
|
||||
"src/**/*.{jsx,tsx,ts,js,vue}": [
|
||||
"prettier --write",
|
||||
"eslint --fix"
|
||||
]
|
||||
}
|
||||
"name": "msb-shop-admin",
|
||||
"author": {
|
||||
"name": "向文可",
|
||||
"email": "1041367524@qq.com"
|
||||
},
|
||||
"private": true,
|
||||
"version": "0.0.1",
|
||||
"scripts": {
|
||||
"dev": "vite",
|
||||
"build:test": "vite build --mode test",
|
||||
"build:beta": "vite build --mode beta",
|
||||
"build:prod": "vite build --mode prod",
|
||||
"preview": "vite preview",
|
||||
"prepare": "husky install",
|
||||
"lint": "eslint src/**/*.{vue,js,jsx} --fix"
|
||||
},
|
||||
"dependencies": {
|
||||
"@element-plus/icons": "^0.0.11",
|
||||
"@vueup/vue-quill": "^1.0.0-beta.8",
|
||||
"axios": "^0.26.1",
|
||||
"china-area-data": "^5.0.1",
|
||||
"dayjs": "^1.11.0",
|
||||
"element-plus": "^2.1.7",
|
||||
"lodash": "^4.17.21",
|
||||
"qs": "^6.10.3",
|
||||
"quill-image-uploader": "^1.2.2",
|
||||
"sortablejs": "^1.14.0",
|
||||
"vue": "^3.2.25",
|
||||
"vue-router": "^4.0.14",
|
||||
"vuex": "^4.0.2",
|
||||
"vuex-persistedstate": "^4.1.0"
|
||||
},
|
||||
"devDependencies": {
|
||||
"@commitlint/cli": "^13.2.1",
|
||||
"@commitlint/config-conventional": "^13.2.0",
|
||||
"@nabla/vite-plugin-eslint": "^1.4.0",
|
||||
"@originjs/vite-plugin-global-style": "^1.0.2",
|
||||
"@types/node": "^17.0.21",
|
||||
"@vitejs/plugin-legacy": "^1.7.1",
|
||||
"@vitejs/plugin-vue": "^2.2.0",
|
||||
"@vitejs/plugin-vue-jsx": "^1.3.8",
|
||||
"airbnb": "^0.0.2",
|
||||
"consola": "^2.15.3",
|
||||
"eslint": "^8.11.0",
|
||||
"eslint-config-prettier": "^8.5.0",
|
||||
"eslint-plugin-prettier": "^4.0.0",
|
||||
"eslint-plugin-vue": "^8.5.0",
|
||||
"husky": "^7.0.4",
|
||||
"less": "^4.1.2",
|
||||
"lint-staged": "^12.3.7",
|
||||
"prettier": "^2.6.0",
|
||||
"unplugin-auto-import": "^0.6.4",
|
||||
"unplugin-vue-components": "^0.18.0",
|
||||
"vite": "^2.8.0",
|
||||
"vite-plugin-remove-console": "^0.0.6",
|
||||
"vite-svg-loader": "^3.1.2"
|
||||
},
|
||||
"lint-staged": {
|
||||
"src/**/*.{jsx,tsx,ts,js,vue}": [
|
||||
"prettier --write",
|
||||
"eslint --fix"
|
||||
]
|
||||
}
|
||||
}
|
||||
|
||||
@ -0,0 +1,28 @@
|
||||
<template>
|
||||
<component :is="render" />
|
||||
</template>
|
||||
<script setup lang="jsx">
|
||||
import data from 'china-area-data';
|
||||
import ElCascader from './extra/ElCascader.vue';
|
||||
const props = defineProps({
|
||||
props: {
|
||||
type: Object,
|
||||
default: () => {
|
||||
return {
|
||||
expandTrigger: 'hover',
|
||||
};
|
||||
},
|
||||
},
|
||||
});
|
||||
const attrs = useAttrs();
|
||||
const slots = useSlots();
|
||||
const convert = (obj) =>
|
||||
obj
|
||||
? Object.entries(obj).map((entry) => {
|
||||
return { label: entry[1], value: entry[0], children: convert(data[entry[0]]) };
|
||||
})
|
||||
: [];
|
||||
const options = convert(data[86]);
|
||||
const render = () => <ElCascader {...{ ...props, options }} {...attrs} v-slots={slots} />;
|
||||
</script>
|
||||
<style lang="less" scoped></style>
|
||||
@ -0,0 +1,81 @@
|
||||
<template>
|
||||
<el-dialog v-model="state.visible" title="修改收货人信息">
|
||||
<el-form ref="refsForm" v-loading="state.submitting" :model="state.form" :rules="state.rules">
|
||||
<el-form-item label="收货人姓名" prop="recipientName">
|
||||
<el-input v-model="state.form.recipientName" />
|
||||
</el-form-item>
|
||||
<el-form-item label="手机号码" prop="recipientPhone">
|
||||
<el-input v-model="state.form.recipientPhone" />
|
||||
</el-form-item>
|
||||
<el-form-item label="所在区域" prop="area">
|
||||
<el-area v-model="state.form.area" />
|
||||
</el-form-item>
|
||||
<el-form-item label="详细地址" prop="recipientAddress">
|
||||
<el-input v-model="state.form.recipientAddress" type="textarea" />
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
<template #footer>
|
||||
<el-button @click="close">取消</el-button>
|
||||
<el-button :loading="state.submitting" type="primary" @click="handleSave">确定</el-button>
|
||||
</template>
|
||||
</el-dialog>
|
||||
</template>
|
||||
|
||||
<script setup lang="jsx">
|
||||
const store = useStore();
|
||||
|
||||
const refsForm = ref(null);
|
||||
const state = reactive({
|
||||
submitting: false,
|
||||
visible: false,
|
||||
order: null,
|
||||
form: {
|
||||
orderId: null,
|
||||
area: [],
|
||||
recipientName: null,
|
||||
recipientPhone: null,
|
||||
recipientAddress: null,
|
||||
},
|
||||
rules: {
|
||||
orderId: [{ required: true, message: '订单ID不能为空' }],
|
||||
area: [{ required: true, message: '省市区不能为空' }],
|
||||
recipientName: [{ required: true, message: '收货人姓名不能为空' }],
|
||||
recipientPhone: [{ required: true, message: '收货人手机不能为空' }],
|
||||
recipientAddress: [{ required: true, message: '详细地址不能为空' }],
|
||||
},
|
||||
});
|
||||
const show = (order) => {
|
||||
state.order = order;
|
||||
state.form = {
|
||||
orderId: order.orderId,
|
||||
area: [],
|
||||
recipientName: order.logistics?.recipientName,
|
||||
recipientPhone: order.logistics?.recipientPhone,
|
||||
recipientAddress: order.logistics?.recipientAddress,
|
||||
};
|
||||
state.visible = true;
|
||||
};
|
||||
const close = () => {
|
||||
state.visible = false;
|
||||
};
|
||||
defineExpose({
|
||||
show,
|
||||
close,
|
||||
});
|
||||
const handleSave = async () => {
|
||||
state.submitting = true;
|
||||
try {
|
||||
await unref(refsForm).validate();
|
||||
let res = await store.dispatch('order/address', state.form);
|
||||
if (res) {
|
||||
Object.assign(state.order, state.form);
|
||||
state.visible = false;
|
||||
}
|
||||
} catch (e) {
|
||||
console.info('取消关闭', e);
|
||||
}
|
||||
state.submitting = false;
|
||||
};
|
||||
</script>
|
||||
|
||||
<style lang="less" scoped></style>
|
||||
@ -0,0 +1,72 @@
|
||||
<template>
|
||||
<el-dialog v-model="state.visible" title="修改费用信息">
|
||||
<el-form ref="refsForm" v-loading="state.submitting" :model="state.form" :rules="state.rules">
|
||||
<el-form-item label="商品合计" prop="totalAmount">￥{{ state.order.totalAmount }}</el-form-item>
|
||||
<el-form-item label="运费" prop="shippingAmount">
|
||||
<el-input-number v-model="state.form.shippingAmount" />
|
||||
</el-form-item>
|
||||
<el-form-item label="活动优惠" prop="discountAmount">￥{{ state.order.discountAmount }}</el-form-item>
|
||||
<el-form-item label="应付款金额" prop="payAmount">
|
||||
<span class="red">￥{{ state.order.payAmount }}</span>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
<template #footer>
|
||||
<el-button @click="close">取消</el-button>
|
||||
<el-button :loading="state.submitting" type="primary" @click="handleSave">确定</el-button>
|
||||
</template>
|
||||
</el-dialog>
|
||||
</template>
|
||||
|
||||
<script setup lang="jsx">
|
||||
const store = useStore();
|
||||
|
||||
const refsForm = ref(null);
|
||||
const state = reactive({
|
||||
submitting: false,
|
||||
visible: false,
|
||||
order: {},
|
||||
form: {
|
||||
orderId: null,
|
||||
shippingAmount: 0,
|
||||
},
|
||||
rules: {
|
||||
orderId: [{ required: true, message: '订单ID不能为空' }],
|
||||
shippingAmount: [{ required: true, message: '运费不能为空' }],
|
||||
},
|
||||
});
|
||||
const show = (order) => {
|
||||
state.order = order;
|
||||
state.form = {
|
||||
orderId: order.orderId,
|
||||
shippingAmount: order.shippingAmount,
|
||||
};
|
||||
state.visible = true;
|
||||
};
|
||||
const close = () => {
|
||||
state.visible = false;
|
||||
};
|
||||
defineExpose({
|
||||
show,
|
||||
close,
|
||||
});
|
||||
const handleSave = async () => {
|
||||
state.submitting = true;
|
||||
try {
|
||||
await unref(refsForm).validate();
|
||||
let res = await store.dispatch('order/fees', state.form);
|
||||
if (res) {
|
||||
Object.assign(state.order, state.form);
|
||||
state.visible = false;
|
||||
}
|
||||
} catch (e) {
|
||||
console.info('取消关闭', e);
|
||||
}
|
||||
state.submitting = false;
|
||||
};
|
||||
</script>
|
||||
|
||||
<style lang="less" scoped>
|
||||
.red {
|
||||
color: var(--el-color-danger);
|
||||
}
|
||||
</style>
|
||||
Loading…
Reference in new issue