|
|
@@ -1,9 +1,159 @@
|
|
|
<template>
|
|
|
- <div>1111</div>
|
|
|
+ <div class="hc-system-announcement-box">
|
|
|
+ <div class="classify-card">
|
|
|
+ <div class="card-body">
|
|
|
+ <div class="card-main">
|
|
|
+ <div class="header">
|
|
|
+ <div class="title">系统分类</div>
|
|
|
+ <div class="extra">
|
|
|
+ <el-button icon="el-icon-plus" size="mini" type="primary" @click="addSystemClick"></el-button>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div class="content">
|
|
|
+ <el-menu :default-active="systemClassify" class="classify-data" @select="systemClassifySelect">
|
|
|
+ <el-submenu index="1">
|
|
|
+ <div slot="title">
|
|
|
+ <div @contextmenu.prevent="editSystemClick($event, '1')">电子档案系统</div>
|
|
|
+ </div>
|
|
|
+ <el-menu-item index="1-1" @contextmenu.native.prevent="editSystemClick($event, '1-1')">质检系统</el-menu-item>
|
|
|
+ <el-menu-item index="1-2" @contextmenu.native.prevent="editSystemClick($event, '1-2')">档案系统</el-menu-item>
|
|
|
+ <el-menu-item index="1-3" @contextmenu.native.prevent="editSystemClick($event, '1-3')">计量系统</el-menu-item>
|
|
|
+ </el-submenu>
|
|
|
+ <el-submenu index="2">
|
|
|
+ <div slot="title">
|
|
|
+ <div @contextmenu.prevent="editSystemClick($event, '2')">规发中心</div>
|
|
|
+ </div>
|
|
|
+ <el-menu-item index="2-1" @contextmenu.native.prevent="editSystemClick($event, '2-1')">数据分析系统</el-menu-item>
|
|
|
+ </el-submenu>
|
|
|
+ </el-menu>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div class="data-card">
|
|
|
+ <div class="card-body">
|
|
|
+ <div class="card-main">222</div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <!--新增/编辑 系统-->
|
|
|
+ <el-dialog
|
|
|
+ class="hc-system-announcement-dialog"
|
|
|
+ :title="`${systemInfoData.id?'编辑':'新增'}系统`"
|
|
|
+ :visible.sync="isSystemInfoShow"
|
|
|
+ append-to-body center
|
|
|
+ destroy-on-close
|
|
|
+ width="400px"
|
|
|
+ @closed="systemFormCancel"
|
|
|
+ >
|
|
|
+ <el-form :model="systemInfoData" :rules="systemInfoRules" ref="systemInfoRef" label-width="auto">
|
|
|
+ <el-form-item label="数据类型：" prop="type">
|
|
|
+ <el-radio-group v-model="systemInfoData.type">
|
|
|
+ <el-radio label="1">系统分组</el-radio>
|
|
|
+ <el-radio label="2">项目系统</el-radio>
|
|
|
+ </el-radio-group>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="分组名称：" prop="name" v-if="systemInfoData.type === '1'">
|
|
|
+ <el-input v-model="systemInfoData.name" placeholder="请输入分组名称"></el-input>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="上级分组：" prop="groupId" v-if="systemInfoData.type === '2'">
|
|
|
+ <el-select v-model="systemInfoData.groupId" class="block" clearable filterable placeholder="请选择上级分组">
|
|
|
+ <el-option label="电子档案系统" value="1"></el-option>
|
|
|
+ <el-option label="规发中心" value="2"></el-option>
|
|
|
+ </el-select>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="关联应用：" prop="client" v-if="systemInfoData.type === '2'">
|
|
|
+ <el-select v-model="systemInfoData.client" class="block" clearable filterable placeholder="请选择关联应用">
|
|
|
+ <el-option label="client（质检试验）" value="client"></el-option>
|
|
|
+ <el-option label="archives（档案管理）" value="archives"></el-option>
|
|
|
+ <el-option label="measure（计量系统）" value="measure"></el-option>
|
|
|
+ </el-select>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="项目名称：" prop="title" v-if="systemInfoData.type === '2'">
|
|
|
+ <el-input v-model="systemInfoData.title" placeholder="请输入项目名称"></el-input>
|
|
|
+ </el-form-item>
|
|
|
+ </el-form>
|
|
|
+ <div slot="footer">
|
|
|
+ <el-button @click="systemFormCancel">取消</el-button>
|
|
|
+ <el-popconfirm title="确定要删除当前数据吗？" @confirm="systemFormDel" v-if="systemInfoData.id">
|
|
|
+ <el-button slot="reference" type="danger">删除</el-button>
|
|
|
+ </el-popconfirm>
|
|
|
+ <el-button type="primary" @click="systemFormSubmit">确定</el-button>
|
|
|
+ </div>
|
|
|
+ </el-dialog>
|
|
|
+ </div>
|
|
|
</template>
|
|
|
|
|
|
-<script setup>
|
|
|
+<script>
|
|
|
+import '@/styles/announcement.scss'
|
|
|
+export default {
|
|
|
+ data() {
|
|
|
+ return {
|
|
|
+ isSystemInfoShow: false,
|
|
|
+ systemClassify: '1-1',
|
|
|
+ systemInfoData: {type: '1'},
|
|
|
+ systemInfoRules: {
|
|
|
+ type: [{ required: true, message: '请选择数据类型', trigger: 'blur' }],
|
|
|
+ name: [{ required: true, message: '请输入分组名称', trigger: 'blur' }],
|
|
|
+ groupId: [{ required: true, message: '请选择上级分组', trigger: 'blur' }],
|
|
|
+ client: [{ required: true, message: '请选择关联应用', trigger: 'blur' }],
|
|
|
+ title: [{ required: true, message: '请输入项目名称', trigger: 'blur' }],
|
|
|
+ }
|
|
|
+ }
|
|
|
+ },
|
|
|
+ computed: {
|
|
|
+
|
|
|
+ },
|
|
|
+ created() {
|
|
|
|
|
|
+ },
|
|
|
+ methods: {
|
|
|
+ //系统分类被选择
|
|
|
+ systemClassifySelect(index) {
|
|
|
+ this.systemClassify = index
|
|
|
+ },
|
|
|
+ //新增系统
|
|
|
+ addSystemClick() {
|
|
|
+ this.systemInfoData = {type: '1'}
|
|
|
+ this.isSystemInfoShow = true
|
|
|
+ },
|
|
|
+ //编辑系统
|
|
|
+ editSystemClick(event, index) {
|
|
|
+ // 阻止默认右键菜单
|
|
|
+ event.preventDefault();
|
|
|
+ console.log(index)
|
|
|
+ this.systemInfoData = {id:'11', type: '1'}
|
|
|
+ this.isSystemInfoShow = true
|
|
|
+ },
|
|
|
+ //确定新增编辑系统
|
|
|
+ async systemFormSubmit() {
|
|
|
+ const isForm = await this.getFormValidate('systemInfoRef')
|
|
|
+ if (!isForm) return
|
|
|
+ console.log(this.systemInfoData)
|
|
|
+ },
|
|
|
+ //删除系统分类
|
|
|
+ systemFormDel() {
|
|
|
+ console.log('操作删除')
|
|
|
+ },
|
|
|
+ //取消新增编辑系统
|
|
|
+ systemFormCancel() {
|
|
|
+ this.isSystemInfoShow = false
|
|
|
+ this.systemInfoData = {}
|
|
|
+ },
|
|
|
+ //验证表单
|
|
|
+ async getFormValidate(ref) {
|
|
|
+ return new Promise(resolve => {
|
|
|
+ if (!ref) {
|
|
|
+ resolve(false)
|
|
|
+ return
|
|
|
+ }
|
|
|
+ this.$refs[ref].validate((valid) => {
|
|
|
+ resolve(!!valid)
|
|
|
+ });
|
|
|
+ })
|
|
|
+ }
|
|
|
+ },
|
|
|
+}
|
|
|
</script>
|
|
|
|
|
|
<style lang="scss">
|
