|
|
@@ -1,562 +1,351 @@
|
|
|
<template>
|
|
|
- <div class="classify-en-box">
|
|
|
- <el-card>
|
|
|
- <div class="header" slot="header">
|
|
|
- <div class="type-box">
|
|
|
- <span @click="$emit('typeChange','1')" v-permission="permissionBtn.classifyBtn.classifyList_cnClassify">中文分类</span>
|
|
|
- <span class="act" v-permission="permissionBtn.enClassifyBtn.classifyList_enClassify">英文分类</span>
|
|
|
+ <div class="classify-page">
|
|
|
+ <div class="top-wrap">
|
|
|
+ <div class="type-box">
|
|
|
+ <div class="item" @click="$emit('typeChange','1')">中文分类</div>
|
|
|
+ <div class="item active">英文分类</div>
|
|
|
+ </div>
|
|
|
+ <div style="display:flex;padding:10px;gap:10px">
|
|
|
+ <el-button
|
|
|
+ type="primary"
|
|
|
+ @click="addClassify"
|
|
|
+ v-permission="permissionBtn.enClassifyBtn.classifyList_enClassify_rpAddClassify"
|
|
|
+ >添加分类</el-button>
|
|
|
+ <el-input placeholder="分类名称" v-model="searchVal" style="max-width: 262px;" @change="getList" clearable>
|
|
|
+ <i slot="prefix" class="el-input__icon el-icon-search"></i>
|
|
|
+ </el-input>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div class="content-box">
|
|
|
+ <el-tree
|
|
|
+ :data="list"
|
|
|
+ node-key="Id"
|
|
|
+ :props="{
|
|
|
+ label: 'ClassifyName',
|
|
|
+ children: 'Child'
|
|
|
+ }"
|
|
|
+ check-strictly
|
|
|
+ empty-text="暂无数据"
|
|
|
+ draggable
|
|
|
+ indent='76'
|
|
|
+ :allow-drop="canDropHandle"
|
|
|
+ @node-drop="dropOverHandle"
|
|
|
+ >
|
|
|
+ <div
|
|
|
+ class="classify-item-wrap"
|
|
|
+ slot-scope="{ node, data }"
|
|
|
+ >
|
|
|
+ <div>
|
|
|
+ <span :class="['tag', data.Enabled==1?'open':'close']" @click.stop="handleEnableSet(data)">{{data.Enabled==1?'启用':'禁用'}}</span>
|
|
|
+ <span>{{data.ClassifyName}}</span>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <div class="opt-box">
|
|
|
+ <img class="icon-drag" src="~@/assets/img/data_m/move_ico2.png" alt="">
|
|
|
+ <img class="icon-set" src="~@/assets/img/icons/variety_set.png" alt="" @click.stop="handleEdit(data,node)">
|
|
|
+ </div>
|
|
|
</div>
|
|
|
- <div>
|
|
|
- <el-button v-if="isAddClassifyBtnShow"
|
|
|
- type="primary" size="small" @click="addClassify"
|
|
|
- >添加分类</el-button
|
|
|
- >
|
|
|
- <el-input
|
|
|
- placeholder="分类名称"
|
|
|
- v-model="searchform.key_word"
|
|
|
- clearable
|
|
|
- size="small"
|
|
|
- style="width: 250px"
|
|
|
- @change="getList"
|
|
|
- >
|
|
|
- <i slot="prefix" class="el-input__icon el-icon-search"></i>
|
|
|
- </el-input>
|
|
|
+ </el-tree>
|
|
|
</div>
|
|
|
- </div>
|
|
|
- <!-- <div class="tabs-box" :style="authTabsOpt.length>1?'':'border:none'"
|
|
|
- v-if="authTabsOpt.length">
|
|
|
- <span
|
|
|
- v-for="item in authTabsOpt"
|
|
|
- :key="item.val"
|
|
|
- :class="item.val==aTab?'active':''"
|
|
|
- @click="handleTabChange(item)"
|
|
|
- >{{item.name}}</span>
|
|
|
- </div> -->
|
|
|
|
|
|
- <!-- v-if="authTabsOpt.length" -->
|
|
|
- <el-table
|
|
|
- :data="tableData"
|
|
|
- v-loading="dataLoading"
|
|
|
- row-class-name="tableRowClassName"
|
|
|
- element-loading-text="数据加载中..."
|
|
|
- :default-expand-all="isexpand"
|
|
|
- row-key="Id"
|
|
|
- style="border: 1px solid #dcdfe6"
|
|
|
- :tree-props="{ children: 'Child', hasChildren: 'hasChildren' }"
|
|
|
- >
|
|
|
- <el-table-column
|
|
|
- v-for="item in tableColums"
|
|
|
- :key="item.prop"
|
|
|
- :label="item.label"
|
|
|
- :width="item.widthsty"
|
|
|
- :min-width="item.minwidthsty"
|
|
|
- :prop="item.prop"
|
|
|
- :align="item.align || 'left'"
|
|
|
- :default-expand-all="isexpand"
|
|
|
- row-key="Id"
|
|
|
- :tree-props="{ children: 'Child', hasChildren: 'hasChildren' }"
|
|
|
+ <!-- 分类弹窗 -->
|
|
|
+ <m-dialog
|
|
|
+ :title="classifyForm.id?'编辑分类':'新增分类'"
|
|
|
+ :show.sync="classifyForm.show"
|
|
|
+ width="650px"
|
|
|
>
|
|
|
- <template slot-scope="{ row }">
|
|
|
- <span v-if="item.prop === 'ClassifyOne'">{{
|
|
|
- row.level==1 ? row.ClassifyName : ""
|
|
|
- }}</span>
|
|
|
- <span v-else-if="item.prop === 'ClassifyTwo'">{{
|
|
|
- row.level==2 ? row.ClassifyName : ""
|
|
|
- }}</span>
|
|
|
- <span v-else-if="item.prop === 'ClassifyThree'">{{
|
|
|
- row.level==3 ? row.ClassifyName : ""
|
|
|
- }}</span>
|
|
|
-
|
|
|
- <div v-else-if="item.prop === 'handle'">
|
|
|
- <span
|
|
|
-
|
|
|
- class="editsty"
|
|
|
- v-if="row.level==3&&isAuthSetBtnShow"
|
|
|
- @click="handleShowSetVariety(row)"
|
|
|
- >权限配置</span>
|
|
|
- <span class="editsty" v-if="isEditBtnShow"
|
|
|
- style="margin:0 20px" @click="itemHandle('edit',row)">编辑</span>
|
|
|
- <span class="deletesty" v-if="isDeleteBtnShow"
|
|
|
- @click="itemHandle('del',row)">删除</span>
|
|
|
+ <div style="padding-left: 50px">
|
|
|
+ <el-form
|
|
|
+ :model="classifyForm"
|
|
|
+ :rules="formRules"
|
|
|
+ ref="formRef"
|
|
|
+ label-position="left"
|
|
|
+ hide-required-asterisk
|
|
|
+ label-width="90px">
|
|
|
+ <el-form-item prop="classify_name" label="分类名称">
|
|
|
+ <el-input
|
|
|
+ type="text"
|
|
|
+ v-model="classifyForm.classify_name"
|
|
|
+ placeholder="请输入分类名称"
|
|
|
+ style="width:400px;"
|
|
|
+ />
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item prop="parent_id" label="上级分类">
|
|
|
+ <el-cascader :options="classifyparentArr" v-model="classifyForm.parent_id" placeholder="请选择"
|
|
|
+ :props="{value:'Id',label:'ClassifyName',children:'Child',checkStrictly:true,emitPath:false}" style="min-width:400px;"></el-cascader>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item prop="variety" label="关联品种" v-if="classifyForm.level==3">
|
|
|
+ <template slot="label">
|
|
|
+ <el-tooltip class="item" effect="dark" content="控制报告阅读权限">
|
|
|
+ <div>
|
|
|
+ <span>关联品种</span>
|
|
|
+ <i class="el-icon-info"></i>
|
|
|
+ </div>
|
|
|
+ </el-tooltip>
|
|
|
+ </template>
|
|
|
+ <el-cascader
|
|
|
+ :options="reportVarietyList"
|
|
|
+ v-model="classifyForm.variety"
|
|
|
+ placeholder="请选择"
|
|
|
+ collapse-tags
|
|
|
+ :props="{value:'PermissionId',label:'PermissionName',children:'Child',multiple: true,emitPath:false}"
|
|
|
+ style="min-width:400px;"
|
|
|
+ ></el-cascader>
|
|
|
+ </el-form-item>
|
|
|
+ </el-form>
|
|
|
</div>
|
|
|
- </template>
|
|
|
- </el-table-column>
|
|
|
- <div slot="empty" style="padding: 100px 0">
|
|
|
- <tableNoData text="暂无数据" size="mini"/>
|
|
|
- </div>
|
|
|
- </el-table>
|
|
|
-
|
|
|
- <el-col :span="24" class="toolbar">
|
|
|
- <m-page
|
|
|
- :page_no="page_no"
|
|
|
- :pageSize="15"
|
|
|
- :total="total"
|
|
|
- @handleCurrentChange="pageChange"
|
|
|
- />
|
|
|
- </el-col>
|
|
|
- </el-card>
|
|
|
-
|
|
|
- <!-- 分类弹窗 -->
|
|
|
- <m-dialog
|
|
|
- :title="classifyForm.title"
|
|
|
- :show.sync="classifyForm.show"
|
|
|
- width="650px"
|
|
|
- >
|
|
|
- <div style="padding-left: 50px">
|
|
|
- <el-form
|
|
|
- :model="classifyForm"
|
|
|
- :rules="formRules"
|
|
|
- ref="formRef"
|
|
|
- label-position="left"
|
|
|
- hide-required-asterisk
|
|
|
- label-width="80px">
|
|
|
- <!-- <el-form-item prop="type" label="所属模块">
|
|
|
- <el-select
|
|
|
- v-model="classifyForm.type"
|
|
|
- placeholder="请选择所属模块"
|
|
|
- size="small"
|
|
|
- style="width:400px;"
|
|
|
- @change="FormClassifyChange"
|
|
|
- :disabled="classifyForm.title=='编辑英文分类'"
|
|
|
- >
|
|
|
- <el-option v-for="item in authTabsOpt" :key="item.val" :label="item.name" :value="item.val"/>
|
|
|
- </el-select>
|
|
|
-
|
|
|
- </el-form-item> -->
|
|
|
- <el-form-item prop="classify_name" label="分类名称">
|
|
|
- <el-input
|
|
|
- type="text"
|
|
|
- v-model="classifyForm.classify_name"
|
|
|
- placeholder="请输入"
|
|
|
- size="small"
|
|
|
- style="width:400px;"
|
|
|
- />
|
|
|
- </el-form-item>
|
|
|
- <el-form-item prop="parent_id" label="上级分类">
|
|
|
- <!-- <el-select
|
|
|
- v-model="classifyForm.parent_id"
|
|
|
- placeholder="请选择"
|
|
|
- size="small"
|
|
|
- style="width:400px;"
|
|
|
- >
|
|
|
- <el-option label="无" :value="0"/>
|
|
|
- <el-option v-for="item in classifyparentArr" :key="item.ClassifyName" :label="item.ClassifyName" :value="item.Id"/>
|
|
|
- </el-select> -->
|
|
|
- <el-cascader :options="classifyparentArr" v-model="classifyForm.parent_id" placeholder="请选择"
|
|
|
- :props="{value:'Id',label:'ClassifyName',children:'Child',checkStrictly:true,emitPath:false}" style="min-width:400px;"></el-cascader>
|
|
|
- </el-form-item>
|
|
|
- <el-form-item label="后台排序" prop="sort">
|
|
|
- <el-input
|
|
|
- type="number"
|
|
|
- v-model="classifyForm.sort"
|
|
|
- placeholder="请输入数字"
|
|
|
- size="small"
|
|
|
- style="width:400px;"
|
|
|
- />
|
|
|
- </el-form-item>
|
|
|
- </el-form>
|
|
|
- </div>
|
|
|
- <div slot="footer" style="margin-top: 20px;">
|
|
|
- <el-button
|
|
|
- @click="cancelClassify"
|
|
|
- style="width: 132px; height: 40px"
|
|
|
- >取消</el-button>
|
|
|
- <el-button
|
|
|
- @click="setClassifyHandle"
|
|
|
- type="primary"
|
|
|
- style="width: 132px; height: 40px"
|
|
|
- >保存</el-button>
|
|
|
- </div>
|
|
|
- </m-dialog>
|
|
|
-
|
|
|
- <!-- 配置权限 -->
|
|
|
- <el-dialog
|
|
|
- title="权限配置"
|
|
|
- :visible.sync="showSetVariety"
|
|
|
- width="705px"
|
|
|
- append-to-body
|
|
|
- :close-on-click-modal="false"
|
|
|
- >
|
|
|
- <div style="padding:10px 40px">
|
|
|
- <reportVarietyEnSet ref="varietyIns" :checked="checkedVariety" v-if="showSetVariety" />
|
|
|
- </div>
|
|
|
- <div style="text-align:center;padding:10px 0 30px 0">
|
|
|
- <el-button type="primary" plain @click="showSetVariety=false;checkedVariety=[]">取消</el-button>
|
|
|
- <el-button type="primary" style="margin-left:20px" @click="handleSaveVariety">保存</el-button>
|
|
|
- </div>
|
|
|
- </el-dialog>
|
|
|
- </div>
|
|
|
+ <div slot="footer" style="margin-top: 20px;">
|
|
|
+ <el-button
|
|
|
+ @click="cancelClassify"
|
|
|
+ style="width: 132px; height: 40px"
|
|
|
+ >取消</el-button>
|
|
|
+ <el-button
|
|
|
+ @click="setClassifyHandle"
|
|
|
+ type="primary"
|
|
|
+ style="width: 132px; height: 40px"
|
|
|
+ >保存</el-button>
|
|
|
+ </div>
|
|
|
+ </m-dialog>
|
|
|
+ </div>
|
|
|
</template>
|
|
|
|
|
|
<script>
|
|
|
-import * as classifyEnInterface from "@/api/modules/classifyEnApi.js";
|
|
|
-import mPage from "@/components/mPage.vue";
|
|
|
+import draggable from 'vuedraggable';
|
|
|
import mDialog from '@/components/mDialog.vue';
|
|
|
-import reportVarietyEnSet from '@/components/reportVarietyEnSet.vue'
|
|
|
+import {reportVarietyENInterence} from '@/api/modules/reportVariety'
|
|
|
+import * as classifyEnInterface from "@/api/modules/classifyEnApi.js";
|
|
|
export default {
|
|
|
- components: { mPage,mDialog,reportVarietyEnSet },
|
|
|
- watch: {
|
|
|
- 'classifyForm.show': {
|
|
|
- handler(newval) {
|
|
|
- newval && this.getClassifyOne();
|
|
|
- }
|
|
|
- }
|
|
|
- },
|
|
|
- computed:{
|
|
|
- //添加分类是否展示
|
|
|
- isAddClassifyBtnShow(){
|
|
|
- // if(this.aTab===0&&this.authTabsOpt.length){
|
|
|
- return this.permissionBtn.checkPermissionBtn(
|
|
|
- this.permissionBtn.enClassifyBtn.classifyList_enClassify_rpAddClassify
|
|
|
- )
|
|
|
- // }
|
|
|
- // if(this.aTab===1&&this.authTabsOpt.length){
|
|
|
- // return this.permissionBtn.checkPermissionBtn(
|
|
|
- // this.permissionBtn.enClassifyBtn.classifyList_enClassify_rsAddClassify
|
|
|
- // )
|
|
|
- // }
|
|
|
- },
|
|
|
- //编辑是否展示
|
|
|
- isEditBtnShow(){
|
|
|
- // if(this.aTab===0){
|
|
|
- return this.permissionBtn.checkPermissionBtn(
|
|
|
- this.permissionBtn.enClassifyBtn.classifyList_enClassify_rpEdit
|
|
|
- )
|
|
|
- // }else{
|
|
|
- // return this.permissionBtn.checkPermissionBtn(
|
|
|
- // this.permissionBtn.enClassifyBtn.classifyList_enClassify_rsEdit
|
|
|
- // )
|
|
|
- // }
|
|
|
- },
|
|
|
- //删除是否展示
|
|
|
- isDeleteBtnShow(){
|
|
|
- // if(this.aTab===0){
|
|
|
- return this.permissionBtn.checkPermissionBtn(
|
|
|
- this.permissionBtn.enClassifyBtn.classifyList_enClassify_rpDel
|
|
|
- )
|
|
|
- // }else{
|
|
|
- // return this.permissionBtn.checkPermissionBtn(
|
|
|
- // this.permissionBtn.enClassifyBtn.classifyList_enClassify_rsDel
|
|
|
- // )
|
|
|
- // }
|
|
|
- },
|
|
|
- //权限设置是否展示
|
|
|
- isAuthSetBtnShow(){
|
|
|
- // if(this.aTab===0){
|
|
|
- return this.permissionBtn.checkPermissionBtn(
|
|
|
- this.permissionBtn.enClassifyBtn.classifyList_enClassify_rpAuthSetting
|
|
|
- )
|
|
|
- // }else{
|
|
|
- // return this.permissionBtn.checkPermissionBtn(
|
|
|
- // this.permissionBtn.enClassifyBtn.classifyList_enClassify_rsAuthSetting
|
|
|
- // )
|
|
|
- // }
|
|
|
- },
|
|
|
- //英文研报、线上路演选项卡 - ETA1.1.7 不区分英文研报和线上路演，统一用英文研报的 按钮标识
|
|
|
- // authTabsOpt(){
|
|
|
- // const isShowTabRoadshow = this.permissionBtn.checkPermissionBtn(
|
|
|
- // this.permissionBtn.enClassifyBtn.classifyList_enClassify_roadshow
|
|
|
- // )
|
|
|
- // const isShowTabReport = this.permissionBtn.checkPermissionBtn(
|
|
|
- // this.permissionBtn.enClassifyBtn.classifyList_enClassify_report
|
|
|
- // )
|
|
|
- // //没时间写更好的写法了，有空再优化
|
|
|
- // let authTabs = []
|
|
|
- // if(isShowTabReport){
|
|
|
- // authTabs.push(this.tabsOpt[0])
|
|
|
- // }
|
|
|
- // if(isShowTabRoadshow){
|
|
|
- // authTabs.push(this.tabsOpt[1])
|
|
|
- // }
|
|
|
- // return authTabs
|
|
|
- // },
|
|
|
- //添加分类时的选项框
|
|
|
- },
|
|
|
- data() {
|
|
|
- return {
|
|
|
- searchform: {
|
|
|
- key_word: "",
|
|
|
- },
|
|
|
-
|
|
|
- dataLoading: false,
|
|
|
- page_no: 1,
|
|
|
- total: 0,
|
|
|
- tableData: [],
|
|
|
- tableColums: [
|
|
|
- {
|
|
|
- label: "一级分类",
|
|
|
- prop: "ClassifyOne",
|
|
|
+ components:{draggable,mDialog},
|
|
|
+ data() {
|
|
|
+ return {
|
|
|
+ typeVal:1,
|
|
|
+ searchVal:'',
|
|
|
+ list:[],
|
|
|
+
|
|
|
+ classifyForm:{
|
|
|
+ show:false,
|
|
|
+ classify_id:0,
|
|
|
+ classify_name:"",
|
|
|
+ parent_id: '',
|
|
|
+ variety:'',//关联的品种
|
|
|
+ level:1
|
|
|
+ },
|
|
|
+ formRules: {
|
|
|
+ classify_name: [{ required:true,message:'请输入分类名称',trigger:'blur'}]
|
|
|
+ },
|
|
|
+ classifyparentArr:[],
|
|
|
+
|
|
|
+ reportVarietyList:[],//英文品种列表
|
|
|
+ }
|
|
|
+ },
|
|
|
+ mounted(){
|
|
|
+ this.getList('init')
|
|
|
+ this.getReportVarietyList()
|
|
|
+ },
|
|
|
+ methods: {
|
|
|
+ async getList(type){
|
|
|
+ const res=await classifyEnInterface.classifyList({
|
|
|
+ KeyWord:this.searchVal
|
|
|
+ })
|
|
|
+ if(res.Ret===200){
|
|
|
+ this.list=res.Data.List||[]
|
|
|
+ if(type==='init'){
|
|
|
+ this.classifyparentArr=res.Data.List || [];
|
|
|
+ this.classifyparentArr.unshift({Id:"0",ClassifyName:'无',Child:null})
|
|
|
+ }
|
|
|
+ }
|
|
|
},
|
|
|
- {
|
|
|
- label: "二级分类",
|
|
|
- prop: "ClassifyTwo",
|
|
|
+
|
|
|
+
|
|
|
+ //启用\禁用设置
|
|
|
+ handleEnableSet(item){
|
|
|
+ classifyEnInterface.enableSet({
|
|
|
+ ClassifyId:item.Id,
|
|
|
+ Enabled:item.Enabled==1?0:1
|
|
|
+ }).then(res=>{
|
|
|
+ if(res.Ret===200){
|
|
|
+ this.$message.success('设置成功')
|
|
|
+ this.getList('init')
|
|
|
+ }
|
|
|
+ })
|
|
|
},
|
|
|
- {
|
|
|
- label: "三级分类",
|
|
|
- prop: "ClassifyThree",
|
|
|
+
|
|
|
+ addClassify(){
|
|
|
+ this.classifyForm={
|
|
|
+ show:true,
|
|
|
+ classify_id:0,
|
|
|
+ classify_name:"",
|
|
|
+ parent_id: '',
|
|
|
+ variety:'',//关联的品种
|
|
|
+ }
|
|
|
},
|
|
|
- {
|
|
|
- label: "操作",
|
|
|
- prop: "handle",
|
|
|
- align: "center",
|
|
|
+ handleEdit(item,node){
|
|
|
+ this.classifyForm={
|
|
|
+ show:true,
|
|
|
+ classify_id:item.Id,
|
|
|
+ classify_name:item.ClassifyName,
|
|
|
+ parent_id: item.ParentId||'0',
|
|
|
+ variety:item.EnPermissions||'',//关联的品种
|
|
|
+ level:node.level
|
|
|
+ }
|
|
|
},
|
|
|
- ],
|
|
|
-
|
|
|
- classifyparentArr: [],
|
|
|
- classifyForm: {
|
|
|
- title: '',
|
|
|
- show: false,
|
|
|
- classify_name: '',
|
|
|
- parent_id: "0", // 数字的0，级联选择器不回显
|
|
|
- sort: 1,
|
|
|
- classify_id: '',
|
|
|
+ async setClassifyHandle(){
|
|
|
+ await this.$refs.formRef.validate();
|
|
|
+ const { classify_name,parent_id,sort,classify_id } = this.classifyForm;
|
|
|
+ let params = {
|
|
|
+ ClassifyName: classify_name,
|
|
|
+ ParentId: parent_id||0,
|
|
|
+ EnPermissions:this.classifyForm.variety||[]
|
|
|
+ }
|
|
|
+ // console.log(params);
|
|
|
|
|
|
- type:0
|
|
|
- },
|
|
|
- formRules: {
|
|
|
- classify_name: [{ required:true,message:'请输入分类名称',trigger:'blur'}],
|
|
|
- parent_id: [{ required:true,message:'请输入',trigger:'blur'}],
|
|
|
- sort: [{ required:true,message:'请输入数字',trigger:'blur'}],
|
|
|
- // type: [{ required:true,message:'请选择',trigger:'change'}]
|
|
|
- },
|
|
|
+ const { Ret,Msg } = classify_id
|
|
|
+ ? await classifyEnInterface.classifyEdit({...params,ClassifyId: classify_id})
|
|
|
+ : await classifyEnInterface.classifyAdd(params)
|
|
|
|
|
|
- tabsOpt:[
|
|
|
- {
|
|
|
- name:'英文研报',
|
|
|
- val:0
|
|
|
+ if(Ret !== 200) return
|
|
|
+ this.$message.success(Msg)
|
|
|
+ this.cancelClassify();
|
|
|
+ this.getList('init');
|
|
|
+ },
|
|
|
+ /* 取消 */
|
|
|
+ cancelClassify() {
|
|
|
+ this.$refs.formRef.resetFields();
|
|
|
+ this.classifyForm.show = false;
|
|
|
},
|
|
|
- {
|
|
|
- name:'线上路演',
|
|
|
- val:1
|
|
|
- }
|
|
|
- ],
|
|
|
- aTab:0,
|
|
|
-
|
|
|
- isexpand:false,
|
|
|
-
|
|
|
- showSetVariety:false,
|
|
|
- checkedVariety:[],
|
|
|
- activeItem:{},//当前编辑权限的分类
|
|
|
- };
|
|
|
- },
|
|
|
|
|
|
- methods: {
|
|
|
- handleShowSetVariety(item){
|
|
|
- console.log(item.EnPermissions);
|
|
|
- this.activeItem=item
|
|
|
- this.checkedVariety=item.EnPermissions?JSON.parse(JSON.stringify(item.EnPermissions)):[]
|
|
|
- this.showSetVariety=true
|
|
|
- },
|
|
|
- handleSaveVariety(){
|
|
|
+ // 获取品种数据
|
|
|
+ getReportVarietyList(){
|
|
|
+ reportVarietyENInterence.filterVarietyOpts().then(res=>{
|
|
|
+ this.reportVarietyList=res.Data||[]
|
|
|
+ })
|
|
|
+ },
|
|
|
|
|
|
- let params={
|
|
|
- ClassifyId:this.activeItem.Id,
|
|
|
- EnPermissions:this.$refs.varietyIns.checkedItems||[]
|
|
|
- }
|
|
|
- // console.log(params);
|
|
|
- classifyEnInterface.setClassifyVariety(params).then(res=>{
|
|
|
- if(res.Ret===200){
|
|
|
- this.$message.success('设置成功')
|
|
|
- this.getList();
|
|
|
- this.showSetVariety=false
|
|
|
- }
|
|
|
- })
|
|
|
- },
|
|
|
+ //控制只能同级拖动
|
|
|
+ canDropHandle(draggingNode, dropNode, type){
|
|
|
+ if(type==='inner') return false //禁止向内部拖动
|
|
|
+ if(draggingNode.level!=dropNode.level) return false
|
|
|
+ if(draggingNode.data.ParentId!=dropNode.data.ParentId) return false
|
|
|
+ return true
|
|
|
+ },
|
|
|
|
|
|
- getList() {
|
|
|
- //获取列表
|
|
|
- this.dataLoading = true;
|
|
|
- let params = {
|
|
|
- CurrentIndex: this.page_no,
|
|
|
- PageSize: 15,
|
|
|
- KeyWord: this.searchform.key_word,
|
|
|
- // ClassifyType:this.aTab
|
|
|
- };
|
|
|
- classifyEnInterface.classifyList(params).then(res => {
|
|
|
- this.dataLoading = false;
|
|
|
- if (res.Ret === 200) {
|
|
|
- this.tableData = res.Data.List || [];
|
|
|
- this.total = parseInt(res.Data.Paging.Totals);
|
|
|
- this.tableData.forEach((item, index) => {
|
|
|
- item.level = 1
|
|
|
- if (item.Child) {
|
|
|
- // item.hasChildren=true;
|
|
|
- // let childnode = JSON.parse(JSON.stringify(item.Child));
|
|
|
- item.Child.forEach((itemchild, i) => {
|
|
|
- itemchild.level = 2;
|
|
|
- itemchild.Child && itemchild.Child.forEach((itemChildTwo,i)=>{
|
|
|
- itemChildTwo.level=3
|
|
|
- })
|
|
|
- });
|
|
|
- // item.children = childnode;
|
|
|
+ //拖动结束
|
|
|
+ dropOverHandle(b,a,i,e) {
|
|
|
+ // 被拖拽节点对应的 Node、结束拖拽时最后进入的节点、被拖拽节点的放置位置
|
|
|
+ const classifyId=b.data.Id
|
|
|
+ let list=a.parent.childNodes;
|
|
|
+ let PrevClassifyId=0,NextClassifyId=0,targetIndex=0;
|
|
|
+ list.forEach((item,index) => {
|
|
|
+ if(item.data.Id===classifyId){
|
|
|
+ targetIndex=index
|
|
|
+ }
|
|
|
+ });
|
|
|
+ if(targetIndex===0){
|
|
|
+ NextClassifyId=list[1].data.Id
|
|
|
+ }else if(targetIndex===list.length-1){
|
|
|
+ PrevClassifyId=list[list.length-1].data.Id
|
|
|
+ }else{
|
|
|
+ PrevClassifyId=list[targetIndex-1].data.Id
|
|
|
+ NextClassifyId=list[targetIndex+1].data.Id
|
|
|
}
|
|
|
- });
|
|
|
- console.log(this.tableData,'this.tableData');
|
|
|
- }
|
|
|
- });
|
|
|
- },
|
|
|
-
|
|
|
- addClassify() {
|
|
|
- this.classifyForm = {
|
|
|
- title: '新增英文分类',
|
|
|
- show: true,
|
|
|
- classify_name: '',
|
|
|
- parent_id: "0",
|
|
|
- sort: 1,
|
|
|
- type:0
|
|
|
- }
|
|
|
- },
|
|
|
|
|
|
- /* 获取一级分类 */
|
|
|
- getClassifyOne() {
|
|
|
- classifyEnInterface.classifyOne({ CurrentIndex: 1, PageSize: 9999 /**,ClassifyType:this.classifyForm.type */ })
|
|
|
- .then(res => {
|
|
|
- if(res.Ret !== 200) return
|
|
|
-
|
|
|
- this.classifyparentArr=res.Data.List || [];
|
|
|
-
|
|
|
- this.classifyparentArr.unshift({Id:"0",ClassifyName:'无',Child:null})
|
|
|
- })
|
|
|
- },
|
|
|
-
|
|
|
- /* 操作 */
|
|
|
- itemHandle(key,row) {
|
|
|
- const keyMap = {
|
|
|
- 'edit': this.editHandle,
|
|
|
- 'del': this.delHandle
|
|
|
- }
|
|
|
-
|
|
|
- keyMap[key](row)
|
|
|
- },
|
|
|
-
|
|
|
- editHandle({ClassifyName,Id,ParentId,Sort,ClassifyType}) {
|
|
|
- this.classifyForm = {
|
|
|
- title: '编辑分类',
|
|
|
- show: true,
|
|
|
- classify_name: ClassifyName,
|
|
|
- parent_id: ParentId==0?0+'':ParentId,//数字的0，'无'不回显
|
|
|
- sort: Sort,
|
|
|
- classify_id: Id,
|
|
|
- type:ClassifyType
|
|
|
- }
|
|
|
- },
|
|
|
-
|
|
|
- delHandle({Id,ParentId}) {
|
|
|
-
|
|
|
- this.$confirm('确认删除吗?','提示',{type:'warning'}).then(() => {
|
|
|
- classifyEnInterface.classifyDel({ClassifyId:Id,ParentId}).then(res =>{
|
|
|
- if( res.Ret!==200 ) return
|
|
|
-
|
|
|
- this.$message.success(res.Msg);
|
|
|
- this.getList();
|
|
|
- });
|
|
|
- }).catch(() => {});
|
|
|
- },
|
|
|
-
|
|
|
- /* 日期改变 */
|
|
|
- pageChange(page) {
|
|
|
- this.page_no = page;
|
|
|
-
|
|
|
- this.getList();
|
|
|
- },
|
|
|
-
|
|
|
- /* 保存分类 */
|
|
|
- async setClassifyHandle() {
|
|
|
- await this.$refs.formRef.validate();
|
|
|
- console.log(this.classifyForm);
|
|
|
- // return
|
|
|
- const { classify_name,parent_id,sort,classify_id } = this.classifyForm;
|
|
|
- let params = {
|
|
|
- ClassifyName: classify_name,
|
|
|
- ParentId: parseInt(parent_id),
|
|
|
- Sort: sort
|
|
|
- }
|
|
|
-
|
|
|
- const { Ret,Msg } = classify_id
|
|
|
- ? await classifyEnInterface.classifyEdit({...params,ClassifyId: classify_id})
|
|
|
- : await classifyEnInterface.classifyAdd(params)
|
|
|
- // : await classifyEnInterface.classifyAdd({...params,ClassifyType:this.classifyForm.type})
|
|
|
-
|
|
|
- if(Ret !== 200) return
|
|
|
- this.$message.success(Msg)
|
|
|
- this.cancelClassify();
|
|
|
- this.getList();
|
|
|
- },
|
|
|
-
|
|
|
- /* 取消 */
|
|
|
- cancelClassify() {
|
|
|
- this.$refs.formRef.resetFields();
|
|
|
- this.classifyForm.show = false;
|
|
|
+ const params={
|
|
|
+ ClassifyId:classifyId,
|
|
|
+ PrevClassifyId,
|
|
|
+ NextClassifyId
|
|
|
+ }
|
|
|
+ console.log(params);
|
|
|
+ classifyEnInterface.moveSort(params).then(res=>{
|
|
|
+ if(res.Ret===200){
|
|
|
+ this.$message.success('操作成功')
|
|
|
+ }else{
|
|
|
+ this.getList()
|
|
|
+ }
|
|
|
+ })
|
|
|
+ },
|
|
|
},
|
|
|
-
|
|
|
- //切换分类
|
|
|
- // handleTabChange(item){
|
|
|
- // this.aTab=item.val
|
|
|
- // this.page_no=1
|
|
|
- // this.searchform.key_word=''
|
|
|
- // this.getList()
|
|
|
- // },
|
|
|
-
|
|
|
- //新增分类时切换分类
|
|
|
- // FormClassifyChange(){
|
|
|
- // this.classifyForm.parent_id=0
|
|
|
- // this.getClassifyOne()
|
|
|
- // }
|
|
|
- },
|
|
|
-
|
|
|
- mounted() {
|
|
|
- // if(this.authTabsOpt.length){
|
|
|
- // this.aTab = this.authTabsOpt[0].val
|
|
|
- this.getList();
|
|
|
- // }
|
|
|
- },
|
|
|
-};
|
|
|
+}
|
|
|
</script>
|
|
|
|
|
|
+<style lang="scss">
|
|
|
+.el-cascader .el-input{
|
|
|
+ width: 100%;
|
|
|
+}
|
|
|
+.classify-page{
|
|
|
+ .content-box{
|
|
|
+ .el-tree-node__content{
|
|
|
+ padding-top: 10px;
|
|
|
+ padding-bottom: 10px;
|
|
|
+ border-bottom: 1px solid #C8CDD9;
|
|
|
+ }
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+</style>
|
|
|
<style lang="scss" scoped>
|
|
|
-.classify-en-box {
|
|
|
- .header {
|
|
|
+.top-wrap{
|
|
|
display: flex;
|
|
|
justify-content: space-between;
|
|
|
- align-items: center;
|
|
|
- .type-box{
|
|
|
- span{
|
|
|
- cursor: pointer;
|
|
|
- display: inline-block;
|
|
|
- margin-right: 50px;
|
|
|
- font-size: 18px;
|
|
|
- padding-bottom: 10px;
|
|
|
- }
|
|
|
- .act{
|
|
|
- color: #409EFF;
|
|
|
- border-bottom: 2px solid #409EFF;
|
|
|
- }
|
|
|
- }
|
|
|
- }
|
|
|
- .tabs-box{
|
|
|
- margin-bottom: 20px;
|
|
|
- width: 160px;
|
|
|
- border: 1px solid #DCDFE6;
|
|
|
+ background: #FFFFFF;
|
|
|
border-radius: 4px;
|
|
|
- overflow: hidden;
|
|
|
- span{
|
|
|
- display: inline-block;
|
|
|
- width: 80px;
|
|
|
- line-height: 40px;
|
|
|
- color: #666;
|
|
|
- cursor: pointer;
|
|
|
- text-align: center;
|
|
|
- }
|
|
|
- .active{
|
|
|
- color: #fff;
|
|
|
- background-color: #409EFF;
|
|
|
+ .type-box{
|
|
|
+ display: flex;
|
|
|
+ .item{
|
|
|
+ position: relative;
|
|
|
+ cursor: pointer;
|
|
|
+ color: #666;
|
|
|
+ min-width: 88px;
|
|
|
+ line-height: 60px;
|
|
|
+ text-align: center;
|
|
|
+ }
|
|
|
+ .active{
|
|
|
+ color: #0052D9;
|
|
|
+ &::after{
|
|
|
+ content: '';
|
|
|
+ display: block;
|
|
|
+ width: 100%;
|
|
|
+ height: 2px;
|
|
|
+ position: absolute;
|
|
|
+ bottom: 0px;
|
|
|
+ left: 0;
|
|
|
+ background-color: #0052D9;
|
|
|
+ }
|
|
|
+ }
|
|
|
}
|
|
|
- }
|
|
|
}
|
|
|
-</style>
|
|
|
-<style lang="scss">
|
|
|
-.el-cascader .el-input{
|
|
|
- width: 100%;
|
|
|
+.content-box{
|
|
|
+ padding: 20px;
|
|
|
+ margin-top: 20px;
|
|
|
+ height: calc(100vh - 230px);
|
|
|
+ overflow-y: auto;
|
|
|
+ background-color: #FFFFFF;
|
|
|
+ .classify-item-wrap{
|
|
|
+ flex: 1;
|
|
|
+ padding-right: 20px;
|
|
|
+ display: flex;
|
|
|
+ justify-content: space-between;
|
|
|
+ align-items: center;
|
|
|
+ .tag{
|
|
|
+ display: inline-block;
|
|
|
+ min-width: 76px;
|
|
|
+ line-height: 30px;
|
|
|
+ text-align: center;
|
|
|
+ &.open{
|
|
|
+ background-color: #ECF2FE;
|
|
|
+ color: #0052D9;
|
|
|
+ }
|
|
|
+ &.close{
|
|
|
+ background-color: #0052D9;
|
|
|
+ color: #fff;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .opt-box{
|
|
|
+ .icon-drag,.icon-set{
|
|
|
+ width: 16px;
|
|
|
+ height: 16px;
|
|
|
+ margin-left: 10px;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
}
|
|
|
-
|
|
|
-</style>
|
|
|
+</style>
|
