lxl
2022-10-27 f6ebd1820968db8521bed86d25b183efe7eb877b
src/views/datamanage/styleManage.vue
@@ -1,11 +1,19 @@
<template>
  <div class="authorityManagement_box">
    <My-bread :list="['数据管理', '样式管理']"></My-bread>
    <My-bread
      :list="[
        `${$t('dataManage.dataManage')}`,
        `${$t('dataManage.styleManage')}`,
      ]"
    ></My-bread>
    <el-divider />
    <div class="searchComp">
      <el-form ref="ruleForm" :model="ruleForm" :inline="true">
        <el-form-item label="关键字" prop="name">
          <el-input v-model="ruleForm.name" placeholder="请输入" />
        <el-form-item :label="$t('dataManage.vmobj.keyword')" prop="name">
          <el-input
            v-model="ruleForm.name"
            :placeholder="$t('common.pleaseInput')"
          />
        </el-form-item>
        <el-form-item>
          <el-button
@@ -13,28 +21,28 @@
            icon="el-icon-search"
            type="primary"
            size="small"
            >查询</el-button
            >{{ $t('common.iquery') }}</el-button
          >
          <el-button
            @click="resetForm('ruleForm')"
            icon="el-icon-refresh"
            type="info"
            size="small"
            >重置</el-button
            >{{ $t('common.empty') }}</el-button
          >
          <el-button
          <el-button  v-if="btnStatus.insert"
            @click="InsertFormdialog = true"
            icon="el-icon-edit"
            type="success"
            size="small"
            >新增</el-button
            >{{ $t('common.append') }}</el-button
          >
          <el-button
          <el-button  v-if="btnStatus.delete"
            @click="delStyleData"
            icon="el-icon-delete"
            type="danger"
            size="small"
            >删除</el-button
            >{{ $t('common.delete') }}</el-button
          >
        </el-form-item>
      </el-form>
@@ -44,61 +52,113 @@
        <div class="table_box">
          <el-table
            :data="tableData"
            border
            style="width: 100%"
            fit
            height="100%"
            @selection-change="handleSelectionChange"
          >
            <el-table-column type="selection" width="55" />
            <el-table-column width="50" type="index" label="序号" />
            <el-table-column min-width="70" prop="name" label="样式名称" />
            <!-- <el-table-column min-width="70" prop="path" label="存储目录" /> -->
            <el-table-column min-width="70" prop="type" label="类型" />
            <!-- <el-table-column min-width="70" prop="img" label="图片" /> -->
            <el-table-column
              min-width="150"
              prop="queryLevel"
              label="所属目录"
              align="center"
              type="index"
              :label="$t('dataManage.styleObj.index')"
              width="70px"
            />
            <el-table-column align="center" prop="id" v-if="false" />
            <el-table-column
              align="center"
              prop="name"
              :label="$t('dataManage.styleObj.name')"
            />
            <el-table-column
              min-width="100"
              prop="create_time"
              label="创建时间"
              align="center"
              prop="type"
              :label="$t('dataManage.styleObj.type')"
            />
            <el-table-column
              min-width="100"
              prop="create_user"
              label="创建人员"
              align="center"
              prop="dirName"
              :label="$t('dataManage.styleObj.dirid')"
            />
            <el-table-column min-width="100" prop="up_time" label="更新时间" />
            <el-table-column min-width="100" prop="up_user" label="更新人员" />
            <el-table-column min-width="70" prop="format" label="格式" />
            <el-table-column min-width="100" prop="up_unit" label="上传单位" />
            <el-table-column min-width="70" prop="status" label="状态" />
            <el-table-column min-width="70" prop="version" label="版本" />
            <el-table-column min-width="70" prop="accuracy" label="精度" />
            <el-table-column min-width="70" prop="remarks" label="备注" />
            <el-table-column min-width="100" label="操作">
            <el-table-column
              align="center"
              prop="depName"
              :label="$t('dataManage.styleObj.depid')"
            />
            <el-table-column
              align="center"
              prop="ver"
              :label="$t('dataManage.styleObj.ver')"
            />
            <el-table-column
              align="center"
              prop="status"
              :label="$t('dataManage.styleObj.status')"
              :formatter="formatStatus"
            />
            <el-table-column
              align="center"
              prop="precision"
              :label="$t('dataManage.styleObj.precision')"
            />
            <el-table-column
              align="center"
              prop="descr"
              :label="$t('dataManage.styleObj.descr')"
            />
            <!-- <el-table-column
              align="center"
              prop="fileGuid"
              :label="$t('dataManage.styleObj.fileguid')"
            />
            <el-table-column
              align="center"
              prop="viewGuid"
              :label="$t('dataManage.styleObj.viewguid')"
            />
            <el-table-column
              align="center"
              prop="createUser"
              :label="$t('dataManage.styleObj.createUser')"
            />
            <el-table-column
              align="center"
              prop="createTime"
              :label="$t('dataManage.styleObj.createTime')"
              :formatter="formatTime"
            />
            <el-table-column
              align="center"
              prop="updateUser"
              :label="$t('dataManage.styleObj.updateUser')"
            />
            <el-table-column
              align="center"
              prop="updateTime"
              :label="$t('dataManage.styleObj.updateTime')"
              :formatter="formatTime"
            /> -->
            <el-table-column
              align="center"
              prop="bak"
              :label="$t('dataManage.styleObj.bak')"
            />
            <el-table-column min-width="120" :label="$t('common.operate')">
              <template slot-scope="scope">
                <el-link
                  :underline="false"
                <el-button
                  @click="showDetail(scope.$index, scope.row)"
                  >查看</el-link
                  type="primary"
                  plain
                  size="small"
                  >{{ $t('common.see') }}</el-button
                >
                <el-link
                  :underline="false"
                <el-button
                  @click="handleEdit(scope.$index, scope.row)"
                  style="margin-left: 10px"
                  >修改</el-link
                  type="warning"
                  plain
                  size="small"
                  >{{ $t('common.update') }}</el-button
                >
                <!-- <el-link
                  :underline="false"
                  @click="handleDelete(scope.$index, scope.row)"
                  style="margin-left: 10px"
                  >删除</el-link
                > -->
              </template>
            </el-table-column>
          </el-table>
@@ -110,9 +170,9 @@
          <el-pagination
            @size-change="handleSizeChange"
            @current-change="handleCurrentChange"
            :current-page="currentPage1"
            :current-page="listData.pageIndex"
            :page-sizes="[10, 20, 50, 100]"
            :page-size="pageNum"
            :page-size="listData.pageSize"
            layout="total, sizes, prev, pager, next, jumper"
            :total="count"
          >
@@ -123,305 +183,431 @@
    <div class="infoBox" v-show="showinfoBox">
      <el-card class="box-card">
        <div slot="header" class="clearfix">
          <span>详细信息</span>
          <span>{{ $t('dataManage.styleObj.deInformation') }}</span>
          <div style="float: right; cursor: pointer" @click="closeDetial">
            <i class="el-icon-close"></i>
          </div>
        </div>
        <div class="contentBox">
          <p>样式名称:{{ itemdetail.name }}</p>
          <p>
            <label> {{ $t('dataManage.styleObj.name') }}:</label>
            <label class="boxlabel">{{ itemdetail.name }}</label>
          </p>
          <el-divider></el-divider>
          <p>
            服务地址:{{ itemdetail.path }}
            <el-link @click="ShowWindowFly(itemdetail.path)" :underline="false" type="primary"
              >详情</el-link
            >
           <p>
            <label> {{ $t('dataManage.styleObj.type') }}:</label>
            <label class="boxlabel">{{ itemdetail.type }}</label>
          </p>
          <el-divider></el-divider>、
          <p>类型:{{ itemdetail.type }}</p>
          </p>
          <el-divider></el-divider>
          <p>缩略图:<img id="showImg" src="" width="200px" height="100px" /></p>
          <p>
            <label> {{ $t('dataManage.styleObj.dirid') }}:</label>
            <label class="boxlabel">{{ itemdetail.dirName }}</label>
          </p>
          <el-divider></el-divider>
          <p>所属目录:{{ itemdetail.queryLevel }}</p>
           <p>
            <label> {{ $t('dataManage.styleObj.depid') }}:</label>
            <label class="boxlabel">{{ itemdetail.depName }}</label>
          </p>
          <el-divider></el-divider>
          <p>格式:{{ itemdetail.format }}</p>
          <p>
            <label> {{ $t('dataManage.styleObj.ver') }}:</label>
            <label class="boxlabel">{{ itemdetail.ver }}</label>
          </p>
          <el-divider></el-divider>
          <p>上传单位:{{ itemdetail.up_unit }}</p>
          <p>
            <label> {{ $t('dataManage.styleObj.status') }}:</label>
            <label class="boxlabel">{{ itemdetail.status }}</label>
          </p>
          <el-divider></el-divider>
          <p>状态:{{ itemdetail.status }}</p>
           <p>
            <label> {{ $t('dataManage.styleObj.descr') }}:</label>
            <label class="boxlabel">{{ itemdetail.descr }}</label>
          </p>
          <el-divider></el-divider>
          <p>版本:{{ itemdetail.version }}</p>
          <p>
            <label> {{ $t('dataManage.styleObj.fileguid') }}:</label>
            <label class="boxlabel">{{ itemdetail.fileGuid }}</label>
          </p>
          <el-divider></el-divider>
          <p>精度:{{ itemdetail.accuracy }}</p>
          <p>
            <label> {{ $t('dataManage.styleObj.viewguid') }}:</label>
            <label class="boxlabel">  <div style="width:440px;height:200px;">
                <img style="width:100%; height:100%" :src="itemdetail.imageFile" alt=""/>
              </div></label>
          </p>
          <el-divider></el-divider>
          <p>备注:{{ itemdetail.remarks }}</p>
          <p>
            <label> {{ $t('dataManage.styleObj.createUser') }}:</label>
            <label class="boxlabel">{{ itemdetail.createUser }}</label>
          </p>
          <el-divider></el-divider>
          <p>创建时间:{{ itemdetail.create_time }}</p>
         <p>
            <label> {{ $t('dataManage.styleObj.createTime') }}:</label>
            <label class="boxlabel">{{ itemdetail.createTime }}</label>
          </p>
          <el-divider></el-divider>
          <p>创建人员:{{ itemdetail.create_user }}</p>
            <p>
            <label> {{ $t('dataManage.styleObj.updateUser') }}:</label>
            <label class="boxlabel">{{ itemdetail.updateUser }}</label>
          </p>
          <el-divider></el-divider>
          <p>更新时间:{{ itemdetail.create_time }}</p>
           <p>
            <label> {{ $t('dataManage.styleObj.updateTime') }}:</label>
            <label class="boxlabel">{{ itemdetail.updateTime }}</label>
          </p>
          <el-divider></el-divider>
          <p>更新人员:{{ itemdetail.create_user }}</p>
           <p>
            <label> {{ $t('dataManage.styleObj.bak') }}:</label>
            <label class="boxlabel">{{ itemdetail.bak }}</label>
          </p>
          <el-divider></el-divider>
        </div>
      </el-card>
    </div>
    <el-dialog
      title="修改详情"
      top="5vh"
      top="2vh"
      style="overflow: hidden"
      :before-close="removeUpdate"
      :visible.sync="dialogFormVisible"
    >
      <el-form :model="upform">
        <el-form-item label="样式名称" :label-width="formLabelWidth">
        <el-form-item
          :label="$t('dataManage.styleObj.name')"
          :label-width="formLabelWidth"
        >
          <el-input v-model="upform.name" autocomplete="off"></el-input>
        </el-form-item>
        <el-form-item label="文件路径" :label-width="formLabelWidth">
          <input
            name="file1"
            :accept="'.fly,.ttf,.emp,.edp'"
            type="file"
            id="flyFile"
            multiple="multiple"
            style="display: none"
            @change="uploadflyFile"
          />
          <el-row>
            <el-col :span="22">
              <el-input v-model="upform.path" disabled class="firstInput"
            /></el-col>
            <el-col :span="2"
              ><el-link
                title="添加数据"
                :underline="false"
                @click="getflyFile"
                style="margin-left: 10px"
                ><i class="el-icon-plus"></i
              ></el-link>
            </el-col>
          </el-row>
        </el-form-item>
        <el-form-item label="所属目录" :label-width="formLabelWidth">
          <el-row>
            <el-col :span="22">
              <el-input
                disabled
                style="display: none"
                v-model="upform.path_id"
                autocomplete="off"
              ></el-input>
              <el-tooltip
                :content="
                  upform.queryLevel == '' ? '未选择目录' : upform.queryLevel
                "
                placement="top-start"
              >
                <el-input
                  v-model="upform.queryLevel"
                  disabled
                  class="firstInput"
                />
              </el-tooltip>
            </el-col>
            <el-col :span="2">
              <el-link
                title="选择目录"
                :underline="false"
                @click="showCata = true"
                style="margin-left: 10px"
                ><i class="el-icon-plus"></i
              ></el-link>
            </el-col>
          </el-row>
        </el-form-item>
        <el-form-item label="类型" :label-width="formLabelWidth">
        <el-form-item
          :label="$t('dataManage.styleObj.type')"
          :label-width="formLabelWidth"
        >
          <el-input v-model="upform.type" autocomplete="off"></el-input>
        </el-form-item>
        <el-form-item label="格式" :label-width="formLabelWidth">
          <el-input v-model="upform.format" autocomplete="off"></el-input>
        <el-form-item
          :label="$t('dataManage.styleObj.dirid')"
          :label-width="formLabelWidth"
        >
          <el-input
            v-model="upform.dirValue"
            disabled
            autocomplete="off"
          ></el-input
          ><el-link
            :underline="false"
            @click="showDirTree(1)"
            style="margin-left: 10px"
            ><i class="el-icon-plus"></i
          ></el-link>
        </el-form-item>
        <el-form-item label="上传单位" :label-width="formLabelWidth">
          <el-input v-model="upform.up_unit" autocomplete="off"></el-input>
        <el-form-item
          :label="$t('dataManage.styleObj.depid')"
          :label-width="formLabelWidth"
        >
          <el-input
            v-model="upform.depValue"
            disabled
            autocomplete="off"
          ></el-input>
          <el-link
            :underline="false"
            @click="showDepTree(1)"
            style="margin-left: 10px"
            ><i class="el-icon-plus"></i
          ></el-link>
        </el-form-item>
        <el-form-item label="状态" :label-width="formLabelWidth">
          <el-input v-model="upform.status" autocomplete="off"></el-input>
        <el-form-item
          :label="$t('dataManage.styleObj.ver')"
          :label-width="formLabelWidth"
        >
          <el-input v-model="upform.ver" autocomplete="off"></el-input>
        </el-form-item>
        <el-form-item label="版本" :label-width="formLabelWidth">
          <el-input v-model="upform.version" autocomplete="off"></el-input>
        <el-form-item
          :label="$t('dataManage.styleObj.status')"
          :label-width="formLabelWidth"
        >
          <el-select
            v-model="upform.status"
            style="width: 745px"
            :placeholder="$t('common.choose')"
          >
            <el-option
              value="0"
              :label="$t('dataManage.styleObj.deactivate')"
            ></el-option>
            <el-option
              value="1"
              :label="$t('dataManage.styleObj.enable')"
            ></el-option>
          </el-select>
        </el-form-item>
       <el-form-item label="精度" :label-width="formLabelWidth">
          <el-input v-model="upform.accuracy" autocomplete="off"></el-input>
        <el-form-item
          :label="$t('dataManage.styleObj.precision')"
          :label-width="formLabelWidth"
        >
          <el-input
            v-model="upform.precision"
            autocomplete="off"
          ></el-input>
        </el-form-item>
        <el-form-item label="备注" :label-width="formLabelWidth">
          <el-input v-model="upform.remarks" autocomplete="off"></el-input>
        <el-form-item
          :label="$t('dataManage.styleObj.descr')"
          :label-width="formLabelWidth"
        >
          <el-input v-model="upform.descr" autocomplete="off"></el-input>
        </el-form-item>
        <el-form-item label="缩略图" :label-width="formLabelWidth">
          <input
        <el-form-item
          :label="$t('dataManage.styleObj.fileguid')"
          :label-width="formLabelWidth"
        >
          <el-input v-model="upform.fileGuid" disabled autocomplete="off"></el-input>
           <input
            name="file1"
            type="file"
            id="editFile"
            multiple="multiple"
            style="display: none"
            @change="editFile(0)"
          />
           <el-link
            :underline="false"
            @click="geteditFile(0)"
            style="margin-left: 10px"
            ><i class="el-icon-plus"></i
          ></el-link>
           <el-link v-if="btnStatus.upload"
           :title="$t('common.upload')"
            :underline="false"
            @click="seteditFile(0)"
            style="margin-left: 10px"
            ><i class="el-icon-upload2"></i
          ></el-link>
        </el-form-item>
        <el-form-item
          :label="$t('dataManage.styleObj.viewguid')"
          :label-width="formLabelWidth"
        >
          <el-input v-model="upform.viewGuid" disabled autocomplete="off"></el-input>
           <input
            name="file1"
            :accept="'.jpg,.png'"
            type="file"
            id="imageFile"
            id="editimageFile"
            multiple="multiple"
            style="display: none"
            @change="uploadFile"
            @change="editFile(1)"
          />
          <el-row>
            <el-col :span="22">
              <el-input v-model="upform.img" disabled class="firstInput"
            /></el-col>
            <el-col :span="2"
              ><el-link
                title="添加数据"
                :underline="false"
                @click="getImageFile"
                style="margin-left: 10px"
                ><i class="el-icon-plus"></i
              ></el-link>
            </el-col>
          </el-row>
           <el-link
            :underline="false"
            @click="geteditFile(1)"
            style="margin-left: 10px"
            ><i class="el-icon-plus"></i
          ></el-link>
           <el-link
           :title="$t('common.upload')"
            :underline="false"
             @click="seteditFile(1)"
            style="margin-left: 10px"
            ><i class="el-icon-upload2"></i
          ></el-link>
        </el-form-item>
        <el-form-item
          :label="$t('dataManage.styleObj.bak')"
          :label-width="formLabelWidth"
        >
          <el-input v-model="upform.bak" autocomplete="off"></el-input>
        </el-form-item>
      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button @click="removeUpdate">取 消</el-button>
        <el-button type="primary" @click="updateForm">确 定</el-button>
        <el-button @click="removeUpdate">{{$t('common.close')}}</el-button>
        <el-button type="primary" @click="updateForm">{{$t('common.confirm')}}</el-button>
      </div>
    </el-dialog>
    <el-dialog
      title="添加数据"
      top="5vh"
      :title="$t('dataManage.styleObj.addStyleData')"
      top="2vh"
      style="overflow: hidden"
      :visible.sync="InsertFormdialog"
    >
      <el-form :model="insertform">
        <el-form-item label="样式名称" :label-width="formLabelWidth">
        <el-form-item
          :label="$t('dataManage.styleObj.name')"
          :label-width="formLabelWidth"
        >
          <el-input v-model="insertform.name" autocomplete="off"></el-input>
        </el-form-item>
        <el-form-item label="文件路径" :label-width="formLabelWidth">
          <input
            name="file1"
            :accept="'.fly,.ttf,.emp,.edp'"
            type="file"
            id="flyFile"
            multiple="multiple"
            style="display: none"
            @change="uploadflyFile"
          />
          <el-row>
            <el-col :span="22">
              <el-input v-model="insertform.path" disabled class="firstInput"
            /></el-col>
            <el-col :span="2"
              ><el-link
                title="添加数据"
                :underline="false"
                @click="getflyFile"
                style="margin-left: 10px"
                ><i class="el-icon-plus"></i
              ></el-link>
            </el-col>
          </el-row>
        </el-form-item>
        <el-form-item label="所属目录" :label-width="formLabelWidth">
          <el-row>
            <el-col :span="22">
              <el-input
                disabled
                style="display: none"
                v-model="insertform.path_id"
                autocomplete="off"
              ></el-input>
              <el-tooltip
                :content="
                  insertform.queryLevel == ''
                    ? '未选择目录'
                    : insertform.queryLevel
                "
                placement="top-start"
              >
                <el-input
                  v-model="insertform.queryLevel"
                  disabled
                  class="firstInput"
                />
              </el-tooltip>
            </el-col>
            <el-col :span="2">
              <el-link
                title="选择目录"
                :underline="false"
                @click="showCata = true"
                style="margin-left: 10px"
                ><i class="el-icon-plus"></i
              ></el-link>
            </el-col>
          </el-row>
        </el-form-item>
        <el-form-item label="类型" :label-width="formLabelWidth">
        <el-form-item
          :label="$t('dataManage.styleObj.type')"
          :label-width="formLabelWidth"
        >
          <el-input v-model="insertform.type" autocomplete="off"></el-input>
        </el-form-item>
        <el-form-item label="格式" :label-width="formLabelWidth">
          <el-input v-model="insertform.format" autocomplete="off"></el-input>
        <el-form-item
          :label="$t('dataManage.styleObj.dirid')"
          :label-width="formLabelWidth"
        >
          <el-input
            v-model="insertform.dirValue"
            disabled
            autocomplete="off"
          ></el-input
          ><el-link
            :underline="false"
            @click="showDirTree(0)"
            style="margin-left: 10px"
            ><i class="el-icon-plus"></i
          ></el-link>
        </el-form-item>
        <el-form-item label="上传单位" :label-width="formLabelWidth">
          <el-input v-model="insertform.up_unit" autocomplete="off"></el-input>
        <el-form-item
          :label="$t('dataManage.styleObj.depid')"
          :label-width="formLabelWidth"
        >
          <el-input
            v-model="insertform.depValue"
            disabled
            autocomplete="off"
          ></el-input>
          <el-link
            :underline="false"
            @click="showDepTree(0)"
            style="margin-left: 10px"
            ><i class="el-icon-plus"></i
          ></el-link>
        </el-form-item>
        <el-form-item label="状态" :label-width="formLabelWidth">
          <el-input v-model="insertform.status" autocomplete="off"></el-input>
        <el-form-item
          :label="$t('dataManage.styleObj.ver')"
          :label-width="formLabelWidth"
        >
          <el-input v-model="insertform.ver" autocomplete="off"></el-input>
        </el-form-item>
        <el-form-item label="版本" :label-width="formLabelWidth">
          <el-input v-model="insertform.version" autocomplete="off"></el-input>
        <el-form-item
          :label="$t('dataManage.styleObj.status')"
          :label-width="formLabelWidth"
        >
          <el-select
            v-model="insertform.status"
            style="width: 730px"
            :placeholder="$t('common.choose')"
          >
            <el-option
              value="0"
              :label="$t('dataManage.styleObj.deactivate')"
            ></el-option>
            <el-option
              value="1"
              :label="$t('dataManage.styleObj.enable')"
            ></el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="精度" :label-width="formLabelWidth">
          <el-input v-model="insertform.accuracy" autocomplete="off"></el-input>
        <el-form-item
          :label="$t('dataManage.styleObj.precision')"
          :label-width="formLabelWidth"
        >
          <el-input
            v-model="insertform.precision"
            autocomplete="off"
          ></el-input>
        </el-form-item>
        <el-form-item label="备注" :label-width="formLabelWidth">
          <el-input v-model="insertform.remarks" autocomplete="off"></el-input>
        <el-form-item
          :label="$t('dataManage.styleObj.descr')"
          :label-width="formLabelWidth"
        >
          <el-input v-model="insertform.descr"  autocomplete="off"></el-input>
        </el-form-item>
        <el-form-item label="缩略图" :label-width="formLabelWidth">
          <input
        <el-form-item
          :label="$t('dataManage.styleObj.fileguid')"
          :label-width="formLabelWidth"
        >
          <el-input v-model="insertform.fileGuid" disabled autocomplete="off" />
           <input
            name="file1"
            type="file"
            id="insertFile"
            multiple="multiple"
            style="display: none"
            @change="insertFile(0)"
          />
           <el-link
            :underline="false"
            @click="getInsertFile(0)"
            style="margin-left: 10px"
            ><i class="el-icon-plus"></i
          ></el-link>
           <el-link
           :title="$t('common.upload')"
            :underline="false"
  @click="setinsertFile(0)"
            style="margin-left: 10px"
            ><i class="el-icon-upload2"></i
          ></el-link>
        </el-form-item>
        <el-form-item
          :label="$t('dataManage.styleObj.viewguid')"
          :label-width="formLabelWidth"
        >
          <el-input v-model="insertform.viewGuid" disabled autocomplete="off"/>
           <input
            name="file1"
            :accept="'.jpg,.png'"
            type="file"
            id="imageFile"
            id="insertimageFile"
            multiple="multiple"
            style="display: none"
            @change="uploadFile"
            @change="insertFile(1)"
          />
          <el-row>
            <el-col :span="22">
              <el-input v-model="insertform.img" disabled class="firstInput"
            /></el-col>
            <el-col :span="2"
              ><el-link
                title="添加数据"
                :underline="false"
                @click="getImageFile"
                style="margin-left: 10px"
                ><i class="el-icon-plus"></i
              ></el-link>
            </el-col>
          </el-row>
           <el-link
            :underline="false"
            @click="getInsertFile(1)"
            style="margin-left: 10px"
            ><i class="el-icon-plus"></i
          ></el-link>
           <el-link
           :title="$t('common.upload')"
            :underline="false"
             @click="setinsertFile(1)"
            style="margin-left: 10px"
            ><i class="el-icon-upload2"></i
          ></el-link>
        </el-form-item>
        <el-form-item
          :label="$t('dataManage.styleObj.bak')"
          :label-width="formLabelWidth"
        >
          <el-input v-model="insertform.bak" autocomplete="off"></el-input>
        </el-form-item>
      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button @click="InsertFormdialog = false">取 消</el-button>
        <el-button type="primary" @click="insertFromData">确 定</el-button>
        <el-button @click="insertFromDataClose">{{$t('common.close')}}</el-button>
        <el-button type="primary" @click="insertFromData">{{$t('common.confirm')}}</el-button>
      </div>
    </el-dialog>
    <div class="leftTree" v-show="showCata">
      <div class="treeBox"><catalogueTree></catalogueTree></div>
    <div class="leftTree" v-if="showDirCata">
      <div class="treeBox">
        <style-dir-tree></style-dir-tree>
      </div>
      <div class="btnBox">
        <el-button type="primary" size="small" @click="selectCataName"
          >确定</el-button
        >
        <el-button type="primary" size="small" @click="showCata = false"
          >取消</el-button
        >
        <el-button type="primary" size="small" @click="selectDirCataName">{{
          $t('common.confirm')
        }}</el-button>
        <el-button type="primary" size="small" @click="showDirCata = false">{{
          $t('common.close')
        }}</el-button>
      </div>
    </div>
    <div class="leftTree" v-if="showDepCata">
      <div class="treeBox">
        <style-dep-tree></style-dep-tree>
      </div>
      <div class="btnBox">
        <el-button type="primary" size="small" @click="selectDepCataName">{{
          $t('common.confirm')
        }}</el-button>
        <el-button type="primary" size="small" @click="showDepCata = false">{{
          $t('common.close')
        }}</el-button>
      </div>
    </div>
  </div>
@@ -429,49 +615,348 @@
<script>
import $ from "jquery";
import {
  StyleQuery,
  StyleCounnt,
  DeletestStyle,
  InsertStyle,
  UpdateStyle,
} from "../../api/api";
import moment from "moment";
import { getToken } from "../../utils/auth.js";
import MyBread from "../../components/MyBread.vue";
import catalogueTree from "../../components/catalogueTree.vue";
import styleDirTree from "./styleDirTree.vue";
import styleDepTree from "./styleDepTree.vue";
import {
  select_Style_ByPageAndCount,
  insertStyle,
  deleteStyles,
  updateStyle,
  upload_style,
} from "../../api/api";
export default {
  name: "styleManage",
  components: { MyBread, catalogueTree },
  components: { MyBread, styleDirTree, styleDepTree },
  data() {
    return {
      dialogFormVisible: false,
      InsertFormdialog: false,
      showCata: false,
      upform: {},
      formLabelWidth: "100px",
      formLabelWidth: "130px",
      showinfoBox: false,
      itemdetail: {},
      ruleForm: {
        name: "",
      },
      tableData: [],
      insertform: {
        img: "",
        path: "",
      },
      ruleForm: {},
      backupData: [],
      currentPage1: 0,
      pageSize: 1,
      pageNum: 10,
      count: 0,
      searchName: "",
      multipleSelection: [],
      upflag: false,
      /** */
      showDirCata: false,
      showDepCata: false,
      tableData: [],
      insertform: {
        fileGuid: null,
        viewGuid: null,
      },
      dirFlag: null,
      depFlag: null,
      guidFile: null,
      viewFile: null,
      count: 0,
      listData: {
        name: null,
        pageIndex: 1,
        pageSize: 10,
      },
      btnStatus: {
        select: false,
        delete: false,
        upload: false,
        download: false,
        insert: false,
        update: false,
      },
    };
  },
  created() {
    this.startFromData();
    this.getRoleTabelData();
    this.showPermsBtn();
  },
  methods: {
    showPermsBtn() {
      let currentPerms = this.$store.state.currentPerms;
      let permsEntity = this.$store.state.permsEntity;
      permsEntity
        .filter((item) => item.perms == currentPerms)
        .map((item) => (this.btnStatus[item.tag.substr(1)] = true));
    },
    filesReset() {
      document.getElementById("insertFile").reset();
      document.getElementById("insertimageFile").reset();
      this.guidFile = null;
      this.fileGuid = null;
    },
    getInsertFile(res) {
      if (res == 0) {
        $("#insertFile").click();
      } else if (res == 1) {
        $("#insertimageFile").click();
      }
    },
    insertFile(res) {
      if (res == 0) {
        var val = document.getElementById("insertFile").files;
        if (!val || !val.length) return;
        this.insertform.fileGuid = val[0].name;
      } else if (res == 1) {
        var val = document.getElementById("insertimageFile").files;
        if (!val || !val.length) return;
        this.insertform.viewGuid = val[0].name;
      }
    },
    async setinsertFile(res) {
      if (res == 0) {
        var fs = document.getElementById("insertFile");
        if (fs.files.length == 0) {
          return;
        }
        var formData = new FormData();
        formData.append("file", fs.files[0]);
        var val_data = await upload_style(formData);
        if (val_data.code == 200) {
          this.guidFile = val_data.result;
          this.$message({
            message: "上传成功!",
            type: "success",
          });
        } else {
          this.$message({
            message: "上传失败!",
            type: "warning",
          });
        }
      } else if (res == 1) {
        var fs = document.getElementById("insertimageFile");
        if (fs.files.length == 0) {
          return;
        }
        var formData = new FormData();
        formData.append("file", fs.files[0]);
        var val_data = await upload_style(formData);
        if (val_data.code == 200) {
          this.viewFile = val_data.result;
          this.$message({
            message: "上传成功!",
            type: "success",
          });
        } else {
          this.$message({
            message: "上传失败!",
            type: "warning",
          });
        }
      }
    },
    geteditFile(res) {
      if (res == 0) {
        $("#editFile").click();
      } else if (res == 1) {
        $("#editimageFile").click();
      }
    },
    editFile(res) {
      if (res == 0) {
        var val = document.getElementById("editFile").files;
        if (!val || !val.length) return;
        this.upform.fileGuid = val[0].name;
      } else if (res == 1) {
        var val = document.getElementById("editimageFile").files;
        if (!val || !val.length) return;
        this.upform.viewGuid = val[0].name;
      }
    },
    async seteditFile(res) {
      if (res == 0) {
        var fs = document.getElementById("editFile");
        if (fs.files.length == 0) {
          return;
        }
        var formData = new FormData();
        formData.append("file", fs.files[0]);
        var val_data = await upload_style(formData);
        if (val_data.code == 200) {
          this.guidFile = val_data.result;
          this.$message({
            message: "上传成功!",
            type: "success",
          });
        } else {
          this.$message({
            message: "上传失败!",
            type: "warning",
          });
        }
      } else if (res == 1) {
        var fs = document.getElementById("editimageFile");
        if (fs.files.length == 0) {
          return;
        }
        var formData = new FormData();
        formData.append("file", fs.files[0]);
        var val_data = await upload_style(formData);
        if (val_data.code == 200) {
          this.viewFile = val_data.result;
          this.$message({
            message: "上传成功!",
            type: "success",
          });
        } else {
          this.$message({
            message: "上传失败!",
            type: "warning",
          });
        }
      }
    },
    handleSelectionChange(val) {
      this.multipleSelection = val;
    },
    handleSizeChange(val) {
      this.listData.pageSize = val;
      this.getRoleTabelData();
    },
    handleCurrentChange(val) {
      this.listData.pageIndex = val;
      this.getRoleTabelData();
    },
    async delStyleData() {
      var std = [];
      for (var i in this.multipleSelection) {
        std.push(this.multipleSelection[i].id);
      }
      const data = await deleteStyles({ ids: std.toString() });
      if (data.code == 200) {
        this.$message({
          message: "删除成功!",
          type: "success",
        });
        this.getRoleTabelData();
      } else {
        this.$message({
          message: "删除失败!",
          type: "warning",
        });
      }
    },
    showDirTree(res) {
      this.dirFlag = res;
      this.showDirCata = true;
    },
    showDepTree(res) {
      this.depFlag = res;
      this.showDepCata = true;
    },
    selectDepCataName() {
      this.showDepCata = false;
      switch (this.depFlag) {
        case 0:
          this.insertform.depValue = this.$store.state.styleDepCateNodes.name;
          this.insertform.depid = this.$store.state.styleDepCateNodes.id;
          break;
        case 1:
          this.upform.depValue = this.$store.state.styleDepCateNodes.name;
          this.upform.depid = this.$store.state.styleDepCateNodes.id;
          break;
      }
    },
    selectDirCataName() {
      this.showDirCata = false;
      switch (this.dirFlag) {
        case 0:
          // var data = this.$store.state.styleDirCateNodes;
          this.insertform.dirValue = this.$store.state.styleDirCateNodes.name;
          this.insertform.dirid = this.$store.state.styleDirCateNodes.id;
          break;
        case 1:
          this.upform.dirValue = this.$store.state.styleDirCateNodes.name;
          this.upform.dirid = this.$store.state.styleDirCateNodes.id;
          break;
      }
    },
    insertFromDataClose() {
      this.InsertFormdialog = false;
      this.insertform = {};
      this.filesReset();
    },
    async insertFromData() {
      if (this.insertform.dirid == null || this.insertform.depid == null) {
        this.$message({
          message: "请选择样式所属的目录或单位",
          type: "warning",
        });
        return;
      }
      if (this.guidFile != null) {
        this.insertform.fileGuid = this.guidFile;
      }
      if (this.viewFile != null) {
        this.insertform.viewGuid = this.viewFile;
      }
      const data = await insertStyle(this.insertform);
      if (data.code == 200) {
        this.InsertFormdialog = false;
        this.insertform = {};
        this.filesReset();
        this.$message({
          message: "添加成功!",
          type: "success",
        });
        this.getRoleTabelData();
      } else {
        this.$message({
          message: "添加失败!",
          type: "warning",
        });
      }
    },
    async getRoleTabelData() {
      if (this.listData.tab == "") {
        delete this.listData.tab;
      }
      this.listData.name = this.ruleForm.name;
      const data = await select_Style_ByPageAndCount(this.listData);
      if (data.code != 200) {
        this.$message.error("列表调用失败");
      }
      this.tableData = data.result;
      this.count = data.count;
    },
    formatTime(row, column) {
      let date = row[column.property];
      return this.formomentTime(date);
    },
    formomentTime(date) {
      if (date === undefined || date === null) {
        return;
      }
      return moment(parseInt(date)).format("YYYY-MM-DD HH:mm:ss");
    },
    formatStatus(row, column) {
      let date = row[column.property];
      return this.forMontStatus(date);
    },
    forMontStatus(date) {
      if (date === undefined || date === null) {
        return;
      }
      switch (date) {
        case 1:
          return "启用";
          break;
        case 0:
          return "停用";
          break;
      }
    },
    /** */
    getflyFile() {
      $("#flyFile").click();
    },
@@ -552,19 +1037,10 @@
      this.getStyleData(this.pageNum, this.pageSize, this.searchName);
      this.getStyleDataCount(this.searchName);
    },
    insertFromData() {
      this.InsertFormdialog = false;
      InsertStyle(this.insertform).then((res) => {});
      this.insertform = {
        img: "",
        path: "",
      };
      this.startFromData();
    },
    // 请求数据
    getStyleData(size, index, name) {
      StyleQuery(size, index, name).then((res) => {
        console.log(res);
        this.tableData = res.data;
      });
    },
@@ -577,60 +1053,90 @@
    addstyle() {
      this.$router.push("/addstyle");
    },
    updateForm() {
      var that = this;
      this.$confirm("是否保存修改?", "提示", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning",
      })
        .then(() => {
          this.dialogFormVisible = false;
          this.upflag = false;
          UpdateStyle(that.upform).then((res) => {
            that.startFromData();
          });
          this.$message({
            message: "修改成功",
            type: "success",
          });
        })
        .catch(() => {
          that.upflag = false;
    statusFormat(res) {
      switch (res) {
        case "启用":
          return 1;
          break;
        case "停用":
          return 0;
          break;
        case "Start Using":
          return 1;
          break;
        case "Stop Using":
          return 0;
          break;
      }
    },
    async updateForm() {
      if (this.upform.dirid == null || this.upform.depid == null) {
        this.$message({
          message: "请选择样式所属的目录或单位",
          type: "warning",
        });
        return;
      }
      if (Number.isInteger(this.upform.status) == false) {
        this.upform.status = this.statusFormat(this.upform.status);
      }
      if (this.guidFile != null) {
        this.upform.fileGuid = this.guidFile;
      }
      if (this.viewFile != null) {
        this.upform.viewGuid = this.viewFile;
      }
      const data = await updateStyle(this.upform);
      if (data.code == 200) {
        this.dialogFormVisible = false;
        this.upform = {};
        this.$message({
          message: "修改成功!",
          type: "success",
        });
        this.getRoleTabelData();
      } else {
        this.$message({
          message: "修改失败!",
          type: "warning",
        });
      }
    },
    removeUpdate() {
      this.upflag = false;
      this.dialogFormVisible = false;
      this.upform = {};
      this.filesReset();
    },
    submitForm(formName) {
      this.$refs[formName].validate((valid) => {
        if (valid) {
          this.searchName = this.ruleForm.name.trim();
          this.startFromData();
        } else {
          console.log("error submit!!");
          return false;
        }
      });
      this.getRoleTabelData();
      // this.$refs[formName].validate((valid) => {
      //   if (valid) {
      //     this.searchName = this.ruleForm.name.trim();
      //     this.startFromData();
      //   } else {
      //     console.log('error submit!!');
      //     return false;
      //   }
      // });
    },
    resetForm(formName) {
      this.tableData = this.backupData;
      this.$refs[formName].resetFields();
      this.searchName = "";
      this.startFromData();
      this.ruleForm = {};
      this.getRoleTabelData();
    },
    showDetail(index, row) {
      console.log(index, row);
      var value = serverUrl + row.img;
      var img = document.getElementById("showImg");
      img.setAttribute("src", value);
      var token = getToken();
      this.showinfoBox = true;
      this.itemdetail = row;
      this.itemdetail.createTime = this.formomentTime(
        this.itemdetail.createTime
      );
      this.itemdetail.updateTime = this.formomentTime(
        this.itemdetail.updateTime
      );
      this.itemdetail.imageFile =
        BASE_URL + "/res/download?guid=" + row.viewGuid + "&token=" + token;
    },
    closeDetial() {
      this.showinfoBox = false;
@@ -641,6 +1147,9 @@
      this.upflag = true;
      this.dialogFormVisible = true;
      this.upform = row;
      this.upform.depValue = row.depName;
      this.upform.dirValue = row.dirName;
      this.upform.status = this.forMontStatus(row.status);
    },
    handleDelete(index, row) {
      this.$confirm("确定是否删除?", "提示", {
@@ -659,42 +1168,10 @@
        .catch(() => {});
    },
    // 获取多选
    handleSelectionChange(val) {
      this.multipleSelection = val;
    },
    delStyleData() {
      var std = [];
      for (var i in this.multipleSelection) {
        std.push(this.multipleSelection[i].id);
      }
      this.$confirm("确定是否删除所选内容?", "提示", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning",
      })
        .then(() => {
          DeletestStyle(std);
          this.$message({
            type: "success",
            message: "删除成功!",
          });
          this.startFromData();
        })
        .catch(() => {});
    },
    handleSizeChange(val) {
      this.pageNum = val;
      this.getStyleData(this.pageNum, 1, this.searchName);
      this.getStyleDataCount(this.searchName);
    },
    handleCurrentChange(val) {
      this.pageSize = val;
      this.getStyleData(this.pageNum, this.pageSize, this.searchName);
      this.getStyleDataCount(this.searchName);
    },
    ShowWindowFly(res) {
      window.open(
        ifreamUrl+"/LFWeb/poper.html?name="+res,
        ifreamUrl + "/LFWeb/poper.html?name=" + res,
        "",
        "height=800, width=1500, top=150, left=350, toolbar=no, menubar=no, scrollbars=no, resizable=no, location=no, status=no"
      );
@@ -712,8 +1189,9 @@
  box-sizing: border-box;
  .el-input {
    width: 745px;
    width: 730px;
  }
  .searchComp {
    margin: 10px auto;
    background: #fff;
@@ -731,7 +1209,7 @@
    z-index: 10;
    z-index: 9999;
    top: 100px;
    left: 600px;
    left: 800px;
    width: 400px;
    height: 600px;
    background: #f0f2f5;
@@ -744,7 +1222,7 @@
      }
    }
    .btnBox {
      width: 123px;
      width: 160px;
      margin: 10px auto 0;
      // background-color: red;
    }
@@ -761,53 +1239,53 @@
        margin: 0 auto;
        overflow: auto;
        background: #fff;
        .el-table {
          height: 100%;
          // overflow: auto;
        }
        .el-table /deep/ .el-table__header-wrapper tr th {
          background-color: rgb(255, 255, 255) !important;
          color: rgb(0, 0, 0);
        }
        // 修改每行样式:
        .el-table /deep/ .el-table__row {
          background-color: rgba(255, 255, 255) !important;
          color: rgb(0, 0, 0);
        }
        .el-table /deep/ .el-table__body tr.current-row > td {
          background-color: rgb(211, 211, 211) !important;
        }
        .el-table /deep/ .el-table__body tr:hover > td {
          background-color: rgb(211, 211, 211) !important;
        }
        // 修改表格每行边框的样式:
        .el-table /deep/ td,
        .el-table /deep/ th.is-leaf {
          border-bottom: 1px solid #eee;
          border-right: 1px solid #eee;
        }
        .el-table /deep/ .el-table__cell {
          padding: 0;
        }
        // 设置表格每行的高度:
        .el-table /deep/ .el-table__header tr,
        .el-table /deep/ .el-table__header th {
          height: 40px;
        }
        .el-table__body tr,
        .el-table__body td {
          height: 40px;
          padding: 0;
        }
        // 设置表格边框颜色:
        // .el-table {
        //   height: 100%;
        //   // overflow: auto;
        // }
        // .el-table /deep/ .el-table__header-wrapper tr th {
        //   background-color: rgb(255, 255, 255) !important;
        //   color: rgb(0, 0, 0);
        // }
        // // 修改每行样式:
        // .el-table /deep/ .el-table__row {
        //   background-color: rgba(255, 255, 255) !important;
        //   color: rgb(0, 0, 0);
        // }
        // .el-table /deep/ .el-table__body tr.current-row > td {
        //   background-color: rgb(211, 211, 211) !important;
        // }
        // .el-table /deep/ .el-table__body tr:hover > td {
        //   background-color: rgb(211, 211, 211) !important;
        // }
        // // 修改表格每行边框的样式:
        // .el-table /deep/ td,
        // .el-table /deep/ th.is-leaf {
        //   border-bottom: 1px solid #eee;
        //   border-right: 1px solid #eee;
        // }
        // .el-table /deep/ .el-table__cell {
        //   padding: 0;
        // }
        // // 设置表格每行的高度:
        // .el-table /deep/ .el-table__header tr,
        // .el-table /deep/ .el-table__header th {
        //   height: 40px;
        // }
        // .el-table__body tr,
        // .el-table__body td {
        //   height: 40px;
        //   padding: 0;
        // }
        // // 设置表格边框颜色:
        .el-table--border::after,
        .el-table--group::after {
          width: 0;
        }
        .el-table::before {
          height: 0;
        }
        // .el-table--border::after,
        // .el-table--group::after {
        //   width: 0;
        // }
        // .el-table::before {
        //   height: 0;
        // }
        //   a {
        //     color: #000;
        //   }
@@ -838,7 +1316,60 @@
        // margin-bottom: 10px;
        font-size: 14px;
      }
      .boxlabel {
        margin-left: 10px;
      }
    }
    /* 整体样式 */
    .contentBox::-webkit-scrollbar {
      width: 6px;
      height: 6px;
    }
    /* 滚动条 */
    .contentBox::-webkit-scrollbar-thumb {
      background-color: #b3d8ff;
      border-radius: 6px;
    }
    /* 滚动条鼠标经过样式 */
    .contentBox::-webkit-scrollbar-thumb:hover {
      background-color: #b3d8ff;
      border-radius: 6px;
    }
    /* 滚动条轨道 */
    .contentBox::-webkit-scrollbar-track-piece {
      -webkit-box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.2);
      border-radius: 10px;
      background: #ededed;
    }
  }
}
</style>
<style>
/* 整体样式 */
.el-table__body-wrapper::-webkit-scrollbar {
  width: 6px;
  height: 6px;
}
/* 滚动条 */
.el-table__body-wrapper::-webkit-scrollbar-thumb {
  background-color: #b3d8ff;
  border-radius: 6px;
}
/* 滚动条鼠标经过样式 */
.el-table__body-wrapper::-webkit-scrollbar-thumb:hover {
  background-color: #66b1ff;
  border-radius: 8px;
}
/* 滚动条轨道 */
.el-table__body-wrapper::-webkit-scrollbar-track-piece {
  -webkit-box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.2);
  border-radius: 10px;
  background: #ededed;
}
</style>