用户页面问题处理、注册全局组件

src/components/trade-card/main.vue

@@ -0,0 +1,142 @@
+<template>
+  <div>
+    <div class="container">
+      <div class="title">
+        <div class="redcolumn"></div>
+        <div class="container-title">{{ title }}</div>
+      </div>
+      <div v-if="showBtn" class="container-foot" @click="open">
+        <div v-show="show" style="height: 20px">
+          <span><i class="el-icon-arrow-up" :style="styleIocup" /></span>
+        </div>
+        <div v-show="!show" style="height: 20px">
+          <span><i class="el-icon-arrow-down" /></span>
+        </div>
+      </div>
+    </div>
+    <div class="basic-container" :style="styleName" :class="{ 'basic-container--block': block }">
+      <el-card class="basic-container__card" style="padding: 0;">
+        <el-collapse-transition>
+          <div v-show="show">
+            <slot></slot>
+          </div>
+        </el-collapse-transition>
+      </el-card>
+    </div>
+  </div>
+
+</template>
+
+<script>
+export default {
+  name: "basicContainer",
+  data() {
+    return {
+
+    };
+  },
+  props: {
+    radius: {
+      type: [String, Number],
+      default: 10
+    },
+    background: {
+      type: String
+    },
+    block: {
+      type: Boolean,
+      default: false
+    },
+    showBtn: {
+      type: Boolean,
+      default: true
+    },
+    title: {
+      type: String
+    },
+    show: {
+      type: Boolean,
+      default: true
+    },
+    styleIocup:{
+      type:String,
+      default:''
+    },
+  },
+  methods: {
+    open(){
+      this.show = !this.show
+      this.$emit("openClose",this.show)
+    }
+  },
+  computed: {
+    styleName() {
+      return {
+        borderRadius: this.setPx(this.radius),
+        background: this.background
+      };
+    }
+  }
+};
+</script>
+
+<style lang="scss">
+.container {
+  display: flex;
+  justify-content: space-between;
+  margin-left: 10px;
+  margin-right: 10px;
+  background-color: inherit;
+  height: 18px;
+  // padding-bottom: 12px;
+  vertical-align: middle;
+
+  .title {
+    display: flex;
+
+    .redcolumn {
+      width: 4px;
+      height: 13px;
+      background-color: #d6000f;
+      margin: 3px 4px 0 0;
+    }
+
+    .container-title {
+      font-size: 12px;
+      line-height: 20px;
+      font-family: PingFangSC-Semibold, PingFang SC;
+      font-weight: 600;
+      color: #323233;
+    }
+  }
+
+  .container-foot {
+    font-size: 16px;
+    font-weight: 1000;
+  }
+}
+
+.basic-container {
+  padding: 5px 6px;
+  box-sizing: border-box;
+
+  &--block {
+    height: 100%;
+
+    .basic-container__card {
+      height: 100%;
+    }
+  }
+
+  &__card {
+    width: 100%;
+  }
+
+  &:first-child {
+    padding-top: 6px;
+  }
+}
+::v-deep .el-card__body{
+    padding: 0px;
+}
+</style>

src/main.js

@@ -22,6 +22,8 @@ import avueUeditor from 'avue-plugin-ueditor';
 import website from '@/config/website';
 import crudCommon from '@/mixins/crud';
 import format from 'vue-text-format'; //v-format
+import basicBlock from './components/basic-block/main';
+import basicContainer from './components/basic-container/main';
 import {
     getWorkDicts
 } from '@/api/system/dictbiz'
@@ -29,6 +31,10 @@ import './util/directives.js'
 import Avue from '@smallwei/avue';
 import '@smallwei/avue/lib/index.css';
 
+import tradeCard from './components/trade-card/main.vue';
+Vue.component('tradeCard', tradeCard);
+Vue.component('basicContainer', basicContainer);
+Vue.component('basicBlock', basicBlock);
 Vue.use(Avue);
 Vue.use(avueUeditor)
 

src/views/system/dept.vue

@@ -22,9 +22,9 @@
                 @on-load="onLoad"
                 @tree-load="treeLoad"
                 @resetColumn="
-                    resetColumnTwo('crud', 'option', 'optionList', 341)
+                    resetColumnTwo('crud')
                 "
-                @saveColumn="saveColumnTwo('crud', 'option', 'optionList', 341)"
+                @saveColumn="saveColumnTwo('crud')"
             >
                 <template slot="menuLeft">
                     <el-button
@@ -51,36 +51,6 @@
                     <el-tag>{{ row.deptCategoryName }}</el-tag>
                 </template>
 
-                <template slot-scope="{ row }" slot="polCnNameForm">
-                    <search-query
-                        :datalist="polData"
-                        :selectValue="form.polCnName"
-                        :filterable="true"
-                        :clearable="true"
-                        :remote="true"
-                        :buttonIf="false"
-                        :forParameter="{
-                            key: 'id',
-                            label: 'cnName',
-                            value: 'cnName'
-                        }"
-                        @remoteMethod="polBportsListfun($event, 'polCnName')"
-                        @corpChange="corpChange($event, 'polCnName')"
-                        @corpFocus="polBportsListfun($event, 'polCnName')"
-                    >
-                    </search-query>
-                </template>
-                <template slot="regionForm">
-                    <avue-cascader
-                        :emit-path="true"
-                        showAllLevelss
-                        v-model="form.region"
-                        placeholder="请选择产品分类"
-                        :dic="regionList"
-                        :props="regionProps"
-                        @change="regionChange"
-                    ></avue-cascader>
-                </template>
             </avue-crud>
         </basic-container>
     </div>
@@ -97,7 +67,6 @@ import {
 } from "@/api/system/dept";
 import {mapGetters} from "vuex";
 import website from "@/config/website";
-import {getToken} from "@/util/auth";
 
 export default {
     components: {},
@@ -120,8 +89,7 @@ export default {
                 value: "name"
             },
             regionList: [],
-            option: {},
-            optionList: {
+            option: {
                 lazy: true,
                 tip: false,
                 simplePage: true,
@@ -214,38 +182,13 @@ export default {
                         dataType: "number",
                         width: 120,
                         prop: "deptCategory",
-                        slot: true /*,
-              rules: [{
-                required: true,
-                message: "请输入机构类型",
-                trigger: "blur"
-              }]*/
-                    },
-                    {
-                        label: "积分余额",
-                        prop: "pointsBalance",
-                        disabled: true,
-                        hide: true, // 表格里是否可见
-                        addDisplay: false, //当前行数据在新增表单中是否可见
-                        editDisplay: false, //当前行数据在编辑表单中是否可见
-                        viewDisplay: false, // 当前行数据在查看表单中是否可见
-                        value: 0
-                    },
-                    {
-                        label: "装货港",
-                        prop: "polCnName",
-                        type: "select",
-                        formslot: true,
-                        disabled: true,
-                        hide: true, // 表格里是否可见
-                        addDisplay: false, //当前行数据在新增表单中是否可见
-                        editDisplay: false, //当前行数据在编辑表单中是否可见
-                        viewDisplay: false // 当前行数据在查看表单中是否可见
+                        slot: true
                     },
                     {
                         label: "英文全称",
                         prop: "englishFullName",
-                        overHidden: true
+                        overHidden: true,
+                        hide: true
                     },
                     {
                         label: "联系电话",
@@ -258,75 +201,6 @@ export default {
                         overHidden: true
                     },
                     {
-                        label: "所属区域",
-                        prop: "region",
-                        formslot: true,
-                        overHidden: true
-                        // dicData: [],
-                        // dataType: "string",
-                        // type: "cascader",
-                        // // type: "async-cascader", // 修改为 "async-cascader"
-                        // props: {
-                        //     label: 'name',
-                        //     value: 'name'
-                        // },
-                        // lazy: true,
-                        // filterable: true,
-                    },
-                    {
-                        label: "fax",
-                        prop: "fax",
-                        overHidden: true
-                    },
-                    {
-                        label: "邮箱",
-                        prop: "email",
-                        overHidden: true
-                    },
-                    {
-                        label: "网站",
-                        prop: "website",
-                        overHidden: true
-                    },
-                    {
-                        label: "开户银行",
-                        prop: "bankOfDeposit",
-                        overHidden: true
-                    },
-                    {
-                        label: "银行地址",
-                        prop: "bankAddress",
-                        overHidden: true
-                    },
-                    {
-                        label: "开户银行美金",
-                        prop: "bankOfDepositUsd",
-                        width: "100",
-                        overHidden: true
-                    },
-                    {
-                        label: "银行地址美金",
-                        prop: "bankAddressUsd",
-                        width: "100",
-                        overHidden: true
-                    },
-                    {
-                        label: "人民币账号",
-                        prop: "rmbAccount",
-                        width: "100",
-                        overHidden: true
-                    },
-                    {
-                        label: "美金账号",
-                        prop: "usdAccount",
-                        overHidden: true
-                    },
-                    {
-                        label: "swift代码",
-                        prop: "swiftCode",
-                        overHidden: true
-                    },
-                    {
                         label: "logo",
                         prop: "logoUrl",
                         type: "upload",
@@ -344,12 +218,8 @@ export default {
                         prop: "sort",
                         type: "number",
                         align: "right",
-                        width: 60
-                        // rules: [{
-                        //   required: true,
-                        //   message: "请输入排序",
-                        //   trigger: "blur"
-                        // }]
+                        width: 60,
+                        hide: true
                     },
                     {
                         label: "备注",
@@ -369,67 +239,6 @@ export default {
         };
     },
     async created() {
-        this.option = await this.getColumnData(
-            this.getColumnName(341),
-            this.optionList
-        );
-        // this.findObject(this.option.column, "region").dicData = JSON.parse(localStorage.getItem('areaTypeTree'))
-        this.regionList = JSON.parse(localStorage.getItem("areaTypeTree"));
-        // 判断是否是admin 权限
-        let arr = localStorage.getItem("roleName").split(",");
-        // 根据 企业好判断是否要显示 积分余额
-        const content = JSON.parse(localStorage.getItem("saber-tenantId"))
-            .content;
-        this.$nextTick(() => {
-            if (arr.indexOf("admin") != -1) {
-                this.findObject(
-                    this.option.column,
-                    "pointsBalance"
-                ).disabled = false;
-            }
-            this.findObject(this.option.column, "pointsBalance").hide = false;
-            this.findObject(
-                this.option.column,
-                "pointsBalance"
-            ).addDisplay = true;
-            this.findObject(
-                this.option.column,
-                "pointsBalance"
-            ).editDisplay = true;
-            this.findObject(
-                this.option.column,
-                "pointsBalance"
-            ).viewDisplay = true;
-        });
-        // if (content == 171757) {
-        //     this.$nextTick(()=>{
-        //         if (arr.indexOf('admin') != -1) {
-        //             this.findObject(this.option.column, "pointsBalance").disabled = false
-        //         }
-        //         this.findObject(this.option.column, "pointsBalance").hide = false
-        //         this.findObject(this.option.column, "pointsBalance").addDisplay = true
-        //         this.findObject(this.option.column, "pointsBalance").editDisplay = true
-        //         this.findObject(this.option.column, "pointsBalance").viewDisplay = true
-        //     })
-        // }
-        // 判断是否显示装货港
-        if (localStorage.getItem("sysitemType") == 12) {
-            this.$nextTick(() => {
-                this.findObject(this.option.column, "polCnName").hide = false;
-                this.findObject(
-                    this.option.column,
-                    "polCnName"
-                ).addDisplay = true;
-                this.findObject(
-                    this.option.column,
-                    "polCnName"
-                ).editDisplay = true;
-                this.findObject(
-                    this.option.column,
-                    "polCnName"
-                ).viewDisplay = true;
-            });
-        }
     },
     computed: {
         ...mapGetters(["userInfo", "permission"]),
@@ -450,21 +259,6 @@ export default {
         }
     },
     methods: {
-        regionChange(value) {
-            console.log(value, 404);
-        },
-        // 装货港回调数据
-        corpChange(value, name) {
-            for (let item of this.polData) {
-                if (item.cnName == value) {
-                    this.form.polId = item.id;
-                    this.form.polCnName = item.cnName;
-                    this.form.polEnName = item.enName;
-                    this.form.polCode = item.code;
-                    this.form.polNamePrint = item.enName;
-                }
-            }
-        },
 
         initData() {
             getDeptTree().then(res => {
@@ -633,33 +427,161 @@ export default {
             });
         },
         //自定义列保存
-        async saveColumnTwo(ref, option, optionBack, code) {
-            /**
-             * 已定义全局方法，直接使用，saveColumnData保存列数据方法,参数传值(表格名称，当前表格的option数据)
-             * 已定义全局方法，直接使用，getColumnName方法用来获取枚举值，参数根据自己定义的code值获取中文名
-             * 一定要执行异步操作，要等接口成功返回，才能执行下一行代码
-             */
-            const inSave = await this.saveColumnData(
-                this.getColumnName(code),
-                this[option]
-            );
-            if (inSave) {
-                this.$message.success("保存成功");
-                //关闭窗口
-                this.$refs[ref].$refs.dialogColumn.columnBox = false;
-            }
+        async saveColumnTwo(ref) {
+            this.$message.success("保存成功");
+            //关闭窗口
+            this.$refs[ref].$refs.dialogColumn.columnBox = false;
         },
         //自定义列重置
-        async resetColumnTwo(ref, option, optionBack, code) {
-            this[option] = this[optionBack];
-            const inSave = await this.delColumnData(
-                this.getColumnName(code),
-                this[optionBack]
-            );
-            if (inSave) {
-                this.$message.success("重置成功");
-                this.$refs[ref].$refs.dialogColumn.columnBox = false;
+        async resetColumnTwo(ref) {
+            this.option = {
+                lazy: true,
+                tip: false,
+                simplePage: true,
+                searchShow: true,
+                searchMenuSpan: 6,
+                tree: true,
+                border: true,
+                index: true,
+                selection: true,
+                viewBtn: true,
+                menuWidth: 300,
+                dialogClickModal: false,
+                column: [
+                    {
+                        label: "机构名称",
+                        prop: "deptName",
+                        search: true,
+                        width: "100",
+                        rules: [
+                            {
+                                required: true,
+                                message: "请输入机构名称",
+                                trigger: "blur"
+                            }
+                        ]
+                    },
+                    {
+                        label: "所属企业",
+                        prop: "tenantId",
+                        type: "tree",
+                        dicUrl: "/api/blade-system/tenant/select",
+                        addDisplay: false,
+                        editDisplay: false,
+                        viewDisplay: website.tenantMode,
+                        span: 24,
+                        props: {
+                            label: "tenantName",
+                            value: "tenantId"
+                        },
+                        hide: !website.tenantMode,
+                        search: website.tenantMode,
+                        rules: [
+                            {
+                                required: true,
+                                message: "请输入所属企业",
+                                trigger: "click"
+                            }
+                        ]
+                    },
+                    {
+                        label: "机构全称",
+                        prop: "fullName",
+                        search: true,
+                        overHidden: true,
+                        rules: [
+                            {
+                                required: true,
+                                message: "请输入机构全称",
+                                trigger: "blur"
+                            }
+                        ]
+                    },
+                    {
+                        label: "上级机构",
+                        prop: "parentId",
+                        dicData: [],
+                        type: "tree",
+                        hide: true,
+                        addDisabled: false,
+                        props: {
+                            label: "title"
+                        },
+                        rules: [
+                            {
+                                required: false,
+                                message: "请选择上级机构",
+                                trigger: "click"
+                            }
+                        ]
+                    },
+                    {
+                        label: "机构类型",
+                        type: "select",
+                        dicUrl:
+                            "/api/blade-system/dict/dictionary?code=org_category",
+                        props: {
+                            label: "dictValue",
+                            value: "dictKey"
+                        },
+                        dataType: "number",
+                        width: 120,
+                        prop: "deptCategory",
+                        slot: true
+                    },
+                    {
+                        label: "英文全称",
+                        prop: "englishFullName",
+                        overHidden: true,
+                        hide: true
+                    },
+                    {
+                        label: "联系电话",
+                        prop: "tel",
+                        overHidden: true
+                    },
+                    {
+                        label: "公司地址",
+                        prop: "address",
+                        overHidden: true
+                    },
+                    {
+                        label: "logo",
+                        prop: "logoUrl",
+                        type: "upload",
+                        listType: "picture-img",
+                        tip: "只能上传jpg/png/jpeg文件，且不超过2M",
+                        action: "/api/blade-resource/oss/endpoint/put-file",
+                        dataType: "string",
+                        propsHttp: {
+                            res: "data",
+                            url: "link"
+                        }
+                    },
+                    {
+                        label: "排序",
+                        prop: "sort",
+                        type: "number",
+                        align: "right",
+                        width: 60,
+                        hide: true
+                    },
+                    {
+                        label: "备注",
+                        prop: "remark",
+                        rules: [
+                            {
+                                required: false,
+                                message: "请输入备注",
+                                trigger: "blur"
+                            }
+                        ],
+                        hide: true
+                    }
+                ]
             }
+            this.$message.success("重置成功");
+            this.$refs[ref].$refs.dialogColumn.columnBox = false;
         }
     }
 };