rongxing-vue/src/views/modules/labelSetting/com_show_label_content.vue

<template>
  <div class="customer-css">
    <el-dialog :title="titleCon" :close-on-click-modal="false" :visible.sync="visible" width="932px" style="height: 480px;" class="customer-dialog">

        <el-form :inline="true" label-position="top" label-width="80px">
            <!-- 按钮区域 -->
          <el-row>
            <el-col :span="24">
              <el-form-item class="customer-button">
               <span>{{labels.labelName}}</span>
                <el-input v-model="pageData.labelName" disabled style="width: 150px;" ></el-input>
              </el-form-item>
              <el-form-item class="customer-button">
                <el-button @click="addLabelParameterModal()" type="primary" style="margin-left: 10px; margin-bottom: 5px;">
                  {{buttons.addButton}}</el-button>
              </el-form-item>
              <el-form-item class="customer-button">
                <el-button @click="updateLabelParameterModal()" type="primary" style="margin-left: 10px; margin-bottom: 5px;">
                  {{buttons.editButton}}</el-button>
              </el-form-item>
              <el-form-item class="customer-button">
                <el-button @click="deleteLabelContentConfirm()" type="primary" style="margin-left: 10px; margin-bottom: 5px;">
                  {{buttons.deleteButton}}</el-button>
              </el-form-item>
              <el-form-item class="customer-button">
                <el-button @click="copyLabelContentMethod()" type="primary" style="margin-left: 10px; margin-bottom: 5px;">
                  {{buttons.copyButton}}</el-button>
              </el-form-item>
              <el-form-item class="customer-button">
                <el-button @click="copyLabelContentWithOtherMethod()" type="primary" style="margin-left: 10px; margin-bottom: 5px;">
                  {{buttons.copyButtonWithOther}}</el-button>
              </el-form-item>
              <el-form-item class="customer-button">
                <el-button type="primary" @click="refreshCurrentPageTable()" style="margin-left: 10px; margin-bottom: 5px;">
                  {{buttons.refreshButton}}</el-button>
              </el-form-item>
            </el-col>
          </el-row>

          <el-form class="customer-components">
            <el-table @row-click="setCurrentRow"
                    :height="height"
                    highlight-current-row
                    :data="labelArrays"
                    border
                    v-loading="dataListLoading"
                    style="width: 100%;">
            <el-table-column
              v-for="(item,index) in columnList" :key="index"
              :sortable="item.columnSortable"
              :prop="item.columnProp"
              :header-align="item.headerAlign"
              :show-overflow-tooltip="item.showOverflowTooltip"
              :align="item.align"
              :fixed="item.fixed==''?false:item.fixed"
              :width="item.columnWidth"
              :label="item.columnLabel">
              <template slot-scope="scope">
                <span v-if="!item.columnHidden"> {{ scope.row[item.columnProp] }}</span>
                <span v-if="item.columnImage"><img :src="scope.row[item.columnProp]"
                                                   style="width: 100px; height: 80px"/></span>
              </template>
            </el-table-column>
            <el-table-column
              fixed="left"
              header-align="center"
              align="center"
              width="150"
              :label=labels.operationLabel>
              <template slot-scope="scope">
                <a class="customer-a" v-if="scope.row.dbFieldName === '流水号'"  @click="serialRuleModal(scope.row)">{{ labels.serialRuleLabel }}</a>
                <a class="customer-a" v-if="scope.row.dbFieldName === '流水号'" @click="serialInfoModal(scope.row)">{{ labels.serialInfoLabel }}</a>
              </template>
            </el-table-column>
          </el-table>
          </el-form>
        </el-form>
    </el-dialog>
    <!-- 新增或者修改的modal   -->
    <comAddUpdateLabel  ref="comAddUpdateLabel" @refreshCurrentPageTable="refreshCurrentPageTable" v-drag></comAddUpdateLabel>
    <!--  复制其他的模版的标签  -->
    <comCopyLabelAllContents  ref="comCopyLabelAllContents" @refreshCurrentPageTable="refreshCurrentPageTable" v-drag></comCopyLabelAllContents>
    <!--  标签内容流水号规则  -->
    <comLabelContentSerialRule  ref="comLabelContentSerialRule" @refreshCurrentPageTable="refreshCurrentPageTable" v-drag></comLabelContentSerialRule>
    <!--  标签内容流水号信息  -->
    <comShowLabelSerialInfo  ref="comShowLabelSerialInfo" @refreshCurrentPageTable="refreshCurrentPageTable" v-drag></comShowLabelSerialInfo>

  </div>
</template>

<script>
import {
  getLabelContentList,
  deleteLabelContent,
  copyLabelContent,
} from '@/api/labelSetting/com_show_label_content.js';

/*引入組件*/
import comAddUpdateLabel from "./com_add_update_label_content";/*新增或者修改的組件*/
import comCopyLabelAllContents from "./com_copy_label_content";/*复制报表内容的組件*/
import comLabelContentSerialRule from "./com_label_content_serial_rule";/*复制报表内容的組件*/
import comShowLabelSerialInfo from "./com_show_label_serial_info";/*标签内容流水号信息的組件*/

/* 动态表头 */
import {
  saveTableDefaultList,
  getTableDefaultListLanguage,
  getTableUserListLanguage,
  removerDefault,
  removerUser
} from '@/api/table.js'

import {
  searchSysLanguagePackList,
  searchSysLanguageParam,
  searchFunctionButtonList,
  saveButtonList,
  searchSysLanguage,
  searchLanguageListByLanguageCode,
  saveSysLanguageOne,
  searchPageLanguageData,
  removerLanguage,
  saveSysLanguageList
} from "@/api/sysLanguage.js";

var functionId = 'C10000046';

export default {
  data() {
    return {
      titleCon: '打印内容定义',
      showDefault: false,
      visible: false,
      height: 200,
      pageData: {
        site: this.$store.state.user.site,
        username: this.$store.state.user.name,
        labelNo: '',
        labelType: '',
        labelName: '',
        labelClass: '',
        remark: '',
        searchFlag: 'N',
      },
      columnList: [
        {
          userId: this.$store.state.user.name,
          functionId: 'C10000046',
          serialNumber: 'C10000046LabelItemNo',
          tableId: 'C10000046Label',
          tableName: '标签参数定义',
          columnProp: 'itemNo',
          headerAlign: 'center',
          align: 'center',
          columnLabel: '序号',
          columnWidth: 60,
          columnHidden: false,
          columnImage: false,
          columnSortable: true,
          sortLv: 0,
          status: true,
          fixed: ''
        }, {
          userId: this.$store.state.user.name,
          functionId: 'C10000046',
          serialNumber: 'C10000046LabelItemDesc',
          tableId: 'C10000046Label',
          tableName: '标签参数定义',
          columnProp: 'itemDesc',
          headerAlign: 'center',
          align: 'center',
          columnLabel: '内容描述',
          columnWidth: 80,
          columnHidden: false,
          columnImage: false,
          columnSortable: true,
          sortLv: 0,
          status: true,
          fixed: ''
        }, {
          userId: this.$store.state.user.name,
          functionId: 'C10000046',
          serialNumber: 'C10000046LabelObjectName',
          tableId: 'C10000046Label',
          tableName: '标签参数定义',
          columnProp: 'objectName',
          headerAlign: 'center',
          align: 'center',
          columnLabel: 'Bartender字符串名称',
          columnWidth: 180,
          columnHidden: false,
          columnImage: false,
          columnSortable: true,
          sortLv: 0,
          status: true,
          fixed: ''
        }, {
          userId: this.$store.state.user.name,
          functionId: 'C10000046',
          serialNumber: 'C10000046LabelObjectGroup',
          tableId: 'C10000046Label',
          tableName: '标签参数定义',
          columnProp: 'objectGroup',
          headerAlign: 'center',
          align: 'left',
          columnLabel: 'Bartender控件名称',
          columnWidth: 180,
          columnHidden: false,
          columnImage: false,
          columnSortable: false,
          sortLv: 0,
          status: true,
          fixed: ''
        }, {
          userId: this.$store.state.user.name,
          functionId: 'C10000046',
          serialNumber: 'C10000046LabelDbFieldName',
          tableId: 'C10000046Label',
          tableName: '标签参数定义',
          columnProp: 'dbFieldName',
          headerAlign: 'center',
          align: 'left',
          columnLabel: '对应ERP字段',
          columnWidth: 100,
          columnHidden: false,
          columnImage: false,
          columnSortable: false,
          sortLv: 0,
          status: true,
          fixed: ''
        }, {
          userId: this.$store.state.user.name,
          functionId: 'C10000046',
          serialNumber: 'C10000046LabelSequenceBits',
          tableId: 'C10000046Label',
          tableName: '标签参数定义',
          columnProp: 'sequenceBits',
          headerAlign: 'center',
          align: 'left',
          columnLabel: '流水号位数',
          columnWidth: 80,
          columnHidden: false,
          columnImage: false,
          columnSortable: false,
          sortLv: 0,
          status: true,
          fixed: ''
        }, {
          userId: this.$store.state.user.name,
          functionId: 'C10000046',
          serialNumber: 'C10000046LabelIntervalValue',
          tableId: 'C10000046Label',
          tableName: '标签参数定义',
          columnProp: 'intervalValue',
          headerAlign: 'center',
          align: 'left',
          columnLabel: '流水码增量',
          columnWidth: 80,
          columnHidden: false,
          columnImage: false,
          columnSortable: false,
          sortLv: 0,
          status: true,
          fixed: ''
        },
      ],
      currentRow: {},
      labelArrays: [],
      dataListLoading: false,
      queryTable: {
        userId: this.$store.state.user.name,
        functionId: functionId,
        tableId: 'C10000046Label',
        languageCode: this.$i18n.locale
      },
      // 用户table 查询参数
      queryTableUser: {
        userId: this.$store.state.user.name,
        functionId: functionId,
        tableId: 'C10000046Label',
        status: true,
        languageCode: this.$i18n.locale
      },
      buttons: {
        addButton: '新增',
        editButton: '修改',
        deleteButton: '删除',
        copyButton: '复制',
        copyButtonWithOther: '从其他模版复制',
        refreshButton: '刷新',
      },
      queryButton: {
        functionId: functionId,
        table_id: '*',
        languageCode: this.$i18n.locale,
        objectType: 'button'
      },
      labels: {
        titleCon: '打印内容定义',
        labelName: '标签名称:',
        serialRuleLabel: '流水号规则',
        serialInfoLabel: '流水号信息',
        sureDeleteThisRecord: '确定要删除该记录吗?',
        tipsLabel: '提示',
        confirmLabel: '确定',
        cancelLabel: '取消',
      },
      queryLabel: {
        functionId: functionId,
        table_id: '*',
        languageCode: this.$i18n.locale,
        objectType: 'label'
      },
    }
  },
  methods: {
    //初始化组件的参数
    init(currentRow) {
      //初始化参数
      this.pageData = JSON.parse(JSON.stringify(currentRow));
      //打开页面
      this.visible = true;
      //默认不查询
      this.searchFlag = 'Y';
      //判断是否启用多语言
      this.getMultiLanguageList();
      // 获取动态表头的信息
      this.getTableUserColumn();
      //重置标题
      this.titleCon = this.labels.titleCon;
      //组合标签内容
      this.pageData.labelName = this.pageData.labelType +" "+ this.pageData.remark;
      //刷新当前页面的table
      this.getLabelContentMethod();
    },

    /*刷新页面*/
    refreshCurrentPageTable(){
      this.pageData.searchFlag = 'Y';
      //调用方法 刷新数据
      this.getLabelContentMethod();
    },

    /*查询列表的参数*/
    getLabelContentMethod(){
      getLabelContentList(this.pageData).then(({data}) => {
        this.labelArrays = data.rows;
      });
    },

    /* 设置选中行的参数 */
    setCurrentRow(row, column, event) {
      this.currentRow = JSON.parse(JSON.stringify(row))
    },

    /*新增打印参数*/
    addLabelParameterModal(){
      let currentData = {
        site: this.$store.state.user.site,
        username: this.$store.state.user.name,
        labelNo: this.pageData.labelNo,
        itemNo: '',
        showSeqNo: '',
        itemDesc: '',
        objectName: '',
        objectGroup: '',
        dbFieldName: '',
        sequenceBits: -1,
        intervalValue: -1,
        sequenceNoFlag: 'N',
        addFlag: 'Y',
      };
      //打开组件 去做新增业务
      this.$nextTick(() => {
        this.$refs.comAddUpdateLabel.init(currentData);
      })
    },

    /*验证时长的参数*/
    updateLabelParameterModal(){
      //打开组件 去做新增业务
      this.$nextTick(() => {
        this.$refs.comAddUpdateLabel.init(this.currentRow);
      })
    },

    /*删除打印参数*/
    deleteLabelContentConfirm(){
      this.$confirm(this.labels.sureDeleteThisRecord, this.labels.tipsLabel, {
        confirmButtonText: this.labels.confirmLabel,
        cancelButtonText: this.labels.cancelLabel,
        type: 'warning'
      }).then(() => {
        deleteLabelContent(this.currentRow).then(({data}) => {
          if (data && data.code == 200) {
            this.refreshCurrentPageTable();
            this.$message.success(data.msg);
          } else {
            this.$message.error(data.msg);
          }
        });
      });
    },

    /*复制打印参数*/
    copyLabelContentMethod(){
      copyLabelContent(this.currentRow).then(({data}) => {
        if (data && data.code == 200) {
          this.refreshCurrentPageTable();
          this.$message.success(data.msg);
        } else {
          this.$message.error(data.msg);
        }
      });
    },

    copyLabelContentWithOtherMethod(){
      //打开组件 去做复制其他标签业务
      this.$nextTick(() => {
        this.$refs.comCopyLabelAllContents.init(this.pageData);
      })
    },

    /*流水号规则的modal*/
    serialRuleModal(row){
      //打开组件 去做复制其他标签业务
      this.$nextTick(() => {
        this.$refs.comLabelContentSerialRule.init(row);
      })
    },

    /*流水号信息的modal*/
    serialInfoModal(row){
      //打开组件 去做复制其他标签业务
      this.$nextTick(() => {
        this.$refs.comShowLabelSerialInfo.init(row);
      })
    },

    /*关闭modal*/
    closeDialog(){
      //刷新报工的页面
      this.$emit('refreshPageTables');
      //关闭当前的页面
      this.visible = false;
    },

    getMultiLanguageList() {
      //首先查询当前按钮的多语言
      searchFunctionButtonList(this.queryButton).then(({data}) => {
        if (data && data.code == 0 ) {
          this.buttons = data.data
        } else {
          // saveButtonList(this.buttonList).then(({data}) => {
          // })
        }
      });
      //其次查询当前标签的多语言
      searchFunctionButtonList(this.queryLabel).then(({data}) => {
        if (data && data.code == 0 ) {
          this.labels = data.data
        } else {
          // saveButtonList(this.buttonList).then(({data}) => {
          // })
        }
      });
    },

    // 获取 用户保存的 格式列
    getTableUserColumn() {
      getTableUserListLanguage(this.queryTableUser).then(({data}) => {
        if (data && data.code == 0 && data.rows.length > 0) {
          // this.columnList = []
          this.columnList = data.rows
        } else {
          this.getColumnList()
        }
      })
    },

    // 获取 tableDefault 列
    getColumnList() {
      getTableDefaultListLanguage(this.queryTable).then(({data}) => {
        if (data && data.code == 0) {
          // this.showDefault = false
          this.columnList = data.rows
        } else {
          // this.showDefault = true
        }
      })
    },


  },
  /*组件*/
  components: {
    comAddUpdateLabel,/*标签新增或者修改的组件*/
    comCopyLabelAllContents,/*复制报表的内容*/
    comLabelContentSerialRule,/*标签内容序列号规则*/
    comShowLabelSerialInfo,/*标签内容流水号信息的組件*/
  },
  mounted() {
    this.$nextTick(() => {
      this.height = 265;
    })
  },
  created() {
    // this.factoryList()
    // this.getLanguageList()
  }
}

</script>

<style scoped lang="scss">
 .customer-css .el-tabs__content{
  padding: 0px !important;
}

</style>