Browse Source

门类管理

master
z_yu 3 years ago
parent
commit
6d55b92582
  1. 8
      src/api/category/fieldManage.js
  2. 83
      src/views/category/descriptionPreview/index.vue
  3. 12
      src/views/category/fieldManage/module/form.vue
  4. 81
      src/views/components/category/SettingForm.vue
  5. 2
      src/views/components/field/module/form.vue

8
src/api/category/fieldManage.js

@ -2,9 +2,9 @@ import request from '@/utils/request'
export function add(data) {
if (data.isDataType === 1) {
data.isDataTypeDetail = 'varchar'
data.isDataTypeDetails = 'varchar'
} else if (data.isDataType === 2) {
data.isDataTypeDetail = 'int'
data.isDataTypeDetails = 'int'
}
return request({
url: 'api/archives-type/create-dic',
@ -24,9 +24,9 @@ export function del(ids) {
export function edit(data) {
if (data.isDataType === 1) {
data.isDataTypeDetail = 'varchar'
data.isDataTypeDetails = 'varchar'
} else if (data.isDataType === 2) {
data.isDataTypeDetail = 'int'
data.isDataTypeDetails = 'int'
}
return request({
url: 'api/archives-type/update',

83
src/views/category/descriptionPreview/index.vue

@ -101,16 +101,19 @@ export default {
getArchivesType() {
FetchArchivesTypeManage({ categoryId: this.selectedCategory.id }).then(res => {
this.allFieldsData = res
console.log(this.allFieldsData)
this.allFieldsData.forEach((item, index) => {
// null
item.dictionaryConfigId = item.dictionaryConfigId || { name: null }
if (item.isInput) {
console.log(item)
// this.fieldsActive = index
// this.thisFields = arr[this.fieldsActive]
return
}
item.dictionaryConfigId = item.dictionaryConfigId || { dicName: '', id: null }
// if (item.isInput) {
// console.log(item)
// this.fieldsActive = index
// this.thisFields = arr[this.fieldsActive]
// return
// }
})
this.thisFields = this.allFieldsData.find((item) => { return item.isInput })
this.fieldsActive = this.allFieldsData.findIndex((item) => { return item.isInput })
})
},
handleClose(done) {
@ -139,20 +142,20 @@ export default {
}
</script>
<style lang="scss" scoped>
.category-main{
.category-main {
display: flex;
justify-content: flex-start;
padding: 20px;
.des-preview-left,
.des-preview-right{
.des-preview-right {
height: calc(100vh - 274px);
padding-right: 10px;
overflow-y: auto;
}
.des-preview-left{
.des-preview-left {
flex: 1;
}
.des-title{
.des-title {
position: relative;
height: 28px;
margin-bottom: 10px;
@ -161,28 +164,34 @@ export default {
font-weight: bold;
color: #fff;
cursor: pointer;
p{
p {
position: absolute;
left: 46px;
top: 0;
line-height: 28px;
background-image: -webkit-gradient(linear, 0 0, 0 bottom, from(rgba(255, 255, 255, 1)), to(rgba(46, 143, 237, 1)));
background-image: -webkit-gradient(
linear,
0 0,
0 bottom,
from(rgba(255, 255, 255, 1)),
to(rgba(46, 143, 237, 1))
);
background-clip: text;
-webkit-text-fill-color: transparent;
z-index: 2;
i{
i {
font-size: 16px;
margin-left: 6px;
background-image: none;
-webkit-text-fill-color: #fff;
transition: all ease-in .5s;
&.arrow-up{
transform:rotate(180deg);
transition: all ease-in 0.5s;
&.arrow-up {
transform: rotate(180deg);
}
}
}
&::before{
content:"";
&::before {
content: "";
position: absolute;
left: 0;
top: 0;
@ -193,22 +202,22 @@ export default {
z-index: 1;
}
}
.des-fields{
.des-fields {
display: flex;
flex-wrap: wrap;
margin-bottom: 30px;
margin-left: 1px;
li{
li {
width: 100px;
height: 40px;
line-height: 40px;
margin: -1px 0 0 -1px;
font-size: 14px;
text-align: center;
color: #3A99FD;
border: 1px solid #339CFF;
color: #3a99fd;
border: 1px solid #339cff;
cursor: pointer;
p{
p {
overflow: hidden;
text-overflow: ellipsis;
display: -webkit-box;
@ -216,34 +225,34 @@ export default {
-webkit-line-clamp: 1;
}
&:hover,
&.fields-active{
&.fields-active {
color: #fff;
background-color: #02255F;
background-color: #02255f;
}
}
}
.des-set-btn{
.des-set-btn {
text-align: right;
.el-button{
background-color: #3A99FD;
.el-button {
background-color: #3a99fd;
}
.des-set-sort{
::v-deep .iconfont{
.des-set-sort {
::v-deep .iconfont {
line-height: 0 !important;
}
::v-deep span{
::v-deep span {
margin-left: 5px;
}
}
}
.des-preview-right{
.des-preview-right {
width: 658px;
margin-left: 20px;
}
.edit-form-dialog{
::v-deep .el-dialog{
.el-input.is-disabled .el-input__inner{
.edit-form-dialog {
::v-deep .el-dialog {
.el-input.is-disabled .el-input__inner {
color: #fff;
}
.el-input-number.is-controls-right {
@ -252,7 +261,7 @@ export default {
}
}
.drag-tip{
.drag-tip {
display: block;
padding-left: 20px;
padding-bottom: 10px;

12
src/views/category/fieldManage/module/form.vue

@ -60,18 +60,6 @@ export default {
data() {
return {
}
},
methods: {
submitForm(formName) {
this.$refs[formName].validate((valid) => {
if (valid) {
alert('submit!')
} else {
console.log('error submit!!')
return false
}
})
}
}
}
</script>

81
src/views/components/category/SettingForm.vue

@ -7,7 +7,7 @@
<el-input v-model="form.fieldCnName" :disabled="isDisabled" />
</el-form-item>
<el-form-item v-if="!isDisabled" label="字段标识" prop="fieldName">
<el-form-item v-if="!isDisabled" label="字段标识" prop="fieldName" :inline-message="true">
<el-input v-if="isDisabled" v-model="form.fieldName" readonly />
<el-input v-else v-model="form.fieldName" :disabled="!isAdd" />
</el-form-item>
@ -34,7 +34,7 @@
<el-form-item label="对应字典" prop="dictionaryConfigId">
<el-input v-if="isDisabled" v-model="form.dictionaryConfigId.dicName" readonly />
<!-- @change="selectDictionary" -->
<el-select v-else v-model="form.dictionaryConfigId.id" placeholder="" value-key="id">
<el-select v-else v-model="form.dictionaryConfigId.id" placeholder="" value-key="id" :disabled="form.isInputClass !== 'select' && form.isInputClass !== 'popover'">
<el-option v-for="item in dictionaryData" :key="item.id" :label="item.dicName" :value="item.id" />
</el-select>
</el-form-item>
@ -116,13 +116,37 @@ export default {
}
}
var checkFieldName = (rule, value, callback) => {
const reg = /^[A-Za-z][A-Za-z_]+[a-zA-Z]*$/
const reg = /^[A-Za-z][A-Za-z_]]*[a-zA-Z]*$/
if (reg.test(value)) {
callback()
} else {
callback(new Error('字段标识只能由字母、字符“_”组成,并且必须以字母开头和结尾'))
}
}
//
var checkEditLength = (rule, value, callback) => {
if (this.form.editLength && this.form.editLength > 510) {
callback(new Error('显示长度最大510'))
} else {
callback()
}
}
//
var checkDictionaryConfigId = (rule, value, callback) => {
if ((this.form.isInputClass === 'select' || this.form.isInputClass === 'popover') && !this.form.dictionaryConfigId.id) {
callback(new Error('对应字典项不可为空!'))
} else {
callback()
}
}
// ''
var checkFillingDigit = (rule, value, callback) => {
if (this.form.isFilling && !this.form.fillingDigit) {
callback(new Error('请填写位数!'))
} else {
callback()
}
}
var getRules = () => {
const rules = {
fieldCnName: [
@ -137,6 +161,15 @@ export default {
],
isColumnLength: [
{ validator: checkMaxLength, trigger: 'blur' }
],
editLength: [
{ validator: checkEditLength, trigger: 'blur' }
],
dictionaryConfigId: [
{ validator: checkDictionaryConfigId, trigger: 'blur' }
],
fillingDigit: [
{ validator: checkFillingDigit, trigger: 'blur' }
]
}
if (this.isDisabled) {
@ -300,27 +333,27 @@ export default {
}
},
submitForm(formName) {
//
if (this.form.isInputClass === 'select' || this.form.isInputClass === 'popover') {
if (!this.form.dictionaryConfigId.id) {
this.$message.error('对应字典项不可为空!')
return
}
}
// ''
if (this.form.isFilling) {
if (!this.form.fillingDigit) {
this.$message.error('请填写位数!')
return
}
}
//
if (this.form.editLength) {
if (this.form.editLength > 510) {
this.$message.error('显示长度最大510')
return
}
}
// //
// if (this.form.isInputClass === 'select' || this.form.isInputClass === 'popover') {
// if (!this.form.dictionaryConfigId.id) {
// this.$message.error('')
// return
// }
// }
// // ''
// if (this.form.isFilling) {
// if (!this.form.fillingDigit) {
// this.$message.error('')
// return
// }
// }
// //
// if (this.form.editLength) {
// if (this.form.editLength > 510) {
// this.$message.error('510')
// return
// }
// }
this.$refs[formName].validate((valid) => {
if (valid) {
alert('submit!')

2
src/views/components/field/module/form.vue

@ -62,7 +62,7 @@ export default {
}
}
var checkFieldName = (rule, value, callback) => {
const reg = /^[A-Za-z][A-Za-z_]+[a-zA-Z]*$/
const reg = /^[A-Za-z][A-Za-z_]]*[a-zA-Z]*$/
if (reg.test(value)) {
callback()
} else {

Loading…
Cancel
Save