client-eam-v5/src/components/customer/AssetByRfid.vue

<template>
  <div class="grid-container">
    <div class="grid-item-1">
      <!-- <div class="col-md-12"> -->
      <!-- <div class="h2 pull-left">资产进出记录</div> -->
      <div>
        <Navbar
          :title="$t('lang.AssetByRfid.assetInAndOutRecords')"
          :is-go-back="false"
          style="margin-left: 14px"
        />
      </div>
    </div>

    <div class="grid-item-2">
      <form class="form-inline">
        <div class="form-group">
          <label style="margin-left: 14px">{{
            $t("lang.AssetByRfid.startTime")
          }}</label>
          <div style="float: right">
            <DateTime
              v-model="startDate"
              name="datetime"
              style="float: left"
            />
          </div>
        </div>

        <div class="form-group">
          <label>{{ $t("lang.AssetByRfid.endTime") }}</label>
          <div style="float: right">
            <DateTime
              v-model="endDate"
              name="datetime"
            />
          </div>
        </div>

        <div class="form-group">
          <label>{{ $t("lang.AssetByRfid.storageLocation") }}</label>
          <div style="float: right">
            <SearchWidget
              :info-window-no="289190"
              :field="field"
              :field-value="fieldValue"
              :display-name="field.listFieldNames"
              :where-clause-source="whereClauseSource"
              @value-changed="valueChanged"
            />
          </div>
        </div>
        <button
          type="button"
          class="btn btn-default"
          style="margin-top: 1px"
          @click="search"
        >
          {{ $t("lang.AssetByRfid.determine") }}
        </button>
        <button
          type="button"
          class="btn btn-default"
          style="margin-top: 1px"
          @click="exportExcel"
        >
          {{ $t("lang.AssetByRfid.export") }}
        </button>
      </form>
    </div>

    <div class="grid-item-3">
      <div class="col-md-12 div-asset-info">
        <div class="form form-inline time-box">
          <div class="table-responsive">
            <table class="table table-striped table-bordered">
              <thead>
                <tr height="40px">
                  <th>{{ $t("lang.AssetByRfid.serialNumber") }}</th>
                  <th>{{ $t("lang.AssetByRfid.assetName") }}</th>
                  <th>{{ $t("lang.AssetByRfid.assetNumber") }}</th>
                  <th>{{ $t("lang.AssetByRfid.assetCategory") }}</th>
                  <th>{{ $t("lang.AssetByRfid.assetEPC") }}</th>
                  <th>{{ $t("lang.AssetByRfid.storageLocation") }}</th>
                  <th>{{ $t("lang.AssetByRfid.startUseTime") }}</th>
                  <th>{{ $t("lang.AssetByRfid.remarks") }}</th>
                </tr>
              </thead>
              <tbody>
                <tr v-for="(item, index) in assetInstances" :key="item.id">
                  <td>{{ index + 1 }}</td>
                  <td>{{ item.name }}</td>
                  <td>{{ item.assetNo }}</td>
                  <td>{{ item.category }}</td>
                  <td>{{ item.epc }}</td>
                  <td>{{ item.locationName }}</td>
                  <td>{{ item.depreciationStartDate }}</td>
                  <td>{{ item.description }}</td>
                </tr>
              </tbody>
            </table>
          </div>
        </div>
      </div>
    </div>
  </div>
</template>

<script>
import Common from '../../common/Common.js';
import { Notify } from 'pc-component-v3';








export default {

  components: {
    
    
    
    
    
    
    
    
  },
  data: function () {
    return {
      startDate: undefined,
      endDate: undefined,
      locationId: null,
      assetInstances: [],
      field: {
        name: '',
        listFieldNames: 'location.name',
      },
      fieldValue: {
        id: null,
        displayValue: [''],
        fieldType: 'Key',
      },
      whereClauseSource: {
        customerDataDimensions:[{
          fieldName: 'o.id',
          dataDimensionTypeNo: '202201191700',
          defaultDataDimensionTypeValueNo: '1',
        }],
      },
    };
  },

  methods: {
    /**
     * 导出excel
     */
    exportExcel: function () {
      var _self = this;
      if (
        _self.assetInstances.length == 0 ||
        _self.assetInstances == undefined ||
        _self.assetInstances == null
      ) {
        Notify.error('提示', '当前无数据导出');
        return;
      }
      var loginInfo = localStorage.getItem('#LoginInfo');
      var loginData = JSON.parse(loginInfo);
      var locationId = _self.locationId;
      var whereClause = ' assetInstance.clientId=' + loginData.loginClientId;
      var str = '';
      var epcs = [];
      _self.assetInstances.forEach(function (ai) {
        epcs.push(ai.epc);
      });
      str = ' and ai.epc in ( ';
      for (var i = 0; i < epcs.length; i++) {
        if (i == epcs.length - 1) {
          str = str + epcs[i] + ' ) ';
        } else {
          str = str + epcs[i] + ' , ';
        }
      }
      if (locationId != null) {
        str = str + ' and ai.locationId = ' + locationId;
      }
      whereClause = whereClause + str;
      console.log(whereClause);
      whereClause = encodeURIComponent(whereClause);
      var url =
        '/ureport/preview?_u=dicfile-eam:AssetInstancetU2Report.ureport.xml&whereClause=' +
        whereClause;
      window.open(url);
    },

    /**
     * 存放地点选择事件
     * @param {Object} newFieldValue
     */
    valueChanged: function (newFieldValue) {
      console.log(newFieldValue);
      this.fieldValue = newFieldValue;
      this.locationId = newFieldValue.id;
    },
    /**
     * 搜索
     */
    search: function () {
      var _self = this;
      $.ajax({
        url: Common.getApiURL('AssetInstanceResource/getAssetByTime'),
        type: 'get',
        dataType: 'json',
        data: {
          startTime: _self.startDate,
          endTime: _self.endDate,
          locationId: _self.locationId,
        },
        beforeSend: function (request) {
          Common.addTokenToRequest(request);
        },
        success: function (data) {
          _self.assetInstances = data;
        },
        error: function (XMLHttpRequest, textStatus, errorThrown) {
          _self.loading=false;
          Common.processException(XMLHttpRequest, textStatus, errorThrown);
        },
      });
    },



    mounted: function () {
      this.startDate = '';
      this.endDate = '';
      this.search();
    },
  },
};
</script>
<style scoped>
.grid-container {
  display: grid;
  grid-template-rows: 8% 8% 84%;
  grid-template-columns: 100%;
  width: 100%;
  /*视口被均分为 100 单位的 vh 占据整个窗口，扣掉顶部 topNav 的距离后，计算得到 responseOrganizationSelect 的高度*/
  height: calc(100vh - 130px);
  margin-top: 10px;
}

.grid-item-1 {
  grid-row: 1/2;
}

.grid-item-2 {
  grid-row: 2/3;
}

.grid-item-3 {
  grid-row: 3/4;
}

.box {
  border: 1px #ccc solid;
  margin-bottom: 15px;
  padding-top: 10px;
  border-radius: 5px;
  background-color: #ffffff;
}

.label {
  float: left;
}

.div-form {
  margin-bottom: 10px;
}
</style>