优化部分样式问题,新增部分功能,解决发现的bug,暂未完全测试通过。

master
lemon橪 2021-06-10 18:31:54 +08:00
parent 8b3d19625f
commit c9ea7ba898
30 changed files with 1143 additions and 1131 deletions

View File

@ -1,77 +1,133 @@
// import Vue from 'vue'; // import Vue from 'vue';
import axios from 'axios'; import axios from "axios";
import https from 'https'; import https from "https";
import { import { Message, Spin, Modal } from "view-design";
Message, import Storage from "./storage";
Spin, import config from "@/config";
Modal import router from "../router/index.js";
} from 'view-design'; import store from "../vuex/store";
import Storage from './storage'; import { handleRefreshToken } from "@/api/index";
import config from '@/config'; const qs = require("qs");
import router from '../router/index.js'; export const buyerUrl =
import store from '../vuex/store'; process.env.NODE_ENV === "development"
import { ? config.api_dev.buyer
handleRefreshToken : config.api_prod.buyer;
} from '@/api/index'; export const commonUrl =
const qs = require('qs'); process.env.NODE_ENV === "development"
? config.api_dev.common
export const buyerUrl = (process.env.NODE_ENV === 'development' ? config.api_dev.buyer : config.api_prod.buyer); : config.api_prod.common;
export const commonUrl = (process.env.NODE_ENV === 'development' ? config.api_dev.common : config.api_prod.common); export const managerUrl =
export const managerUrl = (process.env.NODE_ENV === 'development' ? config.api_dev.manager : config.api_prod.manager); process.env.NODE_ENV === "development"
export const sellerUrl = (process.env.NODE_ENV === 'development' ? config.api_dev.seller : config.api_prod.seller); ? config.api_dev.manager
: config.api_prod.manager;
export const sellerUrl =
process.env.NODE_ENV === "development"
? config.api_dev.seller
: config.api_prod.seller;
// 创建axios实例 // 创建axios实例
var isRefreshToken = 0; var isRefreshToken = 0;
const refreshToken = getTokenDebounce() const refreshToken = getTokenDebounce();
const service = axios.create({ const service = axios.create({
timeout: 10000, // 请求超时时间 timeout: 10000, // 请求超时时间
baseURL: buyerUrl, // API baseURL: buyerUrl, // API
httpsAgent: new https.Agent({ httpsAgent: new https.Agent({
rejectUnauthorized: false rejectUnauthorized: false
}), }),
paramsSerializer: params => qs.stringify(params, { paramsSerializer: params =>
arrayFormat: 'repeat' qs.stringify(params, {
}) arrayFormat: "repeat"
})
}); });
// request拦截器 // request拦截器
service.interceptors.request.use(config => { service.interceptors.request.use(
const { config => {
loading const { loading } = config;
} = config; // 如果是put/post请求用qs.stringify序列化参数
// 如果是put/post请求用qs.stringify序列化参数 const isPutPost = config.method === "put" || config.method === "post";
const isPutPost = config.method === 'put' || config.method === 'post'; const isJson = config.headers["Content-Type"] === "application/json";
const isJson = config.headers['Content-Type'] === 'application/json'; const isFile = config.headers["Content-Type"] === "multipart/form-data";
const isFile = config.headers['Content-Type'] === 'multipart/form-data'; if (isPutPost && isJson) {
if (isPutPost && isJson) { config.data = JSON.stringify(config.data);
config.data = JSON.stringify(config.data); }
if (isPutPost && !isFile && !isJson) {
config.data = qs.stringify(config.data, {
arrayFormat: "repeat"
});
}
/** 配置全屏加载 */
if (process.client && loading !== false) {
config.loading = Spin.show();
}
const uuid = Storage.getItem("uuid");
config.headers["uuid"] = uuid;
// 获取访问Token
let accessToken = Storage.getItem("accessToken");
if (accessToken && config.needToken) {
config.headers["accessToken"] = accessToken;
// 解析当前token时间
let jwtData = JSON.parse(
decodeURIComponent(escape(window.atob(accessToken.split(".")[1])))
);
if (jwtData.exp < new Date().getTime() / 1000) {
refresh()
}
}
return config;
},
error => {
Promise.reject(error);
} }
if (isPutPost && !isFile && !isJson) { );
config.data = qs.stringify(config.data, {
arrayFormat: 'repeat' async function refresh() {
const getTokenRes = await refreshToken();
if (getTokenRes === "success") {
// 刷新token
if (isRefreshToken === 1) {
error.response.config.headers.accessToken = Storage.getItem(
"accessToken"
);
return service(error.response.config);
} else {
router.go(0);
}
} else {
Storage.removeItem("accessToken");
Storage.removeItem("refreshToken");
Storage.removeItem("userInfo");
Storage.setItem("cartNum", 0);
store.commit("SET_CARTNUM", 0);
console.log("1111");
Modal.confirm({
title: "请登录",
content: "<p>请登录后执行此操作</p>",
okText: "立即登录",
cancelText: "继续浏览",
onOk: () => {
router.push({
path: "/login",
query: {
rePath: router.history.current.path,
query: JSON.stringify(router.history.current.query)
}
});
},
onCancel: () => {
Modal.remove();
}
}); });
} }
/** 配置全屏加载 */ }
if (process.client && loading !== false) {
config.loading = Spin.show();
}
const uuid = Storage.getItem('uuid');
config.headers['uuid'] = uuid;
// 获取访问Token
let accessToken = Storage.getItem('accessToken');
if (accessToken && config.needToken) {
config.headers['accessToken'] = accessToken;
}
return config;
}, error => {
Promise.reject(error);
});
// respone拦截器 // respone拦截器
service.interceptors.response.use( service.interceptors.response.use(
async response => { async response => {
await closeLoading(response); await closeLoading(response);
return response.data; return response.data;
}, },
async error => { async error => {
@ -84,45 +140,15 @@ service.interceptors.response.use(
isRefreshToken++; isRefreshToken++;
if (isRefreshToken === 1) { if (isRefreshToken === 1) {
const getTokenRes = await refreshToken(); refresh()
if (getTokenRes === 'success') { // 刷新token isRefreshToken = 0;
if (isRefreshToken === 1) {
error.response.config.headers.accessToken = Storage.getItem('accessToken')
return service(error.response.config)
} else {
router.go(0)
}
} else {
Storage.removeItem('accessToken');
Storage.removeItem('refreshToken');
Storage.removeItem('userInfo');
Storage.setItem('cartNum', 0)
store.commit('SET_CARTNUM', 0)
console.log('1111');
Modal.confirm({
title: '请登录',
content: '<p>请登录后执行此操作</p>',
okText: '立即登录',
cancelText: '继续浏览',
onOk: () => {
router.push({
path: '/login',
query: {
rePath: router.history.current.path,
query: JSON.stringify(router.history.current.query)
}
});
},
onCancel: () => {
Modal.remove();
}
});
}
isRefreshToken = 0
} }
} else { } else {
if (error.message) { if (error.message) {
let _message = error.code === 'ECONNABORTED' ? '连接超时,请稍候再试!' : '网络错误,请稍后再试!'; let _message =
error.code === "ECONNABORTED"
? "连接超时,请稍候再试!"
: "网络错误,请稍后再试!";
Message.error(errorData.message || _message); Message.error(errorData.message || _message);
} }
} }
@ -134,7 +160,7 @@ service.interceptors.response.use(
* 关闭全局加载 * 关闭全局加载
* @param target * @param target
*/ */
const closeLoading = (target) => { const closeLoading = target => {
if (!target.config || !target.config.loading) return true; if (!target.config || !target.config.loading) return true;
return new Promise((resolve, reject) => { return new Promise((resolve, reject) => {
setTimeout(() => { setTimeout(() => {
@ -145,13 +171,13 @@ const closeLoading = (target) => {
}; };
export const Method = { export const Method = {
GET: 'get', GET: "get",
POST: 'post', POST: "post",
PUT: 'put', PUT: "put",
DELETE: 'delete' DELETE: "delete"
}; };
export default function request (options) { export default function request(options) {
// 如果是服务端或者是请求的刷新token不需要检查token直接请求。 // 如果是服务端或者是请求的刷新token不需要检查token直接请求。
// if (process.server || options.url.indexOf('passport/token') !== -1) { // if (process.server || options.url.indexOf('passport/token') !== -1) {
return service(options); return service(options);
@ -160,47 +186,46 @@ export default function request (options) {
} }
// 防抖闭包来一波 // 防抖闭包来一波
function getTokenDebounce () { function getTokenDebounce() {
let lock = false let lock = false;
let success = false let success = false;
return function () { return function() {
if (!lock) { if (!lock) {
lock = true lock = true;
let oldRefreshToken = Storage.getItem('refreshToken'); let oldRefreshToken = Storage.getItem("refreshToken");
handleRefreshToken(oldRefreshToken).then(res => { handleRefreshToken(oldRefreshToken)
if (res.success) { .then(res => {
let { if (res.success) {
accessToken, let { accessToken, refreshToken } = res.result;
refreshToken Storage.setItem("accessToken", accessToken);
} = res.result; Storage.setItem("refreshToken", refreshToken);
Storage.setItem('accessToken', accessToken);
Storage.setItem('refreshToken', refreshToken);
success = true success = true;
lock = false lock = false;
} else { } else {
success = false success = false;
lock = false lock = false;
// router.push('/login') // router.push('/login')
} }
}).catch((err) => { })
console.log(err); .catch(err => {
success = false console.log(err);
lock = false success = false;
}) lock = false;
});
} }
return new Promise(resolve => { return new Promise(resolve => {
// 一直看lock,直到请求失败或者成功 // 一直看lock,直到请求失败或者成功
const timer = setInterval(() => { const timer = setInterval(() => {
if (!lock) { if (!lock) {
clearInterval(timer) clearInterval(timer);
if (success) { if (success) {
resolve('success') resolve("success");
} else { } else {
resolve('fail') resolve("fail");
} }
} }
}, 500) // 轮询时间间隔 }, 500); // 轮询时间间隔
}) });
} };
} }

View File

@ -3,13 +3,7 @@
<div class="model-title"> <div class="model-title">
<div>店铺装修</div> <div>店铺装修</div>
<div class="btns"> <div class="btns">
<Button <Button @click="clickBtn(item)" size="small" v-for="(item, index) in way" :key="index" :type="item.selected ? 'primary' : ''">
@click="clickBtn(item)"
size="small"
v-for="(item, index) in way"
:key="index"
:type="item.selected ? 'primary' : ''"
>
{{ item.title }} {{ item.title }}
</Button> </Button>
</div> </div>
@ -21,17 +15,9 @@
<div ref="qrCodeUrl"></div> <div ref="qrCodeUrl"></div>
</div> </div>
</Poptip> </Poptip>
<Button size="default" type="primary" @click="handleSpinShow" <Button size="default" type="primary" @click="handleSpinShow"></Button>
>保存模板</Button
>
<Modal <Modal title="保存中" v-model="saveDialog" :closable="true" :mask-closable="false" :footer-hide="true">
title="保存中"
v-model="saveDialog"
:closable="true"
:mask-closable="false"
:footer-hide="true"
>
<div v-if="progress"> <div v-if="progress">
<div class="model-item"> <div class="model-item">
模板名称 <Input style="width: 200px" v-model="submitWay.name" /> 模板名称 <Input style="width: 200px" v-model="submitWay.name" />
@ -61,7 +47,8 @@ export default {
progress: true, // progress: true, //
num: 20, // num: 20, //
saveDialog: false, // saveDialog: false, //
way: [ // tab way: [
// tab
{ {
title: "首页", title: "首页",
name: "index", name: "index",
@ -80,7 +67,8 @@ export default {
}, },
], ],
qrcode: "", // qrcode: "", //
submitWay: { // submitWay: {
//
pageShow: this.$route.query.type || false, pageShow: this.$route.query.type || false,
name: this.$route.query.name || "模板名称", name: this.$route.query.name || "模板名称",
pageClientType: "H5", pageClientType: "H5",
@ -124,11 +112,13 @@ export default {
// //
update() { update() {
this.progress = false; this.progress = false;
API_Other.updateHome(this.$route.query.id, { API_Other.updateHome(this.$route.query.id, {
pageData: JSON.stringify(this.$store.state.styleStore), pageData: JSON.stringify(this.$store.state.styleStore),
name: this.submitWay.name, name: this.submitWay.name,
pageShow: this.submitWay.pageShow, pageShow: this.submitWay.pageShow,
pageType: "INDEX",
pageClientType: "H5",
}) })
.then((res) => { .then((res) => {
this.num = 50; this.num = 50;
@ -171,7 +161,7 @@ export default {
this.goback(); this.goback();
}, 1000); }, 1000);
} else { } else {
this.progress = true; this.progress = true;
this.saveDialog = false; this.saveDialog = false;
this.$Message.error("保存失败,请稍后重试"); this.$Message.error("保存失败,请稍后重试");
} }

View File

@ -1,6 +1,6 @@
.image-mode { .image-mode {
max-width: 100%; width: 100%;
height: auto; height: 100%;
display: block; display: block;
padding: 1px; padding: 1px;
} }

View File

@ -1,11 +1,11 @@
<template> <template>
<div class="layout"> <div class="layout">
<img class="image-mode" :src="res.list[0].img" alt=""> <img class="image-mode" :src="res.list[0].img" alt="">
<img class="image-mode" :src="res.list[1].img" alt=""> <img class="image-mode" :src="res.list[1].img" alt="">
<img class="image-mode" :src="res.list[2].img" alt=""> <img class="image-mode" :src="res.list[2].img" alt="">
<img class="image-mode" :src="res.list[3].img" alt=""> <img class="image-mode" :src="res.list[3].img" alt="">
<img class="image-mode" :src="res.list[4].img" alt=""> <img class="image-mode" :src="res.list[4].img" alt="">
</div> </div>
</template> </template>
@ -13,21 +13,18 @@
export default { export default {
title: "五列单行图片模块", title: "五列单行图片模块",
props: ["res"], props: ["res"],
mounted() {
console.log(this.res);
}
}; };
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>
@import "./tpl.scss"; @import "./tpl.scss";
.layout { .layout {
background: #e8e8e8;
display: flex; display: flex;
align-items: center; align-items: center;
justify-content: center; justify-content: center;
background-size: cover; background-size: cover;
} }
img{ img {
width: 67px; width: 67px;
} }
</style> </style>

View File

@ -12,21 +12,22 @@
export default { export default {
title: "四列单行图片模块", title: "四列单行图片模块",
props: ["res"], props: ["res"],
mounted() {
console.log(this.res);
}
}; };
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>
@import "./tpl.scss"; @import "./tpl.scss";
.layout { .layout {
height: 84px; // background: #e8e8e8;
// height: 84px;
display: flex; display: flex;
padding: 0 8px;
align-items: center; align-items: center;
justify-content: center; justify-content: center;
background-size: cover; background-size: cover;
} }
img{ img{
width: 84px; width: 84px;
} }
</style> </style>

View File

@ -11,14 +11,12 @@
export default { export default {
title: "三列单行图片模块", title: "三列单行图片模块",
props: ["res"], props: ["res"],
mounted() {
console.log(this.res);
}
}; };
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>
@import "./tpl.scss"; @import "./tpl.scss";
.layout { .layout {
background: #e8e8e8;
height: 110px; height: 110px;
display: flex; display: flex;
align-items: center; align-items: center;
@ -28,4 +26,4 @@ export default {
img{ img{
width: 111px; width: 111px;
} }
</style> </style>

View File

@ -20,7 +20,7 @@ export default {
title: "左一右二", title: "左一右二",
props: ["res"], props: ["res"],
mounted() { mounted() {
console.log(this.res);
} }
}; };
</script> </script>
@ -34,4 +34,4 @@ export default {
background-size: cover; background-size: cover;
} }
</style> </style>

View File

@ -10,7 +10,7 @@
</div> </div>
</div> </div>
<div class="view-height-150"> <div class="view-height-150">
<img class="image-mode" :src="res.list[2].img" /> <img class="image-mode" style="height:150px;" :src="res.list[2].img" />
</div> </div>
</div> </div>
</template> </template>
@ -21,18 +21,22 @@ export default {
props: ["res"], props: ["res"],
mounted() { mounted() {
console.log(this.res); console.log(this.res);
} },
}; };
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>
@import "./tpl.scss"; @import "./tpl.scss";
.layout { .layout {
height: 167px; height: 150px;
display: flex; display: flex;
align-items: center; align-items: center;
justify-content: center; justify-content: center;
background-size: cover; background-size: cover;
} }
.view-height-75 {
</style> .image-mode {
height: 75px;
}
}
</style>

View File

@ -23,12 +23,7 @@
</Row> </Row>
<!-- 拼图验证码 --> <!-- 拼图验证码 -->
<verify <verify ref="verify" class="verify-con" verifyType="LOGIN" @change="verifyChange"></verify>
ref="verify"
class="verify-con"
verifyType="LOGIN"
@change="verifyChange"
></verify>
<div v-if="socialLogining"> <div v-if="socialLogining">
<RectLoading /> <RectLoading />
</div> </div>
@ -48,7 +43,7 @@ import LangSwitch from "@/views/main-components/lang-switch";
import RectLoading from "@/views/my-components/lili/rect-loading"; import RectLoading from "@/views/my-components/lili/rect-loading";
import CountDownButton from "@/views/my-components/lili/count-down-button"; import CountDownButton from "@/views/my-components/lili/count-down-button";
import util from "@/libs/util.js"; import util from "@/libs/util.js";
import verify from '@/views/my-components/verify'; import verify from "@/views/my-components/verify";
export default { export default {
components: { components: {
@ -57,18 +52,20 @@ export default {
LangSwitch, LangSwitch,
Header, Header,
Footer, Footer,
verify verify,
}, },
data() { data() {
return { return {
loading: false, // loading: false, //
form: { // form: {
//
username: "", username: "",
password: "", password: "",
mobile: "", mobile: "",
code: "", code: "",
}, },
rules: { // rules: {
//
username: [ username: [
{ {
required: true, required: true,
@ -88,7 +85,8 @@ export default {
}, },
methods: { methods: {
mounted() {}, mounted() {},
afterLogin(res) { // afterLogin(res) {
//
let accessToken = res.result.accessToken; let accessToken = res.result.accessToken;
let refreshToken = res.result.refreshToken; let refreshToken = res.result.refreshToken;
this.setStore("accessToken", accessToken); this.setStore("accessToken", accessToken);
@ -109,28 +107,35 @@ export default {
} }
}); });
}, },
submitLogin() { // submitLogin() {
//
this.$refs.usernameLoginForm.validate((valid) => { this.$refs.usernameLoginForm.validate((valid) => {
if (valid) { if (valid) {
this.$refs.verify.show = true; this.$refs.verify.show = true;
} }
}); });
}, },
verifyChange (con) { // verifyChange(con) {
//
if (!con.status) return; if (!con.status) return;
this.loading = true; this.loading = true;
login({ login({
username: this.form.username, username: this.form.username,
password: this.md5(this.form.password), password: this.md5(this.form.password),
}).then((res) => { })
if (res && res.success) { .then((res) => {
this.afterLogin(res); if (res && res.success) {
} else { this.afterLogin(res);
} else {
this.loading = false;
}
})
.catch(() => {
this.loading = false; this.loading = false;
} });
}).catch(()=>{this.loading = false}); this.$refs.verify.show = false;
} },
}, },
}; };
</script> </script>
@ -154,7 +159,7 @@ export default {
position: relative; position: relative;
zoom: 1; zoom: 1;
} }
.verify-con{ .verify-con {
position: absolute; position: absolute;
top: 90px; top: 90px;
z-index: 10; z-index: 10;
@ -198,5 +203,4 @@ export default {
.flex { .flex {
justify-content: center; justify-content: center;
} }
</style> </style>

View File

@ -2,7 +2,6 @@
<div> <div>
<Row class="header"> <Row class="header">
<img src="../../assets/logo.png" class="logo" width="220px"> <img src="../../assets/logo.png" class="logo" width="220px">
<!-- <div class="description">{{ $t('LILISHOP-ADMIN') }}</div> -->
</Row> </Row>
</div> </div>
</template> </template>
@ -15,13 +14,13 @@ export default {
<style lang="scss" scoped> <style lang="scss" scoped>
.header { .header {
margin-bottom: 6vh; margin-bottom: 6vh;
text-align: center; text-align: center;
display: flex; display: flex;
justify-content: center !important; justify-content: center !important;
} }
.logo { .logo {
transform: scale(2); width: 440px;
height: 158px;
} }
</style> </style>

View File

@ -15,20 +15,8 @@
</div> </div>
</div> </div>
<Modal <Modal title="编辑html代码" v-model="showHTMLModal" :mask-closable="false" :width="900" :fullscreen="full">
title="编辑html代码" <Input v-if="!full" v-model="dataEdit" :rows="15" type="textarea" style="max-height:60vh;overflow:auto;" />
v-model="showHTMLModal"
:mask-closable="false"
:width="900"
:fullscreen="full"
>
<Input
v-if="!full"
v-model="dataEdit"
:rows="15"
type="textarea"
style="max-height:60vh;overflow:auto;"
/>
<Input v-if="full" v-model="dataEdit" :rows="32" type="textarea" /> <Input v-if="full" v-model="dataEdit" :rows="32" type="textarea" />
<div slot="footer"> <div slot="footer">
<Button @click="full=!full" icon="md-expand">全屏开/</Button> <Button @click="full=!full" icon="md-expand">全屏开/</Button>
@ -56,21 +44,21 @@ export default {
props: { props: {
id: { id: {
type: String, type: String,
default: "editor" default: "editor",
}, },
value: String, value: String,
base64: { base64: {
type: Boolean, type: Boolean,
default: false default: false,
}, },
showExpand: { showExpand: {
type: Boolean, type: Boolean,
default: true default: true,
}, },
openXss: { openXss: {
type: Boolean, type: Boolean,
default: false default: false,
} },
}, },
data() { data() {
return { return {
@ -79,16 +67,17 @@ export default {
dataEdit: "", // dataEdit: "", //
showHTMLModal: false, // html showHTMLModal: false, // html
full: false, // html full: false, // html
fullscreenModal: false // fullscreenModal: false, //
}; };
}, },
methods: { methods: {
initEditor() { initEditor() {
let that = this; let that = this;
// wangeditor3 https://www.kancloud.cn/wangfupeng/wangeditor3/332599 // wangeditor3 https://www.kancloud.cn/wangfupeng/wangeditor3/332599
editor = new E(`#${this.id}`); editor = new E(`#${this.id}`);
// //
editor.config.onchange = html => { editor.config.onchange = (html) => {
if (this.openXss) { if (this.openXss) {
this.data = xss(html); this.data = xss(html);
} else { } else {
@ -108,30 +97,30 @@ export default {
editor.config.uploadImgServer = uploadFile; editor.config.uploadImgServer = uploadFile;
// liliheadertoken // liliheadertoken
editor.config.uploadImgHeaders = { editor.config.uploadImgHeaders = {
accessToken: that.getStore("accessToken") accessToken: that.getStore("accessToken"),
}; };
editor.config.uploadFileName = "file"; editor.config.uploadFileName = "file";
editor.config.uploadImgHooks = { editor.config.uploadImgHooks = {
before: function(xhr, editor, files) { before: function (xhr, editor, files) {
// //
}, },
success: function(xhr, editor, result) { success: function (xhr, editor, result) {
// //
}, },
fail: function(xhr, editor, result) { fail: function (xhr, editor, result) {
// //
that.$Message.error("上传图片失败"); that.$Message.error("上传图片失败");
}, },
error: function(xhr, editor) { error: function (xhr, editor) {
// //
that.$Message.error("上传图片出错"); that.$Message.error("上传图片出错");
}, },
timeout: function(xhr, editor) { timeout: function (xhr, editor) {
// //
that.$Message.error("上传图片超时"); that.$Message.error("上传图片超时");
}, },
// {errno:0, data: [...]} 使 // {errno:0, data: [...]} 使
customInsert: function(insertImg, result, editor) { customInsert: function (insertImg, result, editor) {
if (result.success == true) { if (result.success == true) {
let url = result.result; let url = result.result;
insertImg(url); insertImg(url);
@ -139,10 +128,11 @@ export default {
} else { } else {
that.$Message.error(result.message); that.$Message.error(result.message);
} }
} },
}; };
} }
editor.config.customAlert = function(info) {
editor.config.customAlert = function (info) {
// info // info
// that.$Message.info(info); // that.$Message.info(info);
}; };
@ -156,8 +146,8 @@ export default {
// type -> 'emoji' / 'image' // type -> 'emoji' / 'image'
type: "image", type: "image",
// content -> // content ->
content: sina content: sina,
} },
]; ];
editor.create(); editor.create();
if (this.value) { if (this.value) {
@ -187,7 +177,7 @@ export default {
editor.txt.html(this.data); editor.txt.html(this.data);
this.$emit("input", this.data); this.$emit("input", this.data);
this.$emit("on-change", this.data); this.$emit("on-change", this.data);
} },
}); });
}, },
setData(value) { setData(value) {
@ -200,22 +190,21 @@ export default {
this.$emit("input", this.data); this.$emit("input", this.data);
this.$emit("on-change", this.data); this.$emit("on-change", this.data);
} }
} },
}, },
watch: { watch: {
value(val) { value(val) {
this.setData(val); this.setData(val);
} },
}, },
mounted() { mounted() {
this.initEditor(); this.initEditor();
} },
}; };
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>
.e-menu { .e-menu {
z-index: 101; z-index: 101;
position: absolute; position: absolute;
cursor: pointer; cursor: pointer;

View File

@ -57,7 +57,7 @@
<Input type="number" v-model="form.sort" clearable style="width: 10%" /> <Input type="number" v-model="form.sort" clearable style="width: 10%" />
</FormItem> </FormItem>
<FormItem class="form-item-view-el" label="文章内容" prop="content"> <FormItem class="form-item-view-el" label="文章内容" prop="content">
<editor v-model="form.content"></editor> <editor openXss v-model="form.content"></editor>
</FormItem> </FormItem>
<FormItem label="是否展示" prop="openStatus"> <FormItem label="是否展示" prop="openStatus">
<i-switch size="large" v-model="form.openStatus" :true-value="open" :false-value="close"> <i-switch size="large" v-model="form.openStatus" :true-value="open" :false-value="close">
@ -72,7 +72,7 @@
</div> </div>
</Modal> </Modal>
</template> </template>
</Card> </Card>
</Col> </Col>
@ -123,7 +123,7 @@ export default {
searchTreeValue: "", // searchTreeValue: "", //
form: { form: {
// //
openStatus:false, openStatus: false,
title: "", title: "",
categoryId: "", categoryId: "",
sort: 1, sort: 1,
@ -380,7 +380,6 @@ export default {
// //
this.data = []; this.data = [];
if (res.result.records.length > 0) { if (res.result.records.length > 0) {
this.data = res.result.records; this.data = res.result.records;
} }
} }
@ -390,7 +389,6 @@ export default {
}, },
handleSubmit() { handleSubmit() {
this.$refs.form.validate((valid) => { this.$refs.form.validate((valid) => {
if (valid) { if (valid) {
this.submitLoading = true; this.submitLoading = true;
@ -403,7 +401,6 @@ export default {
this.$Message.success("操作成功"); this.$Message.success("操作成功");
this.getDataList(); this.getDataList();
this.modalVisible = false; this.modalVisible = false;
} }
}); });
} else { } else {
@ -414,8 +411,6 @@ export default {
this.$Message.success("操作成功"); this.$Message.success("操作成功");
this.getDataList(); this.getDataList();
this.modalVisible = false; this.modalVisible = false;
} }
}); });
} }
@ -440,10 +435,25 @@ export default {
this.form.categoryId = res.result.categoryId; this.form.categoryId = res.result.categoryId;
this.treeValue = data.articleCategoryName; this.treeValue = data.articleCategoryName;
this.form.id = data.id; this.form.id = data.id;
this.form.content = res.result.content; this.form.content = htmlEscape(res.result.content);
this.form.title = res.result.title; this.form.title = res.result.title;
this.form.sort = res.result.sort; this.form.sort = res.result.sort;
this.form.openStatus = res.result.openStatus this.form.openStatus = res.result.openStatus;
}
});
},
htmlEscape(text) {
return text.replace(/[<>"&]/g, function (match, pos, originalText) {
switch (match) {
case "<":
return "&lt;";
case ">":
return "&gt;";
case "&":
return "&amp;";
case '"':
return "&quot;";
} }
}); });
}, },

View File

@ -347,6 +347,7 @@ export default {
this.form.versionUpdateDate / 1000 this.form.versionUpdateDate / 1000
); );
this.form.versionUpdateDate = versionUpdateDate; this.form.versionUpdateDate = versionUpdateDate;
this.form.updateTime = versionUpdateDate; this.form.updateTime = versionUpdateDate;
if (this.modalType == 0) { if (this.modalType == 0) {
// id // id

View File

@ -2,6 +2,19 @@
import {getRequest, postRequest, putRequest} from '@/libs/axios'; import {getRequest, postRequest, putRequest} from '@/libs/axios';
// 下载待发货的订单列表
export const verificationCode = (verificationCode) => {
return getRequest(`/orders/getOrderByVerificationCode/${verificationCode}`)
}
// 下载待发货的订单列表
export const downLoadDeliverExcel = (params) => {
return getRequest(`/orders/downLoadDeliverExcel`, params)
}
// 获取普通订单列表 // 获取普通订单列表
export const getOrderList = (params) => { export const getOrderList = (params) => {
return getRequest(`/orders`, params) return getRequest(`/orders`, params)
@ -62,8 +75,8 @@ export const getLogisticsChecked = () => {
} }
// 订单核验 // 订单核验
export const orderTake = (sn, params) => { export const orderTake = (sn, verificationCode) => {
return postRequest(`/orders/${sn}/take`, params) return putRequest(`/orders/take/${sn}/${verificationCode}`)
} }
// 售后服务单 // 售后服务单

Binary file not shown.

After

Width:  |  Height:  |  Size: 2.6 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 2.8 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 754 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 3.6 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 234 KiB

After

Width:  |  Height:  |  Size: 390 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 4.4 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 2.4 KiB

View File

@ -18,10 +18,10 @@ export default {
* @description api请求基础路径 * @description api请求基础路径
*/ */
api_dev: { api_dev: {
common: 'https://common-api.pickmall.cn', // common: 'https://common-api.pickmall.cn',
buyer: 'https://buyer-api.pickmall.cn', // buyer: 'https://buyer-api.pickmall.cn',
seller: 'https://store-api.pickmall.cn', // seller: 'https://store-api.pickmall.cn',
manager: 'https://admin-api.pickmall.cn', // manager: 'https://admin-api.pickmall.cn',
common: 'http://192.168.0.109:8890', common: 'http://192.168.0.109:8890',
buyer: 'http://192.168.0.109:8888', buyer: 'http://192.168.0.109:8888',
seller: 'http://192.168.0.109:8889', seller: 'http://192.168.0.109:8889',

View File

@ -127,12 +127,19 @@ export const otherRouter = {
name: "full-cut-detail", name: "full-cut-detail",
component: () => import("@/views/promotion/fullCut/newFullCut.vue") component: () => import("@/views/promotion/fullCut/newFullCut.vue")
}, },
{
path: "export-order-deliver",
title: "发货",
name: "export-order-deliver",
component: () => import("@/views/order/order/exportOrderDeliver.vue")
},
{ {
path: "order-detail", path: "order-detail",
title: "订单详情", title: "订单详情",
name: "order-detail", name: "order-detail",
component: () => import("@/views/order/order/orderDetail.vue") component: () => import("@/views/order/order/orderDetail.vue")
}, },
// { // {
// path: "/*", // path: "/*",
// name: "error-404", // name: "error-404",

View File

@ -3,22 +3,25 @@
padding: 15px; padding: 15px;
margin: 0 auto; margin: 0 auto;
text-align: center; text-align: center;
border: 1px solid #ddd; border-radius: 0.8em;
box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.1);
background: none repeat 0 0 #fff; background: none repeat 0 0 #fff;
/*商品品类*/ /*商品品类*/
.goods-category { .goods-category {
min-height: 500px;
border-radius: 0.8em;
text-align: left; text-align: left;
padding: 10px; padding: 10px;
background: #fafafa; background: #ededed;
border: 1px solid #e6e6e6;
ul { ul {
padding: 8px 4px 8px 8px; padding: 12px 8px;
list-style: none; list-style: none;
width: 300px; width: 300px;
background: none repeat 0 0 #fff; background: none repeat 0 0 #fff;
border: 1px solid #e6e6e6; box-shadow: 0 2px 4px rgba(0, 0, 0, 0.12), 0 0 6px rgba(0, 0, 0, 0.04);
border-radius: 0.4em;
display: inline-block; display: inline-block;
letter-spacing: normal; letter-spacing: normal;
margin-right: 15px; margin-right: 15px;
@ -27,7 +30,7 @@
li { li {
line-height: 20px; line-height: 20px;
padding: 5px; padding: 10px 5px;
cursor: pointer; cursor: pointer;
color: #333; color: #333;
font-size: 12px; font-size: 12px;
@ -42,9 +45,10 @@
/** 当前品类被选中的样式 */ /** 当前品类被选中的样式 */
.activeClass { .activeClass {
background-color: #d9edf7; border-radius: 0.4em;
border: 1px solid #bce8f1; background-color: rgba($color: $theme_color, $alpha: 0.2);
color: #3a87ad; border: 1px solid rgba($color: $theme_color, $alpha: 0.8);
color: #fff;
} }
/*!*当前选择的商品品类文字*!*/ /*!*当前选择的商品品类文字*!*/
@ -215,6 +219,19 @@ div.base-info-item {
} }
} }
.success {
> h1 {
font-size: 28px;
}
> * {
margin: 10px;
}
}
.operation {
> * {
margin: 10px 0;
}
}
/*商品描述*/ /*商品描述*/
.goods-intro { .goods-intro {
line-height: 40; line-height: 40;
@ -223,12 +240,16 @@ div.base-info-item {
/** 底部步骤 */ /** 底部步骤 */
.footer { .footer {
width: 100%; width: 100%;
margin-top: 20px;
padding: 10px; padding: 10px;
background-color: #ffc; background-color: #ffc;
position: sticky; position: sticky;
bottom: 0px; bottom: 0px;
text-align: center; text-align: center;
z-index: 9; z-index: 999;
> .ivu-btn {
margin: 0 10px;
}
} }
/*图片上传组件第一张图设置封面*/ /*图片上传组件第一张图设置封面*/
@ -261,9 +282,20 @@ div.base-info-item {
word-break: break-all; word-break: break-all;
} }
/deep/ .ivu-steps {
width: 100% !important;
display: flex;
}
.step-list {
height: 60px;
margin-bottom: 20px;
border-radius: 0.8em;
box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.1);
// box-shadow: 0 2px 4px rgba(0, 0, 0, .12), 0 0 6px rgba(0, 0, 0, .04)
}
.step-view { .step-view {
width: 33%; flex: 1;
height: 40px; height: 60px;
font-size: 19px; font-size: 19px;
text-align: center; text-align: center;
display: flex; display: flex;
@ -271,6 +303,14 @@ div.base-info-item {
justify-content: center; justify-content: center;
align-items: center; align-items: center;
} }
.step-view:nth-of-type(1) {
border-top-left-radius: 0.4em;
border-bottom-left-radius: 0.4em;
}
.step-view:nth-last-child(1) {
border-top-right-radius: 0.4em;
border-bottom-right-radius: 0.4em;
}
.add-sku-btn { .add-sku-btn {
margin-top: 10px; margin-top: 10px;
@ -374,14 +414,61 @@ div.base-info-item {
right: 0; right: 0;
background: rgba(0, 0, 0, 0.6); background: rgba(0, 0, 0, 0.6);
justify-content: space-between;
align-items: center;
flex-direction: column;
} }
.demo-upload-list:hover .demo-upload-list-cover { .demo-upload-list:hover .demo-upload-list-cover {
display: block; display:flex;
} }
.demo-upload-list-cover i { .demo-upload-list-cover div {
width: 50%; margin: 10% 0;
margin-top: 8px; width: 100%;
color: #fff;
font-size: 20px; > i {
cursor: pointer; width: 50%;
margin-top: 8px;
color: #fff;
font-size: 20px;
cursor: pointer;
}
}
.active-goods-type {
background: #e8e8e8;
}
.goods-type-list {
max-height: 500px;
overflow-y: auto;
> .goods-type-item {
padding: 20px 0;
width: 100%;
cursor: pointer;
transition: 0.35s;
display: flex;
justify-content: center;
align-items: center;
/deep/ img {
margin-right: 20px;
width: 100px;
}
/deep/ h2 {
cursor: pointer;
font-size: 21px;
padding: 10px 0;
color: #333;
}
/deep/ p {
color: #999;
font-size: 14px;
margin-top: 10px;
}
}
> .goods-type-item:hover {
transform: translateY(-10px);
}
}
.template-item {
justify-content: flex-start !important;
} }

File diff suppressed because it is too large Load Diff

View File

@ -1,67 +1,29 @@
<template> <template>
<div class="login"> <div class="login">
<Row <Row type="flex" @keydown.enter.native="submitLogin">
type="flex"
class="row"
justify="center"
align="middle"
@keydown.enter.native="submitLogin"
>
<Col style="width: 368px"> <Col style="width: 368px">
<Header /> <Header />
<Row style="flex-direction: column;">
<Form ref="usernameLoginForm" :model="form" :rules="rules" class="form">
<FormItem prop="username">
<Input v-model="form.username" prefix="ios-contact" size="large" clearable placeholder="请输入用户名" autocomplete="off" />
</FormItem>
<FormItem prop="password">
<Input type="password" v-model="form.password" prefix="ios-lock" size="large" password placeholder="请输入密码" autocomplete="off" />
</FormItem>
</Form>
<Row> <Row>
<Form <Button class="login-btn" type="primary" size="large" :loading="loading" @click="submitLogin" long>
ref="usernameLoginForm" <span v-if="!loading">{{ $t("login") }}</span>
:model="form" <span v-else>{{ $t("logining") }}</span>
:rules="rules" </Button>
class="form"
>
<FormItem prop="username">
<Input
v-model="form.username"
prefix="ios-contact"
size="large"
clearable
placeholder="请输入用户名"
autocomplete="off"
/>
</FormItem>
<FormItem prop="password">
<Input
type="password"
v-model="form.password"
prefix="ios-lock"
size="large"
password
placeholder="请输入密码"
autocomplete="off"
/>
</FormItem>
</Form>
<Row>
<Button
class="login-btn"
type="primary"
size="large"
:loading="loading"
@click="submitLogin"
long
>
<span v-if="!loading">{{ $t("login") }}</span>
<span v-else>{{ $t("logining") }}</span>
</Button>
</Row>
</Row> </Row>
<Footer />
<!-- 拼图验证码 --> </Row>
<verify <Footer />
ref="verify" <!-- 拼图验证码 -->
class="verify-con" <verify ref="verify" class="verify-con" verifyType="LOGIN" @change="verifyChange"></verify>
verifyType="LOGIN"
@change="verifyChange"
></verify>
</Col> </Col>
<!-- <LangSwitch /> --> <!-- <LangSwitch /> -->
</Row> </Row>
@ -69,35 +31,34 @@
</template> </template>
<script> <script>
import { import { login, userMsg } from "@/api/index";
login,
userMsg,
} from "@/api/index";
import { validateMobile } from "@/libs/validate"; import { validateMobile } from "@/libs/validate";
import Cookies from "js-cookie"; import Cookies from "js-cookie";
import Header from "@/views/main-components/header"; import Header from "@/views/main-components/header";
import Footer from "@/views/main-components/footer"; import Footer from "@/views/main-components/footer";
import LangSwitch from "@/views/main-components/lang-switch"; import LangSwitch from "@/views/main-components/lang-switch";
import util from "@/libs/util.js"; import util from "@/libs/util.js";
import verify from '@/views/my-components/verify'; import verify from "@/views/my-components/verify";
export default { export default {
components: { components: {
LangSwitch, LangSwitch,
Header, Header,
Footer, Footer,
verify verify,
}, },
data() { data() {
return { return {
saveLogin: true, // saveLogin: true, //
loading: false, // loading: false, //
form: { // form: {
//
username: "", username: "",
password: "", password: "",
mobile: "", mobile: "",
code: "", code: "",
}, },
rules: { // rules: {
//
username: [ username: [
{ {
required: true, required: true,
@ -163,35 +124,41 @@ export default {
} }
}); });
}, },
submitLogin() { // submitLogin() {
//
this.$refs.usernameLoginForm.validate((valid) => { this.$refs.usernameLoginForm.validate((valid) => {
if (valid) { if (valid) {
this.$refs.verify.show = true; this.$refs.verify.show = true;
} }
}) });
}, },
verifyChange (con) { // verifyChange(con) {
//
if (!con.status) return; if (!con.status) return;
this.loading = true; this.loading = true;
login({ login({
username: this.form.username, username: this.form.username,
password: this.md5(this.form.password), password: this.md5(this.form.password),
}).then((res) => { })
this.loading = false; .then((res) => {
if (res && res.success) { this.loading = false;
this.afterLogin(res); if (res && res.success) {
} this.afterLogin(res);
}).catch(()=>{this.loading = false}) }
} })
} .catch(() => {
this.loading = false;
});
this.$refs.verify.show = false;
},
},
}; };
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>
.row { .row {
padding: 70px 50px; padding: 70px 50px;
border-radius: .8em; border-radius: 0.8em;
} }
.login { .login {
height: 100%; height: 100%;
@ -212,11 +179,11 @@ export default {
position: relative; position: relative;
zoom: 1; zoom: 1;
} }
/deep/ .ivu-row{ /deep/ .ivu-row {
display: flex; display: flex;
flex-direction: column !important;
} }
.verify-con{ .verify-con {
position: absolute; position: absolute;
top: 126px; top: 126px;
z-index: 10; z-index: 10;
@ -260,5 +227,4 @@ export default {
.flex { .flex {
justify-content: center; justify-content: center;
} }
</style> </style>

View File

@ -1,7 +1,7 @@
<template> <template>
<div> <div>
<Row class="header"> <Row class="header">
<img src="../../assets/lili.png" class="logo" width="220px"> <img class="logo" src="../../assets/logo.png" >
</Row> </Row>
</div> </div>
</template> </template>
@ -14,13 +14,13 @@ export default {
<style lang="scss" scoped> <style lang="scss" scoped>
.header { .header {
margin-bottom: 6vh; margin-bottom: 6vh;
align-items: center; align-items: center;
display: flex; display: flex;
justify-content: center !important; justify-content: center !important;
} }
.logo { .logo {
transform: scale(3); width: 440px;
height: 158px;
} }
</style> </style>

View File

@ -0,0 +1,122 @@
<template>
<Card>
<div class="step-list">
<div class="step-item" @click="handleCheckStep(item)" :class="{'active':item.checked}" v-for="(item,index) in stepList" :key="index">
<img class="img" :src="item.img" alt="">
<div>
<h2>{{item.title}}</h2>
</div>
</div>
</div>
<div v-for="(item,index) in stepList" :key="index">
<!-- 下载 -->
<div v-if="item.checked && index ==0" class="tpl">
<Button @click="downLoad"></Button>
</div>
<!-- 上传 -->
<div v-if="item.checked && index ==1" class="tpl">
<Upload style="width:50%; height:400px;" accept="application/vnd.openxmlformats-officedocument.spreadsheetml.sheet, application/vnd.ms-excel" multiple type="drag"
action="//jsonplaceholder.typicode.com/posts/">
<div style="padding: 50px 0">
<Icon type="ios-cloud-upload" size="102" style="color: #3399ff"></Icon>
<h2>选择或拖拽文件上传</h2>
</div>
</Upload>
</div>
<!-- 上传 -->
<div v-if="item.checked && index ==2" class="tpl">
<h1>发货完成</h1>
<div>
<Button>关闭页面</Button>
</div>
</div>
</div>
</Card>
</template>
<script>
import { downLoadDeliverExcel } from "@/api/order.js";
export default {
data() {
return {
//
stepList: [
{
img: require("@/assets/download.png"),
title: "1.下载批量发货导入模板",
checked: true,
},
{
img: require("@/assets/upload.png"),
title: "2.上传数据",
checked: false,
},
{
img: require("@/assets/success.png"),
title: "3.完成",
checked: false,
},
],
};
},
mounted() {},
methods: {
//
handleCheckStep(val) {
this.stepList.map((item) => {
item.checked = false;
});
val.checked = true;
},
async downLoad() {
let res = await downLoadDeliverExcel({ orderIds: "1402886442132217857" });
console.log(res);
},
},
};
</script>
<style lang="scss" scoped>
.step-list {
width: 80%;
min-width: 500px;
max-width: 1160px;
margin: 0 auto;
display: flex;
padding: 40px;
justify-content: space-between;
}
h2 {
text-align: center;
margin: 10px 0;
}
.tpl {
margin: 50px 0;
display: flex;
justify-content: center;
}
.active {
background: #efefef;
border-radius: 0.8em;
}
.step-item {
width: 100%;
padding: 0 20px;
display: flex;
align-items: center;
flex-direction: column;
justify-content: center;
transition: 0.35s;
cursor: pointer;
}
img {
width: 100px;
height: 100px;
}
</style>

View File

@ -527,7 +527,7 @@ export default {
orderTakeSubmit() { orderTakeSubmit() {
this.$refs.orderTakeForm.validate((valid) => { this.$refs.orderTakeForm.validate((valid) => {
if (valid) { if (valid) {
API_Order.orderTake(this.sn, this.orderTakeForm).then((res) => { API_Order.orderTake(this.sn, this.orderTakeForm.qrCode).then((res) => {
if (res.success) { if (res.success) {
this.$Message.success("订单核销成功"); this.$Message.success("订单核销成功");
this.orderTakeModal = false; this.orderTakeModal = false;

View File

@ -4,22 +4,10 @@
<Row @keydown.enter.native="handleSearch"> <Row @keydown.enter.native="handleSearch">
<Form ref="searchForm" :model="searchForm" inline :label-width="70" class="search-form"> <Form ref="searchForm" :model="searchForm" inline :label-width="70" class="search-form">
<Form-item label="订单编号" prop="orderSn"> <Form-item label="订单编号" prop="orderSn">
<Input <Input type="text" v-model="searchForm.orderSn" clearable placeholder="请输入订单编号" style="width: 200px" />
type="text"
v-model="searchForm.orderSn"
clearable
placeholder="请输入订单编号"
style="width: 200px"
/>
</Form-item> </Form-item>
<Form-item label="会员名称" prop="buyerName"> <Form-item label="会员名称" prop="buyerName">
<Input <Input type="text" v-model="searchForm.buyerName" clearable placeholder="请输入会员名称" style="width: 200px" />
type="text"
v-model="searchForm.buyerName"
clearable
placeholder="请输入会员名称"
style="width: 200px"
/>
</Form-item> </Form-item>
<Form-item label="订单状态" prop="orderStatus"> <Form-item label="订单状态" prop="orderStatus">
<Select v-model="searchForm.orderStatus" placeholder="请选择" clearable style="width: 200px"> <Select v-model="searchForm.orderStatus" placeholder="请选择" clearable style="width: 200px">
@ -33,279 +21,295 @@
</Select> </Select>
</Form-item> </Form-item>
<Form-item label="下单时间"> <Form-item label="下单时间">
<DatePicker <DatePicker v-model="selectDate" type="datetimerange" format="yyyy-MM-dd" clearable @on-change="selectDateRange" placeholder="选择起始时间" style="width: 200px"></DatePicker>
v-model="selectDate"
type="datetimerange"
format="yyyy-MM-dd"
clearable
@on-change="selectDateRange"
placeholder="选择起始时间"
style="width: 200px"
></DatePicker>
</Form-item> </Form-item>
<Button @click="handleSearch" type="primary" icon="ios-search" class="search-btn">搜索</Button> <Button @click="handleSearch" type="primary" icon="ios-search" class="search-btn">搜索</Button>
<Button @click="handleReset" class="search-btn">重置</Button> <Button @click="handleReset" class="search-btn">重置</Button>
</Form> </Form>
</Row> </Row>
<Table <div>
:loading="loading" <Button type="primary" class="export" @click="expressOrderDeliver">
border 批量发货
:columns="columns" <Icon type="ios-arrow-down"></Icon>
:data="data" </Button>
ref="table" <Poptip @keydown.enter.native="orderVerification" placement="bottom-start" width="400">
sortable="custom" <Button class="export">
@on-sort-change="changeSort" 核验订单
@on-selection-change="changeSelect" </Button>
></Table> <div class="api" slot="content">
<h2>核验订单号</h2>
<div style="margin:10px 0;">
<Input v-model="orderCode" style="width:300px; margin-right:10px;" />
<Button style="primary" @click="orderVerification"></Button>
</div>
</div>
</Poptip>
</div>
<Table :loading="loading" border :columns="columns" :data="data" ref="table" sortable="custom" @on-sort-change="changeSort" @on-selection-change="changeSelect"></Table>
<Row type="flex" justify="end" class="page"> <Row type="flex" justify="end" class="page">
<Page <Page :current="searchForm.pageNumber" :total="total" :page-size="searchForm.pageSize" @on-change="changePage" @on-page-size-change="changePageSize" :page-size-opts="[10, 20, 50]" size="small"
:current="searchForm.pageNumber" show-total show-elevator show-sizer></Page>
:total="total"
:page-size="searchForm.pageSize"
@on-change="changePage"
@on-page-size-change="changePageSize"
:page-size-opts="[10, 20, 50]"
size="small"
show-total
show-elevator
show-sizer
></Page>
</Row> </Row>
</Card> </Card>
</div> </div>
</template> </template>
<script> <script>
import * as API_Order from "@/api/order"; import * as API_Order from "@/api/order";
export default { import { verificationCode } from "@/api/order";
name: "orderList", export default {
data() { name: "orderList",
return { data() {
loading: true, // return {
searchForm: { orderCode: "",
// loading: true, //
pageNumber: 1, // searchForm: {
pageSize: 10, // //
sort: "createTime", // pageNumber: 1, //
order: "desc", // pageSize: 10, //
startDate: "", // sort: "createTime", //
endDate: "", // order: "desc", //
orderSn:"", startDate: "", //
buyerName:"", endDate: "", //
orderStatus:"" orderSn: "",
buyerName: "",
orderStatus: "",
},
selectDate: null,
form: {
//
sn: "",
sellerName: "",
startTime: "",
endTime: "",
billPrice: "",
},
//
formValidate: {},
submitLoading: false, //
selectList: [], //
selectCount: 0, //
columns: [
{
title: "订单号",
key: "sn",
minWidth: 240,
tooltip: true,
}, },
selectDate: null, {
form: { title: "订单来源",
// key: "clientType",
sn: "", width: 120,
sellerName: "", render: (h, params) => {
startTime: "", if (params.row.clientType == "H5") {
endTime: "", return h("div", {}, "移动端");
billPrice: "", } else if (params.row.clientType == "PC") {
}, return h("div", {}, "PC端");
// } else if (params.row.clientType == "WECHAT_MP") {
formValidate: {}, return h("div", {}, "小程序端");
submitLoading: false, // } else if (params.row.clientType == "APP") {
selectList: [], // return h("div", {}, "移动应用端");
selectCount: 0, // } else {
columns: [ return h("div", {}, params.row.clientType);
{
title: "订单号",
key: "sn",
minWidth: 240,
tooltip: true
},
{
title: "订单来源",
key: "clientType",
width: 120,
render: (h, params) => {
if (params.row.clientType == "H5") {
return h("div",{},"移动端");
}else if(params.row.clientType == "PC") {
return h("div",{},"PC端");
}else if(params.row.clientType == "WECHAT_MP") {
return h("div",{},"小程序端");
}else if(params.row.clientType == "APP") {
return h("div",{},"移动应用端");
}
else{
return h("div",{},params.row.clientType);
}
},
},
{
title: "订单类型",
key: "orderType",
width: 120,
render: (h, params) => {
if (params.row.orderType == "NORMAL") {
return h('div', [h('span', { }, '普通订单'),]);
} else if (params.row.orderType == "PINTUAN") {
return h('div', [h('span', { }, '拼团订单'),]);
} else if (params.row.orderType == "GIFT") {
return h('div', [h('span', { }, '赠品订单'),]);
}
} }
}, },
{ },
title: "买家名称", {
key: "memberName", title: "订单类型",
minWidth: 130, key: "orderType",
tooltip: true width: 120,
}, render: (h, params) => {
{ if (params.row.orderType == "NORMAL") {
title: "订单金额", return h("div", [h("span", {}, "普通订单")]);
key: "flowPrice", } else if (params.row.orderType == "PINTUAN") {
minWidth: 100, return h("div", [h("span", {}, "拼团订单")]);
tooltip: true, } else if (params.row.orderType == "GIFT") {
render: (h, params) => { return h("div", [h("span", {}, "赠品订单")]);
return h( } else if (params.row.orderType == "VIRTUAL") {
"div", return h("div", [h("tag", {}, "核验订单")]);
this.$options.filters.unitPrice(params.row.flowPrice, "¥")
);
},
},
{
title: "订单状态",
key: "orderStatus",
minWidth: 100,
render: (h, params) => {
if (params.row.orderStatus == "UNPAID") {
return h('div', [h('span', { }, '未付款'),]);
} else if (params.row.orderStatus == "PAID") {
return h('div', [h('span', { }, '已付款'),]);
} else if (params.row.orderStatus == "UNDELIVERED") {
return h('div', [h('span', { }, '待发货'),]);
}else if (params.row.orderStatus == "DELIVERED") {
return h('div', [h('span', { }, '已发货'),]);
}else if (params.row.orderStatus == "COMPLETED") {
return h('div', [h('span', { }, '已完成'),]);
}else if (params.row.orderStatus == "TAKE") {
return h('div', [h('span', { }, '待核验'),]);
}else if (params.row.orderStatus == "CANCELLED") {
return h('div', [h('span', { }, '已取消'),]);
}
} }
}, },
{ },
title: "下单时间", {
key: "createTime", title: "买家名称",
width: 170, key: "memberName",
sortable: true, minWidth: 130,
sortType: "desc", tooltip: true,
},
{
title: "订单金额",
key: "flowPrice",
minWidth: 100,
tooltip: true,
render: (h, params) => {
return h(
"div",
this.$options.filters.unitPrice(params.row.flowPrice, "¥")
);
}, },
},
{ {
title: "操作", title: "订单状态",
key: "action", key: "orderStatus",
align: "center", minWidth: 100,
width: 100, render: (h, params) => {
render: (h, params) => { if (params.row.orderStatus == "UNPAID") {
return h("div", [ return h("div", [h("span", {}, "未付款")]);
h( } else if (params.row.orderStatus == "PAID") {
"Button", return h("div", [h("span", {}, "已付款")]);
{ } else if (params.row.orderStatus == "UNDELIVERED") {
props: { return h("div", [h("span", {}, "待发货")]);
type: "info", } else if (params.row.orderStatus == "DELIVERED") {
size: "small", return h("div", [h("span", {}, "已发货")]);
}, } else if (params.row.orderStatus == "COMPLETED") {
style: { return h("div", [h("span", {}, "已完成")]);
marginRight: "5px", } else if (params.row.orderStatus == "TAKE") {
}, return h("div", [h("span", {}, "待核验")]);
on: { } else if (params.row.orderStatus == "CANCELLED") {
click: () => { return h("div", [h("span", {}, "已取消")]);
this.detail(params.row); }
}, },
},
{
title: "下单时间",
key: "createTime",
width: 170,
sortable: true,
sortType: "desc",
},
{
title: "操作",
key: "action",
align: "center",
width: 100,
render: (h, params) => {
return h("div", [
h(
"Button",
{
props: {
type: "info",
size: "small",
},
style: {
marginRight: "5px",
},
on: {
click: () => {
this.detail(params.row);
}, },
}, },
"查看" },
), "查看"
]); ),
}, ]);
}, },
], },
data: [], // ],
total: 0, // data: [], //
}; total: 0, //
}, };
methods: { },
init() { methods: {
this.getDataList(); /**
}, * 核验订单
changePage(v) { */
this.searchForm.pageNumber = v; async orderVerification() {
this.getDataList(); let result = await verificationCode(this.orderCode);
this.clearSelectAll();
}, if (result.success) {
changePageSize(v) {
this.searchForm.pageSize = v;
this.getDataList();
},
handleSearch() {
this.searchForm.pageNumber = 1;
this.searchForm.pageSize = 10;
this.getDataList();
},
handleReset() {
this.searchForm = {};
this.searchForm.pageNumber = 1;
this.searchForm.pageSize = 10;
this.selectDate = null;
this.searchForm.startDate = "";
this.searchForm.endDate = "";
//
this.getDataList();
},
changeSort(e) {
this.searchForm.sort = e.key;
this.searchForm.order = e.order;
if (e.order === "normal") {
this.searchForm.order = "";
}
this.getDataList();
},
clearSelectAll() {
this.$refs.table.selectAll(false);
},
changeSelect(e) {
this.selectList = e;
this.selectCount = e.length;
},
selectDateRange(v) {
if (v) {
this.searchForm.startDate = v[0];
this.searchForm.endDate = v[1];
}
},
getDataList() {
this.loading = true;
API_Order.getOrderList(this.searchForm).then((res) => {
this.loading = false;
if (res.success) {
this.data = res.result.records;
this.total = res.result.total;
}
});
},
detail(v) {
let sn = v.sn;
this.$router.push({ this.$router.push({
name: "order-detail", name: "order-detail",
query: { sn: sn }, query: { sn: result.result.sn || this.orderCode },
}); });
}
},
/**
* 批量发货
*/
expressOrderDeliver() {
this.$router.push({
path: "/export-order-deliver",
});
},
init() {
this.getDataList();
},
changePage(v) {
this.searchForm.pageNumber = v;
this.getDataList();
},
changePageSize(v) {
this.searchForm.pageSize = v;
this.getDataList();
},
handleSearch() {
this.searchForm.pageNumber = 1;
this.searchForm.pageSize = 10;
this.getDataList();
},
handleReset() {
this.searchForm = {};
this.searchForm.pageNumber = 1;
this.searchForm.pageSize = 10;
this.selectDate = null;
this.searchForm.startDate = "";
this.searchForm.endDate = "";
//
this.getDataList();
},
changeSort(e) {
this.searchForm.sort = e.key;
this.searchForm.order = e.order;
if (e.order === "normal") {
this.searchForm.order = "";
}
this.getDataList();
},
}, changeSelect(e) {
this.selectList = e;
this.selectCount = e.length;
}, },
activated () { selectDateRange(v) {
this.init(); if (v) {
this.searchForm.startDate = v[0];
this.searchForm.endDate = v[1];
}
}, },
}; getDataList() {
this.loading = true;
API_Order.getOrderList(this.searchForm).then((res) => {
this.loading = false;
if (res.success) {
this.data = res.result.records;
this.total = res.result.total;
}
});
},
detail(v) {
let sn = v.sn;
this.$router.push({
name: "order-detail",
query: { sn: sn },
});
},
},
activated() {
this.init();
},
};
</script> </script>
<style lang="scss"> <style lang="scss">
// //
@import "@/styles/table-common.scss"; @import "@/styles/table-common.scss";
.export {
margin: 10px 20px 10px 0;
}
</style> </style>