Skip to content
GitLab
Commit d87f1649 authored by 季圣华's avatar 季圣华
Browse files

去掉多余的文件

parent 1043ee9b
Expand all Hide whitespace changes
Inline Side-by-side
jshERP-web/src/components/dict/JDictSelectTag.vue deleted 100644 → 0
View file @ 1043ee9b
<template>
<a-radio-group v-if="tagType=='radio'" @change="handleInput" :value="getValueSting" :disabled="disabled">
<a-radio v-for="(item, key) in dictOptions" :key="key" :value="item.value">{{ item.text }}</a-radio>
</a-radio-group>
<a-radio-group v-else-if="tagType=='radioButton'" buttonStyle="solid" @change="handleInput" :value="getValueSting" :disabled="disabled">
<a-radio-button v-for="(item, key) in dictOptions" :key="key" :value="item.value">{{ item.text }}</a-radio-button>
</a-radio-group>
<a-select v-else-if="tagType=='select'" :getPopupContainer = "(target) => target.parentNode" :placeholder="placeholder" :disabled="disabled" :value="getValueSting" @change="handleInput">
<a-select-option :value="undefined">请选择</a-select-option>
<a-select-option v-for="(item, key) in dictOptions" :key="key" :value="item.value">
<span style="display: inline-block;width: 100%" :title=" item.text || item.label ">
{{ item.text || item.label }}
</span>
</a-select-option>
</a-select>
</template>
<script>
import {ajaxGetDictItems,getDictItemsFromCache} from '@/api/api'
export default {
name: "JDictSelectTag",
props: {
dictCode: String,
placeholder: String,
triggerChange: Boolean,
disabled: Boolean,
value: [String, Number],
type: String
},
data() {
return {
dictOptions: [],
tagType:""
}
},
watch:{
dictCode:{
immediate:true,
handler() {
this.initDictData()
},
}
},
created() {
// console.log(this.dictCode);
if(!this.type || this.type==="list"){
this.tagType = "select"
}else{
this.tagType = this.type
}
//获取字典数据
// this.initDictData();
},
computed: {
getValueSting(){
return this.value != null ? this.value.toString() : null;
},
},
methods: {
initDictData() {
//优先从缓存中读取字典配置
if(getDictItemsFromCache(this.dictCode)){
this.dictOptions = getDictItemsFromCache(this.dictCode);
return
}
//根据字典Code, 初始化字典数组
ajaxGetDictItems(this.dictCode, null).then((res) => {
if (res.success) {
// console.log(res.result);
this.dictOptions = res.result;
}
})
},
handleInput(e) {
let val;
if(this.tagType=="radio"){
val = e.target.value
}else{
val = e
}
console.log(val);
if(this.triggerChange){
this.$emit('change', val);
}else{
this.$emit('input', val);
}
},
setCurrentDictOptions(dictOptions){
this.dictOptions = dictOptions
},
getCurrentDictOptions(){
return this.dictOptions
}
}
}
</script>
<style scoped>
</style>
\ No newline at end of file
jshERP-web/src/components/dict/JDictSelectUtil.js deleted 100644 → 0
View file @ 1043ee9b
/**
* 字典 util
* author: scott
* date: 20190109
*/
import {ajaxGetDictItems,getDictItemsFromCache} from '@/api/api'
import {getAction} from '@/api/manage'
/**
* 获取字典数组
* @param dictCode 字典Code
* @return List<Map>
*/
export async function initDictOptions(dictCode) {
if (!dictCode) {
return '字典Code不能为空!';
}
//优先从缓存中读取字典配置
if(getDictItemsFromCache(dictCode)){
let res = {}
res.result = getDictItemsFromCache(dictCode);
res.success = true;
return res;
}
//获取字典数组
let res = await ajaxGetDictItems(dictCode);
return res;
}
/**
* 字典值替换文本通用方法
* @param dictOptions 字典数组
* @param text 字典值
* @return String
*/
export function filterDictText(dictOptions, text) {
// --update-begin----author:sunjianlei---date:20200323------for: 字典翻译 text 允许逗号分隔 ---
if (text != null && dictOptions instanceof Array) {
let result = []
// 允许多个逗号分隔
let splitText = text.toString().trim().split(',')
for (let txt of splitText) {
let dictText = txt
for (let dictItem of dictOptions) {
if (txt === dictItem.value.toString()) {
dictText = dictItem.text
break
}
}
result.push(dictText)
}
return result.join(',')
}
return text
// --update-end----author:sunjianlei---date:20200323------for: 字典翻译 text 允许逗号分隔 ---
}
/**
* 字典值替换文本通用方法(多选)
* @param dictOptions 字典数组
* @param text 字典值
* @return String
*/
export function filterMultiDictText(dictOptions, text) {
//js “!text” 认为0为空，所以做提前处理
if(text === 0 || text === '0'){
if(dictOptions){
for (let dictItem of dictOptions) {
if (text == dictItem.value) {
return dictItem.text
}
}
}
}
if(!text || text=='null' || !dictOptions || dictOptions.length==0){
return ""
}
let re = "";
text = text.toString()
let arr = text.split(",")
dictOptions.forEach(function (option) {
if(option){
for(let i=0;i<arr.length;i++){
if (arr[i] === option.value) {
re += option.text+",";
break;
}
}
}
});
if(re==""){
return text;
}
return re.substring(0,re.length-1);
}
/**
* 翻译字段值对应的文本
* @param children
* @returns string
*/
export function filterDictTextByCache(dictCode, key) {
if(key==null ||key.length==0){
return;
}
if (!dictCode) {
return '字典Code不能为空!';
}
//优先从缓存中读取字典配置
if(getDictItemsFromCache(dictCode)){
let item = getDictItemsFromCache(dictCode).filter(t => t["value"] == key)
if(item && item.length>0){
return item[0]["text"]
}
}
}
/** 通过code获取字典数组 */
export async function getDictItems(dictCode, params) {
//优先从缓存中读取字典配置
if(getDictItemsFromCache(dictCode)){
let desformDictItems = getDictItemsFromCache(dictCode).map(item => ({...item, label: item.text}))
return desformDictItems;
}
//缓存中没有，就请求后台
return await ajaxGetDictItems(dictCode, params).then(({success, result}) => {
if (success) {
let res = result.map(item => ({...item, label: item.text}))
console.log('------- 从DB中获取到了字典-------dictCode : ', dictCode, res)
return Promise.resolve(res)
} else {
console.error('getDictItems error: : ', res)
return Promise.resolve([])
}
}).catch((res) => {
console.error('getDictItems error: ', res)
return Promise.resolve([])
})
}
\ No newline at end of file
jshERP-web/src/components/dict/JMultiSelectTag.vue deleted 100644 → 0
View file @ 1043ee9b
<template>
<a-checkbox-group v-if="tagType=='checkbox'" @change="onChange" :value="arrayValue" :disabled="disabled">
<a-checkbox v-for="(item, key) in dictOptions" :key="key" :value="item.value">{{ item.text || item.label }}</a-checkbox>
</a-checkbox-group>
<a-select
v-else-if="tagType=='select'"
:value="arrayValue"
@change="onChange"
:disabled="disabled"
mode="multiple"
:placeholder="placeholder"
:getPopupContainer="(node) => node.parentNode"
allowClear>
<a-select-option
v-for="(item,index) in dictOptions"
:key="index"
:value="item.value">
<span style="display: inline-block;width: 100%" :title=" item.text || item.label ">
{{ item.text || item.label }}
</span>
</a-select-option>
</a-select>
</template>
<script>
import {ajaxGetDictItems,getDictItemsFromCache} from '@/api/api'
export default {
name: 'JMultiSelectTag',
props: {
dictCode: String,
placeholder: String,
disabled: Boolean,
value: String,
type: String,
options:Array
},
data() {
return {
dictOptions: [],
tagType:"",
arrayValue:!this.value?[]:this.value.split(",")
}
},
created() {
if(!this.type || this.type==="list_multi"){
this.tagType = "select"
}else{
this.tagType = this.type
}
//获取字典数据
//this.initDictData();
},
watch:{
options: function(val){
this.setCurrentDictOptions(val);
},
dictCode:{
immediate:true,
handler() {
this.initDictData()
},
},
value (val) {
if(!val){
this.arrayValue = []
}else{
this.arrayValue = this.value.split(",")
}
}
},
methods: {
initDictData() {
if(this.options && this.options.length>0){
this.dictOptions = [...this.options]
}else{
//优先从缓存中读取字典配置
if(getDictItemsFromCache(this.dictCode)){
this.dictOptions = getDictItemsFromCache(this.dictCode);
return
}
//根据字典Code, 初始化字典数组
ajaxGetDictItems(this.dictCode, null).then((res) => {
if (res.success) {
this.dictOptions = res.result;
}
})
}
},
onChange (selectedValue) {
this.$emit('change', selectedValue.join(","));
},
setCurrentDictOptions(dictOptions){
this.dictOptions = dictOptions
},
getCurrentDictOptions(){
return this.dictOptions
}
},
model: {
prop: 'value',
event: 'change'
}
}
</script>
jshERP-web/src/components/dict/JSearchSelectTag.vue deleted 100644 → 0
View file @ 1043ee9b
<template>
<a-select
v-if="async"
showSearch
labelInValue
:disabled="disabled"
:getPopupContainer="(node) => node.parentNode"
@search="loadData"
:placeholder="placeholder"
v-model="selectedAsyncValue"
style="width: 100%"
:filterOption="false"
@change="handleAsyncChange"
allowClear
:notFoundContent="loading ? undefined : null"
>
<a-spin v-if="loading" slot="notFoundContent" size="small"/>
<a-select-option v-for="d in options" :key="d.value" :value="d.value">{{ d.text }}</a-select-option>
</a-select>
<a-select
v-else
:getPopupContainer="(node) => node.parentNode"
showSearch
:disabled="disabled"
:placeholder="placeholder"
optionFilterProp="children"
style="width: 100%"
@change="handleChange"
:filterOption="filterOption"
v-model="selectedValue"
allowClear
:notFoundContent="loading ? undefined : null">
<a-spin v-if="loading" slot="notFoundContent" size="small"/>
<a-select-option v-for="d in options" :key="d.value" :value="d.value">{{ d.text }}</a-select-option>
</a-select>
</template>
<script>
import { ajaxGetDictItems,getDictItemsFromCache } from '@/api/api'
import debounce from 'lodash/debounce';
import { getAction } from '../../api/manage'
export default {
name: 'JSearchSelectTag',
props:{
disabled: Boolean,
value: [String, Number],
dict: String,
dictOptions: Array,
async: Boolean,
placeholder:{
type:String,
default:"请选择",
required:false
}
},
data(){
this.loadData = debounce(this.loadData, 800);//消抖
this.lastLoad = 0;
return {
loading:false,
selectedValue:[],
selectedAsyncValue:[],
options: [],
}
},
created(){
this.initDictData();
},
watch:{
"value":{
immediate:true,
handler(val){
if(!val){
if(val==0){
this.initSelectValue()
}else{
this.selectedValue=[]
this.selectedAsyncValue=[]
}
}else{
this.initSelectValue()
}
}
},
"dict":{
handler(){
this.initDictData()
}
}
},
methods:{
initSelectValue(){
if(this.async){
if(!this.selectedAsyncValue || !this.selectedAsyncValue.key || this.selectedAsyncValue.key!=this.value){
console.log("这才请求后台")
getAction(`/sys/dict/loadDictItem/${this.dict}`,{key:this.value}).then(res=>{
if(res.success){
let obj = {
key:this.value,
label:res.result
}
this.selectedAsyncValue = {...obj}
}
})
}
}else{
this.selectedValue = this.value.toString()
}
},
loadData(value){
console.log("数据加载",value)
this.lastLoad +=1
const currentLoad = this.lastLoad
this.options = []
this.loading=true
// 字典code格式：table,text,code
getAction(`/sys/dict/loadDict/${this.dict}`,{keyword:value}).then(res=>{
this.loading=false
if(res.success){
if(currentLoad!=this.lastLoad){
return
}
this.options = res.result
console.log("我是第一个",res)
}else{
this.$message.warning(res.message)
}
})
},
initDictData(){
if(!this.async){
//如果字典项集合有数据
if(this.dictOptions && this.dictOptions.length>0){
this.options = [...this.dictOptions]
}else{
//根据字典Code, 初始化字典数组
let dictStr = ''
if(this.dict){
let arr = this.dict.split(',')
if(arr[0].indexOf('where')>0){
let tbInfo = arr[0].split('where')
dictStr = tbInfo[0].trim()+','+arr[1]+','+arr[2]+','+encodeURIComponent(tbInfo[1])
}else{
dictStr = this.dict
}
if (this.dict.indexOf(",") == -1) {
//优先从缓存中读取字典配置
if (getDictItemsFromCache(this.dictCode)) {
this.options = getDictItemsFromCache(this.dictCode);
return
}
}
ajaxGetDictItems(dictStr, null).then((res) => {
if (res.success) {
this.options = res.result;
}
})
}
}
}
},
filterOption(input, option) {
return option.componentOptions.children[0].text.toLowerCase().indexOf(input.toLowerCase()) >= 0
},
handleChange (selectedValue) {
console.log("selectedValue",selectedValue)
this.selectedValue = selectedValue
this.callback()
},
handleAsyncChange(selectedObj){
this.selectedAsyncValue = selectedObj
this.selectedValue = selectedObj.key
this.callback()
},
callback(){
this.$emit('change', this.selectedValue);
},
setCurrentDictOptions(dictOptions){
this.options = dictOptions
},
getCurrentDictOptions(){
return this.options
}
},
model: {
prop: 'value',
event: 'change'
}
}
</script>
<style scoped>
</style>
\ No newline at end of file
jshERP-web/src/components/dict/README.md deleted 100644 → 0
View file @ 1043ee9b
# JDictSelectTag 组件用法
----
- 从字典表获取数据,dictCode格式说明: 字典code
```html
<j-dict-select-tag v-model="queryParam.sex" placeholder="请输入用户性别"
dictCode="sex"/>
```
v-decorator用法：
```html
<j-dict-select-tag v-decorator="['sex', {}]" :triggerChange="true" placeholder="请输入用户性别"
dictCode="sex"/>
```
- 从数据库表获取字典数据，dictCode格式说明: 表名,文本字段,取值字段
```html
<j-dict-select-tag v-model="queryParam.username" placeholder="请选择用户名称"
dictCode="sys_user,realname,id"/>
```
# JDictSelectUtil.js 列表字典函数用法
----
- 第一步: 引入依赖方法
```html
import {initDictOptions, filterDictText} from '@/components/dict/JDictSelectUtil'
```
- 第二步: 在created()初始化方法执行字典配置方法
```html
//初始化字典配置
this.initDictConfig();
```
- 第三步: 实现initDictConfig方法，加载列表所需要的字典(列表上有多个字典项，就执行多次initDictOptions方法)
```html
initDictConfig() {
//初始化字典 - 性别
initDictOptions('sex').then((res) => {
if (res.success) {
this.sexDictOptions = res.result;
}
});
},
```
- 第四步: 实现字段的customRender方法
```html
customRender: (text, record, index) => {
//字典值替换通用方法
return filterDictText(this.sexDictOptions, text);
}
```
# JMultiSelectTag 多选组件
下拉/checkbox
## 参数配置
| 参数 | 类型 | 必填 |说明|
|--------------|---------|----|---------|
| placeholder |string | | placeholder |
| disabled |Boolean | | 是否禁用 |
| type |string | | 多选类型 select/checkbox 默认是select |
| dictCode |string | | 数据字典编码或者表名,显示字段名,存储字段名拼接而成的字符串,如果提供了options参数 则此参数可不填|
| options |Array | | 多选项,如果dictCode参数未提供,可以设置此参数加载多选项 |
使用示例
----
```vue
<template>
<a-form>
<a-form-item label="下拉多选" style="width: 300px">
<j-multi-select-tag
v-model="selectValue"
:options="dictOptions"
placeholder="请做出你的选择">
</j-multi-select-tag>
{{ selectValue }}
</a-form-item>
<a-form-item label="checkbox">
<j-multi-select-tag
v-model="checkboxValue"
:options="dictOptions"
type="checkbox">
</j-multi-select-tag>
{{ checkboxValue }}
</a-form-item>
</a-form >
</template>
<script>
import JMultiSelectTag from '@/components/dict/JMultiSelectTag'
export default {
components: {JMultiSelectTag},
data() {
return {
selectValue:"",
checkboxValue:"",
dictOptions:[{
label:"选项一",
value:"1"
},{
label:"选项二",
value:"2"
},{
label:"选项三",
value:"3"
}]
}
}
}
</script>
```
# JSearchSelectTag 字典表的搜索组件
下拉搜索组件,支持异步加载,异步加载用于大数据量的字典表
## 参数配置
| 参数 | 类型 | 必填 |说明|
|--------------|---------|----|---------|
| placeholder |string | | placeholder |
| disabled |Boolean | | 是否禁用 |
| dict |string | | 表名,显示字段名,存储字段名拼接而成的字符串,如果提供了dictOptions参数 则此参数可不填|
| dictOptions |Array | | 多选项,如果dict参数未提供,可以设置此参数加载多选项 |
| async |Boolean | | 是否支持异步加载,设置成true,则通过输入的内容加载远程数据,否则在本地过滤数据,默认false|
使用示例
----
```vue
<template>
<a-form>
<a-form-item label="下拉搜索" style="width: 300px">
<j-search-select-tag
placeholder="请做出你的选择"
v-model="selectValue"
:dictOptions="dictOptions">
</j-search-select-tag>
{{ selectValue }}
</a-form-item>
<a-form-item label="异步加载" style="width: 300px">
<j-search-select-tag
placeholder="请做出你的选择"
v-model="asyncSelectValue"
dict="sys_depart,depart_name,id"
:async="true">
</j-search-select-tag>
{{ asyncSelectValue }}
</a-form-item>
</a-form >
</template>
<script>
import JSearchSelectTag from '@/components/dict/JSearchSelectTag'
export default {
components: {JSearchSelectTag},
data() {
return {
selectValue:"",
asyncSelectValue:"",
dictOptions:[{
text:"选项一",
value:"1"
},{
text:"选项二",
value:"2"
},{
text:"选项三",
value:"3"
}]
}
}
}
</script>
```
jshERP-web/src/components/dict/index.js deleted 100644 → 0
View file @ 1043ee9b
import T from './JDictSelectTag.vue'
const JDictSelectTag = {
install: function (Vue) {
Vue.component('JDictSelectTag',T);
}
}
export default JDictSelectTag;
\ No newline at end of file
jshERP-web/src/components/jeecg/JEditableTable.vue
View file @ d87f1649
......@@ -764,7 +764,6 @@
import { FormTypes, VALIDATE_NO_PASSED } from '@/utils/JEditableTableUtil'
import { cloneObject, randomString, randomNumber } from '@/utils/util'
import JDate from '@/components/jeecg/JDate'
import { initDictOptions } from '@/components/dict/JDictSelectUtil'
import { getFileAccessHttpUrl } from '@/api/manage';
import JInputPop from '@/components/jeecg/minipop/JInputPop'
import JFilePop from '@/components/jeecg/minipop/JFilePop'
......@@ -1029,9 +1028,6 @@
return {}
})
}
if (column.dictCode) {
this._loadDictConcatToOptions(column)
}
}
})
})
......@@ -2472,24 +2468,6 @@
}
},
/** 加载数据字典并合并到 options */
_loadDictConcatToOptions(column) {
initDictOptions(column.dictCode).then((res) => {
if (res && res.code == 200) {
let newOptions = (column.options || [])// .concat(res.result)
res.data.forEach(item => {
for (let option of newOptions) if (option.value === item.value) return
newOptions.push(item)
})
column.options = newOptions
} else {
console.group(`JEditableTable 查询字典(${column.dictCode})发生异常`)
console.log(res.data)
console.groupEnd()
}
})
},
/* --- common function end --- */
/* --- 以下是辅助方法，多用于动态构造页面中的数据 --- */
......
jshERP-web/src/components/jeecg/README.md
View file @ d87f1649
This diff is collapsed.
jshERP-web/src/config/router.config.js
View file @ d87f1649
......@@ -41,12 +41,7 @@ export const constantRouterMap = [
path: 'register',
name: 'register',
component: () => import(/* webpackChunkName: "user" */ '@/views/user/Register')
},
{
path: 'register-result',
name: 'registerResult',
component: () => import(/* webpackChunkName: "user" */ '@/views/user/RegisterResult')
},
}
]
},
{
......
jshERP-web/src/main.js
View file @ d87f1649
......@@ -32,7 +32,6 @@ import {
} from "@/store/mutation-types"
import config from '@/defaultSettings'
import JDictSelectTag from './components/dict/index.js'
import hasPermission from '@/utils/hasPermission'
import vueBus from '@/utils/vueBus';
import JeecgComponents from '@/components/jeecg/index'
......@@ -45,7 +44,6 @@ Vue.use(Antd)
Vue.use(VueAxios, router)
Vue.use(Viser)
Vue.use(hasPermission)
Vue.use(JDictSelectTag)
Vue.use(Print)
Vue.use(preview)
Vue.use(vueBus);
......
jshERP-web/src/mixins/OnlAutoListMixin.js deleted 100644 → 0
View file @ 1043ee9b
export const HrefJump = {
data() {
return {
fieldHrefSlots: [],
hrefComponent: {
model: {
title: '',
width: '100%',
visible: false,
destroyOnClose: true,
style: {
top: 0,
left: 0,
height: '100%',
margin: 0,
padding: 0
},
bodyStyle: { padding: '8px', height: 'calc(100vh - 108px)', overflow: 'auto', overflowX: 'hidden' },
// 隐藏掉取消按钮
cancelButtonProps: { style: { display: 'none' } },
afterClose: () => {
// 恢复body的滚动
document.body.style.overflow = null
}
},
on: {
ok: () => this.hrefComponent.model.visible = false,
cancel: () => this.hrefComponent.model.visible = false
},
is: null,
params: {},
}
}
},
methods: {
//支持链接href跳转
handleClickFieldHref(field, record) {
let href = field.href
let urlPattern = /(ht|f)tp(s?)\:\/\/[0-9a-zA-Z]([-.\w]*[0-9a-zA-Z])*(:(0-9)*)*(\/?)([a-zA-Z0-9\-\.\?\,\'\/\\\+&amp;%\$#_]*)?/
let compPattern = /\.vue(\?.*)?$/
if (typeof href === 'string') {
href = href.trim().replace(/\${([^}]+)?}/g, (s1, s2) => record[s2])
if (urlPattern.test(href)) {
window.open(href, '_blank')
} else if (compPattern.test(href)) {
this.openHrefCompModal(href)
} else {
this.$router.push(href)
}
}
},
openHrefCompModal(href) {
// 解析 href 参数
let index = href.indexOf('?')
let path = href
if (index !== -1) {
path = href.substring(0, index)
let paramString = href.substring(index + 1, href.length)
let paramArray = paramString.split('&')
let params = {}
paramArray.forEach(paramObject => {
let paramItem = paramObject.split('=')
params[paramItem[0]] = paramItem[1]
})
this.hrefComponent.params = params
} else {
this.hrefComponent.params = {}
}
this.hrefComponent.model.visible = true
this.hrefComponent.model.title = '@/views/' + path
this.hrefComponent.is = () => import('@/views/' + (path.startsWith('/')?path.slice(1):path))
// 禁止body滚动，防止滚动穿透
setTimeout(() => {
document.body.style.overflow = 'hidden'
}, 300)
},
}
}
\ No newline at end of file
jshERP-web/src/mixins/OnlineCommonUtil.js deleted 100644 → 0
View file @ 1043ee9b
import { formatDate } from '@/utils/util'
import Area from '@/components/_util/Area'
const onlUtil = {
data(){
return {
mixin_pca:''
}
},
created(){
this.mixin_pca = new Area()
},
methods:{
simpleDateFormat(millisecond, format){
return formatDate(millisecond, format)
},
getPcaText(code){
return this.mixin_pca.getText(code);
},
getPcaCode(text){
return this.mixin_pca.getCode(text)
}
}
}
export { onlUtil }
\ No newline at end of file
jshERP-web/src/views/form/advancedForm/AdvancedForm.vue deleted 100644 → 0
View file @ 1043ee9b
<template>
<div>
<a-card class="card" title="仓库管理" :bordered="false">
<repository-form ref="repository" :showSubmit="false" />
</a-card>
<a-card class="card" title="任务管理" :bordered="false">
<task-form ref="task" :showSubmit="false" />
</a-card>
<!-- table -->
<a-card>
<form :autoFormCreate="(form) => this.form = form">
<a-table
:columns="columns"
:dataSource="data"
:pagination="false"
>
<template v-for="(col, i) in ['name', 'workId', 'department']" :slot="col" slot-scope="text, record, index">
<a-input
:key="col"
v-if="record.editable"
style="margin: -5px 0"
:value="text"
:placeholder="columns[i].title"
@change="e => handleChange(e.target.value, record.key, col)"
/>
<template v-else>{{ text }}</template>
</template>
<template slot="operation" slot-scope="text, record, index">
<template v-if="record.editable">
<span v-if="record.isNew">
<a @click="saveRow(record.key)">添加</a>
<a-divider type="vertical" />
<a-popconfirm title="是否要删除此行？" @confirm="remove(record.key)">
<a>删除</a>
</a-popconfirm>
</span>
<span v-else>
<a @click="saveRow(record.key)">保存</a>
<a-divider type="vertical" />
<a @click="cancel(record.key)">取消</a>
</span>
</template>
<span v-else>
<a @click="toggle(record.key)">编辑</a>
<a-divider type="vertical" />
<a-popconfirm title="是否要删除此行？" @confirm="remove(record.key)">
<a>删除</a>
</a-popconfirm>
</span>
</template>
</a-table>
<a-button style="width: 100%; margin-top: 16px; margin-bottom: 8px" type="dashed" icon="plus" @click="newMember">新增成员</a-button>
</form>
</a-card>
<!-- fixed footer toolbar -->
<footer-tool-bar>
<a-button type="primary" @click="validate" :loading="loading">提交</a-button>
</footer-tool-bar>
</div>
</template>
<script>
import RepositoryForm from './RepositoryForm'
import TaskForm from './TaskForm'
import FooterToolBar from '@/components/tools/FooterToolBar'
export default {
name: "AdvancedForm",
components: {
FooterToolBar,
RepositoryForm,
TaskForm
},
data () {
return {
description: '高级表单常见于一次性输入和提交大批量数据的场景。',
loading: false,
// table
columns: [
{
title: '成员姓名',
dataIndex: 'name',
key: 'name',
width: '20%',
scopedSlots: { customRender: 'name' }
},
{
title: '工号',
dataIndex: 'workId',
key: 'workId',
width: '20%',
scopedSlots: { customRender: 'workId' }
},
{
title: '所属部门',
dataIndex: 'department',
key: 'department',
width: '40%',
scopedSlots: { customRender: 'department' }
},
{
title: '操作',
key: 'action',
scopedSlots: { customRender: 'operation' }
}
],
data: [
{
key: '1',
name: '小明',
workId: '001',
editable: false,
department: '行政部'
},
{
key: '2',
name: '李莉',
workId: '002',
editable: false,
department: 'IT部'
},
{
key: '3',
name: '王小帅',
workId: '003',
editable: false,
department: '财务部'
}
]
}
},
methods: {
handleSubmit (e) {
e.preventDefault()
},
newMember () {
this.data.push({
key: '-1',
name: '',
workId: '',
department: '',
editable: true,
isNew: true
})
},
remove (key) {
const newData = this.data.filter(item => item.key !== key)
this.data = newData
},
saveRow (key) {
let target = this.data.filter(item => item.key === key)[0]
target.editable = false
target.isNew = false
},
toggle (key) {
let target = this.data.filter(item => item.key === key)[0]
target.editable = !target.editable
},
getRowByKey (key, newData) {
const data = this.data
return (newData || data).filter(item => item.key === key)[0]
},
cancel (key) {
let target = this.data.filter(item => item.key === key)[0]
target.editable = false
},
handleChange (value, key, column) {
const newData = [...this.data]
const target = newData.filter(item => key === item.key)[0]
if (target) {
target[column] = value
this.data = newData
}
},
// 最终全页面提交
validate () {
this.$refs.repository.form.validateFields((err, values) => {
if (!err) {
this.$notification['error']({
message: 'Received values of form:',
description: values
})
}
})
this.$refs.task.form.validateFields((err, values) => {
if (!err) {
this.$notification['error']({
message: 'Received values of form:',
description: values
})
}
})
}
}
}
</script>
<style lang="less" scoped>
.card{
margin-bottom: 24px;
}
</style>
\ No newline at end of file
jshERP-web/src/views/form/advancedForm/RepositoryForm.vue deleted 100644 → 0
View file @ 1043ee9b
<template>
<a-form @submit="handleSubmit" :form="form" class="form">
<a-row class="form-row" :gutter="16">
<a-col :lg="6" :md="12" :sm="24">
<a-form-item label="仓库名">
<a-input
placeholder="请输入仓库名称"
v-decorator="[
'repository.name',
{rules: [{ required: true, message: '请输入仓库名称', whitespace: true}]}
]" />
</a-form-item>
</a-col>
<a-col :xl="{span: 7, offset: 1}" :lg="{span: 8}" :md="{span: 12}" :sm="24">
<a-form-item
label="仓库域名">
<a-input
addonBefore="http://"
addonAfter=".com"
placeholder="请输入"
v-decorator="[
'repository.domain',
{rules: [{ required: true, message: '请输入仓库域名', whitespace: true}, {validator: validate}]}
]" />
</a-form-item>
</a-col>
<a-col :xl="{span: 9, offset: 1}" :lg="{span: 10}" :md="{span: 24}" :sm="24">
<a-form-item
label="仓库管理员">
<a-select placeholder="请选择管理员" v-decorator="[ 'repository.manager', {rules: [{ required: true, message: '请选择管理员'}]} ]">
<a-select-option value="王同学">王同学</a-select-option>
<a-select-option value="李同学">李同学</a-select-option>
<a-select-option value="黄同学">黄同学</a-select-option>
</a-select>
</a-form-item>
</a-col>
</a-row>
<a-row class="form-row" :gutter="16">
<a-col :lg="6" :md="12" :sm="24">
<a-form-item
label="审批人">
<a-select placeholder="请选择审批员" v-decorator="[ 'repository.auditor', {rules: [{ required: true, message: '请选择审批员'}]} ]">
<a-select-option value="王晓丽">王晓丽</a-select-option>
<a-select-option value="李军">李军</a-select-option>
</a-select>
</a-form-item>
</a-col>
<a-col :xl="{span: 7, offset: 1}" :lg="{span: 8}" :md="{span: 12}" :sm="24">
<a-form-item
label="生效日期">
<a-range-picker
style="width: 100%"
v-decorator="[
'repository.effectiveDate',
{rules: [{ required: true, message: '请选择生效日期'}]}
]" />
</a-form-item>
</a-col>
<a-col :xl="{span: 9, offset: 1}" :lg="{span: 10}" :md="{span: 24}" :sm="24">
<a-form-item
label="仓库类型">
<a-select
placeholder="请选择仓库类型"
v-decorator="[
'repository.type',
{rules: [{ required: true, message: '请选择仓库类型'}]}
]" >
<a-select-option value="公开">公开</a-select-option>
<a-select-option value="私密">私密</a-select-option>
</a-select>
</a-form-item>
</a-col>
</a-row>
<a-form-item v-if="showSubmit">
<a-button htmlType="submit" >Submit</a-button>
</a-form-item>
</a-form>
</template>
<script>
export default {
name: "RepositoryForm",
props: {
showSubmit: {
type: Boolean,
default: false
}
},
data () {
return {
form: this.$form.createForm(this)
}
},
methods: {
handleSubmit (e) {
e.preventDefault()
this.form.validateFields((err, values) => {
if (!err) {
this.$notification['error']({
message: 'Received values of form:',
description: values
})
}
})
},
validate (rule, value, callback) {
const regex = /^user-(.*)$/
if (!regex.test(value)) {
callback('需要以 user- 开头')
}
callback()
}
}
}
</script>
<style scoped>
</style>
\ No newline at end of file
jshERP-web/src/views/form/advancedForm/TaskForm.vue deleted 100644 → 0
View file @ 1043ee9b
<template>
<a-form @submit="handleSubmit" :form="form" class="form">
<a-row class="form-row" :gutter="16">
<a-col :lg="6" :md="12" :sm="24">
<a-form-item
label="任务名">
<a-input placeholder="请输入任务名称" v-decorator="[ 'task.name', {rules: [{ required: true, message: '请输入任务名称', whitespace: true}]} ]" />
</a-form-item>
</a-col>
<a-col :xl="{span: 7, offset: 1}" :lg="{span: 8}" :md="{span: 12}" :sm="24">
<a-form-item
label="任务描述">
<a-input placeholder="请输入任务描述" v-decorator="[ 'task.description', {rules: [{ required: true, message: '请输入任务描述', whitespace: true}]} ]" />
</a-form-item>
</a-col>
<a-col :xl="{span: 9, offset: 1}" :lg="{span: 10}" :md="{span: 24}" :sm="24">
<a-form-item
label="执行人">
<a-select
placeholder="请选择执行人"
v-decorator="[
'task.executor',
{rules: [{ required: true, message: '请选择执行人'}]}
]" >
<a-select-option value="黄丽丽">黄丽丽</a-select-option>
<a-select-option value="李大刀">李大刀</a-select-option>
</a-select>
</a-form-item>
</a-col>
</a-row>
<a-row class="form-row" :gutter="16">
<a-col :lg="6" :md="12" :sm="24">
<a-form-item
label="责任人">
<a-select
placeholder="请选择责任人"
v-decorator="[
'task.manager',
{rules: [{ required: true, message: '请选择责任人'}]}
]" >
<a-select-option value="王伟">王伟</a-select-option>
<a-select-option value="李红军">李红军</a-select-option>
</a-select>
</a-form-item>
</a-col>
<a-col :xl="{span: 7, offset: 1}" :lg="{span: 8}" :md="{span: 12}" :sm="24">
<a-form-item
label="提醒时间">
<a-time-picker
style="width: 100%"
v-decorator="[
'task.time',
{rules: [{ required: true, message: '请选择提醒时间'}]}
]" />
</a-form-item>
</a-col>
<a-col :xl="{span: 9, offset: 1}" :lg="{span: 10}" :md="{span: 24}" :sm="24">
<a-form-item
label="任务类型">
<a-select
placeholder="请选择任务类型"
v-decorator="[ 'task.type', {rules: [{ required: true, message: '请选择任务类型'}]} ]" >
<a-select-option value="定时执行">定时执行</a-select-option>
<a-select-option value="周期执行">周期执行</a-select-option>
</a-select>
</a-form-item>
</a-col>
</a-row>
<a-form-item v-if="showSubmit">
<a-button htmlType="submit" >Submit</a-button>
</a-form-item>
</a-form>
</template>
<script>
export default {
name: "TaskForm",
props: {
showSubmit: {
type: Boolean,
default: false
}
},
data () {
return {
form: this.$form.createForm(this)
}
},
methods: {
handleSubmit (e) {
e.preventDefault()
this.form.validateFields((err, values) => {
if (!err) {
this.$notification['error']({
message: 'Received values of form:',
description: values
})
}
})
}
}
}
</script>
<style scoped>
</style>
\ No newline at end of file
jshERP-web/src/views/form/stepForm/Step1.vue deleted 100644 → 0
View file @ 1043ee9b
<template>
<div>
<a-form style="max-width: 500px; margin: 40px auto 0;">
<a-form-item
label="付款账户"
:labelCol="{span: 5}"
:wrapperCol="{span: 19}"
>
<a-select value="1" placeholder="ant-design@alipay.com">
<a-select-option value="1">ant-design@alipay.com</a-select-option>
</a-select>
</a-form-item>
<a-form-item
label="收款账户"
:labelCol="{span: 5}"
:wrapperCol="{span: 19}"
>
<a-input-group :compact="true" style="display: inline-block; vertical-align: middle">
<a-select defaultValue="alipay" style="width: 100px">
<a-select-option value="alipay">支付宝</a-select-option>
<a-select-option value="wexinpay">微信</a-select-option>
</a-select>
<a-input :style="{width: 'calc(100% - 100px)'}" value="test@example.com"/>
</a-input-group>
</a-form-item>
<a-form-item
label="收款人姓名"
:labelCol="{span: 5}"
:wrapperCol="{span: 19}"
>
<a-input value="Alex" />
</a-form-item>
<a-form-item
label="转账金额"
:labelCol="{span: 5}"
:wrapperCol="{span: 19}"
>
<a-input prefix="￥" value="5000" />
</a-form-item>
<a-form-item :wrapperCol="{span: 19, offset: 5}">
<a-button type="primary" @click="nextStep">下一步</a-button>
</a-form-item>
</a-form>
</div>
</template>
<script>
export default {
name: "Step1",
methods: {
nextStep () {
this.$emit('nextStep')
}
}
}
</script>
<style scoped>
</style>
\ No newline at end of file
jshERP-web/src/views/form/stepForm/Step2.vue deleted 100644 → 0
View file @ 1043ee9b
<template>
<div>
<a-form style="max-width: 500px; margin: 40px auto 0;">
<a-alert
:closable="true"
message="确认转账后，资金将直接打入对方账户，无法退回。"
style="margin-bottom: 24px;"
/>
<a-form-item
label="付款账户"
:labelCol="{span: 5}"
:wrapperCol="{span: 19}"
class="stepFormText"
>
ant-design@alipay.com
</a-form-item>
<a-form-item
label="收款账户"
:labelCol="{span: 5}"
:wrapperCol="{span: 19}"
class="stepFormText"
>
test@example.com
</a-form-item>
<a-form-item
label="收款人姓名"
:labelCol="{span: 5}"
:wrapperCol="{span: 19}"
class="stepFormText"
>
Alex
</a-form-item>
<a-form-item
label="转账金额"
:labelCol="{span: 5}"
:wrapperCol="{span: 19}"
class="stepFormText"
>
￥ 5,000.00
</a-form-item>
<a-form-item :wrapperCol="{span: 19, offset: 5}">
<a-button :loading="loading" type="primary" @click="nextStep">提交</a-button>
<a-button style="margin-left: 8px" @click="prevStep">上一步</a-button>
</a-form-item>
</a-form>
</div>
</template>
<script>
export default {
name: "Step2",
data () {
return {
loading: false
}
},
methods: {
nextStep () {
let that = this
that.loading = true
setTimeout(function () {
that.$emit('nextStep')
}, 1500)
},
prevStep () {
this.$emit('prevStep')
}
}
}
</script>
<style lang="less" scoped>
.stepFormText {
margin-bottom: 24px;
.ant-form-item-label,
.ant-form-item-control {
line-height: 22px;
}
}
</style>
\ No newline at end of file
jshERP-web/src/views/form/stepForm/Step3.vue deleted 100644 → 0
View file @ 1043ee9b
<template>
<div>
<a-form style="margin: 40px auto 0;">
<result title="操作成功" :is-success="true" description="预计两小时内到账">
<div class="information">
<a-row>
<a-col :sm="8" :xs="24">付款账户：</a-col>
<a-col :sm="16" :xs="24">ant-design@alipay.com</a-col>
</a-row>
<a-row>
<a-col :sm="8" :xs="24">收款账户：</a-col>
<a-col :sm="16" :xs="24">test@example.com</a-col>
</a-row>
<a-row>
<a-col :sm="8" :xs="24">收款人姓名：</a-col>
<a-col :sm="16" :xs="24">辉夜</a-col>
</a-row>
<a-row>
<a-col :sm="8" :xs="24">转账金额：</a-col>
<a-col :sm="16" :xs="24"><span class="money">500</span> 元</a-col>
</a-row>
</div>
<div slot="action">
<a-button type="primary" @click="finish">再转一笔</a-button>
<a-button style="margin-left: 8px" @click="toOrderList">查看账单</a-button>
</div>
</result>
</a-form>
</div>
</template>
<script>
import Result from '../../result/Result'
export default {
name: "Step3",
components: {
Result
},
data () {
return {
loading: false
}
},
methods: {
finish () {
this.$emit('finish')
},
toOrderList () {
this.$router.push('/list/query-list')
}
}
}
</script>
<style lang="less" scoped>
.information {
line-height: 22px;
.ant-row:not(:last-child) {
margin-bottom: 24px;
}
}
.money {
font-family: "Helvetica Neue",sans-serif;
font-weight: 500;
font-size: 20px;
line-height: 14px;
}
</style>
\ No newline at end of file
jshERP-web/src/views/form/stepForm/StepForm.vue deleted 100644 → 0
View file @ 1043ee9b
<template>
<a-card :bordered="false">
<a-steps class="steps" :current="currentTab">
<a-step title="填写转账信息" />
<a-step title="确认转账信息" />
<a-step title="完成" />
</a-steps>
<div class="content">
<step1 v-if="currentTab === 0" @nextStep="nextStep"/>
<step2 v-if="currentTab === 1" @nextStep="nextStep" @prevStep="prevStep"/>
<step3 v-if="currentTab === 2" @prevStep="prevStep" @finish="finish"/>
</div>
</a-card>
</template>
<script>
import Step1 from './Step1'
import Step2 from './Step2'
import Step3 from './Step3'
export default {
name: "StepForm",
components: {
Step1,
Step2,
Step3
},
data () {
return {
description: '将一个冗长或用户不熟悉的表单任务分成多个步骤，指导用户完成。',
currentTab: 0,
// form
form: null,
}
},
methods: {
// handler
nextStep () {
if (this.currentTab < 2) {
this.currentTab += 1
}
},
prevStep () {
if (this.currentTab > 0) {
this.currentTab -= 1
}
},
finish () {
this.currentTab = 0
}
}
}
</script>
<style lang="less" scoped>
.steps {
max-width: 750px;
margin: 16px auto;
}
</style>
\ No newline at end of file
Supports Markdown
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