lshcomment 1.0.0

package/src/components/iris-areaqueryshop/lsh-edit-index.vue

@@ -0,0 +1,341 @@
+<template>
+  <div class="row warp pma">
+    <div class="col-md-4" ref="select1">
+      <el-tooltip
+        class="item"
+        effect="dark"
+        :content="currentLabels"
+        placement="top-start"
+      >
+        <el-cascader
+          ref="area"
+          style="width: 100%"
+          :options="options"
+          v-model="selectedOptions"
+          @change="handleChange"
+        >
+        </el-cascader>
+      </el-tooltip>
+    </div>
+    <div class="col-md-8" style="padding-left: 0">
+      <el-select
+        v-model="storeCodes"
+        :multiple="checkFlag"
+        :filterable="!storeFlag"
+        placeholder="请选择门店"
+        @change="changeValue"
+        style="width: 100%"
+        :disabled="storeFlag"
+      >
+        <el-option
+          v-for="item in values"
+          :key="item.value"
+          :label="item.label"
+          :disabled="item.disabled"
+          :value="item.value"
+          :orgCode="item.orgCode"
+        >
+        </el-option>
+      </el-select>
+    </div>
+  </div>
+</template>
+<script>
+import vue from "vue";
+import treepicker from "../treepicker/treepicker.vue";
+import api from "../../common/api";
+import config from "../../common/config";
+import { Tree, Tooltip, Cascader } from "element-ui";
+vue.use(Tooltip);
+
+import { mapGetters } from "vuex";
+
+export default {
+  data() {
+    return {
+      selectText: "",
+      options: [],
+      selectedOptions: [],
+      values: [],
+      storeCodes: [],
+      storeMap: {},
+      currentLabels: "",
+      storeFlag: false,
+      flag: false, //门店数据请求完成
+    };
+  },
+  props: {
+    area: {
+      type: String,
+      default: "",
+    },
+    store: {
+      type: String,
+      default: "",
+    },
+    readonly: {
+      type: Boolean,
+      default: false,
+    },
+    checkFlag: {
+      type: Boolean,
+      default: true,
+    },
+    showStoreName: {
+      type: Boolean,
+      default: false,
+    },
+    codeset: {
+      type: Array,
+      default: function () {
+        return [];
+      },
+    },
+    createOrgCode: {
+      type: Array,
+      default: function () {
+        return [];
+      },
+    },
+  },
+  methods: {
+    //查询当前的组织
+    queryOrganization() {
+      this.userInfo.inCharegOrgVo.orgCode =
+        this.userInfo.inCharegOrgVo.orgCode == "000001"
+          ? "00000001"
+          : this.userInfo.inCharegOrgVo.orgCode;
+
+      const option = { orgCodes: [this.userInfo.inCharegOrgVo.orgCode] };
+      api.liApi.org.queryOrgSetByOrg(
+        { orgCodes: [this.userInfo.inCharegOrgVo.orgCode] },
+        (res) => {
+          if (res.data.code == "success") {
+            let obj = res.data.obj || [];
+            this.options = obj.map(
+              ({ orgName: label, orgCode: value, subOrgList: children }) => {
+                children = children.map(
+                  ({ orgName: label, orgCode: value }) => ({ label, value })
+                );
+                if (children.length > 1) {
+                  children.unshift({
+                    label: "全部PMA",
+                    value: "",
+                  });
+                }
+                if (!children.length) {
+                  children.push({
+                    label: "暂无PMA",
+                    value: "",
+                  });
+                }
+                return { label, value, children };
+              }
+            );
+            if (this.options.length > 1) {
+              this.options.unshift({
+                label: "全部大区",
+                value: "",
+                children: [
+                  {
+                    label: "全部PMA",
+                    value: "",
+                  },
+                ],
+              });
+            }
+          }
+
+          // 设置当前组织的默认属性
+          // this.selectedOptions = ['00000020', '50001681']
+          this.currentLabels = `${this.options[0].label} / ${this.options[0].children[0].label}`;
+          //默认查门店
+          let storeInfo = this.userInfo.userAvailableInfo;
+          if (storeInfo.availableType == "0") {
+            //如果是门店账号无需在查门店，直接取
+            this.values = [
+              {
+                label: storeInfo.storeInfoVo.storeName,
+                value: storeInfo.storeInfoVo.storeCode,
+                orgCode: storeInfo.storeInfoVo.orgCode,
+              },
+            ];
+            //默认设置门店选中
+            this.storeCodes = this.checkFlag
+              ? [this.values[0].value]
+              : this.values[0].value;
+          } else {
+            //不是门店账号的话，再去查
+            // this.queryStores(
+            //   this.options[0].value == ""
+            //     ? "00000001"
+            //     : this.options[0].children[0].value || this.options[0].value
+            // );
+          }
+        }
+      );
+    },
+    handleChange(val,flag) {
+      console.log(val,'1231');
+      //获取当前选中的文字值
+      this.currentLabels = this.$refs.area.currentLabels.join(" / ");
+      let storeInfo = this.userInfo.userAvailableInfo || {};
+      if (storeInfo.availableType == "0") return; //门店账号选中大区的时候，锁定门店
+      let org = val[1] || val[0] || "00000001"; //val两个值都是空，说明是集团
+      this.queryStores(org,flag);
+    },
+
+    // 默认查询门店
+    queryStores(val,flag) {
+      this.$emit('returnId',val)
+      const option = {
+        orgCodes: [val],
+      };
+      console.log(option, "option");
+      api.liApi.org.queryStoreSetByOrg(option, (res) => {
+        if (res.data.code == "success") {
+          this.values = res.data.obj.map(
+            ({ storeName: label, storeCode: value, orgCode: orgCode }) => ({
+              label,
+              value,
+              disabled: false,
+              orgCode,
+            })
+          );
+           this.flag = true;
+          // 多选添加全部
+          if (this.checkFlag) {
+            this.values.unshift({
+              label: "全部门店",
+              value: "",
+              disabled: false,
+              orgCode: "",
+            });
+          }
+          this.values.forEach(({ label, value }) => {
+            this.storeMap.value = label;
+          });
+          //默认设置门店
+          let arr = [];
+          if(flag==1){
+            arr=this.storeCodes
+          }else{
+             this.storeCodes = this.checkFlag
+            ? [this.values[0].value]
+            : this.values[0].value;
+             arr = this.values
+            .map((item) => item.value)
+            .filter((item) => item && item.trim());
+          }
+         
+        
+         
+          // this.$emit('select-change',arr,this.values.filter(item => item.value !=='' ))
+          console.log(arr,'3333333333');
+          this.changeValue(this.checkFlag ? arr : this.values[0].value);
+        }
+      });
+    },
+
+    changeValue(val) {
+      let arr = [];
+      if (val.includes("") && Array.isArray(val)) {
+        arr = this.values
+          .map((item) => {
+            this.$set(item, "disabled", true);
+            return item.value;
+          })
+          .filter((item) => item && item.trim());
+      } else {
+        this.values.forEach((item) => {
+          if (item.value == "" && val.length) item.disabled = true;
+          else item.disabled = false;
+        });
+        arr = val;
+      }
+
+      this.$emit(
+        "select-change",
+        arr,
+        this.values.filter((item) => item.value !== "")
+      );
+    },
+    // 清空值方法
+    reset() {
+      this.queryOrganization();
+    },
+  },
+  watch: {
+    createOrgCode: {
+      handler(val) {
+       if(val[0]=='000001'&&val[1]=='00000001'){
+         this.selectedOptions = ['',''];
+       }else{
+         console.log(val,"val1");
+         if(val[0]=='00000001'){
+           this.selectedOptions = [val[1],'']
+         }else{
+           this.selectedOptions = val;
+         }
+          
+       }
+        
+       
+      },
+      deep: true,
+      immediate: true,
+    },
+
+     codeset: {
+      handler(val) {
+        if (this.flag) {
+          this.storeCodes = val;
+        } else {
+          setTimeout(() => {
+            this.storeCodes = val;
+          }, 1000);
+        }   
+      },
+      deep: true,
+      immediate: true,
+    },
+  },
+  computed: {
+    userInfo() {
+      return JSON.parse(sessionStorage.getItem("userInfo"));
+    },
+  },
+  components: {},
+  created() {
+    //获取组织
+    this.queryOrganization();
+    let storeInfo = this.userInfo.userAvailableInfo || {};
+    if (storeInfo.availableType == "0") this.storeFlag = true;
+    else this.storeFlag = false;
+  },
+};
+</script>
+
+<style lang="scss" scoped>
+.pma {
+  .el-select__tags {
+    text-align: left !important;
+  }
+  .el-tag {
+    max-width: 100%;
+    text-align: left;
+  }
+  .el-select__tags-text {
+    display: inline-block;
+    //   max-width: 90%;
+    overflow: hidden;
+    text-overflow: ellipsis;
+    line-height: 1;
+  }
+//   /deep/ .pma .el-tag{
+//    overflow: hidden;
+//    text-overflow:ellipsis;
+//    white-space: nowrap;
+//  }
+}
+</style>

package/src/components/iris-areaqueryshop/lsh-index.vue

@@ -0,0 +1,301 @@
+<template>
+    <div class="row warp pma">
+        <div class="col-md-4" ref="select1">
+          <el-tooltip class="item" effect="dark" :content="currentLabels" placement="top-start">
+          <el-cascader
+          ref="area"
+          style="width:100%"
+          :options="options"
+          v-model="selectedOptions"
+          @change="handleChange">
+        </el-cascader>
+       </el-tooltip>
+        </div>
+        <div class="col-md-8" style="padding-left:0">
+          <el-select v-model="storeCodes" :multiple="checkFlag"  :filterable="!storeFlag"  placeholder="请选择门店" @change="changeValue" style="width:100%"  :disabled="storeFlag">
+            <el-option
+              v-for="item in values"
+              :key="item.value"
+              :label="item.label"
+              :disabled="item.disabled"
+              :value="item.value"
+              :orgCode="item.orgCode">
+            </el-option>
+          </el-select>
+        </div>
+    </div>
+</template>
+<script>
+import vue from "vue";
+import api from "@/common/api";
+import { Tree , Tooltip,Cascader} from "element-ui";
+vue.use(Tooltip)
+
+export default {
+  data() {
+    return {
+      selectText:'',
+      options: [],
+      selectedOptions: [],
+      values: [],
+      allValues: [],
+      storeCodes: [],
+      storeMap:{},
+      currentLabels:'',
+      storeFlag:false,
+      isCcc:false,
+      customerCenterInfoVos:[],
+      firstChange:true,
+    };
+  },
+  props: {
+    area: {
+      type: String,
+      default: ''
+    },
+    store: {
+      type: String,
+      default: ''
+    },
+    readonly: {
+      type: Boolean,
+      default: false
+    },
+    checkFlag: {
+      type: Boolean,
+      default: true
+    },
+    showStoreName:{
+      type: Boolean,
+      default: false
+    },
+    showCcc:{
+      type: Boolean,
+      default: false
+    },
+    isGroup:{
+      type: Number,
+      default: 0
+    },
+    isAll:{
+      type: Boolean,
+      default: false
+    },
+  },
+  methods: {
+    //查询当前的组织
+    queryOrganization(){
+      this.userInfo.inCharegOrgVo.orgCode = this.userInfo.inCharegOrgVo.orgCode == '000001' ? '00000001':this.userInfo.inCharegOrgVo.orgCode
+      
+      const option = {orgCodes:[this.userInfo.inCharegOrgVo.orgCode]}
+      api.liApi.org.queryOrgSetByOrg({orgCodes:[this.userInfo.inCharegOrgVo.orgCode],},res =>{
+        if(res.data.code == 'success'){
+          let obj = res.data.obj ||[]
+           this.options = obj.map(({orgName:label,orgCode:value,subOrgList:children,}) => {
+             children = children.map(({orgName:label,orgCode:value}) => ({label,value}))
+             if(children.length > 1){
+                children.unshift({
+                  label:'全部PMA',
+                  value:"",
+                })
+             }
+             if(!children.length){
+                children.push({
+                  label:'暂无PMA',
+                  value:"",
+                })
+             }
+             return {label,value,children}
+           })
+          if(this.options.length > 1){
+              this.options.unshift({
+                label:'全部大区',
+                value:"",
+                children:[{
+                  label:'全部PMA',
+                  value:"",
+                }]
+              })
+            }
+        }
+
+        // 设置当前组织的默认属性
+        if(!this.selectedOptions.length) this.selectedOptions = [this.options[0].value,this.options[0].children[0].value]
+        this.currentLabels = `${this.options[0].label} / ${this.options[0].children[0].label}`
+        //默认查门店
+        let storeInfo = this.userInfo.userAvailableInfo
+        if(storeInfo.availableType == '0' && !this.isAll){ //如果是门店账号无需在查门店，直接取
+          if(this.isCcc){
+            this.values = this.customerCenterInfoVos.map(item => {
+              return {
+                label:item.storeName,
+                value:item.storeCode,
+                orgCode: item.orgCode,
+              }
+            })
+          } else {
+            this.values = [{
+              label:storeInfo.storeInfoVo.storeName,
+              value:storeInfo.storeInfoVo.storeCode,
+              orgCode: storeInfo.storeInfoVo.orgCode
+            }]
+          }
+            //默认设置门店选中
+            if(!this.storeCodes.length) this.storeCodes = this.checkFlag ? [storeInfo.storeInfoVo.storeCode] : storeInfo.storeInfoVo.storeCode
+        }else{//不是门店账号的话，再去查
+          if(this.selectedOptions.length){
+            this.queryStores(this.selectedOptions[1] || this.selectedOptions[0] || '00000001')
+          } else {
+            this.queryStores(this.options[0].value == "" ? "00000001" : this.options[0].children[0].value || this.options[0].value)
+          }
+        }
+      })
+
+      
+    },
+    handleChange(val){
+      //获取当前选中的文字值
+      this.currentLabels = this.$refs.area.currentLabels.join(' / ')
+      let storeInfo = this.userInfo.userAvailableInfo || {}
+      if(storeInfo.availableType == '0' && !this.isAll) return //门店账号选中大区的时候，锁定门店
+      let org = val[1] || val[0] || '00000001'//val两个值都是空，说明是集团
+      this.storeCodes = this.checkFlag ? [] : ''
+      console.log(org,val,"val");
+      this.queryStores(org)
+    },
+
+    // 默认查询门店
+    queryStores(val){
+      this.$emit('returnId',val)
+      const option = {
+        orgCodes:[val],
+        isGroup:this.isGroup,
+      }
+      api.liApi.org.queryStoreSetByOrg(option,res =>{
+        if(res.data.code == 'success'){
+            this.values = res.data.obj.filter(item => item.storeType != 'storeTypeInside').map(({storeName:label,storeCode:value,orgCode: orgCode}) =>({label,value,disabled:false,orgCode}))
+            this.allValues = res.data.obj.map(item => item.storeCode)
+            // 多选添加全部
+            if(this.checkFlag){
+              this.values.unshift({
+                label:'全部门店',
+                value:"",
+                disabled:false,
+                orgCode: ''
+              })
+            }
+            this.values.forEach(({label,value})=>{
+              this.storeMap.value = label
+            })
+           //默认设置门店
+          if(this.storeCodes.length){
+          this.changeValue(this.storeCodes)
+          } else {
+           this.storeCodes = this.checkFlag ? [this.values[0].value] : this.values[0].value
+            let arr = []
+            arr = this.values.map(item => item.value).filter(item => item && item.trim())
+            // this.$emit('select-change',arr,this.values.filter(item => item.value !=='' ))
+            this.changeValue(this.checkFlag ? arr : this.values[0].value )
+          }
+        }
+      })
+    },
+    getStoreName() {
+      return this.values.filter(item => item.value == this.storeCodes)[0].label
+    },
+    changeValue(val){
+       let arr = []
+       let storeName = ''
+       if(val.includes('') && Array.isArray(val)) {
+         arr = this.values.map(item => {
+            this.$set(item,'disabled',true)
+            return item.value
+         }).filter(item => item && item.trim())
+       }
+       else {
+          this.values.forEach(item => {
+            if(item.value == '' && val.length) item.disabled = true
+            else item.disabled = false
+          })
+          arr = val
+       }
+      if(val.includes('') && Array.isArray(val) && this.isGroup == 1) {
+        arr = this.allValues
+      }
+      this.$emit('select-change',arr,this.values.filter(item => item.value !=='' ))
+      this.$nextTick(() => {
+        if(this.firstChange){
+          this.firstChange = false
+          this.$emit('firstChange')
+        }
+      });
+    },
+    // 清空值方法
+    reset() {
+      this.selectedOptions = []
+      this.storeCodes = this.checkFlag ? [] : ''
+      this.queryOrganization()
+    },
+    // 获取值
+    getOrgStore(){
+      return [this.selectedOptions, this.storeCodes]
+    },
+    // 设置值，回显
+    setOrgStore(value){
+      this.selectedOptions = value[0] || []
+      this.storeCodes = value[1] || []
+    },
+    // 设置缓存
+    setCache(key = ''){
+      this.$store.commit('queryParams/setParams', {params: this.getOrgStore(), key: `${this.$route.path}Store${key}`})
+    },
+    // 应用缓存
+    useCache(key = ''){
+      this.setOrgStore(this.$store.state.queryParams[`${this.$route.path}Store${key}`])
+    },
+  },
+  computed: {
+    userInfo(){
+      let userInfo = JSON.parse(sessionStorage.getItem('userInfo')) || {}
+      if(this.isAll){
+        userInfo.inCharegOrgVo.orgCode = '00000001'
+      }
+      return userInfo
+    }
+  },
+  watch: {
+  },
+  components: {
+  },
+  created() {
+    //获取组织
+    this.queryOrganization()
+    let storeInfo = this.userInfo.userAvailableInfo || {}
+    if(this.showCcc && storeInfo.customerCenterInfo && storeInfo.customerCenterInfo.customerCenterInfoVos.length){
+      this.isCcc = true
+      this.customerCenterInfoVos = storeInfo.customerCenterInfo.customerCenterInfoVos
+    }
+    if(storeInfo.availableType == '0' && !this.isCcc && !this.isAll) this.storeFlag = true
+    else this.storeFlag = false
+  }
+};
+</script>
+
+<style lang="scss">
+  .pma {
+    .el-select__tags {
+      text-align: left !important;
+    }
+    .el-tag {
+      max-width: 100%;
+      text-align: left;
+    }
+    .el-select__tags-text {
+      display: inline-block;
+    //   max-width: 90%;
+      overflow: hidden;
+      text-overflow: ellipsis;
+      line-height: 1;
+    }
+  }
+</style>