Skip to content

S
saas-manage
Commit 0001c842 by frenck
Options

Merge branch 'master' of http://47.99.244.21:9999/chehuidong/saas-manage

parents f3857afc e5e05d45
Showing with 3041 additions and 116 deletions
.eslintrc.js
module.exports = {
root: true,
env: {
node: true,
node: true
},
extends: [
'plugin:vue/essential',
'@vue/standard',
],
extends: ['plugin:vue/essential', '@vue/standard'],
parserOptions: {
parser: '@babel/eslint-parser',
parser: '@babel/eslint-parser'
},
rules: {
"space-before-function-paren": 0,
'space-before-function-paren': 0,
'no-console': process.env.NODE_ENV === 'production' ? 'warn' : 'off',
'no-debugger': process.env.NODE_ENV === 'production' ? 'warn' : 'off',
'comma-dangle': ['error', 'always-multiline'],
'comma-dangle': 'off',
// eslint-disable-next-line no-dupe-keys
'space-before-function-paren': 'off',
indent: 'off',
'multiline-ternary': 'off',
"vue/multi-word-component-names":"off",
'vue/multi-word-component-names': 'off',
'eol-last': 0,
'vue/no-mutating-props':"off"
},
'vue/no-mutating-props': 'off'
}
}
.prettierrc
{
"tabWidth": 2,
"singleQuote": true,
"printWidth": 180,
"printWidth": 80,
"semi": false,
"trailingComma": "none",
"bracketSpacing": true,
......
src/.prettierrc deleted 100644 → 0
{
"singleQuote": true,
"semi": false,
"trailingComma": "all",
"printWidth": 60
}
src/assets/css/common.css
......@@ -1045,10 +1045,6 @@ ul li {
padding: 0 8px;
}
.el-dialog__footer .el-button {
width: 100px;
}
.operate-popper {
min-width: 100px;
}
......
src/common/api/axios.js
......@@ -5,7 +5,7 @@ import router from '@/router'
const axios = Axios.create({
baseURL: window.apiHostSetting.VUE_APP_BASE_URL + '/api',
timeout: 30 * 1000,
timeout: 30 * 1000
})
let HTTPNUM = 0
axios.interceptors.request.use((config) => {
......@@ -29,6 +29,8 @@ axios.interceptors.response.use(
Vue.prototype.$message({
type: 'error',
message: res.data.message,
offset: 200,
duration: 1000
})
sessionStorage.setItem('active', 'true')
// router
......@@ -43,6 +45,8 @@ axios.interceptors.response.use(
Vue.prototype.$message({
message: res.data.message,
type: 'warning',
offset: 200,
duration: 1000
})
return Promise.reject(res.data)
} else if (res.data.code === 403) {
......@@ -52,10 +56,12 @@ axios.interceptors.response.use(
Vue.prototype.$message({
type: 'error',
message: res.data.message,
offset: 200,
duration: 1000
})
router
.replace({
name: 'login',
name: 'login'
})
.catch((err) => {
console.log(err)
......@@ -65,12 +71,12 @@ axios.interceptors.response.use(
} else if (res.data.code === 500) {
Vue.prototype.$alert(
'<div style="max-height:500px;overflow:auto">' +
res.data.message +
'</div>',
res.data.message +
'</div>',
'错误提示',
{
dangerouslyUseHTMLString: true,
},
dangerouslyUseHTMLString: true
}
)
}
} else {
......@@ -78,26 +84,23 @@ axios.interceptors.response.use(
if (res.data) {
const fileReader = new FileReader()
fileReader.readAsText(res.data)
fileReader.onload = function(ev) {
fileReader.onload = function (ev) {
console.log(ev.target.result)
Vue.prototype.$alert(ev.target.result, '提示', {
confirmButtonText: '确定',
callback: () => {
},
callback: () => {}
})
}
} else {
Vue.prototype.$alert('请求参数有误', '提示', {
confirmButtonText: '确定',
callback: () => {
},
callback: () => {}
})
}
} else if (res.status === 404) {
Vue.prototype.$alert('请求不存在', '提示', {
confirmButtonText: '确定',
callback: () => {
},
callback: () => {}
})
}
}
......@@ -107,16 +110,16 @@ axios.interceptors.response.use(
(error) => {
Vue.prototype.$alert(error.message, 'Error', {
confirmButtonText: '确定',
callback: () => {
},
callback: () => {}
})
return Promise.reject(error)
},
}
)
export function get(url, params) {
return new Promise((resolve, reject) => {
axios.get(url, { params })
axios
.get(url, { params })
.then((res) => {
if (res.status === 200 && res.data) {
resolve(res.data)
......@@ -132,7 +135,8 @@ export function get(url, params) {
export function post(url, params, headers) {
return new Promise((resolve, reject) => {
axios.post(url, params, headers)
axios
.post(url, params, headers)
.then((res) => {
if (res.status === 200 && res.data) {
resolve(res.data)
......
src/common/api/operation/lossOrder.js 0 → 100644
import axios from '../axios'
export function listTableData(data) {
return axios.post('/order/loseOrderInfo/list_page', data)
}
export function listShopPlateformData() {
return axios.get('/order/loseOrderInfo/getPlatform')
}
export function deleteData(data) {
return axios.post('/order/loseOrderInfo/deleteLoseOrderInfoByIds?ids=' + data)
}
src/common/components/element-ui.js
......@@ -36,6 +36,7 @@ import {
Tooltip,
ColorPicker,
CheckboxGroup,
Popover,
} from 'element-ui'
const components = [
......@@ -71,6 +72,7 @@ const components = [
Tooltip,
ColorPicker,
CheckboxGroup,
Popover,
]
export default {
......
src/router/index.js
......@@ -89,6 +89,40 @@ const routes = [
name: 'system_management',
meta: { title: '客户管理' },
},
{
path: '/saas/logistics/transporters',
component: () => import('@/views/system/transporters.vue'),
name: 'system_transporters',
meta: { title: '运输商列表' },
},
{
path: '/saas/category-style',
component: () => import('@/views/system/category-style.vue'),
name: 'system_category_style',
meta: { title: '类别风格' },
},
{
path: '/saas/sku-sort',
component: () => import('@/views/system/sku-sort.vue'),
name: 'system_sku-sort',
meta: {
title: '属性类管理',
},
},
{
path: '/saas/sku-manage',
component: () => import('@/views/system/sku-manage.vue'),
name: 'system_sku-manage',
meta: {
title: '属性值管理',
},
},
{
path: '/operation/lossOrder',
component: () => import('@/views/operation/lossOrder/index.vue'),
name: 'system_management',
meta: { title: '丢单管理' },
},
],
},
]
......
src/views/home/navMenu.vue
......@@ -11,15 +11,13 @@
text-color="#fff"
style="flex: 1"
background-color="#1565C0"
@click.native="onClickMenus"
active-text-color="#ffd04b"
>
@select="onClickMenus"
active-text-color="#ffd04b">
<template v-for="(nav, index) in menuList">
<el-menu-item
:key="index"
v-if="nav.children.length === 0"
:index="nav.index"
>
:index="nav.index">
<template slot="title">
<i :class="nav.icon"></i>
<span class="label">{{ nav.label }}</span>
......@@ -33,14 +31,11 @@
<el-menu-item
:index="subs.index"
v-for="(subs, index) in nav.children"
:key="index"
>
:key="index">
<template slot="title">
<i :class="subs.icon"></i>
<span class="label">{{
subs.label
}}</span></template
>
<span class="label">{{ subs.label }}</span>
</template>
</el-menu-item>
</el-submenu>
</template>
......@@ -51,18 +46,14 @@
</span>
<el-dropdown>
<div size="mini" style="color: #fff">
{{ userInfo && userInfo.realName
}}<i
class="el-icon-arrow-down el-icon--right"
></i>
{{ userInfo && userInfo.realName }}
<i class="el-icon-arrow-down el-icon--right"></i>
</div>
<el-dropdown-menu slot="dropdown">
<el-dropdown-item @click.native="updatePassword"
>修改密码</el-dropdown-item
>
<el-dropdown-item @click.native="logout"
>退出登录</el-dropdown-item
>
<el-dropdown-item @click.native="updatePassword">
修改密码
</el-dropdown-item>
<el-dropdown-item @click.native="logout">退出登录</el-dropdown-item>
</el-dropdown-menu>
</el-dropdown>
......@@ -77,56 +68,60 @@
:close-on-click-modal="false"
title="修改密码"
:visible.sync="dialogVisible"
width="400px"
>
<el-form
:inline="true"
label-width="100px"
size="small"
>
width="400px">
<el-form :inline="true" label-width="100px" size="small">
<el-form-item label="原密码">
<el-input
show-password
v-model="oldPwd"
placeholder="原密码"
></el-input>
placeholder="原密码"></el-input>
</el-form-item>
<el-form-item label="新密码">
<el-input
show-password
v-model="newPwd"
placeholder="新密码"
></el-input>
placeholder="新密码"></el-input>
</el-form-item>
<el-form-item label="确认新密码">
<el-input
show-password
v-model="confimPwd"
placeholder="确认新密码"
></el-input>
placeholder="确认新密码"></el-input>
</el-form-item>
</el-form>
<div slot="footer">
<el-button
size="small"
@click="dialogVisible = false"
>取 消</el-button
>
<el-button
size="small"
type="primary"
@click="resetPasswordSumbit"
>
<el-button size="small" @click="dialogVisible = false">取 消</el-button>
<el-button size="small" type="primary" @click="resetPasswordSumbit">
确 定
</el-button>
</div>
</el-dialog>
<el-dialog
title="运维工具"
:visible.sync="omVisible"
:close-on-click-modal="false"
width="800px">
<el-form :model="editForm">
<el-form-item>
<el-input
type="textarea"
:rows="10"
placeholder="请输入内容"
v-model="editForm.content"></el-input>
</el-form-item>
</el-form>
<span slot="footer">
<el-button @click="omVisible = false">取消</el-button>
<el-button @click="submitOm" type="primary">确认</el-button>
</span>
</el-dialog>
</div>
</template>
<script>
import { mapGetters, mapState } from 'vuex'
import { logout, resetPassword } from '@/common/api/login'
import { setToken, setUser } from '@/utils/auth'
import { post } from '@/common/api/axios'
export default {
name: 'navMenu',
data() {
......@@ -138,7 +133,7 @@ export default {
label: 'ERP管理',
icon: 'el-icon-menu',
index: '/saas/manage',
children: [],
children: []
},
{
id: 3,
......@@ -146,7 +141,7 @@ export default {
label: 'ERP菜单管理',
icon: 'el-icon-menu',
index: '/saas/menu',
children: [],
children: []
},
{
id: 4,
......@@ -154,7 +149,7 @@ export default {
label: '工单管理',
icon: 'el-icon-s-order',
index: '/saas/taskManage',
children: [],
children: []
},
{
id: 2,
......@@ -164,82 +159,151 @@ export default {
index: '/system',
children: [
{
id: 4,
id: 1,
path: '',
label: '用户管理',
icon: 'el-icon-s-order',
index: 'user',
children: [],
children: []
},
{
id: 4,
id: 2,
path: '',
label: '角色管理',
icon: 'el-icon-s-order',
index: 'user',
children: [],
children: []
},
{
id: 4,
path: '',
label: '汇率币种',
icon: 'el-icon-bank-card',
index: '/saas/currency',
children: [],
},
{
id: 4,
id: 3,
path: '',
label: '定时任务',
icon: 'el-icon-message-solid',
index: '/saas/timed_task',
children: [],
children: []
},
{
id: 5,
id: 4,
path: '',
label: '公告管理',
icon: 'el-icon-s-promotion',
index: '/saas/announceManage',
children: [],
children: []
}
]
},
{
id: 5,
path: '',
label: '功能管理',
icon: '',
index: '',
children: [
{
id: 1,
path: '',
label: '汇率币种',
icon: 'el-icon-bank-card',
index: '/saas/currency',
children: []
},
{
id: 6,
id: 4,
path: '',
label: '国家代码',
icon: 'el-icon-s-flag',
index: '/saas/countryCode',
children: [],
children: []
},
{
id: 7,
id: 5,
path: '',
label: '州省简称',
icon: 'el-icon-s-help',
index: '/saas/abbreviation',
children: [],
children: []
},
{
id: 8,
id: 6,
path: '',
label: '客户管理',
icon: 'el-icon-s-custom',
index: '/saas/management',
children: [],
children: []
},
{
id: 7,
path: '',
label: '运输商列表',
icon: 'el-icon-s-operation',
index: '/saas/logistics/transporters',
children: []
},
{
id: 8,
path: '',
label: '类别风格',
icon: 'el-icon-box',
index: '/saas/category-style',
children: []
},
],
{
id: 9,
path: '',
label: '属性类管理',
icon: 'el-icon-box',
index: '/saas/sku-sort',
children: []
},
{
id: 10,
path: '',
label: '商品值管理',
icon: 'el-icon-box',
index: '/saas/sku-manage',
children: []
}
]
},
{
id: 6,
path: '',
label: '运维',
icon: 'el-icon-s-operation',
index: '/operation',
children: [
{
id: 6_1,
path: '',
label: '丢单管理',
icon: 'el-icon-s-order',
index: '/operation/lossOrder',
children: []
},
{
id: 9,
path: '',
label: '运维工具',
icon: 'el-icon-bank-card',
index: '',
children: []
},
]
}
],
dialogVisible: false,
oldPwd: '',
newPwd: '',
confimPwd: '',
omVisible: false,
editForm: {
content: ''
}
}
},
computed: {
...mapGetters('tags', ['currentTag']),
...mapState(['userInfo']),
...mapState(['userInfo'])
},
watch: {
currentTag(v) {
......@@ -254,7 +318,7 @@ export default {
if (parent) {
this.$refs.menu.open(parent.path)
}
},
}
},
methods: {
updatePassword() {
......@@ -280,7 +344,7 @@ export default {
const res = await resetPassword({
account: this.userInfo.account,
oldPwd: this.oldPwd,
newPwd: this.newPwd,
newPwd: this.newPwd
})
if (res.code === 200) {
this.dialogVisible = false
......@@ -305,8 +369,26 @@ export default {
this.$store.commit('tags/removeAllTags')
this.$router.push('/login')
},
onClickMenus() {},
},
onClickMenus(index) {
if (!index) {
this.omVisible = true
}
},
async submitOm() {
if (!this.editForm.content) {
return this.$message.warning('请输入内容')
}
try {
const res = await post('sys/announcement/get/tool', {
...this.editForm
})
if (res.code !== 200) return
this.$message.success(res.message)
} catch (e) {
console.error(e)
}
}
}
}
</script>
<style lang="scss" scoped>
......
src/views/operation/lossOrder/index.vue 0 → 100644
<template>
<div class="saas-manage card">
<div class="search">
<el-form
:model="searchForm"
size="small"
:inline="true"
>
<el-form-item label="所属平台">
<el-select
style="width: 120px"
filterable
clearable
v-model="searchForm.salesPlatform"
placeholder="请选择所属平台"
>
<el-option
v-for="(value,
index) in plateformList"
:key="index"
:value="value"
:label="index"
></el-option>
</el-select>
</el-form-item>
<el-form-item label="三方平台订单ID">
<el-input
style="width: 160px"
clearable
v-model="searchForm.orderThirdId"
placeholder="请输入三方平台订单ID"
></el-input>
</el-form-item>
<el-form-item label="店铺单号">
<el-input
style="width: 140px"
clearable
v-model="searchForm.shopNumber"
placeholder="请输入店铺单号"
></el-input>
</el-form-item>
<el-form-item label="创建时间">
<el-date-picker
style="width: 360px"
v-model="searchForm.createTimeText"
type="datetimerange"
value-format="yyyy-MM-dd HH:mm:ss"
range-separator="至"
start-placeholder="开始日期"
end-placeholder="结束日期"
>
</el-date-picker>
</el-form-item>
<el-form-item>
<el-button
type="primary"
size="small"
icon="el-icon-search"
@click="search"
>查询</el-button
>
</el-form-item>
<el-form-item>
<el-button
type="danger"
size="small"
icon="el-icon-delete"
@click="deleteData()"
>删除</el-button
>
</el-form-item>
</el-form>
</div>
<div class="table-wrap" v-loading="loading">
<el-table
ref="table"
:data="manageData"
border
width="100%"
height="100%"
:highlight-current-row="true"
@selection-change="handleSelectionChange"
@row-click="rowClick"
header-row-class-name="header-row-class-name"
>
<el-table-column type="expand">
<template slot-scope="props">
<el-form label-position="right" inline class="demo-table-expand" style="display: none;">
<el-form-item label="所属平台">
<span>{{ props.row.salesPlatform }}</span>
</el-form-item>
<el-form-item label="三方平台订单ID">
<span>{{ props.row.orderThirdId }}</span>
</el-form-item>
<el-form-item label="店铺单号">
<span>{{ props.row.shopNumber }}</span>
</el-form-item>
</el-form>
<el-form label-position="right" label-width="100px" size="medium" class="demo-table-expand">
<el-form-item label="失败原因：">
<span style="background-color: #f8f8f9;display: block;padding: 0 13px 0 13px;">{{ props.row.failReason }}</span>
</el-form-item>
</el-form>
</template>
</el-table-column>
<el-table-column
type="selection"
width="55"
header-align="center"
align="center"
>
</el-table-column>
<el-table-column
label="序号"
type="index"
width="50"
align="center"
header-align="center"
>
</el-table-column>
<el-table-column
label="所属平台"
prop="salesPlatform"
header-align="center"
align="center"
width="180"
:show-overflow-tooltip="true"
></el-table-column>
<el-table-column
label="三方平台订单ID"
prop="orderThirdId"
width="200"
header-align="center"
>
</el-table-column>
<el-table-column
label="店铺单号"
prop="shopNumber"
header-align="center"
align="center"
width="200"
:show-overflow-tooltip="true"
></el-table-column>
<el-table-column
label="失败原因"
prop="failReason"
header-align="center"
align="center"
min-width="160"
:show-overflow-tooltip="true"
></el-table-column>
<el-table-column
label="创建时间"
prop="createTime"
header-align="center"
align="center"
width="160"
:show-overflow-tooltip="true"
></el-table-column>
<el-table-column
label="操作"
header-align="center"
align="center"
width="55"
fixed="right"
>
<template slot-scope="scope">
<i
style="cursor: pointer;color:#F56C6C"
class="el-icon-delete"
@click="deleteData(scope.row)"
></i>
</template>
</el-table-column>
</el-table>
</div>
<div class="pagination">
<el-pagination
layout="sizes, total, prev, pager, next, jumper"
background
:total="total"
:page-size="pageSize"
:current-page="currentPage"
@size-change="sizeChange"
@current-change="onCurrentChange"
>
</el-pagination>
</div>
</div>
</template>
<script>
import {
listTableData,
deleteData, // eslint-disable-line no-unused-vars
listShopPlateformData,
} from '@/common/api/operation/lossOrder'
export default {
name: 'lossOrderManage',
data() {
return {
manageData: [],
searchForm: {},
total: 0,
pageSize: 50,
currentPage: 1,
loading: false,
selection: [],
plateformList: [],
}
},
async created() {
this.getList()
this.getShopPlateform()
},
methods: {
async getList() {
this.loading = true
try {
const res = await listTableData(
{
...this.searchForm,
createTimeStart: this.searchForm.createTimeText && this.searchForm.createTimeText[0],
createTimeEnd: this.searchForm.createTimeText && this.searchForm.createTimeText[1],
currentPage: this.currentPage,
pageSize: this.pageSize,
},
)
this.manageData = res.data.records
this.total = res.data.total
} catch (e) {
console.error(e)
} finally {
this.loading = false
}
},
async getShopPlateform() {
const res = await listShopPlateformData()
this.plateformList = res.data
},
search() {
this.getList()
},
async deleteData(row) {
let ids = []
let arr = [] // eslint-disable-line no-unused-vars
if (row) {
arr.push(row)
} else {
arr = this.selection
}
console.log(this.selection)
if (arr.length === 0) {
this.$message.error('请至少选择一条记录')
return
}
try {
await this.$confirm('确认删除？', '提示', {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning',
})
} catch {
return
}
ids = this.selection.map((item) => item.id)
ids = ids.join()
const l = this.$loading({
background: 'rgba(0, 0, 0, 0.3)',
})
try {
await deleteData(ids)
this.selection = []
this.getList()
} catch (e) {
console.error(e)
} finally {
l.close()
}
},
handleSelectionChange(selection) {
this.selection = selection
},
onCurrentChange(currentPage) {
this.currentPage = currentPage
this.getList()
},
sizeChange(pageSize) {
this.pageSize = pageSize
this.getList()
},
rowClick(row) {
if (
this.selection.length === 1 &&
this.selection[0] === row
) {
this.selection = []
this.$refs.table.clearSelection()
} else {
this.selection = [row]
this.$refs.table.clearSelection()
this.$refs.table.toggleRowSelection(row, true)
}
},
},
}
</script>
<style lang="scss" scoped>
.saas-manage {
height: 100%;
overflow: hidden;
display: flex;
flex-direction: column;
&::v-deep {
.el-table .el-table__cell {
padding: 6px 0;
}
.el-input__inner {
padding: 0 4px;
}
.el-input--small .el-input__inner {
height: 30px;
line-height: 30px;
}
.el-icon-time:before {
content: '';
}
.el-dialog__footer {
text-align: center;
.el-button--small {
padding: 9px 50px;
}
}
.el-dialog__body {
padding: 10px 20px;
}
.el-icon-edit:before {
color: #ff9800;
font-weight: bold;
}
.el-range-editor--small .el-range-separator {
line-height: 31px;
}
.header-row-class-name th {
background-color: #f8f8f9;
}
.el-input-group__append {
padding-left: 0;
}
}
}
.search {
background: #fff;
}
.table-wrap {
background: #fff;
flex: 1;
overflow: hidden;
}
.demo-table-expand {
font-size: 0;
//padding: 0 20px 0 20px;
}
.el-form-item__label{
width: 90px!important;
color: #99a9bf!important;
}
</style>
src/views/system/category-style.vue 0 → 100644
<template>
<div class="wrap card">
<el-form :inline="true" size="mini">
<el-form-item label style="margin-bottom: 0px">
<ul class="calcul-tat-bar" style="width: 200px">
<li class="my-flex tabt-bar-nav">
<span
class="my-flex-1"
:class="{ active: is_tab == '1' }"
@click="handleClick('1')"
>
类别
</span>
<span
class="my-flex-1"
:class="{ active: is_tab == '2' }"
@click="handleClick('2')"
>
风格
</span>
</li>
</ul>
</el-form-item>
<el-form-item style="margin-bottom: 0px">
<el-button type="success" @click="addDialog(1)"
>新增</el-button
>
</el-form-item>
<el-form-item style="margin-bottom: 0px">
<el-button type="danger" @click="deleteSection()"
>删除</el-button
>
</el-form-item>
<el-form-item style="margin-bottom: 0px">
<el-button type="warning" @click="getList(1)"
>刷新</el-button
>
</el-form-item>
</el-form>
<div class="my-table-cont my-flex-1">
<table-view
ref="multipleTable"
:sourceData="sourceData"
:treeConfig="{ children: 'children' }"
:selection="true"
@selectionChange="(v) => (selections = v)"
:tableColumns="tableColumns"
></table-view>
</div>
<div class="pagination" v-if="is_tab == 2">
<el-pagination
layout="sizes, total, prev, pager, next, jumper"
background
:total="paginationOptions.total"
:page-size="paginationOptions.pageSize"
:current-page="paginationOptions.currentPage"
@size-change="sizeChange"
@current-change="onCurrentChange"
/>
</div>
<!-- 弹出层 -->
<el-dialog
:close-on-click-modal="false"
:title="is_title == 1 ? '新增' : '编辑'"
:visible.sync="dialogVisible"
width="640px"
>
<el-form
label-position="right"
label-width="100px"
size="mini"
:inline="true"
:model="addcurrencyform"
:rules="addrules"
ref="addcurrencyform"
>
<el-form-item
label="上级分类"
v-if="is_tab == '1'"
prop="pid"
>
<!-- <el-select v-model="addcurrencyform.pid" placeholder="请选择上级分类">
<el-option v-for="item in all_list" :key="item.id" :label="item.name" :value="item.id"></el-option>
</el-select>-->
<el-cascader
clearable
style="width: 164px"
v-model="addcurrencyform.pid"
:options="all_list"
:props="pidoptions"
:show-all-levels="false"
></el-cascader>
</el-form-item>
<el-form-item
label="类别中文名"
prop="name"
v-if="is_tab == '1'"
required
>
<el-input
v-model="addcurrencyform.name"
placeholder="请输入类别中文名称"
></el-input>
</el-form-item>
<el-form-item
label="类别英文名"
prop="enname"
v-if="is_tab == '1'"
required
>
<el-input
v-model="addcurrencyform.enname"
placeholder="请输入类别英文名称"
></el-input>
</el-form-item>
<el-form-item
label="风格名称"
prop="name"
v-if="is_tab == '2'"
required
>
<el-input
v-model="addcurrencyform.name"
placeholder="请输入类别名称"
></el-input>
</el-form-item>
<el-form-item
label="风格编码"
prop="code"
v-if="is_tab == '2'"
required
>
<el-input
v-model="addcurrencyform.code"
placeholder="请输入类别名称"
></el-input>
</el-form-item>
<el-form-item label="排序" prop="remark">
<el-input
style="width: 164px"
v-model="addcurrencyform.sort"
placeholder="排序"
></el-input>
</el-form-item>
<el-form-item label="备注信息" prop="remark">
<el-input
style="width: 438px"
v-model="addcurrencyform.remark"
placeholder="请输入备注信息"
></el-input>
</el-form-item>
<el-form-item
label="相关风格"
prop="styleIds"
v-if="is_tab == '1'"
>
<el-select
v-model="addcurrencyform.styleIds"
multiple
placeholder="请选择相关风格"
style="width: 438px"
filterable
>
<el-option
v-for="(item, index) in all_list2"
:key="index"
:label="item.name"
:value="item.id"
></el-option>
</el-select>
</el-form-item>
<el-form-item
label="SKU属性"
prop="skuPropertyIds"
required
v-if="
is_tab == '1' &&
(addcurrencyform.pid === 0 ||
!addcurrencyform.pid)
"
>
<el-select
v-model="addcurrencyform.skuPropertyIds"
multiple
filterable
placeholder="请选择相关属性"
style="width: 438px"
>
<el-option
v-for="item in skuCategory"
:key="item.id"
:value="item.id"
:label="item.cnname + '(' + item.enname + ')'"
></el-option>
</el-select>
</el-form-item>
<el-form-item
label="一般属性"
prop="generalPropertyIds"
v-if="
is_tab == '1' &&
(addcurrencyform.pid === 0 ||
!addcurrencyform.pid)
"
>
<el-select
v-model="addcurrencyform.generalPropertyIds"
multiple
filterable
placeholder="请选择相关属性"
style="width: 438px"
>
<el-option
v-for="item in generalCategory"
:key="item.id"
:value="item.id"
:label="item.cnname + '(' + item.enname + ')'"
></el-option>
</el-select>
</el-form-item>
</el-form>
<span slot="footer">
<el-button
@click="dialogVisible = false"
size="mini"
style="width: 130px"
>
取消
</el-button>
<el-button
type="primary"
@click="addCurrency()"
size="mini"
style="width: 130px"
>
确认
</el-button>
</span>
</el-dialog>
<!-- 绑定默认供应商 -->
<el-dialog
:title="`设置默认供应商(${currentCateName})`"
:visible.sync="setDefVisivle"
width="790px"
:close-on-click-modal="false"
>
<el-input
v-model="supplierName"
placeholder=""
style="width: 200px; margin-bottom: 10px"
clearable
></el-input>
<div style="min-height: 100px; max-height: 500px">
<el-radio-group
v-model="supplierId"
style="width: 100%"
>
<div
style="
display: inline-block;
width: 33.33%;
margin-bottom: 10px;
"
v-for="(item, index) in supplierlist"
:key="index"
>
<el-radio :label="item.id">{{
item.name
}}</el-radio>
</div>
</el-radio-group>
</div>
<span slot="footer">
<el-button @click="setDefVisivle = false"
>取消</el-button
>
<el-button
type="primary"
@click="submitDefaultSupplier"
>
保存
</el-button>
</span>
</el-dialog>
</div>
</template>
<script>
import axios from '../../common/api/axios'
import TableView from '@/common/components/base/tableView.vue'
export default {
name: 'supply_category',
components: {
TableView,
},
data() {
return {
currentCateName: '',
select_tab: 'LB',
istab: 'LB',
is_title: 1,
sourceData: [],
dialogVisible: false,
addcurrencyform: {
code: '',
id: '',
name: '',
enname: '',
shopId: '',
type: '',
styleIds: [],
styleNames: '',
pid: 0,
propertyIds: [],
},
addcurrencyform2: null,
formId: null,
addrules: {},
all_list: [],
all_list2: [],
is_tab: '1',
pidoptions: {
label: 'name',
value: 'id',
checkStrictly: true,
emitPath: false,
},
paginationOptions: {
pageSize: 100,
currentPage: 1,
total: 0,
},
category: [],
supplierList: [],
currentCateId: '',
setDefVisivle: false,
supplierId: '',
supplierName: '',
selections: [],
skuCategory: [],
generalCategory: [],
}
},
created() {
// this.alllist("baseStyleInfo/all_list", "all_list2");
this.getList(1)
this.addcurrencyform2 = JSON.parse(
JSON.stringify(this.addcurrencyform),
)
},
computed: {
supplierlist() {
return this.supplierList.filter(
(item) =>
item.name &&
item.name.indexOf(this.supplierName) !== -1,
)
},
tableColumns() {
let arr = []
if (this.is_tab === '1') {
arr = [
{
label: '类别中文名',
key: 'name',
width: 200,
align: 'left',
treeNode: true,
render: (item) => (
<div>
<span
class={
item.deep === 1
? 'el-icon-folder'
: item.deep === 2
? 'el-icon-folder-opened'
: 'el-icon-tickets'
}
style={{
color:
item.deep === 1
? '#4168FF'
: item.deep === 2
? '#67c23a'
: '',
}}
></span>
<span>{item.name}</span>
</div>
),
},
{
label: '类别英文名',
key: 'enname',
align: 'left',
width: 130,
},
{
label: '相关风格',
key: 'styleNames',
align: 'left',
width: 200,
},
{
label: 'SKU属性',
key: 'skuPropertyNames',
align: 'left',
width: 200,
},
{
label: '一般属性',
key: 'propertyNames',
align: 'left',
},
]
} else {
arr = [
{
label: '风格名称',
key: 'name',
align: 'left',
},
{
label: '风格编码',
key: 'code',
align: 'left',
},
]
}
return [
...arr,
{
label: '排序',
key: 'sort',
align: 'right',
width: 100,
},
{
label: '备注信息',
key: 'remark',
align: 'center',
},
{
label: '相关操作',
key: '',
align: 'center',
fixed: 'right',
width: 100,
render: (item) => (
<div>
<span
class="icon-view icon-edit-view"
title="编辑"
>
<i
class="el-icon-edit"
onClick={() => this.addDialog(2, item)}
></i>
</span>
<span
class="icon-view icon-del-view"
title="删除"
>
<i
class="el-icon-delete-solid"
onClick={() => this.deleteSection(item)}
></i>
</span>
</div>
),
},
]
},
},
// watch: {
// select_tab(val) {
// if (this.istab == val) return;
// this.istab = val;
// this.currentPage = 1;
// this.getList(1);
// }
// },
filters: {
text_join(value) {
if (!value) return ''
return value.join(',')
},
},
methods: {
onCurrentChange(currentPage) {
this.paginationOptions.currentPage = currentPage
this.getList()
},
sizeChange(pageSize) {
this.paginationOptions.pageSize = pageSize
this.getList()
},
submitDefaultSupplier() {
axios
.post('baseCategoryInfo/setDefaultSupplier', {
id: this.currentCateId,
defaultSupplierId: this.supplierId,
})
.then((res) => {
this.$message.success(res.message)
this.setDefVisivle = false
this.getList()
})
.catch((err) => console.log(err))
},
setDefSupplier(item) {
this.currentCateId = item.id
this.currentCateName = item.name
this.supplierId = ''
axios
.get('supplySupplier/getSupplyByCategory', {
params: { categoryId: item.id },
})
.then((res) => {
const supplierList = res.data || []
if (supplierList.length === 0) {
return this.$message.warning(
'该分类下暂无供应商',
)
} else {
this.setDefVisivle = true
this.supplierList = supplierList
}
})
},
getStyle() {
if (this.all_list2.length > 0) return
this.alllist('baseStyleInfo/all_list', 'all_list2')
if (this.skuCategory.length > 0) return
this.alllist(
'baseProperty/all_list_sku',
'skuCategory',
)
if (this.generalCategory.length > 0) return
this.alllist(
'baseProperty/all_list_general',
'generalCategory',
)
},
search() {
this.currentPage = 1
this.getList(1)
},
handleClick(v) {
this.is_tab = v
this.selections = []
this.getList(1)
},
currentTabFn(val) {
if (val) this.formId = val.id
else this.formId = null
},
addDialog(i, v = null) {
this.getStyle()
if (this.is_tab === '1') {
this.alllist(
'baseCategoryInfo/tree_list',
'all_list',
)
}
if (i === 2) {
if (v) this.formId = v.id
if (!this.formId) {
return this.$message('请勾选至少一条记录')
}
this.selectSection()
} else {
this.$nextTick(() => {
this.addcurrencyform = JSON.parse(
JSON.stringify(this.addcurrencyform2),
)
})
this.is_title = i
this.dialogVisible = true
}
if (this.$refs.addcurrencyform) {
this.$refs.addcurrencyform.resetFields()
}
},
addCurrency() {
this.$refs.addcurrencyform.validate((valid) => {
if (valid) {
if (this.is_title === 1) {
this.addSection()
} else {
this.upSection()
}
}
})
},
setpaginationOptions(opt) {
for (const key in opt) {
this.paginationOptions[key] = opt[key]
}
this.getList()
},
getList() {
if (this.is_tab === '2') {
const { pageSize, currentPage } =
this.paginationOptions
axios
.get('baseStyleInfo/list_page', {
params: {
pageSize: pageSize,
currentPage: currentPage,
},
baseURL: '/api/manage/rest',
})
.then((res) => {
if (res.code === 200) {
this.formId = null
this.sourceData = res.data.records
this.paginationOptions.total = res.data.total
} else {
this.$alert(res.message, '错误提示', {
dangerouslyUseHTMLString: true,
})
}
})
} else {
this.alllist(
'baseCategoryInfo/tree_list',
'sourceData',
)
}
},
selectSection() {
const text =
this.is_tab === '1'
? 'baseCategoryInfo'
: 'baseStyleInfo'
const url = `${text}/get?id=${this.formId}`
axios.get(url, {
baseURL: '/api/manage/rest',
}).then((res) => {
if (res.code === 200) {
const data = res.data
this.addcurrencyform = Object.assign({}, data)
this.is_title = 2
this.dialogVisible = true
} else {
this.$alert(res.message, '错误提示', {
dangerouslyUseHTMLString: true,
})
}
})
},
upSection() {
const text =
this.is_tab === '1'
? 'baseCategoryInfo'
: 'baseStyleInfo'
const url = `${text}/update`
axios.post(url, this.addcurrencyform).then((res) => {
if (res.code === 200) {
this.dialogVisible = false
this.$message({
message: '修改成功',
type: 'success',
})
this.getList(this.currentPage)
} else {
this.$alert(res.message, '错误提示', {
dangerouslyUseHTMLString: true,
})
}
})
},
addSection() {
const text =
this.is_tab === '1'
? 'baseCategoryInfo'
: 'baseStyleInfo'
const url = `${text}/add`
axios.post(url, this.addcurrencyform).then((res) => {
if (res.code === 200) {
this.dialogVisible = false
this.$message({
message: '添加成功',
type: 'success',
})
this.getList(this.currentPage)
} else {
this.$alert(res.message, '错误提示', {
dangerouslyUseHTMLString: true,
})
}
})
},
deleteSection(v) {
let arr = []
if (v) arr.push(v)
else arr = this.selections
const leng = arr.length
if (leng === 0) {
return this.$message('请勾选至少一条记录')
}
let ids = []
ids = arr.map((v) => {
return v.id
})
ids = ids.join()
this.$confirm('确定删除选中的信息？', '提示', {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning',
})
.then(() => {
const text =
this.is_tab === '1'
? 'baseCategoryInfo'
: 'baseStyleInfo'
const url = `${text}/delete?ids=${ids}`
axios.get(url).then((res) => {
if (res.code === 200) {
this.$message({
type: 'success',
message: '删除成功!',
})
this.getList(this.currentPage)
}
})
})
.catch(() => {})
},
alllist(url, arr) {
axios
.get(url, { baseURL: '/api/manage/rest' })
.then((res) => {
if (res.code === 200) {
this[arr] = res.data
this.$nextTick(() => {
if (this.$refs.addcurrencyform) {
this.$refs.addcurrencyform.clearValidate()
}
})
} else {
this.$alert(res.message, '错误提示', {
dangerouslyUseHTMLString: true,
})
}
})
},
},
}
</script>
<style>
.wrap {
height: 100%;
overflow: hidden;
display: flex;
flex-direction: column;
}
.table-wrap {
background: #fff;
flex: 1;
overflow: hidden;
}
</style>
src/views/system/sku-manage.vue 0 → 100644
<template>
<div class="wraper">
<!-- <div class="page_left">
<el-tree
:data="treeData"
:props="defaultProps"
highlight-current
:node-key="'sort'"
:current-node-key="0"
@node-click="handleNodeClick"
>
<span
class="custom-tree-node"
slot-scope="{ node, data }"
>
<span v-html="node.label"></span>
<span>({{ data.quantity }})</span>
</span>
</el-tree>
</div> -->
<div class="page_right">
<el-form
:inline="true"
size="mini"
@submit.native.prevent
v-enter-submit="search"
class="search_form"
>
<template>
<el-form-item label="名称">
<el-input
v-model="searchForm.name"
placeholder="中文或英文"
clearable
></el-input>
</el-form-item>
<el-form-item label="编码">
<el-input
v-model="searchForm.code"
placeholder="中文或英文"
clearable
></el-input>
</el-form-item>
<el-form-item label="类别" prop="employeeName">
<el-select
v-model="searchForm.cateCode"
clearable
placeholder="请选择"
>
<el-option
label="颜色"
value="Color"
></el-option>
<el-option
label="尺寸"
value="Size"
></el-option>
</el-select>
</el-form-item>
<!-- <el-form-item label="SKU属性">
<el-select
style="width: 120px"
v-model="searchForm.skuProperty"
clearable
value-key=""
placeholder="请选择">
<el-option label="是" :value="true"></el-option>
<el-option label="否" :value="false"></el-option>
</el-select>
</el-form-item> -->
<el-form-item>
<el-button
type="primary"
@click="search()"
icon="el-icon-search"
native-type="submit"
>
查询
</el-button>
</el-form-item>
</template>
<el-form-item>
<el-button type="success" @click="addDialog(1)"
>新增</el-button
>
</el-form-item>
<el-form-item>
<el-button type="danger" @click="deleteSection()"
>删除</el-button
>
</el-form-item>
</el-form>
<div class="table-wrap" v-loading="loading">
<my-table
:sourceData="userData"
ref="multipleTable"
:selection="true"
:tableColumns="tableColumns"
@selectionChange="selectionChange"
@currentChange="currentTabFn"
></my-table>
</div>
<div class="pagination">
<pagination
:setValue="setpaginationOptions"
:options="paginationOptions"
/>
</div>
</div>
<!-- 弹出层 -->
<el-dialog
:close-on-click-modal="false"
:title="is_title == 1 ? '新增' : '编辑'"
:visible.sync="dialogVisible"
width="700px"
>
<el-form
label-position="right"
label-width="100px"
size="mini"
:inline="true"
:model="addcurrencyform"
:rules="addrules"
ref="addcurrencyform"
>
<el-form-item label="中文名" prop="cnname" required>
<el-input
style="width: 164px"
v-model="addcurrencyform.cnname"
placeholder="请输入中文名"
></el-input>
</el-form-item>
<el-form-item label="英文名" prop="enname" required>
<el-input
style="width: 164px"
v-model="addcurrencyform.enname"
placeholder="请输入英文名"
></el-input>
</el-form-item>
<el-form-item label="编码" prop="code" required>
<el-input
style="width: 164px"
v-model="addcurrencyform.code"
maxlength="7"
placeholder="请输入编码"
></el-input>
</el-form-item>
<el-form-item
label="类别"
prop="cateCode"
required
>
<el-select
v-model="addcurrencyform.cateCode"
style="width: 164px"
clearable
placeholder="请选择"
>
<el-option
label="颜色"
value="Color"
></el-option>
<el-option
label="尺寸"
value="Size"
></el-option>
</el-select>
</el-form-item>
<el-form-item label="排序序号" prop="sort">
<el-input
style="width: 164px"
v-model.number="addcurrencyform.sort"
placeholder="请输入数字"
></el-input>
</el-form-item>
<el-form-item label="是否带电池">
<el-select
style="width: 164px"
v-model="addcurrencyform.battery"
clearable
value-key=""
placeholder="请选择"
>
<el-option label="是" :value="true"></el-option>
<el-option
label="否"
:value="false"
></el-option>
</el-select>
</el-form-item>
<el-form-item label="是否液体">
<el-select
style="width: 164px"
v-model="addcurrencyform.liquid"
clearable
value-key=""
placeholder="请选择"
>
<el-option label="是" :value="true"></el-option>
<el-option
label="否"
:value="false"
></el-option>
</el-select>
</el-form-item>
<el-form-item label="是否刀具">
<el-select
style="width: 164px"
v-model="addcurrencyform.knife"
clearable
value-key=""
placeholder="请选择"
>
<el-option label="是" :value="true"></el-option>
<el-option
label="否"
:value="false"
></el-option>
</el-select>
</el-form-item>
<el-form-item label="文字色">
<el-color-picker
style="width: 164px"
v-model="addcurrencyform.fontColor"
size="small"
></el-color-picker>
</el-form-item>
<el-form-item label="背景色" prop="remark">
<el-color-picker
style="width: 164px"
v-model="addcurrencyform.bgColor"
size="small"
></el-color-picker>
</el-form-item>
</el-form>
<span slot="footer" class="dialog-footer">
<el-button
@click="dialogVisible = false"
size="mini"
style="width: 100px"
>
取消
</el-button>
<el-button
type="primary"
@click="addCurrency()"
size="mini"
style="width: 100px"
>
确认
</el-button>
</span>
</el-dialog>
</div>
</template>
<script>
import axios from '../../common/api/axios'
import MyTable from '@/common/components/base/tableView.vue'
export default {
name: 'system_sku-manage',
components: {
MyTable,
},
data() {
return {
loading: false,
treeData: [],
is_title: 1,
userData: [],
selection: [],
dialogVisible: false,
searchForm: {
cateId: '',
code: '',
name: '',
},
addcurrencyform: {
sort: '',
cateCode: '',
code: '',
cnname: '',
enname: '',
fontColor: '',
bgColor: '',
},
all_list: [],
addcurrencyform2: null,
formId: null,
addrules: {},
paginationOptions: {
pageSize: 100,
currentPage: 1,
total: 0,
},
defaultProps: {
label: 'name',
},
}
},
computed: {
tableColumns() {
return [
{ label: '中文名', key: 'cnname' },
{ label: '英文名', key: 'enname' },
{ label: '编码', key: 'code' },
{
label: '类别',
key: 'cateName',
},
{ label: '排列序号', key: 'sort', width: 80 },
{
label: '文字色',
key: 'fontColor',
width: 80,
render: (item) => (
<span
style={{
width: '20px',
height: '20px',
display: 'inline-block',
backgroundColor: item.fontColor,
}}
></span>
),
},
{
label: '背景色',
key: 'bgColor',
width: 80,
render: (item) => (
<span
style={{
width: '20px',
height: '20px',
display: 'inline-block',
backgroundColor: item.bgColor,
}}
></span>
),
},
{
label: '相关操作',
width: 80,
render: (item) => (
<div>
<span
class="icon-view icon-edit-view"
title="编辑"
>
<i
class="el-icon-edit"
onClick={() => this.addDialog(2, item)}
></i>
</span>
<span
class="icon-view icon-del-view"
title="删除"
>
<i
class="el-icon-delete-solid"
onClick={() => this.deleteSection(item)}
></i>
</span>
</div>
),
},
]
},
// categoryList() {
// const list = [
// {
// label: 'SKU属性',
// children: [],
// },
// {
// label: '一般属性',
// children: [],
// },
// ]
// const isSkuProperty = this.all_list.filter(
// (item) => item.skuProperty,
// )
// list[0].children = isSkuProperty || []
// const noSkuProperty = this.all_list.filter(
// (item) => !item.skuProperty,
// )
// list[1].children = noSkuProperty || []
// return list
// },
},
created() {
this.alllist('baseProperty/all_list')
this.getList(1)
this.addcurrencyform2 = JSON.parse(
JSON.stringify(this.addcurrencyform),
)
},
methods: {
// 查询
search() {
this.getList(1)
},
handleNodeClick(node) {
this.skuProperty = node.skuProperty
this.getList()
},
currentTabFn(val) {
if (val) this.formId = val.id
else this.formId = null
},
selectionChange(selection) {
this.selection = selection
},
// 修改新增
addDialog(i, v = null) {
// eslint-disable-next-line eqeqeq
if (i == 2) {
if (v) {
this.formId = v.id
// v.cateIdList = [v.cateId]
}
if (!this.formId) {
return this.$message('请勾选至少一条记录')
}
this.addcurrencyform = Object.assign({}, v)
} else {
this.$nextTick(() => {
this.addcurrencyform = JSON.parse(
JSON.stringify(this.addcurrencyform2),
)
})
}
this.is_title = i
this.dialogVisible = true
if (this.$refs.addcurrencyform) {
this.$refs.addcurrencyform.resetFields()
}
},
addCurrency() {
// eslint-disable-next-line eqeqeq
if (this.is_title == 1) {
this.addSection()
} else {
this.upSection()
}
},
setpaginationOptions(opt) {
for (const key in opt) {
this.paginationOptions[key] = opt[key]
}
this.getList()
},
// 查询
getList() {
const { pageSize, currentPage } =
this.paginationOptions
this.loading = true
axios
.get('base/propertyValue/list_page', {
params: {
pageSize,
currentPage,
skuProperty: this.skuProperty,
...this.searchForm,
},
baseURL: '/api/manage/rest',
})
.then((res) => {
// eslint-disable-next-line eqeqeq
if (res.code == 200) {
this.userData = res.data.records
this.paginationOptions.total = res.data.total
} else {
this.$alert(res.message, '错误提示', {
dangerouslyUseHTMLString: true,
})
}
})
.finally(() => {
this.loading = false
})
},
// 部门职员查询
selectSection() {
const url = `base/propertyValue/get?id=${this.formId}`
axios.get(url).then((res) => {
// eslint-disable-next-line eqeqeq
if (res.code == 200) {
const data = res.data
for (const item in data) {
if (data[item] && !Array.isArray(data[item])) {
data[item] = data[item] + ''
}
}
this.addcurrencyform = Object.assign({}, data)
// console.log(this.addcurrencyform);
this.is_title = 2
this.dialogVisible = true
} else {
this.$alert(res.message, '错误提示', {
dangerouslyUseHTMLString: true,
})
}
})
},
// 修改
upSection() {
const url = 'base/propertyValue/update'
this.$refs.addcurrencyform.validate((valid) => {
if (valid) {
axios
.post(url, this.addcurrencyform)
.then((res) => {
// eslint-disable-next-line eqeqeq
if (res.code == 200) {
this.dialogVisible = false
this.$message({
message: '修改成功',
type: 'success',
})
this.getList(this.currentPage)
} else {
this.$alert(res.message, '错误提示', {
dangerouslyUseHTMLString: true,
})
}
})
}
})
},
// 新增
addSection() {
const url = 'base/propertyValue/add'
this.$refs.addcurrencyform.validate((valid) => {
if (valid) {
axios
.post(url, this.addcurrencyform)
.then((res) => {
// eslint-disable-next-line eqeqeq
if (res.code == 200) {
this.dialogVisible = false
this.$message({
message: '添加成功',
type: 'success',
})
this.getList(this.currentPage)
} else {
this.$alert(res.message, '错误提示', {
dangerouslyUseHTMLString: true,
})
}
})
}
})
},
// 删除
deleteSection(v) {
let arr = []
if (v) arr.push(v)
else arr = this.selection
const leng = arr.length
// eslint-disable-next-line eqeqeq
if (leng == 0) {
return this.$message('请勾选至少一条记录')
}
let ids = []
ids = arr.map((v) => {
return v.id
})
ids = ids.join()
this.$confirm('确定删除选中的信息？', '提示', {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning',
})
.then(() => {
const url = `base/propertyValue/delete?ids=${ids}`
axios.get(url).then((res) => {
// eslint-disable-next-line eqeqeq
if (res.code == 200) {
this.$message({
type: 'success',
message: '删除成功!',
})
this.getList(this.currentPage)
}
})
})
.catch(() => {})
},
// 选择列表接口
alllist(url) {
axios
.get(url, {
baseURL: '/api/manage/rest',
})
.then((res) => {
// eslint-disable-next-line eqeqeq
if (res.code == 200) {
this.all_list = res.data
} else {
this.$alert(res.message, '错误提示', {
dangerouslyUseHTMLString: true,
})
}
})
},
},
}
</script>
<style scoped>
.wraper {
height: 100%;
display: flex;
overflow: hidden;
}
.page_left {
width: 200px;
min-width: 200px;
background: #fff;
border-radius: 5px;
margin-right: 10px;
}
.page_right {
flex: 1;
display: flex;
flex-direction: column;
background: #fff;
border-radius: 5px;
overflow: hidden;
}
.table-wrap {
background: #fff;
flex: 1;
overflow: hidden;
width: 100%;
}
.category-list-item-label {
font-size: 14px;
font-weight: bold;
}
.category-list-options {
padding: 6px 0;
}
.category-list-options::v-deep .el-select-dropdown__item {
height: 26px;
line-height: 26px;
}
.search_form {
margin-top: 5px;
margin-left: 10px;
}
.search_form > .el-form-item {
margin-bottom: 5px;
}
</style>
src/views/system/sku-sort.vue 0 → 100644
<!-- eslint-disable eqeqeq -->
<!-- eslint-disable eqeqeq -->
<template>
<div class="wrap card">
<el-form :inline="true" size="mini" v-enter-submit="getList">
<el-form-item label="中文名">
<el-input
clearable
style="width: 120px"
v-model="searchForm.cnname"
placeholder="请输入"></el-input>
</el-form-item>
<el-form-item label="英文名">
<el-input
clearable
style="width: 120px"
v-model="searchForm.enname"
placeholder="请输入"></el-input>
</el-form-item>
<el-form-item label="SKU属性">
<el-select
style="width: 120px"
v-model="searchForm.skuProperty"
clearable
value-key=""
placeholder="请选择">
<el-option label="是" :value="true"></el-option>
<el-option label="否" :value="false"></el-option>
</el-select>
</el-form-item>
<el-form-item>
<el-button type="primary" @click="getList">查询</el-button>
</el-form-item>
<el-form-item>
<el-button type="success" @click="addDialog(1)">新增</el-button>
</el-form-item>
<el-form-item>
<el-button type="danger" @click="deleteSection()">删除</el-button>
</el-form-item>
</el-form>
<div class="table_wrap">
<my-table
:sourceData="userData"
ref="multipleTable"
:selection="true"
:tableColumns="tableColumns"
@selectionChange="selectionChange"
@currentChange="currentTabFn"></my-table>
</div>
<div class="pagination">
<pagination
layout="sizes, total, prev, pager, next, jumper"
background
:total="paginationOptions.total"
:page-size="paginationOptions.pageSize"
:current-page="paginationOptions.currentPage"
@size-change="sizeChange"
@current-change="onCurrentChange" />
</div>
<!-- 弹出层 -->
<el-dialog
custom-class="custom-dialog"
:close-on-click-modal="false"
:title="is_title == 1 ? '新增' : '编辑'"
:visible.sync="dialogVisible"
width="800px">
<el-form
label-position="right"
label-width="100px"
size="mini"
:model="addcurrencyform"
:rules="addrules"
ref="addcurrencyform">
<el-row :gutter="20">
<el-col :span="24">
<el-form-item label="中文名" prop="cnname">
<el-input
style="width: 100%"
v-model="addcurrencyform.cnname"
placeholder="请输入中文名"></el-input>
</el-form-item>
</el-col>
<el-col :span="24">
<el-form-item label="英文名" prop="enname">
<el-input
style="width: 100%"
v-model="addcurrencyform.enname"
placeholder="请输入英文名"></el-input>
</el-form-item>
</el-col>
</el-row>
<el-row :gutter="20">
<el-col :span="8">
<el-form-item label="sku属性" prop="skuProperty">
<div style="width: 100%">
<el-radio v-model="addcurrencyform.skuProperty" :label="true">
是
</el-radio>
<el-radio v-model="addcurrencyform.skuProperty" :label="false">
否
</el-radio>
</div>
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="多选" prop="multi">
<div style="width: 100%">
<el-radio v-model="addcurrencyform.multi" :label="true">
是
</el-radio>
<el-radio v-model="addcurrencyform.multi" :label="false">
否
</el-radio>
</div>
</el-form-item>
</el-col>
<el-col :span="24">
<el-form-item label="排序序号" prop="sort">
<el-input
style="width: 100%"
v-model.number="addcurrencyform.sort"
placeholder="请输入数字"></el-input>
</el-form-item>
</el-col>
</el-row>
<p class="pop-p">
属性SKU
<span class="pop-p-but">
<el-button
icon="el-icon-plus"
size="small"
type="primary"
@click="selectProp">
选择属性
</el-button>
</span>
</p>
<div style="min-height: 40px; background: #fff">
<div
v-for="(item, index) in selectProps"
class="variants"
v-show="item.children.length > 0"
:key="index">
<div class="title">{{ `${item.name}(${item.code})` }}</div>
<ul class>
<li
v-for="g in item.children"
:key="g.id"
:style="{
background: g.bgColor,
color: g.fontColor
}">
{{ g.cnname }}
<i
class="el-icon-close"
@click="optionDelete(index, g.code)"></i>
</li>
</ul>
</div>
</div>
</el-form>
<span slot="footer" class="dialog-footer">
<el-button
@click="dialogVisible = false"
size="mini"
style="width: 130px">
取消
</el-button>
<el-button
type="primary"
@click="addCurrency()"
size="mini"
style="width: 130px">
确认
</el-button>
</span>
</el-dialog>
<el-dialog
:visible.sync="propDialogVisible"
width="800px"
:close-on-click-modal="false"
title="选择属性">
<div class="product-prop">
<div
class="product-prop_item"
v-for="(item, index) in productPropertiesMap"
:key="index">
<div class="prop-label">
<span>{{ `${item.code}(${item.name})` }}</span>
</div>
<el-checkbox
:indeterminate="typeof propMapIsCheckedAll(item) === 'number'"
:value="propMapIsCheckedAll(item) === true"
@input="propMapOnCheckAllInput(item, $event)">
全选
</el-checkbox>
<el-checkbox-group v-model="checkedProps" class="prop-checkbox">
<el-checkbox
v-for="(e, index1) in item.children"
:key="index1"
:label="e.id"
:style="{ background: e.bgColor, color: e.fontColor }">
{{ e.cnname }}
</el-checkbox>
</el-checkbox-group>
</div>
</div>
<span slot="footer">
<el-button @click="propDialogVisible = false" size="small">
取消
</el-button>
<el-button @click="submitProp" type="primary" size="small">
确认
</el-button>
</span>
</el-dialog>
</div>
</template>
<script>
import axios from '../../common/api/axios'
import MyTable from '@/common/components/base/tableView.vue'
export default {
name: 'system_sku-sort',
components: {
MyTable
},
data() {
return {
propDialogVisible: false,
checkedProps: [],
productProperties: [],
is_title: 1,
userData: [],
searchForm: {},
selection: [],
dialogVisible: false,
addcurrencyform: {
id: '',
cnname: '',
enname: '',
sort: '',
skuProperty: false,
multi: false,
enable: true
},
addcurrencyform2: null,
formId: null,
addrules: {
cnname: [
{
required: true,
message: '请输入中文名',
trigger: 'blur'
}
],
enname: [
{
required: true,
message: '请输入英文名',
trigger: 'blur'
}
]
},
paginationOptions: {
pageSize: 100,
currentPage: 1,
total: 0
},
selectProps: []
}
},
computed: {
tableColumns() {
return [
{ label: '中文名', key: 'cnname', align: 'left' },
{ label: '英文名', key: 'enname', align: 'left' },
{
label: 'sku属性',
key: 'skuProperty',
render: (item) => (
<div style="font-size: 20px">
{item.skuProperty === true ? (
<i style="color: green" class="el-icon-success"></i>
) : (
<i style="color: red" class="el-icon-error"></i>
)}
</div>
)
},
{
label: '多选',
key: 'multi',
render: (item) => (
<div style="font-size: 20px">
{item.multi === true ? (
<i style="color: green" class="el-icon-success"></i>
) : (
<i style="color: red" class="el-icon-error"></i>
)}
</div>
)
},
{
label: '排列序号',
key: 'sort',
width: 80,
align: 'right'
},
{
label: '状态',
key: 'enable',
width: 80,
render: (item) => (
<el-switch
onChange={(v) => this.changeDisableStatus(v, item)}
v-model={item.enable}
active-color="#13ce66"
inactive-color="#ff4949"></el-switch>
)
},
{
label: '相关操作',
width: 80,
render: (item) => (
<div>
<span class="icon-view icon-edit-view" title="编辑">
<i
class="el-icon-edit"
onClick={() => this.addDialog(2, item)}></i>
</span>
<span class="icon-view icon-del-view" title="删除">
<i
class="el-icon-delete-solid"
onClick={() => this.deleteSection(item)}></i>
</span>
</div>
)
}
]
},
productPropertiesMap() {
const properties = []
this.productProperties.forEach((item) => {
const prop = {
code: item.cateCode,
name: item.cateName,
cnname: item.cnname,
enname: item.enname,
children: []
}
const current = properties.find((e) => e.code === item.cateCode)
if (current) {
current.children.push(item)
} else {
prop.children.push(item)
properties.push(prop)
}
})
return properties
}
},
created() {
this.getList(1)
this.loadProductProperties()
this.addcurrencyform2 = JSON.parse(JSON.stringify(this.addcurrencyform))
},
methods: {
async changeDisableStatus(v, item) {
try {
await this.$confirm(
`确定将状态改为${v === false ? '禁用' : '启用'}吗?`,
'提示',
{
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning'
}
)
} catch {
this.$set(item, 'enable', !v)
return
}
try {
const res = await axios.get('baseProperty/changeEnable', {
params: {
id: item.id,
enable: v
}
})
if (res.code !== 200) return
this.$message.success(res.message)
this.getList()
} catch (e) {
console.error(e)
}
},
async submitProp() {
if (!this.checkedProps.length) {
return this.$message.warning('请选择属性')
}
this.getSelectProp()
this.propDialogVisible = false
},
getSelectProp() {
const props = []
this.productProperties.forEach((item) => {
const obj = {
code: item.cateCode,
enname: item.enname,
cnname: item.cnname,
name: item.cateName,
children: []
}
if (this.checkedProps.includes(item.id)) {
const current = props.find((ee) => ee.code === item.cateCode)
if (current) {
current.children.push(item)
} else {
obj.children.push(item)
props.push(obj)
}
}
})
this.selectProps = props
},
selectProp() {
const ids = []
this.selectProps.forEach((item) => {
item.children.forEach((e) => {
ids.push(e.id)
})
})
this.checkedProps = ids
this.propDialogVisible = true
},
optionDelete(index, code) {
this.selectProps[index].children = this.selectProps[
index
].children.filter((item) => item.code !== code)
},
propMapOnCheckAllInput(g, value) {
if (value) {
g.children.forEach((e) => {
if (!this.checkedProps.some((id) => id === e.id)) {
this.checkedProps.push(e.id)
}
})
} else {
g.children.forEach((e) => {
const i = this.checkedProps.indexOf(e.id)
if (i >= 0) this.checkedProps.splice(i, 1)
})
}
},
propMapIsCheckedAll(g) {
// eslint-disable-next-line array-callback-return
const n = g.children.filter((item) =>
this.checkedProps.includes(item.id)
)?.length
if (n === 0) return false
if (n === g.children.length) return true
return n
},
async loadProductProperties() {
try {
const res = await axios.get('manage/rest/base/propertyValue/getAllData')
if (res.code !== 200) return
this.productProperties = res.data
} catch (e) {
console.error(e)
}
},
onCurrentChange(currentPage) {
this.paginationOptions.currentPage = currentPage
this.getList()
},
sizeChange(pageSize) {
this.paginationOptions.pageSize = pageSize
this.getList()
},
currentTabFn(val) {
if (val) this.formId = val.id
else this.formId = null
},
selectionChange(selection) {
this.selection = selection
},
// 修改新增
addDialog(i, v = null) {
if (i === 2) {
if (v) this.formId = v.id
if (!this.formId) {
return this.$message('请勾选至少一条记录')
}
this.checkedProps = v.propertyValueIds
this.getSelectProp()
this.addcurrencyform = Object.assign({}, v)
} else {
this.$nextTick(() => {
this.addcurrencyform = JSON.parse(
JSON.stringify(this.addcurrencyform2)
)
})
this.selectProps = []
}
this.is_title = i
this.dialogVisible = true
if (this.$refs.addcurrencyform) {
this.$refs.addcurrencyform.resetFields()
}
},
addCurrency() {
if (!this.selectProps.length) {
return this.$message.warning('请选择属性')
}
if (this.is_title === 1) {
this.addSection()
} else {
this.upSection()
}
},
setpaginationOptions(opt) {
for (const key in opt) {
this.paginationOptions[key] = opt[key]
}
this.getList()
},
// 查询
getList() {
const { pageSize, currentPage } = this.paginationOptions
axios
.get('baseProperty/list_page', {
params: {
pageSize,
currentPage,
...this.searchForm
},
baseURL: '/api/manage/rest'
})
.then((res) => {
if (res.code === 200) {
this.userData = res.data.records
this.paginationOptions.total = res.data.total
} else {
this.$alert(res.message, '错误提示', {
dangerouslyUseHTMLString: true
})
}
})
},
// 部门职员查询
selectSection() {
const url = `baseProperty/get?id=${this.formId}`
axios.get(url).then((res) => {
if (res.code === 200) {
const data = res.data
for (const item in data) {
if (data[item] && !Array.isArray(data[item])) {
data[item] = data[item] + ''
}
}
this.addcurrencyform = Object.assign({}, data)
this.is_title = 2
this.dialogVisible = true
} else {
this.$alert(res.message, '错误提示', {
dangerouslyUseHTMLString: true
})
}
})
},
// 修改
upSection() {
const url = 'baseProperty/update'
this.$refs.addcurrencyform.validate((valid) => {
if (valid) {
const propertyValueIds = []
this.selectProps.forEach((item) => {
item.children.forEach((ee) => {
propertyValueIds.push(ee.id)
})
})
axios
.post(url, { ...this.addcurrencyform, propertyValueIds })
.then((res) => {
// eslint-disable-next-line eqeqeq
if (res.code == 200) {
this.dialogVisible = false
this.$message({
message: '修改成功',
type: 'success'
})
this.getList(this.currentPage)
} else {
this.$alert(res.message, '错误提示', {
dangerouslyUseHTMLString: true
})
}
})
}
})
},
// 新增
addSection() {
const url = 'baseProperty/add'
this.$refs.addcurrencyform.validate((valid) => {
if (valid) {
const propertyValueIds = []
this.selectProps.forEach((item) => {
item.children.forEach((ee) => {
propertyValueIds.push(ee.id)
})
})
axios
.post(url, {
...this.addcurrencyform,
propertyValueIds: propertyValueIds
})
.then((res) => {
if (res.code === 200) {
this.dialogVisible = false
this.$message({
message: '添加成功',
type: 'success'
})
this.getList(this.currentPage)
} else {
this.$alert(res.message, '错误提示', {
dangerouslyUseHTMLString: true
})
}
})
}
})
},
// 删除
deleteSection(v) {
let arr = []
if (v) arr.push(v)
else arr = this.selection
const leng = arr.length
if (leng === 0) {
return this.$message('请勾选至少一条记录')
}
let ids = []
ids = arr.map((v) => {
return v.id
})
ids = ids.join()
this.$confirm('确定删除选中的信息？', '提示', {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning'
})
.then(() => {
const url = `baseProperty/delete?ids=${ids}`
axios.get(url).then((res) => {
// eslint-disable-next-line eqeqeq
if (res.code == 200) {
this.$message({
type: 'success',
message: '删除成功!'
})
this.getList(this.currentPage)
} else {
this.$alert(res.message, '错误提示', {
dangerouslyUseHTMLString: true
})
}
})
})
.catch(() => {})
}
}
}
</script>
<style lang="scss" scoped>
.wrap {
height: 100%;
overflow: hidden;
display: flex;
flex-direction: column;
}
.table_wrap {
background: #fff;
flex: 1;
overflow: hidden;
}
.prop-checkbox {
margin-top: 10px;
&::v-deep {
.el-checkbox__label {
font-size: 12px;
width: 85px;
overflow: hidden;
white-space: nowrap;
vertical-align: middle;
text-overflow: ellipsis;
}
.el-checkbox {
padding: 3px;
padding-bottom: 3px;
min-width: 110px;
border: 1px solid #dcdfe6;
box-sizing: border-box;
border-radius: 4px;
padding-left: 5px;
padding-right: 5px;
margin-right: 10px;
margin-bottom: 10px;
}
}
}
.prop-label {
font-size: 16px;
font-weight: bold;
margin-bottom: 10px;
}
.variants + .variants {
border-top: 1px solid #bbb;
}
.title {
color: #303133;
font-size: 16px;
font-weight: 600;
line-height: 36px;
padding-left: 10px;
border-bottom: 1px solid #efefef;
margin-bottom: 10px;
}
.variants li {
display: inline-block;
position: relative;
width: 100px;
padding: 0 6px;
margin-left: 6px;
box-sizing: border-box;
border: 1px solid #dcdfe6;
background: #fff;
border-radius: 4px;
overflow: hidden;
white-space: nowrap;
font-weight: 500;
font-size: 12px;
line-height: 24px;
color: #606266;
cursor: pointer;
text-overflow: ellipsis;
padding-right: 10px;
}
.variants li i {
position: absolute;
top: 7px;
right: 5px;
}
</style>
<style>
.customsize-label .el-select-dropdown__list {
display: grid;
grid-template-columns: repeat(3, 1fr);
overflow: hidden auto;
width: 500px;
gap: 6px;
padding-left: 6px;
}
.customsize-label.el-select-dropdown.is-multiple
.el-select-dropdown__item.selected::after {
content: '';
display: none;
}
.customsize-label .el-select-dropdown__item.selected .el-tag {
background-color: #ecf5ff;
display: inline-block;
font-size: 12px;
color: #409eff;
border-radius: 4px;
box-sizing: border-box;
white-space: nowrap;
}
.customsize-label .el-select-dropdown__item {
padding: 0px;
white-space: nowrap;
flex-shrink: 0;
padding-right: 0 !important;
}
.custom-dialog .el-dialog__body {
height: 600px;
}
</style>
src/views/system/transporters.vue 0 → 100644
<template>
<div class="wrap card">
<div class="search">
<el-form
:model="searchForm"
ref="form"
:inline="true"
size="small"
v-enter-submit="search"
@submit.native.prevent
>
<el-form-item label="名称">
<el-input
style="width: 300px"
v-model="searchForm.name"
placeholder="请输入名称&中文名称&英文名称"
clearable
></el-input>
</el-form-item>
<el-form-item>
<el-button type="primary" @click="search"
>查询</el-button
>
</el-form-item>
</el-form>
</div>
<div class="table-wrap">
<table-view
:sourceData="sourceData"
:tableColumns="tableColumns"
></table-view>
<!-- <vxe-table
border
ref="xTable"
height="100%"
show-overflow
size="mini"
@scroll="scrollChange"
:data="sourceData">
<vxe-column
v-for="(config, index) in tableColumns"
:key="index"
:width="config.width"
:type="config.type"
:field="config.key"
:title="config.label"></vxe-column>
</vxe-table> -->
</div>
<div class="pagination">
<el-pagination
layout="sizes, total, prev, pager, next, jumper"
background
:total="paginationOptions.total"
:page-size="paginationOptions.pageSize"
:current-page="paginationOptions.currentPage"
@size-change="sizeChange"
@current-change="onCurrentChange"
>
</el-pagination>
</div>
</div>
</template>
<script>
import axios from '../../common/api/axios'
import TableView from '@/common/components/base/tableView.vue'
export default {
name: 'logistics_transporters',
components: {
TableView,
},
data() {
return {
sourceData: [],
searchForm: {},
isLoad: false,
bodyHeight: 0,
currentPage: 1,
sourceDataTotal: 0,
paginationOptions: {
total: 0,
pageSize: 100,
currentPage: 1,
},
}
},
computed: {
tableColumns() {
return [
{ label: '编码', key: 'code' },
{ label: '中文名称', key: 'nameCn', align: 'left' },
{ label: '英文名称', key: 'nameEn', align: 'left' },
{ label: '港澳名称', key: 'nameHk', align: 'left' },
{ label: '链接', key: 'url', align: 'left' },
]
},
},
mounted() {
this.getlist()
},
methods: {
onCurrentChange(currentPage) {
this.paginationOptions.currentPage = currentPage
this.getlist()
},
sizeChange(pageSize) {
this.paginationOptions.pageSize = pageSize
this.getlist()
},
search() {
this.getlist()
},
scrollChange({ scrollTop, scrollHeight, bodyHeight }) {
if (!this.bodyHeight) {
this.bodyHeight = bodyHeight
}
if (scrollTop + this.bodyHeight >= scrollHeight) {
if (!this.isLoad) {
this.isLoad = true
this.currentPage++
if (
this.sourceData.length >= this.sourceDataTotal
) {
return
}
this.getlist(true)
}
}
},
getlist() {
const { pageSize, currentPage } =
this.paginationOptions
axios
.post('LogisticsCarrierCode/list_page', {
pageSize,
currentPage,
...this.searchForm,
}, {
baseURL: '/api/manage/rest',
})
.then((res) => {
this.sourceData = res.data.records
this.paginationOptions.total = res.data.total
})
},
},
}
</script>
<style scoped>
.wrap {
height: 100%;
overflow: hidden;
display: flex;
flex-direction: column;
}
.table-wrap {
background: #fff;
flex: 1;
overflow: hidden;
}
.table_wrap {
vertical-align: middle;
}
.table_wrap >>> .vxe-checkbox--label {
padding-left: 0;
}
.table_wrap >>> .vxe-header--column.tablecolgroup,
.table_wrap
>>> .vxe-header--column.col--ellipsis.tablecolgroup {
height: 22px !important;
}
.table_wrap >>> .vxe-cell {
/* max-height: 30px !important; */
padding-left: 5px;
padding-right: 5px;
}
</style>
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment