|
@@ -1,963 +1,964 @@
|
|
|
-<template>
|
|
|
- <el-form-item
|
|
|
- v-if="showStatus && hidden"
|
|
|
- :label-width="
|
|
|
- isLabel === false || !widget.options.labelWidthStatus ? '0px' : 150 + 'px'
|
|
|
- "
|
|
|
- :label="
|
|
|
- isLabel === false ||
|
|
|
- widget.type === 'divider' ||
|
|
|
- !widget.options.labelWidthStatus
|
|
|
- ? ''
|
|
|
- : widget.name
|
|
|
- "
|
|
|
- :prop="propValue"
|
|
|
- :class="[parentForm, widget.type == 'text' && 'dataModelText']"
|
|
|
- :style="subformIndex !== undefined ? { 'margin-bottom': '0' } : {}"
|
|
|
- >
|
|
|
- <template v-if="preview">
|
|
|
- <template v-if="widget.type === 'color'">
|
|
|
- <div
|
|
|
- style="width: 32px; height: 20px; margin-top: 6px; border-radius: 3px"
|
|
|
- :style="{ 'background-color': dataModel }"
|
|
|
- />
|
|
|
- </template>
|
|
|
- <template v-else-if="widget.type == 'switch'">
|
|
|
- <el-switch v-model="dataModel" :disabled="true" />
|
|
|
- </template>
|
|
|
- <template v-else-if="widget.type === 'editor'">
|
|
|
- <div class="previewEditorDiv" v-html="dataModel" />
|
|
|
- </template>
|
|
|
-
|
|
|
- <template v-else-if="widget.type == 'file'">
|
|
|
- <div
|
|
|
- v-for="(uploadUrlItem, uploadUrlIndex) of dataModel"
|
|
|
- :key="uploadUrlIndex"
|
|
|
- >
|
|
|
- <i style="color: #909399" class="el-icon-document" />
|
|
|
- <span>{{ uploadUrlItem.name || uploadUrlItem.url }}</span>
|
|
|
- <el-button
|
|
|
- round
|
|
|
- size="mini"
|
|
|
- @click="onDownload(uploadUrlItem, 'download')"
|
|
|
- >下载</el-button
|
|
|
- >
|
|
|
- <el-button
|
|
|
- round
|
|
|
- type="primary"
|
|
|
- @click="onDownload(uploadUrlItem)"
|
|
|
- v-if="
|
|
|
- checkFileSuffix(uploadUrlItem.url) &&
|
|
|
- !isCheckImage(uploadUrlItem.url)
|
|
|
- "
|
|
|
- size="mini"
|
|
|
- >预览</el-button
|
|
|
- >
|
|
|
- <div
|
|
|
- v-if="isCheckImage(uploadUrlItem.url)"
|
|
|
- style="display: inline-flex; position: relative"
|
|
|
- >
|
|
|
- <el-button
|
|
|
- style="position: absolute; left: 0; top: 0"
|
|
|
- round
|
|
|
- type="primary"
|
|
|
- @click="onDownload(uploadUrlItem)"
|
|
|
- v-if="checkFileSuffix(uploadUrlItem.url)"
|
|
|
- size="mini"
|
|
|
- >预览</el-button
|
|
|
- >
|
|
|
- <el-image
|
|
|
- style="width: 56px; height: 28px; opacity: 0"
|
|
|
- :src="uploadUrlItem.url"
|
|
|
- :preview-src-list="[uploadUrlItem.url]"
|
|
|
- >
|
|
|
- </el-image>
|
|
|
- </div>
|
|
|
- <!-- <a :href="uploadUrlItem.url" target="_blank">{{ uploadUrlItem.name || uploadUrlItem.url }}</a> -->
|
|
|
- </div>
|
|
|
- </template>
|
|
|
-
|
|
|
- <template v-else-if="widget.type == 'imgupload'">
|
|
|
- <fm-upload
|
|
|
- v-model="dataModel"
|
|
|
- :style="{ width: widget.options.width }"
|
|
|
- :width="widget.options.size.width"
|
|
|
- :height="widget.options.size.height"
|
|
|
- :preview="preview"
|
|
|
- />
|
|
|
- </template>
|
|
|
- <template v-else-if="widget.type == 'rate'">
|
|
|
- <el-rate
|
|
|
- v-model="dataModel"
|
|
|
- :max="widget.options.max"
|
|
|
- :disabled="true"
|
|
|
- :allow-half="widget.options.allowHalf"
|
|
|
- />
|
|
|
- </template>
|
|
|
- <template v-else-if="widget.type === 'divider'">
|
|
|
- <el-divider
|
|
|
- :direction="widget.options.direction"
|
|
|
- :content-position="widget.options.content_position"
|
|
|
- >
|
|
|
- <span
|
|
|
- :style="{
|
|
|
- 'font-size': widget.options.font_size,
|
|
|
- 'font-family': widget.options.font_family,
|
|
|
- 'font-weight': widget.options.font_weight,
|
|
|
- color: widget.options.font_color,
|
|
|
- }"
|
|
|
- >
|
|
|
- {{ widget.options.defaultValue }}
|
|
|
- </span>
|
|
|
- </el-divider>
|
|
|
- </template>
|
|
|
- <template
|
|
|
- v-else-if="widget.type === 'input' && widget.options.showPassword"
|
|
|
- >
|
|
|
- <input
|
|
|
- :value="dataModel"
|
|
|
- type="password"
|
|
|
- style="border: none; background-color: #ffffff; color: #303133"
|
|
|
- disabled="disabled"
|
|
|
- />
|
|
|
- </template>
|
|
|
- <template v-else-if="widget.type === 'cascader'">
|
|
|
- <el-cascader
|
|
|
- v-model="dataModel"
|
|
|
- class="preview-cascader-class"
|
|
|
- :disabled="true"
|
|
|
- :show-all-levels="widget.options.showAllLevels"
|
|
|
- :options="
|
|
|
- widget.options.remote
|
|
|
- ? widget.options.remoteOptions
|
|
|
- : widget.options.options
|
|
|
- "
|
|
|
- />
|
|
|
- </template>
|
|
|
- <template v-else-if="widget.type === 'textarea'">
|
|
|
- <span v-html="dataFormatBr(dataModel)"></span>
|
|
|
- </template>
|
|
|
- <template v-else-if="widget.type === 'text'">
|
|
|
- <span class="dataModelText">{{ dataModel }}</span>
|
|
|
- </template>
|
|
|
- <template v-else>
|
|
|
- <div v-if="dataModel">
|
|
|
- <template v-if="widget.type == 'organ' || widget.type == 'school'">
|
|
|
- {{ dataModelStr }}
|
|
|
- </template>
|
|
|
- <template v-else>
|
|
|
- {{ dataModel }}
|
|
|
- </template>
|
|
|
- </div>
|
|
|
- </template>
|
|
|
- </template>
|
|
|
- <template v-else>
|
|
|
- <template v-if="widget.type === 'input'">
|
|
|
- <el-input
|
|
|
- v-if="
|
|
|
- widget.options.dataType === 'number' ||
|
|
|
- widget.options.dataType === 'integer' ||
|
|
|
- widget.options.dataType === 'float'
|
|
|
- "
|
|
|
- v-model="dataModel"
|
|
|
- :type="widget.options.dataType"
|
|
|
- @input="onInputChangeNumber($event)"
|
|
|
- :placeholder="widget.options.placeholder"
|
|
|
- :style="{ width: widget.options.width }"
|
|
|
- :disabled="widget.options.disabled"
|
|
|
- :show-password="widget.options.showPassword"
|
|
|
- />
|
|
|
- <el-input
|
|
|
- v-else
|
|
|
- v-model="dataModel"
|
|
|
- :type="widget.options.dataType"
|
|
|
- :disabled="widget.options.disabled"
|
|
|
- :placeholder="widget.options.placeholder"
|
|
|
- :style="{ width: widget.options.width }"
|
|
|
- :show-password="widget.options.showPassword"
|
|
|
- />
|
|
|
- </template>
|
|
|
-
|
|
|
- <template v-if="widget.type === 'textarea'">
|
|
|
- <el-input
|
|
|
- v-model="dataModel"
|
|
|
- type="textarea"
|
|
|
- :rows="5"
|
|
|
- :disabled="widget.options.disabled"
|
|
|
- :placeholder="widget.options.placeholder"
|
|
|
- :style="{ width: widget.options.width }"
|
|
|
- />
|
|
|
- </template>
|
|
|
-
|
|
|
- <template v-if="widget.type === 'number'">
|
|
|
- <el-input-number
|
|
|
- v-model="dataModel"
|
|
|
- :style="{ width: widget.options.width }"
|
|
|
- :step="widget.options.step"
|
|
|
- controls-position="right"
|
|
|
- :disabled="widget.options.disabled"
|
|
|
- />
|
|
|
- </template>
|
|
|
-
|
|
|
- <template v-if="widget.type === 'radio'">
|
|
|
- <el-radio-group
|
|
|
- v-model="dataModel"
|
|
|
- :style="{ width: widget.options.width }"
|
|
|
- :disabled="widget.options.disabled"
|
|
|
- >
|
|
|
- <el-radio
|
|
|
- v-for="(item, index) in widget.options.remote
|
|
|
- ? widget.options.remoteOptions
|
|
|
- : widget.options.options"
|
|
|
- :key="index"
|
|
|
- :style="{
|
|
|
- display: widget.options.inline ? 'inline-block' : 'block',
|
|
|
- }"
|
|
|
- :label="item.value"
|
|
|
- >
|
|
|
- <template v-if="widget.options.remote">{{ item.label }}</template>
|
|
|
- <template v-else>{{
|
|
|
- widget.options.showLabel ? item.label : item.value
|
|
|
- }}</template>
|
|
|
- </el-radio>
|
|
|
- </el-radio-group>
|
|
|
- </template>
|
|
|
-
|
|
|
- <template v-if="widget.type === 'checkbox'">
|
|
|
- <el-checkbox-group
|
|
|
- v-model="dataModel"
|
|
|
- :style="{ width: widget.options.width }"
|
|
|
- :disabled="widget.options.disabled"
|
|
|
- >
|
|
|
- <el-checkbox
|
|
|
- v-for="(item, index) in widget.options.remote
|
|
|
- ? widget.options.remoteOptions
|
|
|
- : widget.options.options"
|
|
|
- :key="index"
|
|
|
- :style="{
|
|
|
- display: widget.options.inline ? 'inline-block' : 'block',
|
|
|
- }"
|
|
|
- :label="item.value"
|
|
|
- >
|
|
|
- <template v-if="widget.options.remote">{{ item.label }}</template>
|
|
|
- <template v-else>{{
|
|
|
- widget.options.showLabel ? item.label : item.value
|
|
|
- }}</template>
|
|
|
- </el-checkbox>
|
|
|
- </el-checkbox-group>
|
|
|
- </template>
|
|
|
-
|
|
|
- <template v-if="widget.type === 'time'">
|
|
|
- <el-time-picker
|
|
|
- v-model="dataModel"
|
|
|
- :is-range="widget.options.isRange"
|
|
|
- :placeholder="widget.options.placeholder"
|
|
|
- :start-placeholder="widget.options.startPlaceholder"
|
|
|
- :end-placeholder="widget.options.endPlaceholder"
|
|
|
- :readonly="widget.options.readonly"
|
|
|
- :disabled="widget.options.disabled"
|
|
|
- :editable="widget.options.editable"
|
|
|
- :clearable="widget.options.clearable"
|
|
|
- :arrow-control="widget.options.arrowControl"
|
|
|
- :value-format="widget.options.format"
|
|
|
- :style="{ width: widget.options.width }"
|
|
|
- />
|
|
|
- </template>
|
|
|
-
|
|
|
- <template v-if="widget.type == 'date'">
|
|
|
- <el-date-picker
|
|
|
- v-model="dataModel"
|
|
|
- :type="widget.options.type"
|
|
|
- :placeholder="widget.options.placeholder"
|
|
|
- :start-placeholder="widget.options.startPlaceholder"
|
|
|
- :end-placeholder="widget.options.endPlaceholder"
|
|
|
- :readonly="widget.options.readonly"
|
|
|
- :disabled="widget.options.disabled"
|
|
|
- :editable="widget.options.editable"
|
|
|
- :clearable="widget.options.clearable"
|
|
|
- :value-format="
|
|
|
- widget.options.timestamp ? 'timestamp' : widget.options.format
|
|
|
- "
|
|
|
- :format="widget.options.format"
|
|
|
- :style="{ width: widget.options.width }"
|
|
|
- />
|
|
|
- </template>
|
|
|
-
|
|
|
- <template v-if="widget.type == 'rate'">
|
|
|
- <el-rate
|
|
|
- v-model="dataModel"
|
|
|
- :max="widget.options.max"
|
|
|
- :disabled="widget.options.disabled"
|
|
|
- :allow-half="widget.options.allowHalf"
|
|
|
- />
|
|
|
- </template>
|
|
|
-
|
|
|
- <template v-if="widget.type === 'color'">
|
|
|
- <el-color-picker
|
|
|
- v-model="dataModel"
|
|
|
- :disabled="widget.options.disabled"
|
|
|
- :show-alpha="widget.options.showAlpha"
|
|
|
- />
|
|
|
- </template>
|
|
|
-
|
|
|
- <template v-if="widget.type === 'select'">
|
|
|
- <el-select
|
|
|
- v-model="dataModel"
|
|
|
- :disabled="widget.options.disabled"
|
|
|
- :multiple="widget.options.multiple"
|
|
|
- :clearable="widget.options.clearable"
|
|
|
- :placeholder="widget.options.placeholder"
|
|
|
- :style="{ width: widget.options.width }"
|
|
|
- filterable
|
|
|
- @change="onChangeSelect"
|
|
|
- >
|
|
|
- <el-option
|
|
|
- v-for="item in widget.options.remote
|
|
|
- ? widget.options.remoteOptions
|
|
|
- : widget.options.options"
|
|
|
- :key="item.value"
|
|
|
- :value="item.value"
|
|
|
- :label="
|
|
|
- widget.options.showLabel || widget.options.remote
|
|
|
- ? item.label
|
|
|
- : item.value
|
|
|
- "
|
|
|
- />
|
|
|
- </el-select>
|
|
|
- </template>
|
|
|
-
|
|
|
- <template v-if="widget.type === 'organ'">
|
|
|
- <el-select
|
|
|
- v-model="dataModel"
|
|
|
- :disabled="widget.options.disabled"
|
|
|
- :multiple="widget.options.multiple"
|
|
|
- clearable
|
|
|
- filterable
|
|
|
- :placeholder="widget.options.placeholder"
|
|
|
- :style="{ width: widget.options.width }"
|
|
|
- :name="widget.model"
|
|
|
- >
|
|
|
- <el-option
|
|
|
- v-for="item in organList"
|
|
|
- :key="item.id"
|
|
|
- :value="item.id"
|
|
|
- :label="item.name"
|
|
|
- />
|
|
|
- </el-select>
|
|
|
- </template>
|
|
|
-
|
|
|
- <template v-if="widget.type === 'school'">
|
|
|
- <el-select
|
|
|
- v-model="dataModel"
|
|
|
- :disabled="widget.options.disabled"
|
|
|
- :multiple="widget.options.multiple"
|
|
|
- clearable
|
|
|
- :placeholder="widget.options.placeholder"
|
|
|
- :style="{ width: widget.options.width }"
|
|
|
- filterable
|
|
|
- :loading="selectLoading"
|
|
|
- @visible-change="onGetSchoolList"
|
|
|
- >
|
|
|
- <el-option
|
|
|
- v-for="item in cooperationList"
|
|
|
- :key="item.id"
|
|
|
- :value="item.id"
|
|
|
- :label="item.name"
|
|
|
- />
|
|
|
- </el-select>
|
|
|
- </template>
|
|
|
-
|
|
|
- <template v-if="widget.type == 'switch'">
|
|
|
- <el-switch v-model="dataModel" :disabled="widget.options.disabled" />
|
|
|
- </template>
|
|
|
-
|
|
|
- <template v-if="widget.type == 'slider'">
|
|
|
- <el-slider
|
|
|
- v-model="dataModel"
|
|
|
- :min="widget.options.min"
|
|
|
- :max="widget.options.max"
|
|
|
- :disabled="widget.options.disabled"
|
|
|
- :step="widget.options.step"
|
|
|
- :show-input="widget.options.showInput"
|
|
|
- :range="widget.options.range"
|
|
|
- :style="{ width: widget.options.width }"
|
|
|
- />
|
|
|
- </template>
|
|
|
-
|
|
|
- <template v-if="widget.type == 'imgupload'">
|
|
|
- <fm-upload
|
|
|
- v-model="dataModel"
|
|
|
- :disabled="widget.options.disabled"
|
|
|
- :style="{ width: widget.options.width }"
|
|
|
- :width="widget.options.size.width"
|
|
|
- :height="widget.options.size.height"
|
|
|
- :token="widget.options.token"
|
|
|
- :domain="widget.options.domain"
|
|
|
- :multiple="widget.options.multiple"
|
|
|
- :length="widget.options.length"
|
|
|
- :is-qiniu="widget.options.isQiniu"
|
|
|
- :is-delete="widget.options.isDelete"
|
|
|
- :min="widget.options.min"
|
|
|
- :is-edit="widget.options.isEdit"
|
|
|
- :action="widget.options.action"
|
|
|
- />
|
|
|
- </template>
|
|
|
-
|
|
|
- <template v-if="widget.type == 'file'">
|
|
|
- <FileUpload
|
|
|
- :element="widget"
|
|
|
- :data-model="dataModel"
|
|
|
- @fileList="fileList"
|
|
|
- />
|
|
|
- </template>
|
|
|
-
|
|
|
- <template v-if="widget.type === 'editor'">
|
|
|
- <vue-editor
|
|
|
- v-model="dataModel"
|
|
|
- :disabled="widget.options.disabled"
|
|
|
- :style="{ width: widget.options.width }"
|
|
|
- />
|
|
|
- </template>
|
|
|
-
|
|
|
- <template v-if="widget.type === 'cascader'">
|
|
|
- <el-cascader
|
|
|
- v-model="dataModel"
|
|
|
- :disabled="widget.options.disabled"
|
|
|
- :show-all-levels="widget.options.showAllLevels"
|
|
|
- :clearable="widget.options.clearable"
|
|
|
- :placeholder="widget.options.placeholder"
|
|
|
- :style="{ width: widget.options.width }"
|
|
|
- :options="
|
|
|
- widget.options.remote
|
|
|
- ? widget.options.remoteOptions
|
|
|
- : widget.options.options
|
|
|
- "
|
|
|
- />
|
|
|
- </template>
|
|
|
-
|
|
|
- <template v-if="widget.type === 'text'">
|
|
|
- <!-- color: widget.options.font_color, -->
|
|
|
- <span
|
|
|
- :style="{
|
|
|
- 'font-size': widget.options.font_size,
|
|
|
- 'font-family': widget.options.font_family,
|
|
|
- 'font-weight': widget.options.font_weight,
|
|
|
- }"
|
|
|
- class="dataModelText"
|
|
|
- >
|
|
|
- {{ widget.options.defaultValue }}
|
|
|
- </span>
|
|
|
- </template>
|
|
|
-
|
|
|
- <template v-if="widget.type === 'divider'">
|
|
|
- <el-divider
|
|
|
- :direction="widget.options.direction"
|
|
|
- :content-position="widget.options.content_position"
|
|
|
- >
|
|
|
- <span
|
|
|
- :style="{
|
|
|
- 'font-size': widget.options.font_size,
|
|
|
- 'font-family': widget.options.font_family,
|
|
|
- 'font-weight': widget.options.font_weight,
|
|
|
- color: widget.options.font_color,
|
|
|
- }"
|
|
|
- >
|
|
|
- {{ widget.options.defaultValue }}
|
|
|
- </span>
|
|
|
- </el-divider>
|
|
|
- </template>
|
|
|
- </template>
|
|
|
-
|
|
|
- <el-drawer :title="'预览'" direction="rtl" :visible.sync="open" size="50%">
|
|
|
- <div>
|
|
|
- <iframe :src="previewUrl"></iframe>
|
|
|
- <div style="text-align: center">
|
|
|
- <el-button type="primary" @click="open = false">确定</el-button>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- </el-drawer>
|
|
|
- </el-form-item>
|
|
|
-</template>
|
|
|
-
|
|
|
-<script>
|
|
|
-import XLSX from "xlsx";
|
|
|
-import FmUpload from "./Upload";
|
|
|
-import FileUpload from "./Upload/file";
|
|
|
-import { getOrganCooperation } from "@/api/process/work-order";
|
|
|
-export default {
|
|
|
- name: "GenetateFormItem",
|
|
|
- components: {
|
|
|
- FmUpload,
|
|
|
- FileUpload,
|
|
|
- },
|
|
|
- /* eslint-disable */
|
|
|
- props: [
|
|
|
- "widget",
|
|
|
- "models",
|
|
|
- "propValue",
|
|
|
- "parentForm",
|
|
|
- "remote",
|
|
|
- "data",
|
|
|
- "disabled",
|
|
|
- "preview",
|
|
|
- "isLabel",
|
|
|
- "subformIndex",
|
|
|
- "subformModel",
|
|
|
- "organList",
|
|
|
- ],
|
|
|
- data() {
|
|
|
- return {
|
|
|
- open: false,
|
|
|
- showStatus: true,
|
|
|
- widgetLabelWidth: "",
|
|
|
- dataModel:
|
|
|
- this.subformIndex === undefined
|
|
|
- ? this.models[this.widget.model]
|
|
|
- : this.models[this.subformModel][this.subformIndex][
|
|
|
- this.widget.model
|
|
|
- ],
|
|
|
- dataModelStr: null,
|
|
|
- tableData: [],
|
|
|
- cooperationList: [],
|
|
|
- selectLoading: true,
|
|
|
- previewUrl: "",
|
|
|
- };
|
|
|
- },
|
|
|
- computed: {
|
|
|
- hidden() {
|
|
|
- console.log(this.subformModel, this.widget.hidden);
|
|
|
- return this.subformModel ? true : !this.widget.hidden;
|
|
|
- },
|
|
|
- },
|
|
|
- watch: {
|
|
|
- dataModel: {
|
|
|
- deep: true,
|
|
|
- handler(newValue) {
|
|
|
- // console.log(newValue, 'model', this.widget.model)
|
|
|
- if (newValue !== undefined && newValue !== null) {
|
|
|
- if (this.subformIndex !== undefined) {
|
|
|
- this.models[this.subformModel][this.subformIndex][
|
|
|
- this.widget.model
|
|
|
- ] = newValue;
|
|
|
- this.$emit("update:models", {
|
|
|
- ...this.models,
|
|
|
- [this.subformModel]: this.models[this.subformModel],
|
|
|
- });
|
|
|
- // this.$emit('input-change', val, this.widget.model, this.subformIndex)
|
|
|
- } else {
|
|
|
- this.models[this.widget.model] = newValue;
|
|
|
- this.$emit("update:models", {
|
|
|
- ...this.models,
|
|
|
- [this.widget.model]: newValue,
|
|
|
- });
|
|
|
- // this.$emit('input-change', val, this.widget.model)
|
|
|
- }
|
|
|
- }
|
|
|
- },
|
|
|
- },
|
|
|
- models: {
|
|
|
- deep: true,
|
|
|
- async handler(val) {
|
|
|
- // console.log(val, 'show')
|
|
|
- if (val.status === undefined && val.status === null) {
|
|
|
- if (this.subformIndex === undefined) {
|
|
|
- this.dataModel = val[this.widget.model];
|
|
|
- } else {
|
|
|
- this.dataModel =
|
|
|
- val[this.subformModel][this.subformIndex][this.widget.model];
|
|
|
- }
|
|
|
- }
|
|
|
- delete this.models.status;
|
|
|
- this.handleDisplayVerifiy();
|
|
|
- },
|
|
|
- },
|
|
|
- cooperationList: {
|
|
|
- deep: true,
|
|
|
- handler(val) {
|
|
|
- if (this.widget.type == "school" && this.preview) {
|
|
|
- let tempStr = null;
|
|
|
- val.forEach((item) => {
|
|
|
- if (item.id == this.dataModel) {
|
|
|
- tempStr = item.name;
|
|
|
- }
|
|
|
- });
|
|
|
- this.dataModelStr = tempStr;
|
|
|
- }
|
|
|
- },
|
|
|
- },
|
|
|
- },
|
|
|
- created() {
|
|
|
- // 判断当前元素是否是分部表单()
|
|
|
- // console.log(this.widget, 'widget subform')
|
|
|
- if (this.widget.type == "organ" && this.preview) {
|
|
|
- let tempStr = null;
|
|
|
- this.organList.forEach((item) => {
|
|
|
- if (item.id == this.dataModel) {
|
|
|
- tempStr = item.name;
|
|
|
- }
|
|
|
- });
|
|
|
- this.dataModelStr = tempStr;
|
|
|
- }
|
|
|
- // 学校信息
|
|
|
- if (this.widget.type == "school" && this.preview) {
|
|
|
- this.onGetSchoolList(true);
|
|
|
- // let tempStr = null
|
|
|
- // this.cooperationList.forEach(item => {
|
|
|
- // if(item.id == this.dataModel) {
|
|
|
- // tempStr = item.name
|
|
|
- // }
|
|
|
- // });
|
|
|
- // // this.dataModel = tempStr
|
|
|
- }
|
|
|
-
|
|
|
- if (
|
|
|
- this.widget.options.remote &&
|
|
|
- this.remote[this.widget.options.remoteFunc]
|
|
|
- ) {
|
|
|
- this.remote[this.widget.options.remoteFunc]((data) => {
|
|
|
- this.widget.options.remoteOptions = data.map((item) => {
|
|
|
- return {
|
|
|
- value: item[this.widget.options.props.value],
|
|
|
- label: item[this.widget.options.props.label],
|
|
|
- children: item[this.widget.options.props.children],
|
|
|
- };
|
|
|
- });
|
|
|
- });
|
|
|
- }
|
|
|
-
|
|
|
- if (this.widget.type === "imgupload" && this.widget.options.isQiniu) {
|
|
|
- this.remote[this.widget.options.tokenFunc]((data) => {
|
|
|
- this.widget.options.token = data;
|
|
|
- });
|
|
|
- }
|
|
|
-
|
|
|
- if (this.disabled !== undefined && this.disabled !== null) {
|
|
|
- this.widget.options.disabled = this.disabled;
|
|
|
- }
|
|
|
-
|
|
|
- // label width
|
|
|
- if (this.widget.options.labelWidthDisabled) {
|
|
|
- this.widgetLabelWidth = this.widget.options.labelWidth;
|
|
|
- } else if (this.widget.type === "divider") {
|
|
|
- this.widgetLabelWidth = 0;
|
|
|
- } else {
|
|
|
- this.widgetLabelWidth = 150;
|
|
|
- }
|
|
|
-
|
|
|
- this.handleDisplayVerifiy();
|
|
|
- },
|
|
|
- mounted() {
|
|
|
- // console.log(this.widget, "12121", this.dataModel);
|
|
|
- if (this.widget.type == "select" && this.widget.options.relationStatus) {
|
|
|
- console.log(true, "false");
|
|
|
- this.onChangeSelect();
|
|
|
- }
|
|
|
- },
|
|
|
- methods: {
|
|
|
- isCheckImage(file) {
|
|
|
- const urlArr = file.split(".");
|
|
|
- const suffix = urlArr[urlArr.length - 1];
|
|
|
- const imgSuffix = ["png", "jpg", "jpeg", "gif", "ico"];
|
|
|
- console.log(imgSuffix.includes(suffix), "11");
|
|
|
- return imgSuffix.includes(suffix);
|
|
|
- },
|
|
|
- // 获取学校列表
|
|
|
- onDownload(item, type) {
|
|
|
- if (type == "download") {
|
|
|
- window.location.href = item.url;
|
|
|
- return;
|
|
|
- }
|
|
|
-
|
|
|
- let urlArr = item.url.split(".");
|
|
|
- let suffix = urlArr[urlArr.length - 1];
|
|
|
- const imgSuffix = ["png", "jpg", "jpeg", "gif", "ico"];
|
|
|
- if (imgSuffix.includes(suffix)) {
|
|
|
- } else if (suffix != "pdf") {
|
|
|
- this.previewUrl =
|
|
|
- "https://view.officeapps.live.com/op/view.aspx?src=" + item.url;
|
|
|
- window.open(this.previewUrl);
|
|
|
- return;
|
|
|
- } else {
|
|
|
- this.previewUrl =
|
|
|
- this.validManageUrl() + "/pdf/web/viewer.html?file=" + item.url;
|
|
|
- window.open(this.previewUrl);
|
|
|
- return;
|
|
|
- }
|
|
|
- },
|
|
|
- // 教务地址
|
|
|
- validManageUrl() {
|
|
|
- let url = window.location.href;
|
|
|
- let returnUrl = "";
|
|
|
- if (/dev/.test(url)) {
|
|
|
- // dev 环境
|
|
|
- returnUrl = "http://mandev.dayaedu.com";
|
|
|
- } else if (/test/.test(url)) {
|
|
|
- // dev 环境
|
|
|
- returnUrl = "http://mantest.dayaedu.com";
|
|
|
- } else if (/online/.test(url)) {
|
|
|
- //线上
|
|
|
- returnUrl = "https://manonline.dayaedu.com";
|
|
|
- } else {
|
|
|
- // 默认dev环境
|
|
|
- returnUrl = "http://mandev.dayaedu.com";
|
|
|
- }
|
|
|
- return returnUrl;
|
|
|
- },
|
|
|
- readWorkbookFromRemoteFile: function (url) {
|
|
|
- var xhr = new XMLHttpRequest();
|
|
|
- xhr.open("get", url, true);
|
|
|
- xhr.responseType = "arraybuffer";
|
|
|
- let _this = this;
|
|
|
- xhr.onload = function (e) {
|
|
|
- var binary = "";
|
|
|
- console.log(xhr);
|
|
|
- if (xhr.status === 200) {
|
|
|
- var bytes = new Uint8Array(xhr.response);
|
|
|
- var length = bytes.byteLength;
|
|
|
- for (var i = 0; i < length; i++) {
|
|
|
- binary += String.fromCharCode(bytes[i]);
|
|
|
- }
|
|
|
- var wb = XLSX.read(binary, { type: "binary" });
|
|
|
- var wsname = wb.SheetNames[0];
|
|
|
- var ws = wb.Sheets[wsname];
|
|
|
- console.log(ws);
|
|
|
- var HTML = XLSX.utils.sheet_to_html(ws);
|
|
|
- if (_this.$refs.preview) {
|
|
|
- _this.$refs.preview.innerHTML = HTML;
|
|
|
- }
|
|
|
- }
|
|
|
- };
|
|
|
- xhr.send();
|
|
|
- },
|
|
|
- getData() {
|
|
|
- let that = this;
|
|
|
- let element = that.$refs.preview;
|
|
|
- // Transform(element);
|
|
|
- var initScale = 1;
|
|
|
- this.af = new AlloyFinger(element, {
|
|
|
- // rotate: function (evt) { //实现旋转
|
|
|
- // element.rotateZ += evt.angle;
|
|
|
- // },
|
|
|
- multipointStart: function () {
|
|
|
- initScale = element.scaleX;
|
|
|
- },
|
|
|
- pinch: function (evt) {
|
|
|
- //实现缩放
|
|
|
- element.scaleX = element.scaleY = initScale * evt.zoom;
|
|
|
- },
|
|
|
- pressMove: function (evt) {
|
|
|
- //实现移动
|
|
|
- element.translateX += evt.deltaX;
|
|
|
- element.translateY += evt.deltaY;
|
|
|
- evt.preventDefault();
|
|
|
- },
|
|
|
- });
|
|
|
- },
|
|
|
- checkFileSuffix(url) {
|
|
|
- let urlArr = url.split(".");
|
|
|
- let suffix = urlArr[urlArr.length - 1];
|
|
|
- const passSuffix = [
|
|
|
- "xlsx",
|
|
|
- "xls",
|
|
|
- "pdf",
|
|
|
- "png",
|
|
|
- "jpg",
|
|
|
- "jpeg",
|
|
|
- "gif",
|
|
|
- "ico",
|
|
|
- ];
|
|
|
- if (passSuffix.includes(suffix)) {
|
|
|
- return true;
|
|
|
- } else {
|
|
|
- return false;
|
|
|
- }
|
|
|
- },
|
|
|
- // select 选择时触发
|
|
|
- onChangeSelect() {
|
|
|
- let relationArray = [];
|
|
|
- // console.log(this.widget.options.options)
|
|
|
- let allArray = [];
|
|
|
- this.widget.options &&
|
|
|
- this.widget.options.options.forEach((item) => {
|
|
|
- // 判断是否是多选
|
|
|
- let tempRelation = item.relationOptions || [];
|
|
|
- allArray.push(...tempRelation);
|
|
|
- if (this.widget.options.multiple) {
|
|
|
- if (this.dataModel.includes(item.value)) {
|
|
|
- relationArray.push(...tempRelation);
|
|
|
- }
|
|
|
- } else {
|
|
|
- if (this.dataModel == item.value) {
|
|
|
- let tempRelation = item.relationOptions || [];
|
|
|
- relationArray.push(...tempRelation);
|
|
|
- }
|
|
|
- }
|
|
|
- });
|
|
|
- console.log(relationArray, "111", this.dataModel, this.widget.options);
|
|
|
- // if (relationArray.length > 0) {
|
|
|
- this.$emit("relationFormChange", relationArray, allArray);
|
|
|
- // }
|
|
|
-
|
|
|
- // this.dataModel = this.selectValue.join(",");
|
|
|
- // this.showSelect = false;
|
|
|
- // let relationArray = [];
|
|
|
- // let allArray = [];
|
|
|
- // this.options?.options?.forEach((item) => {
|
|
|
- // let tempRelation = item.relationOptions || [];
|
|
|
- // allArray.push(...tempRelation);
|
|
|
- // if (this.selectValue.includes(item.value)) {
|
|
|
- // relationArray.push(...tempRelation);
|
|
|
- // }
|
|
|
- // });
|
|
|
- // let uniqueArr = [...new Set(relationArray)];
|
|
|
- // this.$emit("relationFormChange", uniqueArr, allArray);
|
|
|
- },
|
|
|
- fileCheckRequired(state) {
|
|
|
- this.$emit("fileCheckRequired", state);
|
|
|
- },
|
|
|
- async onGetSchoolList(val) {
|
|
|
- // 隐藏的时候的不获取数据,
|
|
|
- // 为什么每次都需要请求,因为我没有判断分部数据是否有修改
|
|
|
- if (!val) {
|
|
|
- return;
|
|
|
- }
|
|
|
- let organId = null;
|
|
|
- this.selectLoading = true;
|
|
|
- if (this.subformModel) {
|
|
|
- organId =
|
|
|
- this.models[this.subformModel][this.subformIndex][
|
|
|
- this.widget.options.displayRelation
|
|
|
- ];
|
|
|
- } else {
|
|
|
- organId = this.models[this.widget.options.displayRelation];
|
|
|
- }
|
|
|
- // // 判断是否有选择分部 判断列表已经有数据了
|
|
|
- if (organId) {
|
|
|
- let res = await getOrganCooperation({ organId });
|
|
|
- this.cooperationList = [...res.data];
|
|
|
- }
|
|
|
- this.selectLoading = false;
|
|
|
- },
|
|
|
- // 处理用户输入的值 input框
|
|
|
- onInputChangeNumber(event) {
|
|
|
- // 不用处理string类型的
|
|
|
- // console.log(event, this.widget.options)
|
|
|
- const type = this.widget.options.dataType;
|
|
|
- if (type == "number" || type == "integer") {
|
|
|
- this.onVerifiyNumberInteger(event);
|
|
|
- } else if (type == "float") {
|
|
|
- this.verifyNumberIntegerAndFloat(event);
|
|
|
- }
|
|
|
- },
|
|
|
- verifyNumberIntegerAndFloat(val) {
|
|
|
- // val = this.ruleForm.test;
|
|
|
- const t = val.charAt(0);
|
|
|
- // 匹配空格
|
|
|
- // console.log(val)
|
|
|
- let v = val.replace(/(^\s*)|(\s*$)/g, "");
|
|
|
- // 只能是数字和小数点,不能是其他输入
|
|
|
- v = v.replace(/[^\d.]/g, "");
|
|
|
- // 以0开始只能输入一个
|
|
|
- v = v.replace(/^0{2}$/g, "0");
|
|
|
- // 保证第一位只能是数字,不能是点
|
|
|
- v = v.replace(/^\./g, "");
|
|
|
- // 小数只能出现1位
|
|
|
- v = v.replace(".", "$#$").replace(/\./g, "").replace("$#$", ".");
|
|
|
- // 小数点后面保留2位
|
|
|
- v = v.replace(/^(\-)*(\d+)\.(\d\d).*$/, "$1$2.$3");
|
|
|
- if (t == "-") {
|
|
|
- v = "-" + v;
|
|
|
- }
|
|
|
- // 返回结果
|
|
|
- this.dataModel = v;
|
|
|
- },
|
|
|
- onVerifiyNumberInteger(val) {
|
|
|
- const t = val.charAt(0);
|
|
|
- // 匹配空格
|
|
|
- let v = val.replace(/(^\s*)|(\s*$)/g, "");
|
|
|
- // 去掉 '.' , 防止贴贴的时候出现问题 如 0.1.12.12
|
|
|
- v = v.replace(/[\.]*/g, "");
|
|
|
- // 去掉以 0 开始后面的数, 防止贴贴的时候出现问题 如 00121323
|
|
|
- v = v.replace(/(^0[\d]*)$/g, "0");
|
|
|
- // 首位是0,只能出现一次
|
|
|
- v = v.replace(/^0\d$/g, "0");
|
|
|
- // 只匹配数字
|
|
|
- v = v.replace(/[^\d]/g, "");
|
|
|
- if (t == "-") {
|
|
|
- v = "-" + v;
|
|
|
- }
|
|
|
- // 返回结果
|
|
|
- this.dataModel = v;
|
|
|
- },
|
|
|
- fileList(files) {
|
|
|
- // 只处理乐团退费
|
|
|
- const query = this.$route.query;
|
|
|
- if (query.processId == 19) {
|
|
|
- if (files && files.length > 0) {
|
|
|
- this.$emit("fileCheckRequired", true);
|
|
|
- } else {
|
|
|
- this.$emit("fileCheckRequired", false);
|
|
|
- }
|
|
|
- } else {
|
|
|
- this.$emit("fileCheckRequired", false);
|
|
|
- }
|
|
|
- this.dataModel = files;
|
|
|
- },
|
|
|
- handleDisplayVerifiy() {
|
|
|
- if (Object.keys(this.widget.options).indexOf("displayVerifiy") >= 0) {
|
|
|
- if (this.widget.options.displayVerifiy.type !== "hide") {
|
|
|
- var c = 0;
|
|
|
- for (var v of this.widget.options.displayVerifiy.list) {
|
|
|
- if (this.models[v.model].toString() === v.value) {
|
|
|
- c++;
|
|
|
- }
|
|
|
- }
|
|
|
- if (this.widget.options.displayVerifiy.type === "and") {
|
|
|
- if (c !== this.widget.options.displayVerifiy.list.length) {
|
|
|
- this.showStatus = false;
|
|
|
- } else {
|
|
|
- this.showStatus = true;
|
|
|
- }
|
|
|
- } else if (this.widget.options.displayVerifiy.type === "or") {
|
|
|
- if (c === 0) {
|
|
|
- this.showStatus = false;
|
|
|
- } else {
|
|
|
- this.showStatus = true;
|
|
|
- }
|
|
|
- }
|
|
|
- }
|
|
|
- }
|
|
|
- },
|
|
|
- dataFormatBr(str) {
|
|
|
- return str ? str.replace(/\n/gi, "<br />") : str;
|
|
|
- },
|
|
|
- },
|
|
|
-};
|
|
|
-</script>
|
|
|
-
|
|
|
-<style>
|
|
|
-.previewEditorDiv > p {
|
|
|
- margin: 0;
|
|
|
-}
|
|
|
-
|
|
|
-.preview-cascader-class .el-input.is-disabled .el-input__inner {
|
|
|
- background-color: #fff;
|
|
|
- border: none;
|
|
|
- color: #303133;
|
|
|
-}
|
|
|
-
|
|
|
-.preview-cascader-class
|
|
|
- .el-input.is-disabled
|
|
|
- .el-input__suffix
|
|
|
- .el-input__suffix-inner
|
|
|
- .el-input__icon.el-icon-arrow-down:before {
|
|
|
- content: "";
|
|
|
-}
|
|
|
-
|
|
|
-.dataModelText {
|
|
|
- color: #e7af84;
|
|
|
-}
|
|
|
-.dataModelText .el-form-item__label {
|
|
|
- color: #e7af84 !important;
|
|
|
-}
|
|
|
-</style>
|
|
|
+<template>
|
|
|
+ <el-form-item
|
|
|
+ v-if="showStatus && hidden"
|
|
|
+ :label-width="
|
|
|
+ isLabel === false || !widget.options.labelWidthStatus ? '0px' : 150 + 'px'
|
|
|
+ "
|
|
|
+ :label="
|
|
|
+ isLabel === false ||
|
|
|
+ widget.type === 'divider' ||
|
|
|
+ !widget.options.labelWidthStatus
|
|
|
+ ? ''
|
|
|
+ : widget.name
|
|
|
+ "
|
|
|
+ :key="propValue"
|
|
|
+ :prop="propValue"
|
|
|
+ :class="[parentForm, widget.type == 'text' && 'dataModelText']"
|
|
|
+ :style="subformIndex !== undefined ? { 'margin-bottom': '0' } : {}"
|
|
|
+ >
|
|
|
+ <template v-if="preview">
|
|
|
+ <template v-if="widget.type === 'color'">
|
|
|
+ <div
|
|
|
+ style="width: 32px; height: 20px; margin-top: 6px; border-radius: 3px"
|
|
|
+ :style="{ 'background-color': dataModel }"
|
|
|
+ />
|
|
|
+ </template>
|
|
|
+ <template v-else-if="widget.type == 'switch'">
|
|
|
+ <el-switch v-model="dataModel" :disabled="true" />
|
|
|
+ </template>
|
|
|
+ <template v-else-if="widget.type === 'editor'">
|
|
|
+ <div class="previewEditorDiv" v-html="dataModel" />
|
|
|
+ </template>
|
|
|
+
|
|
|
+ <template v-else-if="widget.type == 'file'">
|
|
|
+ <div
|
|
|
+ v-for="(uploadUrlItem, uploadUrlIndex) of dataModel"
|
|
|
+ :key="uploadUrlIndex"
|
|
|
+ >
|
|
|
+ <i style="color: #909399" class="el-icon-document" />
|
|
|
+ <span>{{ uploadUrlItem.name || uploadUrlItem.url }}</span>
|
|
|
+ <el-button
|
|
|
+ round
|
|
|
+ size="mini"
|
|
|
+ @click="onDownload(uploadUrlItem, 'download')"
|
|
|
+ >下载</el-button
|
|
|
+ >
|
|
|
+ <el-button
|
|
|
+ round
|
|
|
+ type="primary"
|
|
|
+ @click="onDownload(uploadUrlItem)"
|
|
|
+ v-if="
|
|
|
+ checkFileSuffix(uploadUrlItem.url) &&
|
|
|
+ !isCheckImage(uploadUrlItem.url)
|
|
|
+ "
|
|
|
+ size="mini"
|
|
|
+ >预览</el-button
|
|
|
+ >
|
|
|
+ <div
|
|
|
+ v-if="isCheckImage(uploadUrlItem.url)"
|
|
|
+ style="display: inline-flex; position: relative"
|
|
|
+ >
|
|
|
+ <el-button
|
|
|
+ style="position: absolute; left: 0; top: 0"
|
|
|
+ round
|
|
|
+ type="primary"
|
|
|
+ @click="onDownload(uploadUrlItem)"
|
|
|
+ v-if="checkFileSuffix(uploadUrlItem.url)"
|
|
|
+ size="mini"
|
|
|
+ >预览</el-button
|
|
|
+ >
|
|
|
+ <el-image
|
|
|
+ style="width: 56px; height: 28px; opacity: 0"
|
|
|
+ :src="uploadUrlItem.url"
|
|
|
+ :preview-src-list="[uploadUrlItem.url]"
|
|
|
+ >
|
|
|
+ </el-image>
|
|
|
+ </div>
|
|
|
+ <!-- <a :href="uploadUrlItem.url" target="_blank">{{ uploadUrlItem.name || uploadUrlItem.url }}</a> -->
|
|
|
+ </div>
|
|
|
+ </template>
|
|
|
+
|
|
|
+ <template v-else-if="widget.type == 'imgupload'">
|
|
|
+ <fm-upload
|
|
|
+ v-model="dataModel"
|
|
|
+ :style="{ width: widget.options.width }"
|
|
|
+ :width="widget.options.size.width"
|
|
|
+ :height="widget.options.size.height"
|
|
|
+ :preview="preview"
|
|
|
+ />
|
|
|
+ </template>
|
|
|
+ <template v-else-if="widget.type == 'rate'">
|
|
|
+ <el-rate
|
|
|
+ v-model="dataModel"
|
|
|
+ :max="widget.options.max"
|
|
|
+ :disabled="true"
|
|
|
+ :allow-half="widget.options.allowHalf"
|
|
|
+ />
|
|
|
+ </template>
|
|
|
+ <template v-else-if="widget.type === 'divider'">
|
|
|
+ <el-divider
|
|
|
+ :direction="widget.options.direction"
|
|
|
+ :content-position="widget.options.content_position"
|
|
|
+ >
|
|
|
+ <span
|
|
|
+ :style="{
|
|
|
+ 'font-size': widget.options.font_size,
|
|
|
+ 'font-family': widget.options.font_family,
|
|
|
+ 'font-weight': widget.options.font_weight,
|
|
|
+ color: widget.options.font_color,
|
|
|
+ }"
|
|
|
+ >
|
|
|
+ {{ widget.options.defaultValue }}
|
|
|
+ </span>
|
|
|
+ </el-divider>
|
|
|
+ </template>
|
|
|
+ <template
|
|
|
+ v-else-if="widget.type === 'input' && widget.options.showPassword"
|
|
|
+ >
|
|
|
+ <input
|
|
|
+ :value="dataModel"
|
|
|
+ type="password"
|
|
|
+ style="border: none; background-color: #ffffff; color: #303133"
|
|
|
+ disabled="disabled"
|
|
|
+ />
|
|
|
+ </template>
|
|
|
+ <template v-else-if="widget.type === 'cascader'">
|
|
|
+ <el-cascader
|
|
|
+ v-model="dataModel"
|
|
|
+ class="preview-cascader-class"
|
|
|
+ :disabled="true"
|
|
|
+ :show-all-levels="widget.options.showAllLevels"
|
|
|
+ :options="
|
|
|
+ widget.options.remote
|
|
|
+ ? widget.options.remoteOptions
|
|
|
+ : widget.options.options
|
|
|
+ "
|
|
|
+ />
|
|
|
+ </template>
|
|
|
+ <template v-else-if="widget.type === 'textarea'">
|
|
|
+ <span v-html="dataFormatBr(dataModel)"></span>
|
|
|
+ </template>
|
|
|
+ <template v-else-if="widget.type === 'text'">
|
|
|
+ <span class="dataModelText">{{ dataModel }}</span>
|
|
|
+ </template>
|
|
|
+ <template v-else>
|
|
|
+ <div v-if="dataModel">
|
|
|
+ <template v-if="widget.type == 'organ' || widget.type == 'school'">
|
|
|
+ {{ dataModelStr }}
|
|
|
+ </template>
|
|
|
+ <template v-else>
|
|
|
+ {{ dataModel }}
|
|
|
+ </template>
|
|
|
+ </div>
|
|
|
+ </template>
|
|
|
+ </template>
|
|
|
+ <template v-else>
|
|
|
+ <template v-if="widget.type === 'input'">
|
|
|
+ <el-input
|
|
|
+ v-if="
|
|
|
+ widget.options.dataType === 'number' ||
|
|
|
+ widget.options.dataType === 'integer' ||
|
|
|
+ widget.options.dataType === 'float'
|
|
|
+ "
|
|
|
+ v-model="dataModel"
|
|
|
+ :type="widget.options.dataType"
|
|
|
+ @input="onInputChangeNumber($event)"
|
|
|
+ :placeholder="widget.options.placeholder"
|
|
|
+ :style="{ width: widget.options.width }"
|
|
|
+ :disabled="widget.options.disabled"
|
|
|
+ :show-password="widget.options.showPassword"
|
|
|
+ />
|
|
|
+ <el-input
|
|
|
+ v-else
|
|
|
+ v-model="dataModel"
|
|
|
+ :type="widget.options.dataType"
|
|
|
+ :disabled="widget.options.disabled"
|
|
|
+ :placeholder="widget.options.placeholder"
|
|
|
+ :style="{ width: widget.options.width }"
|
|
|
+ :show-password="widget.options.showPassword"
|
|
|
+ />
|
|
|
+ </template>
|
|
|
+
|
|
|
+ <template v-if="widget.type === 'textarea'">
|
|
|
+ <el-input
|
|
|
+ v-model="dataModel"
|
|
|
+ type="textarea"
|
|
|
+ :rows="5"
|
|
|
+ :disabled="widget.options.disabled"
|
|
|
+ :placeholder="widget.options.placeholder"
|
|
|
+ :style="{ width: widget.options.width }"
|
|
|
+ />
|
|
|
+ </template>
|
|
|
+
|
|
|
+ <template v-if="widget.type === 'number'">
|
|
|
+ <el-input-number
|
|
|
+ v-model="dataModel"
|
|
|
+ :style="{ width: widget.options.width }"
|
|
|
+ :step="widget.options.step"
|
|
|
+ controls-position="right"
|
|
|
+ :disabled="widget.options.disabled"
|
|
|
+ />
|
|
|
+ </template>
|
|
|
+
|
|
|
+ <template v-if="widget.type === 'radio'">
|
|
|
+ <el-radio-group
|
|
|
+ v-model="dataModel"
|
|
|
+ :style="{ width: widget.options.width }"
|
|
|
+ :disabled="widget.options.disabled"
|
|
|
+ >
|
|
|
+ <el-radio
|
|
|
+ v-for="(item, index) in widget.options.remote
|
|
|
+ ? widget.options.remoteOptions
|
|
|
+ : widget.options.options"
|
|
|
+ :key="index"
|
|
|
+ :style="{
|
|
|
+ display: widget.options.inline ? 'inline-block' : 'block',
|
|
|
+ }"
|
|
|
+ :label="item.value"
|
|
|
+ >
|
|
|
+ <template v-if="widget.options.remote">{{ item.label }}</template>
|
|
|
+ <template v-else>{{
|
|
|
+ widget.options.showLabel ? item.label : item.value
|
|
|
+ }}</template>
|
|
|
+ </el-radio>
|
|
|
+ </el-radio-group>
|
|
|
+ </template>
|
|
|
+
|
|
|
+ <template v-if="widget.type === 'checkbox'">
|
|
|
+ <el-checkbox-group
|
|
|
+ v-model="dataModel"
|
|
|
+ :style="{ width: widget.options.width }"
|
|
|
+ :disabled="widget.options.disabled"
|
|
|
+ >
|
|
|
+ <el-checkbox
|
|
|
+ v-for="(item, index) in widget.options.remote
|
|
|
+ ? widget.options.remoteOptions
|
|
|
+ : widget.options.options"
|
|
|
+ :key="index"
|
|
|
+ :style="{
|
|
|
+ display: widget.options.inline ? 'inline-block' : 'block',
|
|
|
+ }"
|
|
|
+ :label="item.value"
|
|
|
+ >
|
|
|
+ <template v-if="widget.options.remote">{{ item.label }}</template>
|
|
|
+ <template v-else>{{
|
|
|
+ widget.options.showLabel ? item.label : item.value
|
|
|
+ }}</template>
|
|
|
+ </el-checkbox>
|
|
|
+ </el-checkbox-group>
|
|
|
+ </template>
|
|
|
+
|
|
|
+ <template v-if="widget.type === 'time'">
|
|
|
+ <el-time-picker
|
|
|
+ v-model="dataModel"
|
|
|
+ :is-range="widget.options.isRange"
|
|
|
+ :placeholder="widget.options.placeholder"
|
|
|
+ :start-placeholder="widget.options.startPlaceholder"
|
|
|
+ :end-placeholder="widget.options.endPlaceholder"
|
|
|
+ :readonly="widget.options.readonly"
|
|
|
+ :disabled="widget.options.disabled"
|
|
|
+ :editable="widget.options.editable"
|
|
|
+ :clearable="widget.options.clearable"
|
|
|
+ :arrow-control="widget.options.arrowControl"
|
|
|
+ :value-format="widget.options.format"
|
|
|
+ :style="{ width: widget.options.width }"
|
|
|
+ />
|
|
|
+ </template>
|
|
|
+
|
|
|
+ <template v-if="widget.type == 'date'">
|
|
|
+ <el-date-picker
|
|
|
+ v-model="dataModel"
|
|
|
+ :type="widget.options.type"
|
|
|
+ :placeholder="widget.options.placeholder"
|
|
|
+ :start-placeholder="widget.options.startPlaceholder"
|
|
|
+ :end-placeholder="widget.options.endPlaceholder"
|
|
|
+ :readonly="widget.options.readonly"
|
|
|
+ :disabled="widget.options.disabled"
|
|
|
+ :editable="widget.options.editable"
|
|
|
+ :clearable="widget.options.clearable"
|
|
|
+ :value-format="
|
|
|
+ widget.options.timestamp ? 'timestamp' : widget.options.format
|
|
|
+ "
|
|
|
+ :format="widget.options.format"
|
|
|
+ :style="{ width: widget.options.width }"
|
|
|
+ />
|
|
|
+ </template>
|
|
|
+
|
|
|
+ <template v-if="widget.type == 'rate'">
|
|
|
+ <el-rate
|
|
|
+ v-model="dataModel"
|
|
|
+ :max="widget.options.max"
|
|
|
+ :disabled="widget.options.disabled"
|
|
|
+ :allow-half="widget.options.allowHalf"
|
|
|
+ />
|
|
|
+ </template>
|
|
|
+
|
|
|
+ <template v-if="widget.type === 'color'">
|
|
|
+ <el-color-picker
|
|
|
+ v-model="dataModel"
|
|
|
+ :disabled="widget.options.disabled"
|
|
|
+ :show-alpha="widget.options.showAlpha"
|
|
|
+ />
|
|
|
+ </template>
|
|
|
+
|
|
|
+ <template v-if="widget.type === 'select'">
|
|
|
+ <el-select
|
|
|
+ v-model="dataModel"
|
|
|
+ :disabled="widget.options.disabled"
|
|
|
+ :multiple="widget.options.multiple"
|
|
|
+ :clearable="widget.options.clearable"
|
|
|
+ :placeholder="widget.options.placeholder"
|
|
|
+ :style="{ width: widget.options.width }"
|
|
|
+ filterable
|
|
|
+ @change="onChangeSelect"
|
|
|
+ >
|
|
|
+ <el-option
|
|
|
+ v-for="item in widget.options.remote
|
|
|
+ ? widget.options.remoteOptions
|
|
|
+ : widget.options.options"
|
|
|
+ :key="item.value"
|
|
|
+ :value="item.value"
|
|
|
+ :label="
|
|
|
+ widget.options.showLabel || widget.options.remote
|
|
|
+ ? item.label
|
|
|
+ : item.value
|
|
|
+ "
|
|
|
+ />
|
|
|
+ </el-select>
|
|
|
+ </template>
|
|
|
+
|
|
|
+ <template v-if="widget.type === 'organ'">
|
|
|
+ <el-select
|
|
|
+ v-model="dataModel"
|
|
|
+ :disabled="widget.options.disabled"
|
|
|
+ :multiple="widget.options.multiple"
|
|
|
+ clearable
|
|
|
+ filterable
|
|
|
+ :placeholder="widget.options.placeholder"
|
|
|
+ :style="{ width: widget.options.width }"
|
|
|
+ :name="widget.model"
|
|
|
+ >
|
|
|
+ <el-option
|
|
|
+ v-for="item in organList"
|
|
|
+ :key="item.id"
|
|
|
+ :value="item.id"
|
|
|
+ :label="item.name"
|
|
|
+ />
|
|
|
+ </el-select>
|
|
|
+ </template>
|
|
|
+
|
|
|
+ <template v-if="widget.type === 'school'">
|
|
|
+ <el-select
|
|
|
+ v-model="dataModel"
|
|
|
+ :disabled="widget.options.disabled"
|
|
|
+ :multiple="widget.options.multiple"
|
|
|
+ clearable
|
|
|
+ :placeholder="widget.options.placeholder"
|
|
|
+ :style="{ width: widget.options.width }"
|
|
|
+ filterable
|
|
|
+ :loading="selectLoading"
|
|
|
+ @visible-change="onGetSchoolList"
|
|
|
+ >
|
|
|
+ <el-option
|
|
|
+ v-for="item in cooperationList"
|
|
|
+ :key="item.id"
|
|
|
+ :value="item.id"
|
|
|
+ :label="item.name"
|
|
|
+ />
|
|
|
+ </el-select>
|
|
|
+ </template>
|
|
|
+
|
|
|
+ <template v-if="widget.type == 'switch'">
|
|
|
+ <el-switch v-model="dataModel" :disabled="widget.options.disabled" />
|
|
|
+ </template>
|
|
|
+
|
|
|
+ <template v-if="widget.type == 'slider'">
|
|
|
+ <el-slider
|
|
|
+ v-model="dataModel"
|
|
|
+ :min="widget.options.min"
|
|
|
+ :max="widget.options.max"
|
|
|
+ :disabled="widget.options.disabled"
|
|
|
+ :step="widget.options.step"
|
|
|
+ :show-input="widget.options.showInput"
|
|
|
+ :range="widget.options.range"
|
|
|
+ :style="{ width: widget.options.width }"
|
|
|
+ />
|
|
|
+ </template>
|
|
|
+
|
|
|
+ <template v-if="widget.type == 'imgupload'">
|
|
|
+ <fm-upload
|
|
|
+ v-model="dataModel"
|
|
|
+ :disabled="widget.options.disabled"
|
|
|
+ :style="{ width: widget.options.width }"
|
|
|
+ :width="widget.options.size.width"
|
|
|
+ :height="widget.options.size.height"
|
|
|
+ :token="widget.options.token"
|
|
|
+ :domain="widget.options.domain"
|
|
|
+ :multiple="widget.options.multiple"
|
|
|
+ :length="widget.options.length"
|
|
|
+ :is-qiniu="widget.options.isQiniu"
|
|
|
+ :is-delete="widget.options.isDelete"
|
|
|
+ :min="widget.options.min"
|
|
|
+ :is-edit="widget.options.isEdit"
|
|
|
+ :action="widget.options.action"
|
|
|
+ />
|
|
|
+ </template>
|
|
|
+
|
|
|
+ <template v-if="widget.type == 'file'">
|
|
|
+ <FileUpload
|
|
|
+ :element="widget"
|
|
|
+ :data-model="dataModel"
|
|
|
+ @fileList="fileList"
|
|
|
+ />
|
|
|
+ </template>
|
|
|
+
|
|
|
+ <template v-if="widget.type === 'editor'">
|
|
|
+ <vue-editor
|
|
|
+ v-model="dataModel"
|
|
|
+ :disabled="widget.options.disabled"
|
|
|
+ :style="{ width: widget.options.width }"
|
|
|
+ />
|
|
|
+ </template>
|
|
|
+
|
|
|
+ <template v-if="widget.type === 'cascader'">
|
|
|
+ <el-cascader
|
|
|
+ v-model="dataModel"
|
|
|
+ :disabled="widget.options.disabled"
|
|
|
+ :show-all-levels="widget.options.showAllLevels"
|
|
|
+ :clearable="widget.options.clearable"
|
|
|
+ :placeholder="widget.options.placeholder"
|
|
|
+ :style="{ width: widget.options.width }"
|
|
|
+ :options="
|
|
|
+ widget.options.remote
|
|
|
+ ? widget.options.remoteOptions
|
|
|
+ : widget.options.options
|
|
|
+ "
|
|
|
+ />
|
|
|
+ </template>
|
|
|
+
|
|
|
+ <template v-if="widget.type === 'text'">
|
|
|
+ <!-- color: widget.options.font_color, -->
|
|
|
+ <span
|
|
|
+ :style="{
|
|
|
+ 'font-size': widget.options.font_size,
|
|
|
+ 'font-family': widget.options.font_family,
|
|
|
+ 'font-weight': widget.options.font_weight,
|
|
|
+ }"
|
|
|
+ class="dataModelText"
|
|
|
+ >
|
|
|
+ {{ widget.options.defaultValue }}
|
|
|
+ </span>
|
|
|
+ </template>
|
|
|
+
|
|
|
+ <template v-if="widget.type === 'divider'">
|
|
|
+ <el-divider
|
|
|
+ :direction="widget.options.direction"
|
|
|
+ :content-position="widget.options.content_position"
|
|
|
+ >
|
|
|
+ <span
|
|
|
+ :style="{
|
|
|
+ 'font-size': widget.options.font_size,
|
|
|
+ 'font-family': widget.options.font_family,
|
|
|
+ 'font-weight': widget.options.font_weight,
|
|
|
+ color: widget.options.font_color,
|
|
|
+ }"
|
|
|
+ >
|
|
|
+ {{ widget.options.defaultValue }}
|
|
|
+ </span>
|
|
|
+ </el-divider>
|
|
|
+ </template>
|
|
|
+ </template>
|
|
|
+
|
|
|
+ <el-drawer :title="'预览'" direction="rtl" :visible.sync="open" size="50%">
|
|
|
+ <div>
|
|
|
+ <iframe :src="previewUrl"></iframe>
|
|
|
+ <div style="text-align: center">
|
|
|
+ <el-button type="primary" @click="open = false">确定</el-button>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </el-drawer>
|
|
|
+ </el-form-item>
|
|
|
+</template>
|
|
|
+
|
|
|
+<script>
|
|
|
+import XLSX from "xlsx";
|
|
|
+import FmUpload from "./Upload";
|
|
|
+import FileUpload from "./Upload/file";
|
|
|
+import { getOrganCooperation } from "@/api/process/work-order";
|
|
|
+export default {
|
|
|
+ name: "GenetateFormItem",
|
|
|
+ components: {
|
|
|
+ FmUpload,
|
|
|
+ FileUpload,
|
|
|
+ },
|
|
|
+ /* eslint-disable */
|
|
|
+ props: [
|
|
|
+ "widget",
|
|
|
+ "models",
|
|
|
+ "propValue",
|
|
|
+ "parentForm",
|
|
|
+ "remote",
|
|
|
+ "data",
|
|
|
+ "disabled",
|
|
|
+ "preview",
|
|
|
+ "isLabel",
|
|
|
+ "subformIndex",
|
|
|
+ "subformModel",
|
|
|
+ "organList",
|
|
|
+ ],
|
|
|
+ data() {
|
|
|
+ return {
|
|
|
+ open: false,
|
|
|
+ showStatus: true,
|
|
|
+ widgetLabelWidth: "",
|
|
|
+ dataModel:
|
|
|
+ this.subformIndex === undefined
|
|
|
+ ? this.models[this.widget.model]
|
|
|
+ : this.models[this.subformModel][this.subformIndex][
|
|
|
+ this.widget.model
|
|
|
+ ],
|
|
|
+ dataModelStr: null,
|
|
|
+ tableData: [],
|
|
|
+ cooperationList: [],
|
|
|
+ selectLoading: true,
|
|
|
+ previewUrl: "",
|
|
|
+ };
|
|
|
+ },
|
|
|
+ computed: {
|
|
|
+ hidden() {
|
|
|
+ console.log(this.subformModel, this.widget.hidden);
|
|
|
+ return this.subformModel ? true : !this.widget.hidden;
|
|
|
+ },
|
|
|
+ },
|
|
|
+ watch: {
|
|
|
+ dataModel: {
|
|
|
+ deep: true,
|
|
|
+ handler(newValue) {
|
|
|
+ // console.log(newValue, 'model', this.widget.model)
|
|
|
+ if (newValue !== undefined && newValue !== null) {
|
|
|
+ if (this.subformIndex !== undefined) {
|
|
|
+ this.models[this.subformModel][this.subformIndex][
|
|
|
+ this.widget.model
|
|
|
+ ] = newValue;
|
|
|
+ this.$emit("update:models", {
|
|
|
+ ...this.models,
|
|
|
+ [this.subformModel]: this.models[this.subformModel],
|
|
|
+ });
|
|
|
+ // this.$emit('input-change', val, this.widget.model, this.subformIndex)
|
|
|
+ } else {
|
|
|
+ this.models[this.widget.model] = newValue;
|
|
|
+ this.$emit("update:models", {
|
|
|
+ ...this.models,
|
|
|
+ [this.widget.model]: newValue,
|
|
|
+ });
|
|
|
+ // this.$emit('input-change', val, this.widget.model)
|
|
|
+ }
|
|
|
+ }
|
|
|
+ },
|
|
|
+ },
|
|
|
+ models: {
|
|
|
+ deep: true,
|
|
|
+ async handler(val) {
|
|
|
+ // console.log(val, 'show')
|
|
|
+ if (val.status === undefined && val.status === null) {
|
|
|
+ if (this.subformIndex === undefined) {
|
|
|
+ this.dataModel = val[this.widget.model];
|
|
|
+ } else {
|
|
|
+ this.dataModel =
|
|
|
+ val[this.subformModel][this.subformIndex][this.widget.model];
|
|
|
+ }
|
|
|
+ }
|
|
|
+ delete this.models.status;
|
|
|
+ this.handleDisplayVerifiy();
|
|
|
+ },
|
|
|
+ },
|
|
|
+ cooperationList: {
|
|
|
+ deep: true,
|
|
|
+ handler(val) {
|
|
|
+ if (this.widget.type == "school" && this.preview) {
|
|
|
+ let tempStr = null;
|
|
|
+ val.forEach((item) => {
|
|
|
+ if (item.id == this.dataModel) {
|
|
|
+ tempStr = item.name;
|
|
|
+ }
|
|
|
+ });
|
|
|
+ this.dataModelStr = tempStr;
|
|
|
+ }
|
|
|
+ },
|
|
|
+ },
|
|
|
+ },
|
|
|
+ created() {
|
|
|
+ // 判断当前元素是否是分部表单()
|
|
|
+ // console.log(this.widget, 'widget subform')
|
|
|
+ if (this.widget.type == "organ" && this.preview) {
|
|
|
+ let tempStr = null;
|
|
|
+ this.organList.forEach((item) => {
|
|
|
+ if (item.id == this.dataModel) {
|
|
|
+ tempStr = item.name;
|
|
|
+ }
|
|
|
+ });
|
|
|
+ this.dataModelStr = tempStr;
|
|
|
+ }
|
|
|
+ // 学校信息
|
|
|
+ if (this.widget.type == "school") {
|
|
|
+ this.onGetSchoolList(true);
|
|
|
+ // let tempStr = null
|
|
|
+ // this.cooperationList.forEach(item => {
|
|
|
+ // if(item.id == this.dataModel) {
|
|
|
+ // tempStr = item.name
|
|
|
+ // }
|
|
|
+ // });
|
|
|
+ // // this.dataModel = tempStr
|
|
|
+ }
|
|
|
+
|
|
|
+ if (
|
|
|
+ this.widget.options.remote &&
|
|
|
+ this.remote[this.widget.options.remoteFunc]
|
|
|
+ ) {
|
|
|
+ this.remote[this.widget.options.remoteFunc]((data) => {
|
|
|
+ this.widget.options.remoteOptions = data.map((item) => {
|
|
|
+ return {
|
|
|
+ value: item[this.widget.options.props.value],
|
|
|
+ label: item[this.widget.options.props.label],
|
|
|
+ children: item[this.widget.options.props.children],
|
|
|
+ };
|
|
|
+ });
|
|
|
+ });
|
|
|
+ }
|
|
|
+
|
|
|
+ if (this.widget.type === "imgupload" && this.widget.options.isQiniu) {
|
|
|
+ this.remote[this.widget.options.tokenFunc]((data) => {
|
|
|
+ this.widget.options.token = data;
|
|
|
+ });
|
|
|
+ }
|
|
|
+
|
|
|
+ if (this.disabled !== undefined && this.disabled !== null) {
|
|
|
+ this.widget.options.disabled = this.disabled;
|
|
|
+ }
|
|
|
+
|
|
|
+ // label width
|
|
|
+ if (this.widget.options.labelWidthDisabled) {
|
|
|
+ this.widgetLabelWidth = this.widget.options.labelWidth;
|
|
|
+ } else if (this.widget.type === "divider") {
|
|
|
+ this.widgetLabelWidth = 0;
|
|
|
+ } else {
|
|
|
+ this.widgetLabelWidth = 150;
|
|
|
+ }
|
|
|
+
|
|
|
+ this.handleDisplayVerifiy();
|
|
|
+ },
|
|
|
+ mounted() {
|
|
|
+ // console.log(this.widget, "12121", this.dataModel);
|
|
|
+ if (this.widget.type == "select" && this.widget.options.relationStatus) {
|
|
|
+ console.log(true, "false");
|
|
|
+ this.onChangeSelect();
|
|
|
+ }
|
|
|
+ },
|
|
|
+ methods: {
|
|
|
+ isCheckImage(file) {
|
|
|
+ const urlArr = file.split(".");
|
|
|
+ const suffix = urlArr[urlArr.length - 1];
|
|
|
+ const imgSuffix = ["png", "jpg", "jpeg", "gif", "ico"];
|
|
|
+ console.log(imgSuffix.includes(suffix), "11");
|
|
|
+ return imgSuffix.includes(suffix);
|
|
|
+ },
|
|
|
+ // 获取学校列表
|
|
|
+ onDownload(item, type) {
|
|
|
+ if (type == "download") {
|
|
|
+ window.location.href = item.url;
|
|
|
+ return;
|
|
|
+ }
|
|
|
+
|
|
|
+ let urlArr = item.url.split(".");
|
|
|
+ let suffix = urlArr[urlArr.length - 1];
|
|
|
+ const imgSuffix = ["png", "jpg", "jpeg", "gif", "ico"];
|
|
|
+ if (imgSuffix.includes(suffix)) {
|
|
|
+ } else if (suffix != "pdf") {
|
|
|
+ this.previewUrl =
|
|
|
+ "https://view.officeapps.live.com/op/view.aspx?src=" + item.url;
|
|
|
+ window.open(this.previewUrl);
|
|
|
+ return;
|
|
|
+ } else {
|
|
|
+ this.previewUrl =
|
|
|
+ this.validManageUrl() + "/pdf/web/viewer.html?file=" + item.url;
|
|
|
+ window.open(this.previewUrl);
|
|
|
+ return;
|
|
|
+ }
|
|
|
+ },
|
|
|
+ // 教务地址
|
|
|
+ validManageUrl() {
|
|
|
+ let url = window.location.href;
|
|
|
+ let returnUrl = "";
|
|
|
+ if (/dev/.test(url)) {
|
|
|
+ // dev 环境
|
|
|
+ returnUrl = "http://mandev.dayaedu.com";
|
|
|
+ } else if (/test/.test(url)) {
|
|
|
+ // dev 环境
|
|
|
+ returnUrl = "http://mantest.dayaedu.com";
|
|
|
+ } else if (/online/.test(url)) {
|
|
|
+ //线上
|
|
|
+ returnUrl = "https://manonline.dayaedu.com";
|
|
|
+ } else {
|
|
|
+ // 默认dev环境
|
|
|
+ returnUrl = "http://mandev.dayaedu.com";
|
|
|
+ }
|
|
|
+ return returnUrl;
|
|
|
+ },
|
|
|
+ readWorkbookFromRemoteFile: function (url) {
|
|
|
+ var xhr = new XMLHttpRequest();
|
|
|
+ xhr.open("get", url, true);
|
|
|
+ xhr.responseType = "arraybuffer";
|
|
|
+ let _this = this;
|
|
|
+ xhr.onload = function (e) {
|
|
|
+ var binary = "";
|
|
|
+ console.log(xhr);
|
|
|
+ if (xhr.status === 200) {
|
|
|
+ var bytes = new Uint8Array(xhr.response);
|
|
|
+ var length = bytes.byteLength;
|
|
|
+ for (var i = 0; i < length; i++) {
|
|
|
+ binary += String.fromCharCode(bytes[i]);
|
|
|
+ }
|
|
|
+ var wb = XLSX.read(binary, { type: "binary" });
|
|
|
+ var wsname = wb.SheetNames[0];
|
|
|
+ var ws = wb.Sheets[wsname];
|
|
|
+ console.log(ws);
|
|
|
+ var HTML = XLSX.utils.sheet_to_html(ws);
|
|
|
+ if (_this.$refs.preview) {
|
|
|
+ _this.$refs.preview.innerHTML = HTML;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ };
|
|
|
+ xhr.send();
|
|
|
+ },
|
|
|
+ getData() {
|
|
|
+ let that = this;
|
|
|
+ let element = that.$refs.preview;
|
|
|
+ // Transform(element);
|
|
|
+ var initScale = 1;
|
|
|
+ this.af = new AlloyFinger(element, {
|
|
|
+ // rotate: function (evt) { //实现旋转
|
|
|
+ // element.rotateZ += evt.angle;
|
|
|
+ // },
|
|
|
+ multipointStart: function () {
|
|
|
+ initScale = element.scaleX;
|
|
|
+ },
|
|
|
+ pinch: function (evt) {
|
|
|
+ //实现缩放
|
|
|
+ element.scaleX = element.scaleY = initScale * evt.zoom;
|
|
|
+ },
|
|
|
+ pressMove: function (evt) {
|
|
|
+ //实现移动
|
|
|
+ element.translateX += evt.deltaX;
|
|
|
+ element.translateY += evt.deltaY;
|
|
|
+ evt.preventDefault();
|
|
|
+ },
|
|
|
+ });
|
|
|
+ },
|
|
|
+ checkFileSuffix(url) {
|
|
|
+ let urlArr = url.split(".");
|
|
|
+ let suffix = urlArr[urlArr.length - 1];
|
|
|
+ const passSuffix = [
|
|
|
+ "xlsx",
|
|
|
+ "xls",
|
|
|
+ "pdf",
|
|
|
+ "png",
|
|
|
+ "jpg",
|
|
|
+ "jpeg",
|
|
|
+ "gif",
|
|
|
+ "ico",
|
|
|
+ ];
|
|
|
+ if (passSuffix.includes(suffix)) {
|
|
|
+ return true;
|
|
|
+ } else {
|
|
|
+ return false;
|
|
|
+ }
|
|
|
+ },
|
|
|
+ // select 选择时触发
|
|
|
+ onChangeSelect() {
|
|
|
+ let relationArray = [];
|
|
|
+ // console.log(this.widget.options.options)
|
|
|
+ let allArray = [];
|
|
|
+ this.widget.options &&
|
|
|
+ this.widget.options.options.forEach((item) => {
|
|
|
+ // 判断是否是多选
|
|
|
+ let tempRelation = item.relationOptions || [];
|
|
|
+ allArray.push(...tempRelation);
|
|
|
+ if (this.widget.options.multiple) {
|
|
|
+ if (this.dataModel.includes(item.value)) {
|
|
|
+ relationArray.push(...tempRelation);
|
|
|
+ }
|
|
|
+ } else {
|
|
|
+ if (this.dataModel == item.value) {
|
|
|
+ let tempRelation = item.relationOptions || [];
|
|
|
+ relationArray.push(...tempRelation);
|
|
|
+ }
|
|
|
+ }
|
|
|
+ });
|
|
|
+ console.log(relationArray, "111", this.dataModel, this.widget.options);
|
|
|
+ // if (relationArray.length > 0) {
|
|
|
+ this.$emit("relationFormChange", relationArray, allArray);
|
|
|
+ // }
|
|
|
+
|
|
|
+ // this.dataModel = this.selectValue.join(",");
|
|
|
+ // this.showSelect = false;
|
|
|
+ // let relationArray = [];
|
|
|
+ // let allArray = [];
|
|
|
+ // this.options?.options?.forEach((item) => {
|
|
|
+ // let tempRelation = item.relationOptions || [];
|
|
|
+ // allArray.push(...tempRelation);
|
|
|
+ // if (this.selectValue.includes(item.value)) {
|
|
|
+ // relationArray.push(...tempRelation);
|
|
|
+ // }
|
|
|
+ // });
|
|
|
+ // let uniqueArr = [...new Set(relationArray)];
|
|
|
+ // this.$emit("relationFormChange", uniqueArr, allArray);
|
|
|
+ },
|
|
|
+ fileCheckRequired(state) {
|
|
|
+ this.$emit("fileCheckRequired", state);
|
|
|
+ },
|
|
|
+ async onGetSchoolList(val) {
|
|
|
+ // 隐藏的时候的不获取数据,
|
|
|
+ // 为什么每次都需要请求,因为我没有判断分部数据是否有修改
|
|
|
+ if (!val) {
|
|
|
+ return;
|
|
|
+ }
|
|
|
+ let organId = null;
|
|
|
+ this.selectLoading = true;
|
|
|
+ if (this.subformModel) {
|
|
|
+ organId =
|
|
|
+ this.models[this.subformModel][this.subformIndex][
|
|
|
+ this.widget.options.displayRelation
|
|
|
+ ];
|
|
|
+ } else {
|
|
|
+ organId = this.models[this.widget.options.displayRelation];
|
|
|
+ }
|
|
|
+ // // 判断是否有选择分部 判断列表已经有数据了
|
|
|
+ if (organId) {
|
|
|
+ let res = await getOrganCooperation({ organId });
|
|
|
+ this.cooperationList = [...res.data];
|
|
|
+ }
|
|
|
+ this.selectLoading = false;
|
|
|
+ },
|
|
|
+ // 处理用户输入的值 input框
|
|
|
+ onInputChangeNumber(event) {
|
|
|
+ // 不用处理string类型的
|
|
|
+ // console.log(event, this.widget.options)
|
|
|
+ const type = this.widget.options.dataType;
|
|
|
+ if (type == "number" || type == "integer") {
|
|
|
+ this.onVerifiyNumberInteger(event);
|
|
|
+ } else if (type == "float") {
|
|
|
+ this.verifyNumberIntegerAndFloat(event);
|
|
|
+ }
|
|
|
+ },
|
|
|
+ verifyNumberIntegerAndFloat(val) {
|
|
|
+ // val = this.ruleForm.test;
|
|
|
+ const t = val.charAt(0);
|
|
|
+ // 匹配空格
|
|
|
+ // console.log(val)
|
|
|
+ let v = val.replace(/(^\s*)|(\s*$)/g, "");
|
|
|
+ // 只能是数字和小数点,不能是其他输入
|
|
|
+ v = v.replace(/[^\d.]/g, "");
|
|
|
+ // 以0开始只能输入一个
|
|
|
+ v = v.replace(/^0{2}$/g, "0");
|
|
|
+ // 保证第一位只能是数字,不能是点
|
|
|
+ v = v.replace(/^\./g, "");
|
|
|
+ // 小数只能出现1位
|
|
|
+ v = v.replace(".", "$#$").replace(/\./g, "").replace("$#$", ".");
|
|
|
+ // 小数点后面保留2位
|
|
|
+ v = v.replace(/^(\-)*(\d+)\.(\d\d).*$/, "$1$2.$3");
|
|
|
+ if (t == "-") {
|
|
|
+ v = "-" + v;
|
|
|
+ }
|
|
|
+ // 返回结果
|
|
|
+ this.dataModel = v;
|
|
|
+ },
|
|
|
+ onVerifiyNumberInteger(val) {
|
|
|
+ const t = val.charAt(0);
|
|
|
+ // 匹配空格
|
|
|
+ let v = val.replace(/(^\s*)|(\s*$)/g, "");
|
|
|
+ // 去掉 '.' , 防止贴贴的时候出现问题 如 0.1.12.12
|
|
|
+ v = v.replace(/[\.]*/g, "");
|
|
|
+ // 去掉以 0 开始后面的数, 防止贴贴的时候出现问题 如 00121323
|
|
|
+ v = v.replace(/(^0[\d]*)$/g, "0");
|
|
|
+ // 首位是0,只能出现一次
|
|
|
+ v = v.replace(/^0\d$/g, "0");
|
|
|
+ // 只匹配数字
|
|
|
+ v = v.replace(/[^\d]/g, "");
|
|
|
+ if (t == "-") {
|
|
|
+ v = "-" + v;
|
|
|
+ }
|
|
|
+ // 返回结果
|
|
|
+ this.dataModel = v;
|
|
|
+ },
|
|
|
+ fileList(files) {
|
|
|
+ // 只处理乐团退费
|
|
|
+ const query = this.$route.query;
|
|
|
+ if (query.processId == 19) {
|
|
|
+ if (files && files.length > 0) {
|
|
|
+ this.$emit("fileCheckRequired", true);
|
|
|
+ } else {
|
|
|
+ this.$emit("fileCheckRequired", false);
|
|
|
+ }
|
|
|
+ } else {
|
|
|
+ this.$emit("fileCheckRequired", false);
|
|
|
+ }
|
|
|
+ this.dataModel = files;
|
|
|
+ },
|
|
|
+ handleDisplayVerifiy() {
|
|
|
+ if (Object.keys(this.widget.options).indexOf("displayVerifiy") >= 0) {
|
|
|
+ if (this.widget.options.displayVerifiy.type !== "hide") {
|
|
|
+ var c = 0;
|
|
|
+ for (var v of this.widget.options.displayVerifiy.list) {
|
|
|
+ if (this.models[v.model].toString() === v.value) {
|
|
|
+ c++;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ if (this.widget.options.displayVerifiy.type === "and") {
|
|
|
+ if (c !== this.widget.options.displayVerifiy.list.length) {
|
|
|
+ this.showStatus = false;
|
|
|
+ } else {
|
|
|
+ this.showStatus = true;
|
|
|
+ }
|
|
|
+ } else if (this.widget.options.displayVerifiy.type === "or") {
|
|
|
+ if (c === 0) {
|
|
|
+ this.showStatus = false;
|
|
|
+ } else {
|
|
|
+ this.showStatus = true;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ },
|
|
|
+ dataFormatBr(str) {
|
|
|
+ return str ? str.replace(/\n/gi, "<br />") : str;
|
|
|
+ },
|
|
|
+ },
|
|
|
+};
|
|
|
+</script>
|
|
|
+
|
|
|
+<style>
|
|
|
+.previewEditorDiv > p {
|
|
|
+ margin: 0;
|
|
|
+}
|
|
|
+
|
|
|
+.preview-cascader-class .el-input.is-disabled .el-input__inner {
|
|
|
+ background-color: #fff;
|
|
|
+ border: none;
|
|
|
+ color: #303133;
|
|
|
+}
|
|
|
+
|
|
|
+.preview-cascader-class
|
|
|
+ .el-input.is-disabled
|
|
|
+ .el-input__suffix
|
|
|
+ .el-input__suffix-inner
|
|
|
+ .el-input__icon.el-icon-arrow-down:before {
|
|
|
+ content: "";
|
|
|
+}
|
|
|
+
|
|
|
+.dataModelText {
|
|
|
+ color: #e7af84;
|
|
|
+}
|
|
|
+.dataModelText .el-form-item__label {
|
|
|
+ color: #e7af84 !important;
|
|
|
+}
|
|
|
+</style>
|