Skip to content

bdc / bdcdj-web

Go to a project
Toggle navigation
Toggle navigation pinning
afe73a7d by 任超
Options

style:字典

1 parent 6dbd007b
Inline Side-by-side
Showing 6 changed files with 115 additions and 28 deletions
......@@ -5,4 +5,4 @@ NODE_ENV=development
VUE_APP_BASE_API = '/dev-api'
# 开发环境
VUE_APP_API_BASE_URL = 'http://192.168.2.88:8009'
VUE_APP_API_BASE_URL = 'http://192.168.2.95:8009'
......
......@@ -8,4 +8,20 @@ export function getAllDict () {
method: 'post'
})
}
export function getQlxxDictList (data) {
return request({
url: '/sys/dict/getQlxxDictList',
method: 'post',
data
})
}
// 获取字典子级列表
export function getChildDictList (bsmDict) {
return request({
url: '/sys/dict/getChildDictList',
method: 'get',
params: {
bsmDict: bsmDict
}
})
}
\ No newline at end of file
......
......@@ -323,3 +323,34 @@ aside {
background-color: #fff;
cursor: not-allowed
}
.allow,
.prohibit {
position: relative;
width: 60px;
margin: 0 auto;
}
.allow::before {
content: '';
position: absolute;
left: 5px;
top: 45%;
background-color: $green;
display: inline-block; // 此句为css样式展示重点🏁
width: 5px;
height: 5px;
border-radius: 50%;
}
.prohibit::before {
content: '';
position: absolute;
left: 5px;
top: 45%;
background-color: $pink;
display: inline-block; // 此句为css样式展示重点🏁
width: 5px;
height: 5px;
border-radius: 50%;
}
\ No newline at end of file
......
<template>
<!-- 编辑 -->
<dialogBox submitForm="submitForm" @closeDialog="closeDialog" v-model="myValue" title="字典信息">
<dialogBox submitForm="submitForm" @closeDialog="closeDialog" v-model="myValue" :isSave="!details.isenable == 2"
title="字典信息">
<el-form :model="ruleForm" :rules="rules" ref="ruleForm" label-width="120px">
<el-row :gutter="20">
<el-col :span="12">
......@@ -15,7 +16,7 @@
</el-col>
</el-row>
</el-form>
<lb-table :column="column" :heightNum="520" :key="key" :expand-row-keys="keyList" row-key="dictid"
<lb-table :column="column" :heightNum="500" :key="key" :expand-row-keys="keyList" row-key="bsmDict"
:tree-props="{ children: 'children' }" :pagination="false" :data="tableData">
</lb-table>
</dialogBox>
......@@ -25,6 +26,10 @@
export default {
props: {
value: { type: Boolean, default: false },
details: {
type: Object,
default: {}
}
},
data () {
return {
......@@ -39,7 +44,13 @@ export default {
{
width: '60',
renderHeader: (h, scope) => {
return <i class="el-icon-plus" onClick={() => { this.handleAdd() }} style="cursor:pointer;color:#409EFF"></i>
return (<div>
{
this.details.isenable == 2 ?
<span>序号</span> :
<i class="el-icon-plus" onClick={() => { this.handleAdd() }} style="cursor:pointer;color:#409EFF"></i>
}
</div>)
},
render: (h, scope) => {
return (
......@@ -53,12 +64,12 @@ export default {
render: (h, scope) => {
return (
<div>
<el-input placeholder="字典项编码" v-show={scope.row.codeShow} v-fo value={scope.row[scope.column.property]}
<el-input placeholder="字典项编码" disabled={this.details.isenable == 2} v-show={scope.row.codeShow} v-fo value={scope.row[scope.column.property]}
onFocus={() => { this.itemShowFalse(); scope.row.codeShow = true; }}
onInput={(val) => { scope.row[scope.column.property] = val }}></el-input>
<el-input placeholder="字典项编码" v-show={!scope.row.codeShow} value={scope.row[scope.column.property]}
<el-input placeholder="字典项编码" disabled={this.details.isenable == 2} v-show={!scope.row.codeShow} value={scope.row[scope.column.property]}
onFocus={() => { this.itemShowFalse(); scope.row.codeShow = true; }}
onInput={(val) => { scope.row[scope.column.property] = val }}></el-input>
</div>
......@@ -71,11 +82,11 @@ export default {
render: (h, scope) => {
return (
<div>
<el-input placeholder="字典项编码" v-show={scope.row.nameShow} v-fo value={scope.row[scope.column.property]}
<el-input placeholder="字典项编码" disabled={this.details.isenable == 2} v-show={scope.row.nameShow} v-fo value={scope.row[scope.column.property]}
onFocus={() => { this.itemShowFalse(); scope.row.nameShow = true; }}
onInput={(val) => { scope.row[scope.column.property] = val }}></el-input>
<el-input placeholder="字典项名称" v-show={!scope.row.nameShow} value={scope.row[scope.column.property]}
<el-input placeholder="字典项名称" disabled={this.details.isenable == 2} v-show={!scope.row.nameShow} value={scope.row[scope.column.property]}
onFocus={() => { this.itemShowFalse(); scope.row.nameShow = true; }}
onInput={(val) => { scope.row[scope.column.property] = val }}></el-input>
</div>
......@@ -115,6 +126,16 @@ export default {
watch: {
value (val) {
this.myValue = val
},
details: {
handler: function (newValue) {
this.tableData = newValue.dataList
if (newValue.isenable == 2) {
this.column = this.column.slice(0, 3)
}
this.addIndexes()
},
deep: true
}
},
methods: {
......
......@@ -23,20 +23,24 @@ class data extends filter {
}
},
{
prop: "zdlxbm",
prop: "dcode",
label: "字典类型编码",
},
{
prop: "zdlxmc",
prop: "dname",
label: "字典类型名称",
},
{
prop: "sfyxxg",
label: "是否允许修改",
width: '150',
render: (h, scope) => {
return (
<div>
{scope.row.sfyxxg}
{
scope.row.sfyxxg == '1' ?
<div class='allow'>允许</div> :
<div class='prohibit'>禁止</div>
}
</div>
)
}
......@@ -49,7 +53,11 @@ class data extends filter {
render: (h, scope) => {
return (
<div>
<el-button type="text" icon="el-icon-edit-outline" onClick={() => { vm.editClick(scope) }}>修改</el-button>
{
scope.row.sfyxxg == '1' ?
<el-button type="text" icon="el-icon-edit-outline" onClick={() => { vm.editClick(scope.row, 1) }}>修改</el-button> :
<el-button type="text" icon="el-icon-view" onClick={() => { vm.editClick(scope.row, 2) }}>查看</el-button>
}
</div>
)
}
......
......@@ -2,21 +2,21 @@
<div class="from-clues">
<!-- 表单部分 -->
<div class="from-clues-header">
<el-form :model="ruleForm" ref="ruleForm">
<el-form :model="ruleForm">
<el-row>
<el-col :span="6">
<el-form-item label="字典类型编码">
<el-input v-model="ruleForm.zdlxbm" placeholder="字典类型编码"></el-input>
<el-input v-model="ruleForm.dcode" placeholder="字典类型编码"></el-input>
</el-form-item>
</el-col>
<el-col :span="6">
<el-form-item label="字典类型名称">
<el-input v-model="ruleForm.zdlxmc" placeholder="字典类型名称"></el-input>
<el-input v-model="ruleForm.dname" placeholder="字典类型名称"></el-input>
</el-form-item>
</el-col>
<el-col :span="12" class="btnCol">
<el-form-item>
<el-button type="primary" @click="fetchData()">查询</el-button>
<el-button type="primary" @click="fetchData">查询</el-button>
<el-button @click="moreQueryClick()">高级查询</el-button>
</el-form-item>
</el-col>
......@@ -30,11 +30,12 @@
:data="tableData.data">
</lb-table>
</div>
<editDialog v-model="isDialog" />
<editDialog v-model="isDialog" :details="details" />
</div>
</template>
<script>
import table from "@/utils/mixin/table"
import { getQlxxDictList, getChildDictList } from "@/api/dict.js"
import { datas, sendThis } from "./dictionaries"
import editDialog from "./components/editDialog.vue"
export default {
......@@ -49,30 +50,40 @@ export default {
data () {
return {
isDialog: false,
details: {
dataList: [],
isenable: 1
},
ruleForm: {
zdlxbm: '',
zdlxmc: ''
dcode: '',
dname: ''
},
tableData: {
total: 0,
columns: datas.columns(),
data: [
{
zdlxbm: "66666666666666",
}
]
data: []
}
}
},
methods: {
// 初始化数据
fetchData () {
getQlxxDictList({ ...this.ruleForm, ...this.pageData }).then(res => {
let { records, total } = res.result
this.tableData.data = records
this.tableData.total = total
})
},
moreQueryClick () { },
editClick () {
editClick (row, val) {
this.details.isenable = val
getChildDictList(row.bsmDict).then(res => {
this.isDialog = true
let { result } = res
this.details.dataList = result
})
}
}
},
};
</script>
<style scoped lang="scss">
......