Merge branch 'feature_1.0'

quanyawei

2023-11-14 9eb85404a96658d83fc0168f306adabb8c1c992e

Merge branch 'feature_1.0'

 .eslintrc.js

@@ -1,68 +1,16 @@
module.exports = {
  root: true,
  parserOptions: {
    parser: 'babel-eslint',
    sourceType: 'module'
  },
  env: {
    browser: true,
    node: true,
    es6: true,
    node: true
  },
  extends: [/* vue 2 配置 */
    "plugin:vue/recommended",
      "plugin:vue/essential",
      "plugin:vue/strongly-recommended",
    /* vue 3 配置 */
    // "plugin:vue/vue3-recommended"
    // "plugin:vue/vue3-essential"
    // "plugin:vue/vue3-strongly-recommended"
  extends: [
    'plugin:vue/recommended', // 此项是用来配置vue.js风格
    'eslint:recommended' //继承Eslint中推荐的（打钩的）规则项
  ],

  // add your custom rules here
  //it is base on https://github.com/vuejs/eslint-config-vue
  rules: {
    'vue/no-unused-vars': 'error',
    'eqeqeq': ['error', 'always'], // 强制使用三个等于号
    'semi': 0, // 语句可以不需要分号结尾
    'no-use-before-define': [1, 'nofunc'], // 未定义前不能使用
    'max-lines': ['error', { 'max': 2000, 'skipBlankLines': true }],
    'no-mixed-spaces-and-tabs': 'warn', // 禁止使用空格和tab混合缩进
    'newline-per-chained-call': ['error', { ignoreChainWithDepth: 1 }], // promise 以及 数组的链式操作需要另起一行
    'vue/attribute-hyphenation': ['error', 'always'], // prop变量使用破折号，而不是驼峰。这里做统一，不然以后全局修改prop有可能碰到要修改不全的情况
    'vue/html-indent': [
      'warn',
      2,
      {
        attribute: 1,
        baseIndent: 1,
        closeBracket: 0,
        alignAttributesVertically: true
      }
    ],
    'curly': 2, // 必须使用 if(){} 中的{}
    'vue/prop-name-casing': ['warn', 'camelCase'], //建议使用驼峰命名
    'vue/this-in-template': ['error', 'never'], //不允许在template里面使用this
    'no-trailing-spaces': 1, //一行结束后面不要有空格
    'vue/max-attributes-per-line': [ // template里面写的一行多少个prop属性,单行3个，多余3个的必须每行写一个prop，不然不容易看
      'warn',
      {
        singleline: 3,
        multiline: {
          max: 1,
          allowFirstLine: false
        }
      }
    ],
    'no-catch-shadow': 'error', //禁止catch子句参数与外部作用域变量同名
    'vue/v-bind-style': ['error', 'shorthand'], // 必须使用:来绑定
    'no-debugger': process.env.NODE_ENV === 'production' ? 'error' : 'off', // 只允许在开发环境中使用debugger
    'no-console': process.env.NODE_ENV === 'production' ? 'warn' : 'off',
    'no-unused-vars': 0, // 禁止出现未使用过的变量
    'spaced-comment': 0 // 强制在注释中 // 或 /* 使用一致的空格
  parserOptions: {
    ecmaVersion: 13,
    sourceType: 'module'
  },
  globals: {
    'AMap': false,
    'AMapUI': false
  },
  plugins: ['vue'],
  rules: {}
}

 .prettierrc

@@ -1,11 +1,15 @@
{
    "useTabs": true,
    "arrowParens": "avoid",
    "printWidth": 120,
    "tabWidth": 2,
    "semi": true,
    "singleQuote": true,
    "bracketSpacing": true,
    "endOfLine": "auto",
    "trailingComma": "none"
  "printWidth": 80,  
  "tabWidth": 2,  
  "semi": false,  
  "singleQuote": true,  
  "endOfLine": "auto",  
  "arrowParens": "avoid",  
  "bracketSpacing": true,  
  "insertPragma": false,  
  "jsxBracketSameLine": false,  
  "rangeStart": 0,
  "requirePragma": false, 
  "trailingComma": "none",  
  "useTabs": false  
}

 .vscode/settings.json

@@ -1,120 +1,126 @@
{
    "workbench.iconTheme": "material-icon-theme",
    "editor.fontSize": 16,
    // --------------------  配置eslint  --------------------
    //autoFixedOnSave 设置已废弃，采用如下新的设置，新版(>1.41.0)配置
    "editor.codeActionsOnSave": {
        "source.fixAll.eslint": true
    },
    "eslint.format.enable": true,
    //autoFix默认开启，只需输入字符串数组即可
    "eslint.validate": ["javascript", "vue", "html", "javascriptreact", "vue-html"],
    // --------------------  配置eslint  --------------------
    // 设置编辑器的默认格式化工具
    "editor.defaultFormatter": "esbenp.prettier-vscode",
    "[html]": {
        "editor.defaultFormatter": "esbenp.prettier-vscode"
    },
    "[javascript]": {
        "editor.defaultFormatter": "esbenp.prettier-vscode"
    },
    "[css]": {
        "editor.defaultFormatter": "esbenp.prettier-vscode"
    },
    "[less]": {
        "editor.defaultFormatter": "esbenp.prettier-vscode"
    },
    "[json]": {
        "editor.defaultFormatter": "esbenp.prettier-vscode"
    },
    //方法括号之间插入空格
    "javascript.format.insertSpaceBeforeFunctionParenthesis": false,
    // --------------------  vetur 配置  --------------------
    // vue文件默认格式化工具：vetur
    "[vue]": {
        "editor.defaultFormatter": "octref.vetur"
    },
    // 这个按用户自身习惯选择
    "vetur.format.defaultFormatter.html": "js-beautify-html",
    // 让vue中的js按编辑器自带的ts格式进行格式化
    //  "vetur.format.defaultFormatter.js": "vscode-typescript",
    // 让vue中的js按prettier进行格式化 用这个
    "vetur.format.defaultFormatter.js": "prettier",
    "vetur.format.defaultFormatterOptions": {
        "js": "prettier",
        "js-beautify-html": {
            "wrap_attributes": "aligned-multiple" //当超出折行长度时，将属性进行垂直对齐
        },
        "prettyhtml": {
            "tabWidth": 4, // 会忽略vetur的tabSize配置
            "printWidth": 100, //每行100字符
            "singleQuote": true, //是否使用单引号
            "semi": false, // 句尾是否加;
            "wrapAttributes": false,
            "sortAttributes": false
        },
        //vue中的js生效
        "prettier": {
            "semi": false, // 句尾是否加;
            "singleQuote": true, //是否使用单引号
            "trailingComma": "none" //禁止随时添加逗号
        }
    },
    // --------------------  vetur 配置  --------------------
    // --------------------  koro1FileHeader 配置  --------------------
    // 头部注释
    "fileheader.customMade": {
        "Author": "AuthorName",
        "Date": "Do not edit", // 文件创建时间(不变)
        "LastEditors": "AuthorName", // 文件最后编辑者
        "LastEditTime": "Do not edit", // 文件最后编辑时间
        "Description": ""
        // "FilePath": "only file name", // 只有文件名
        // "custom_string_obkoro1_copyright": "Copyright (C) ${now_year} AuthorName. All rights reserved.",
        // "custom_string_obkoro1_date": "Do not edit" // 不带Date前缀的时间
    },
    // 函数注释
    "fileheader.cursorMode": {
        "description": "",
        //"custom_string_obkoro1": "",
        "param": "params",
        "return": ""
    },
    // 插件配置项
    "fileheader.configObj": {
        "createHeader": false, // 新建文件自动添加头部注释，默认打开
        "autoAdd": false, // 保存自动添加头部注释，开启才能自动添加，默认开启
        "openFunctionParamsCheck": true, //函数注释自动提取函数的参数，默认开启
        "createFileTime": true, // 默认为此文件的创建时间，设为false更改为当前生成注释的时间
        "dateFormat": "YYYY-MM-DD HH:mm:ss", // 默认时间格式，修改影响所有时间字段
        // 自定义注释中的艾特和冒号：
        "atSymbol": ["@", "@"], // 所有文件的头部注释和函数注释的默认值 @
        "colon": [": ", ": "] // 所有文件的头部注释和函数注释的默认值 :
        // 自定义特殊字段名，Date、LastEditTime、LastEditors、Description、FilePath
        // "specialOptions": {
        //   "Date": "since",
        //   "LastEditTime": "lastTime",
        //   "LastEditors": "LastAuthor",
        //   "Description": "message",
        //   "FilePath": "文件相对于项目的路径"
        // }
        // 函数参数配置
        // "functionParamsShape": "normal", // 正常
        // "functionParamsShape": "no bracket", // 没有方括号
        // "functionParamsShape": "no type", // 没有类型
        // "functionParamsShape": [ "{", "}"], // 函数参数外形自定义，默认值 {}
        // "functionTypeSymbol": "*", // 参数没有类型时的默认值 *
        // 函数设置不添加参数和类型 {*}
        // "functionParamsShape": "no type", // 没有类型
        // "functionTypeSymbol": "" // 参数没有类型时的默认值 *
    },
    // --------------------  koro1FileHeader 配置  --------------------
    // --------------------  prettier 配置(以下配置主要针对.js)  --------------------
    "prettier.useEditorConfig": false, // 不使用editorConfig配置文件设置才生效
    "prettier.semi": false, // 句尾是否加;
    "prettier.singleQuote": true, //是否使用单引号
    "prettier.trailingComma": "none", //禁止随时添加逗号
    // --------------------  prettier 配置  --------------------
    "git.confirmSync": false,
    "security.workspace.trust.untrustedFiles": "open"
  "workbench.iconTheme": "material-icon-theme",
  "editor.fontSize": 16,
  // --------------------  配置eslint  --------------------
  //autoFixedOnSave 设置已废弃，采用如下新的设置，新版(>1.41.0)配置
  "editor.codeActionsOnSave": {
    "source.fixAll.eslint": true
  },
  "eslint.format.enable": true,
  //autoFix默认开启，只需输入字符串数组即可
  "eslint.validate": [
    "javascript",
    "vue",
    "html",
    "javascriptreact",
    "vue-html"
  ],
  // --------------------  配置eslint  --------------------
  // 设置编辑器的默认格式化工具
  "editor.defaultFormatter": "esbenp.prettier-vscode",
  "[html]": {
    "editor.defaultFormatter": "esbenp.prettier-vscode"
  },
  "[javascript]": {
    "editor.defaultFormatter": "esbenp.prettier-vscode"
  },
  "[css]": {
    "editor.defaultFormatter": "esbenp.prettier-vscode"
  },
  "[less]": {
    "editor.defaultFormatter": "esbenp.prettier-vscode"
  },
  "[json]": {
    "editor.defaultFormatter": "esbenp.prettier-vscode"
  },
  //方法括号之间插入空格
  "javascript.format.insertSpaceBeforeFunctionParenthesis": false,
  // --------------------  vetur 配置  --------------------
  // vue文件默认格式化工具：vetur
  "[vue]": {
    "editor.defaultFormatter": "octref.vetur"
  },
  // 这个按用户自身习惯选择
  "vetur.format.defaultFormatter.html": "js-beautify-html",
  // 让vue中的js按编辑器自带的ts格式进行格式化
  //  "vetur.format.defaultFormatter.js": "vscode-typescript",
  // 让vue中的js按prettier进行格式化 用这个
  "vetur.format.defaultFormatter.js": "prettier",
  "vetur.format.defaultFormatterOptions": {
    "js": "prettier",
    "js-beautify-html": {
      "wrap_attributes": "aligned-multiple" //当超出折行长度时，将属性进行垂直对齐
    },
    "prettyhtml": {
      "tabWidth": 4, // 会忽略vetur的tabSize配置
      "printWidth": 100, //每行100字符
      "singleQuote": true, //是否使用单引号
      "semi": false, // 句尾是否加;
      "wrapAttributes": false,
      "sortAttributes": false
    },
    //vue中的js生效
    "prettier": {
      "semi": false, // 句尾是否加;
      "singleQuote": true, //是否使用单引号
      "trailingComma": "none" //禁止随时添加逗号
    }
  },
  // --------------------  vetur 配置  --------------------
  // --------------------  koro1FileHeader 配置  --------------------
  // 头部注释
  "fileheader.customMade": {
    "Author": "AuthorName",
    "Date": "Do not edit", // 文件创建时间(不变)
    "LastEditors": "AuthorName", // 文件最后编辑者
    "LastEditTime": "Do not edit", // 文件最后编辑时间
    "Description": ""
    // "FilePath": "only file name", // 只有文件名
    // "custom_string_obkoro1_copyright": "Copyright (C) ${now_year} AuthorName. All rights reserved.",
    // "custom_string_obkoro1_date": "Do not edit" // 不带Date前缀的时间
  },
  // 函数注释
  "fileheader.cursorMode": {
    "description": "",
    //"custom_string_obkoro1": "",
    "param": "params",
    "return": ""
  },
  // 插件配置项
  "fileheader.configObj": {
    "createHeader": false, // 新建文件自动添加头部注释，默认打开
    "autoAdd": false, // 保存自动添加头部注释，开启才能自动添加，默认开启
    "openFunctionParamsCheck": true, //函数注释自动提取函数的参数，默认开启
    "createFileTime": true, // 默认为此文件的创建时间，设为false更改为当前生成注释的时间
    "dateFormat": "YYYY-MM-DD HH:mm:ss", // 默认时间格式，修改影响所有时间字段
    // 自定义注释中的艾特和冒号：
    "atSymbol": ["@", "@"], // 所有文件的头部注释和函数注释的默认值 @
    "colon": [": ", ": "] // 所有文件的头部注释和函数注释的默认值 :
    // 自定义特殊字段名，Date、LastEditTime、LastEditors、Description、FilePath
    // "specialOptions": {
    //   "Date": "since",
    //   "LastEditTime": "lastTime",
    //   "LastEditors": "LastAuthor",
    //   "Description": "message",
    //   "FilePath": "文件相对于项目的路径"
    // }
    // 函数参数配置
    // "functionParamsShape": "normal", // 正常
    // "functionParamsShape": "no bracket", // 没有方括号
    // "functionParamsShape": "no type", // 没有类型
    // "functionParamsShape": [ "{", "}"], // 函数参数外形自定义，默认值 {}
    // "functionTypeSymbol": "*", // 参数没有类型时的默认值 *
    // 函数设置不添加参数和类型 {*}
    // "functionParamsShape": "no type", // 没有类型
    // "functionTypeSymbol": "" // 参数没有类型时的默认值 *
  },
  // --------------------  koro1FileHeader 配置  --------------------
  // --------------------  prettier 配置(以下配置主要针对.js)  --------------------
  "prettier.useEditorConfig": false, // 不使用editorConfig配置文件设置才生效
  "prettier.semi": false, // 句尾是否加;
  "prettier.singleQuote": true, //是否使用单引号
  "prettier.trailingComma": "none", //禁止随时添加逗号
  // --------------------  prettier 配置  --------------------
  "git.confirmSync": false,
  "security.workspace.trust.untrustedFiles": "open"
}

 src/views/toCarryOutLegislativeReforms/components/newWorkOrder.vue

@@ -10,13 +10,7 @@
          <el-row>
            <el-col :span="12">
              <el-form-item label="上报时间：" prop="escalationTime" class="span">
                <el-date-picker
                  v-model="formData.escalationTime"
                  value-format="yyyy-MM-dd"
                  size="small"
                  type="date"
                  placeholder="选择日期"
                />
                <el-date-picker v-model="formData.escalationTime" value-format="yyyy-MM-dd" size="small" type="date" placeholder="选择日期" />
              </el-form-item>
            </el-col>
            <el-col :span="12">
@@ -29,24 +23,14 @@
            <el-col :span="12">
              <el-form-item label="责任主体：" prop="unitId" class="span">
                <el-select v-model="formData.unitId" placeholder="请选择" size="small">
                  <el-option
                    v-for="item in unitList"
                    :key="item.unitId"
                    :label="item.unitName"
                    :value="item.unitId"
                  />
                  <el-option v-for="item in unitList" :key="item.unitId" :label="item.unitName" :value="item.unitId" />
                </el-select>
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item label="污染分类：" prop="polluteType" class="span">
                <el-select v-model="formData.polluteType" placeholder="请选择" size="small">
                  <el-option
                    v-for="item in polluteList"
                    :key="item.dataKey"
                    :label="item.dataValue"
                    :value="item.dataKey"
                  />
                  <el-option v-for="item in polluteList" :key="item.dataKey" :label="item.dataValue" :value="item.dataKey" />
                </el-select>
              </el-form-item>
            </el-col>
@@ -55,12 +39,7 @@
            <el-col :span="12">
              <el-form-item label="整改类型：" prop="changeType" class="span">
                <el-select v-model="formData.changeType" placeholder="请选择" size="small" @change="changeEnumList">
                  <el-option
                    v-for="item in Dic.changeEnum"
                    :key="item.value"
                    :label="item.name"
                    :value="item.value"
                  />
                  <el-option v-for="item in Dic.changeEnum" :key="item.value" :label="item.name" :value="item.value" />
                </el-select>
              </el-form-item>
            </el-col>
@@ -75,12 +54,7 @@
            <el-col :span="12">
              <el-form-item label="上报单位：" prop="escalationUnitId" class="span">
                <el-select v-model="formData.escalationUnitId" placeholder="请选择" size="small">
                  <el-option
                    v-for="item in unitList"
                    :key="item.unitId"
                    :label="item.unitName"
                    :value="item.unitId"
                  />
                  <el-option v-for="item in unitList" :key="item.unitId" :label="item.unitName" :value="item.unitId" />
                </el-select>
              </el-form-item>
            </el-col>
@@ -109,13 +83,7 @@
              <div>
                <div v-if="pageState==='edit'">
                  <div v-for="(file,index) in fileBaseListCover" :key="file.fileId+index" class="block">
                    <el-image
                      v-if="file.fileType ===1"
                      style="width: 100px; height: 100px"
                      :src="file.url"
                      :preview-src-list="getPreviewImages(file.fileId,fileBaseList)"
                      :initial-index="index"
                    />
                    <el-image v-if="file.fileType ===1" style="width: 100px; height: 100px" :src="file.url" :preview-src-list="getPreviewImages(file.fileId,fileBaseList)" :initial-index="index" />
                    <video v-else :src="file.url" style="width: 100px; height: 100px" @click="openVideo(file)">
                      您的浏览器不支持 video 标签。
                    </video>
@@ -135,13 +103,7 @@
    </el-dialog>
    <el-dialog :visible.sync="videoVisible" width="600px" :modal-append-to-body="false" :destroy-on-close="true" @close="handleCancel">
      <div style="text-align: center;">
        <video
          ref="video"
          style="width: 300px;height: 500px"
          :src="dialogImageUrl"
          controls
          autoplay
        />
        <video ref="video" style="width: 300px;height: 500px" :src="dialogImageUrl" controls autoplay />
      </div>
    </el-dialog>
  </div>
@@ -164,6 +126,11 @@
    return {
      videoVisible: false,
      formData: {
        unitId: '',
        escalationUnitId: '',
        changeType: '',
        polluteType: '',
        escalationTime: new Date(),
        fileBaseList: [],
        escalationName: '',
        changeDay: 0,
@@ -192,9 +159,7 @@
        changeType: [
          { required: true, message: '请选择整改类型', trigger: 'change' }
        ],
        changeDay: [
          { required: true, message: '请输入天数', trigger: 'blur' }
        ],
        changeDay: [{ required: true, message: '请输入天数', trigger: 'blur' }],
        escalationUnitId: [
          { required: true, message: '请选择上报单位', trigger: 'change' }
        ],
@@ -216,18 +181,26 @@
    }
  },
  watch: {
    'pageState': {
    pageState: {
      handler(newVal) {
        if (this.pageState === 'edit') {
          if (this.parentFormData.fileBaseList && this.parentFormData.fileBaseList.length > 0) {
          if (
            this.parentFormData.fileBaseList &&
            this.parentFormData.fileBaseList.length > 0
          ) {
            this.parentFormData.fileBaseList.forEach(item => {
              if (item.fileType === 1) {
                this.fileBaseList.push(`${requestObj.baseUrl}file/preview/${item.fileId}`) // 原图
                this.fileBaseList.push(
                  `${requestObj.baseUrl}file/preview/${item.fileId}`
                ) // 原图
              }
              // const srcApi = item.fileType === 1 ? api + 'preview/' : api + 'preview/cover/'
              // this.fileBaseList.push(`${requestObj.baseUrl}file/preview/${item.fileId}`) // 原图
              this.fileBaseListCover.push({
                url: item.fileType === 1 ? `${requestObj.baseUrl}file/preview/cover/${item.fileId}` : `${requestObj.baseUrl}file/preview/${item.fileId}`,
                url:
                  item.fileType === 1
                    ? `${requestObj.baseUrl}file/preview/cover/${item.fileId}`
                    : `${requestObj.baseUrl}file/preview/${item.fileId}`,
                fileType: item.fileType,
                fileId: item.fileId,
                fileName: item.fileName
@@ -241,22 +214,15 @@
      immediate: true
    }
  },
  created() {
    console.log('oldValue', this.parentFormData)
    if (!(JSON.stringify(this.parentFormData) === '{}')) {
      this.formData = this.parentFormData
      this.formData.polluteType = String(this.parentFormData.polluteType)
    } else {
      const name = this.$store.state.user.name
      this.formData.escalationName = name
    }

  async created() {
    this.getUnitList()
    this.getContaminateList()

    console.log('oldValue', this.parentFormData)

    bus.$on('changeFileAfterList', (type, fileList) => {
      this.formData.fileBaseList = []
      if (fileList.length > 0) {
        fileList.map((item) => {
        fileList.map(item => {
          if (item.response) {
            console.log('item.response.data', item.response.data)
            this.formData.fileBaseList.push(item.response.data)
@@ -304,20 +270,32 @@
      this.$request({
        url: '/allocation/unit',
        method: 'get'
      }).then((res) => {
      }).then(res => {
        this.unitList = res.data
        this.getContaminateList()
      })
    },
    getContaminateList() {
      this.$request({
        url: '/allocation/contaminate',
        method: 'get'
      }).then((res) => {
      }).then(res => {
        this.polluteList = res.data
        if (!(JSON.stringify(this.parentFormData) === '{}')) {
          this.formData = this.parentFormData
          this.formData.polluteType = String(this.parentFormData.polluteType)
        } else {
          const name = this.$store.state.user.name
          this.formData.escalationName = name
          this.formData.changeType = this.Dic.changeEnum[0].value
          this.formData.unitId = this.unitList[0].unitId
          this.formData.escalationUnitId = this.unitList[0].unitId
          this.formData.polluteType = this.polluteList[0].dataKey
        }
      })
    },
    close() {
      this.$nextTick(function() {
      this.$nextTick(function () {
        this.$refs.ruleForm.resetFields()
      })
      this.$emit('update:visible', false)
@@ -333,7 +311,7 @@
        })
      }
      this.formData.state = val
      this.$refs.ruleForm.validate((valid) => {
      this.$refs.ruleForm.validate(valid => {
        if (valid) {
          // this.formData.fileBaseList = [...this.parentFormData.fileBaseList, this.formData.fileBaseList]
          this.$emit('handleSubmit', this.formData)
@@ -347,47 +325,45 @@
</script>

<style lang="scss" scoped>
.titBox{
.titBox {
  position: relative;
  font-size: 18px;
  div:first-child{
  div:first-child {
    position: absolute;
    left: 10px;
  }
  div{
  div {
    display: inline-block;
  }
}
.block {
    display: inline-block !important;
    margin-right: 10px;
  display: inline-block !important;
  margin-right: 10px;
}
.textBox {
    display: flex;
    justify-content: space-between;
    margin-left: 15px;
  display: flex;
  justify-content: space-between;
  margin-left: 15px;
}

.el-dialog__body>div {
    border-bottom: 1px dashed rgba(187, 187, 187, 1);
.el-dialog__body > div {
  border-bottom: 1px dashed rgba(187, 187, 187, 1);
}
.span{
.span {
  /deep/.el-form-item__content {

      div {
          width: 100%;
      }
    div {
      width: 100%;
    }
  }
}

.textare {
    /deep/.el-form-item__content {
        width: 800px;
  /deep/.el-form-item__content {
    width: 800px;

        div {
            width: 100%;
        }
    div {
      width: 100%;
    }
  }

}
</style>

 src/views/toCarryOutLegislativeReforms/components/queryForm.vue

@@ -7,86 +7,42 @@
        </el-form-item>

        <el-form-item label="开始时间：">
          <el-date-picker
            v-model="formData.startTime"
            style="width:92%"
            size="small"
            value-format="yyyy-MM-dd"
            type="date"
            placeholder="开始日期"
          />
          <el-date-picker v-model="formData.startTime" style="width:92%" size="small" value-format="yyyy-MM-dd" type="date" placeholder="开始日期" />

        </el-form-item>
        <el-form-item label="结束时间：">
          <el-date-picker
            v-model="formData.endTime"
            style="width:92%"
            size="small"
            value-format="yyyy-MM-dd"
            type="date"
            placeholder="结束时间"
          />
          <el-date-picker v-model="formData.endTime" style="width:92%" size="small" value-format="yyyy-MM-dd" type="date" placeholder="结束时间" />
        </el-form-item>
        <el-form-item label="责任主体：" class="rddd">
          <el-select v-model="formData.unitId" size="small" clearable placeholder="请选择">
            <el-option
              v-for="item in unitList"
              :key="item.unitId"
              :label="item.unitName"
              :value="item.unitId"
            />
          <el-select v-model="formData.unitId" size="small" clearable multiple collapse-tags placeholder="请选择">
            <el-option v-for="item in unitList" :key="item.unitId" :label="item.unitName" :value="item.unitId" />
          </el-select>
        </el-form-item>
        <el-form-item label="污染分类：">
          <el-select v-model="formData.polluteType" size="small" clearable placeholder="请选择">
            <el-option
              v-for="item in polluteList"
              :key="item.dataKey"
              :label="item.dataValue"
              :value="item.dataKey"
            />
          <el-select v-model="formData.polluteType" size="small" clearable multiple collapse-tags placeholder="请选择">
            <el-option v-for="item in polluteList" :key="item.dataKey" :label="item.dataValue" :value="item.dataKey" />
          </el-select>
        </el-form-item>
        <el-form-item label="排查方式：">
          <el-select v-model="formData.investigationType" size="small" clearable placeholder="请选择">
            <el-option
              v-for="item in Dic.investigationEnum"
              :key="item.value"
              :label="item.name"
              :value="item.value"
            />
            <el-option v-for="item in Dic.investigationEnum" :key="item.value" :label="item.name" :value="item.value" />
          </el-select>
        </el-form-item>

        <el-form-item label="整改类型：">
          <el-select v-model="formData.changeType" placeholder="请选择" clearable size="small">
            <el-option
              v-for="item in Dic.changeEnum"
              :key="item.value"
              :label="item.name"
              :value="item.value"
            />
            <el-option v-for="item in Dic.changeEnum" :key="item.value" :label="item.name" :value="item.value" />
          </el-select>
        </el-form-item>
        <el-form-item label="流程状态：">
          <el-select v-model="formData.state" size="small" clearable placeholder="请选择">
            <el-option
              v-for="item in Dic.allocationApproveEnum"
              :key="item.value"
              :label="item.name"
              :value="item.value"
            />
          <el-select v-model="formData.state" size="small" clearable multiple collapse-tags placeholder="请选择">
            <el-option v-for="item in Dic.allocationApproveEnum" :key="item.value" :label="item.name" :value="item.value" />
          </el-select>
        </el-form-item>

        <el-form-item label="是否作废：">
          <el-select v-model="formData.isInvalid " placeholder="请选择" clearable size="small">
            <el-option
              v-for="item in Dic.yesOrNo"
              :key="item.value"
              :label="item.name"
              :value="item.value"
            />
            <el-option v-for="item in Dic.yesOrNo" :key="item.value" :label="item.name" :value="item.value" />
          </el-select>
        </el-form-item>
        <el-form-item>
@@ -106,7 +62,7 @@
  data() {
    return {
      formData: {
        isInvalid: 0
        isInvalid: null
      },
      unitList: [],
      Dic: JSON.parse(localStorage.getItem('dict')),
@@ -119,7 +75,6 @@
  created() {
    this.getUnitList()
    this.getContaminateList()
    console.log('searchType', this.searchType)
  },
  methods: {
    // 获取责任单位list
@@ -127,19 +82,21 @@
      this.$request({
        url: '/allocation/unit',
        method: 'get'
      }).then((res) => {
      }).then(res => {
        this.unitList = res.data
        this.formData.isInvalid = 0
      })
    },
    getContaminateList() {
      this.$request({
        url: '/allocation/contaminate',
        method: 'get'
      }).then((res) => {
      }).then(res => {
        this.polluteList = res.data
      })
    },
    onSubmit() {
      console.log('formData', this.formData)
      this.$emit('handleSearch', this.formData)
    },
    handleAdd() {
@@ -151,19 +108,19 @@

<style scoped lang="scss">
.search-form {
    margin: 20px;
    margin-bottom: 0px;
   /deep/ .el-input__suffix{
      right: 20;
    }
   /deep/ .el-form-item__content{
      width: auto;
    }
  margin: 20px;
  margin-bottom: 0px;
  /deep/ .el-input__suffix {
    right: 20;
  }
  /deep/ .el-form-item__content {
    width: auto;
  }
}
/deep/.el-form-item__label{
/deep/.el-form-item__label {
  font-size: 16px;
}
/deep/.el-form-item{
/deep/.el-form-item {
  margin-bottom: 5px;
}
</style>

 src/views/toCarryOutLegislativeReforms/components/workOrderInformation.vue

@@ -8,37 +8,26 @@
      <div>
        <div v-if="dialogData.pageType !=='delay'" class="stepsList">
          <el-steps :space="200" :active="parentFormData.approveList.length+1" align-center>
            <el-step
              v-for="(item,index) in setepList"
              :key="index"
              :title="'' + item.createName + ' ' + item.stateName"
              :description="item.createTime"
            />
            <el-step v-for="(item,index) in setepList" :key="index" :title="'' + item.createName + ' ' + item.stateName" :description="item.createTime" />
          </el-steps>
        </div>
        <div class="inforData">
          <el-descriptions title="基本信息" :column="parseInt('4')">
          <el-descriptions title="基本信息">
            <el-descriptions-item label="上报时间" label-class-name="itemSpan">{{ parentFormData.escalationTime }}</el-descriptions-item>
            <el-descriptions-item label="污染位置" label-class-name="itemSpan">{{ parentFormData.pollutePosition }}</el-descriptions-item>
            <el-descriptions-item label="责任单位" label-class-name="itemSpan">{{ unitIdFormatter }}</el-descriptions-item>
            <el-descriptions-item label="污染分类" label-class-name="itemSpan">{{ polluteTypeFormatter }}</el-descriptions-item>
            <el-descriptions-item label="整改类型" label-class-name="itemSpan">{{ dictObj.changeEnum[parentFormData.changeType] }}</el-descriptions-item>
            <el-descriptions-item label="期限天数" label-class-name="itemSpan">{{ parentFormData.changeDay }}</el-descriptions-item>
            <el-descriptions-item label="上报单位" label-class-name="itemSpan">{{ updataUnitIdFormatter }}</el-descriptions-item>
            <el-descriptions-item label="上报人" label-class-name="itemSpan">{{ parentFormData.escalationName }}</el-descriptions-item>
            <el-descriptions-item label="污染位置" label-class-name="itemSpan">{{ parentFormData.pollutePosition }}</el-descriptions-item>
          </el-descriptions>
          <el-descriptions :column="parseInt('1')">
            <el-descriptions-item label="问题描述" label-class-name="itemSpan" :content-style="{'width': '80%'}">{{ parentFormData.problemDescribe }}</el-descriptions-item>
            <el-descriptions-item label="附件" label-class-name="itemSpan" :content-style="{'width': '80%'}">
              <div>
                <div v-for="(file,index) in fileBaseListCover" :key="file.id+index" class="block">
                  <el-image
                    v-if="file.fileType ===1"
                    style="width: 100px; height: 100px"
                    :src="file.url"
                    :preview-src-list="getPreviewImages(file.id,fileBaseList)"
                    :initial-index="index"
                  />
                  <el-image v-if="file.fileType ===1" style="width: 100px; height: 100px" :src="file.url" :preview-src-list="getPreviewImages(file.id,fileBaseList)" :initial-index="index" />
                  <video v-else :src="file.url" style="width: 100px; height: 100px" @click="openVideo(file)">
                    您的浏览器不支持 video 标签。
                  </video>
@@ -63,12 +52,7 @@
                </el-form-item>
              </div>
              <el-form-item label="整改反馈:">
                <el-input
                  v-model="workForme.changeDescribe"
                  type="textarea"
                  :autosize="{ minRows: 2, maxRows: 4}"
                  placeholder="请输入内容"
                />
                <el-input v-model="workForme.changeDescribe" type="textarea" :autosize="{ minRows: 2, maxRows: 4}" placeholder="请输入内容" />
              </el-form-item>
              <el-row>
                <el-form-item label="附件:">
@@ -82,7 +66,8 @@
        <!-- 整改信息 -->
        <div v-if="(dialogData.pageType ==='detail'||dialogData.pageType ==='approve' )&& parentFormData.state >=30">
          <el-row class="rectificationContent">
            <el-col :span="12"><div class="grid-content bg-purple" />
            <el-col :span="12">
              <div class="grid-content bg-purple" />
              <el-descriptions title="整改信息" :column="parseInt('2')">
                <el-descriptions-item label="是否整改" label-class-name="itemSpan">{{ parentFormData.changeType }}</el-descriptions-item>
                <el-descriptions-item label="整改人" label-class-name="itemSpan">{{ parentFormData.changeName }}</el-descriptions-item>
@@ -91,19 +76,17 @@
                <el-descriptions-item label="整改反馈" label-class-name="itemSpan">{{ parentFormData.changeDescribe }}</el-descriptions-item>
              </el-descriptions>
            </el-col>
            <el-col :span="12"><div class="grid-content bg-purple-light" />
            <el-col :span="12">
              <div class="grid-content bg-purple-light" />
              <el-row>
                <el-col :span="3" style="margin-top: 40px;font-size: 15px;color: #101010;"><div class="grid-content bg-purple" />附件：</el-col>
                <el-col :span="21"><div class="grid-content bg-purple-light" />
                <el-col :span="3" style="margin-top: 40px;font-size: 15px;color: #101010;">
                  <div class="grid-content bg-purple" />附件：
                </el-col>
                <el-col :span="21">
                  <div class="grid-content bg-purple-light" />
                  <div>
                    <div v-for="(file,index) in fileChangeListCover" :key="file.id+index" class="block">
                      <el-image
                        v-if="file.fileType ===1"
                        style="width: 100px; height: 100px"
                        :src="file.url"
                        :preview-src-list="getPreviewImages(file.id,fileChangeList)"
                        :initial-index="index"
                      />
                      <el-image v-if="file.fileType ===1" style="width: 100px; height: 100px" :src="file.url" :preview-src-list="getPreviewImages(file.id,fileChangeList)" :initial-index="index" />
                      <video v-else :src="file.url" style="width: 100px; height: 100px" @click="openVideo(file)">
                        您的浏览器不支持 video 标签。
                      </video>
@@ -117,7 +100,8 @@
        <!-- 审批信息 -->
        <div v-if="dialogData.pageType ==='detail'&& parentFormData.state>30">
          <el-row class="rectificationContent">
            <el-col :span="12"><div class="grid-content bg-purple" />
            <el-col :span="12">
              <div class="grid-content bg-purple" />
              <el-descriptions title="审批信息" :column="2">
                <el-descriptions-item label="考核打分" label-class-name="itemSpan">{{ parentFormData.checkScore }}</el-descriptions-item>
              </el-descriptions>
@@ -125,20 +109,18 @@
                <el-descriptions-item label="理由" label-class-name="itemSpan">{{ parentFormData.checkDescribe }}</el-descriptions-item>
              </el-descriptions>
            </el-col>
            <el-col :span="12"><div class="grid-content bg-purple-light" />
            <el-col :span="12">
              <div class="grid-content bg-purple-light" />
              <el-row>
                <el-col :span="3" style="margin-top: 40px;font-size: 15px;color: #101010;"><div class="grid-content bg-purple" />附件：</el-col>
                <el-col :span="21"><div class="grid-content bg-purple-light" />
                <el-col :span="3" style="margin-top: 40px;font-size: 15px;color: #101010;">
                  <div class="grid-content bg-purple" />附件：
                </el-col>
                <el-col :span="21">
                  <div class="grid-content bg-purple-light" />
                  <div>
                    <div>
                      <div v-for="(file,index) in fileApproveListCover" :key="file.id+index" class="block">
                        <el-image
                          v-if="file.fileType ===1"
                          style="width: 100px; height: 100px"
                          :src="file.url"
                          :preview-src-list="getPreviewImages(file.id,fileApproveList)"
                          :initial-index="index"
                        />
                        <el-image v-if="file.fileType ===1" style="width: 100px; height: 100px" :src="file.url" :preview-src-list="getPreviewImages(file.id,fileApproveList)" :initial-index="index" />
                        <video v-else :src="file.url" style="width: 100px; height: 100px" @click="openVideo(file)">
                          您的浏览器不支持 video 标签。
                        </video>
@@ -153,30 +135,30 @@
        <!-- 延期信息 -->
        <div v-if="(dialogData.pageType ==='delay' && (dialogData.pageState ==='view' ||dialogData.pageState ==='edit'))">
          <el-row class="rectificationContent">
            <el-col :span="12"><div class="grid-content bg-purple" />
            <el-col :span="12">
              <div class="grid-content bg-purple" />
              <el-descriptions title="延期信息" :column="1">
                <el-descriptions-item label="延期天数" label-class-name="itemSpan">{{ parentFormData.extensionNum }}</el-descriptions-item>
                <el-descriptions-item label="延期理由" label-class-name="itemSpan">{{ parentFormData.remake }}</el-descriptions-item>
              </el-descriptions>
            </el-col>
            <el-col :span="12"><div class="grid-content bg-purple-light" />
            <el-col :span="12">
              <div class="grid-content bg-purple-light" />
              <el-row>
                <el-col :span="3" style="margin-top: 40px;font-size: 15px;color: #101010;"><div class="grid-content bg-purple" />附件：</el-col>
                <el-col :span="21"><div class="grid-content bg-purple-light" />
                <el-col :span="3" style="margin-top: 40px;font-size: 15px;color: #101010;">
                  <div class="grid-content bg-purple" />附件：
                </el-col>
                <el-col :span="21">
                  <div class="grid-content bg-purple-light" />
                  <div>
                    <div v-for="(file,index) in fileDelayListCover" :key="file.id+index" class="block">
                      <el-image
                        v-if="file.fileType ===1"
                        style="width: 100px; height: 100px"
                        :src="file.url"
                        :preview-src-list="getPreviewImages(file.id,fileDelayList)"
                        :initial-index="index"
                      />
                      <el-image v-if="file.fileType ===1" style="width: 100px; height: 100px" :src="file.url" :preview-src-list="getPreviewImages(file.id,fileDelayList)" :initial-index="index" />
                      <video v-else :src="file.url" style="width: 100px; height: 100px" @click="openVideo(file)">
                        您的浏览器不支持 video 标签。
                      </video>
                    </div>
                  </div></el-col>
                  </div>
                </el-col>
              </el-row>
            </el-col>
          </el-row>
@@ -188,12 +170,7 @@
              <el-input v-model="approveForm.checkScore" style="width: 120px;" size="mini" />
            </el-form-item>
            <el-form-item label="理由:">
              <el-input
                v-model="approveForm.checkDescribe"
                type="textarea"
                :autosize="{ minRows: 2, maxRows: 4}"
                placeholder="请输入内容"
              />
              <el-input v-model="approveForm.checkDescribe" type="textarea" :autosize="{ minRows: 2, maxRows: 4}" placeholder="请输入内容" />
            </el-form-item>
            <el-form-item label="附件:">
              <uploadFile :upload-url="uploadTermExcelUrl" :sys-code="dialogData.sysCode" />
@@ -207,12 +184,7 @@
              <el-input v-model="delayForm.extensionNum" style="width: 200px;" />
            </el-form-item>
            <el-form-item label="延期理由:">
              <el-input
                v-model="delayForm.remake"
                type="textarea"
                :autosize="{ minRows: 2, maxRows: 4}"
                placeholder="请输入内容"
              />
              <el-input v-model="delayForm.remake" type="textarea" :autosize="{ minRows: 2, maxRows: 4}" placeholder="请输入内容" />
            </el-form-item>
            <el-form-item label="附件:">
              <uploadFile :upload-url="uploadTermExcelUrl" :sys-code="dialogData.sysCode" />
@@ -230,13 +202,7 @@
    </el-dialog>
    <el-dialog :visible.sync="videoVisible" width="600px" :modal-append-to-body="false" :destroy-on-close="true" @close="handleCancel">
      <div style="text-align: center;">
        <video
          ref="video"
          style="width: 300px;height: 500px"
          :src="dialogImageUrl"
          controls
          autoplay
        />
        <video ref="video" style="width: 300px;height: 500px" :src="dialogImageUrl" controls autoplay />
      </div>
    </el-dialog>
  </div>
@@ -272,9 +238,7 @@
        remake: '',
        extensionNum: ''
      },
      rectificationFromData: {

      },
      rectificationFromData: {},
      dialogVisibleMainGraph: false,
      hasFile: '',
      setepListAdd: {
@@ -287,9 +251,7 @@
          { createName: '', stateName: '审批', createTime: '' },
          { createName: '', stateName: '完成', createTime: '' }
        ],
        set3: [
          { createName: '', stateName: '完成', createTime: '' }
        ]
        set3: [{ createName: '', stateName: '完成', createTime: '' }]
      },
      unitList: [],
      polluteList: [],
@@ -316,16 +278,26 @@
      console.log('parentFormData.approveList', this.dialogData.parentFormData)
      return this.dialogData.parentFormData
    },
    updataUnitIdFormatter: function() {
      const data = this.unitList.find(item => item && item.unitId === this.dialogData.parentFormData.escalationUnitId)
    updataUnitIdFormatter: function () {
      const data = this.unitList.find(
        item =>
          item &&
          item.unitId === this.dialogData.parentFormData.escalationUnitId
      )
      return data ? data.unitName : ''
    },
    unitIdFormatter: function() {
      const data = this.unitList.find(item => item && item.unitId === this.dialogData.parentFormData.unitId)
    unitIdFormatter: function () {
      const data = this.unitList.find(
        item => item && item.unitId === this.dialogData.parentFormData.unitId
      )
      return data ? data.unitName : ''
    },
    polluteTypeFormatter: function() {
      const data = this.polluteList.find(item => item && parseInt(item.dataKey) === this.dialogData.parentFormData.polluteType)
    polluteTypeFormatter: function () {
      const data = this.polluteList.find(
        item =>
          item &&
          parseInt(item.dataKey) === this.dialogData.parentFormData.polluteType
      )
      return data ? data.dataValue : ''
    },
    setepList() {
@@ -346,7 +318,7 @@
    }
  },
  watch: {
    'parentFormData': {
    parentFormData: {
      handler(newVal) {
        this.searchthisFileList(newVal)
      },
@@ -363,7 +335,7 @@
      console.log('fileList', fileList)
      this.fileList = []
      if (fileList.length > 0) {
        fileList.map((item) => {
        fileList.map(item => {
          if (item.response) {
            this.fileList.push(item.response.data)
          }
@@ -401,11 +373,16 @@
      if (newVal.fileBaseList && newVal.fileBaseList.length > 0) {
        newVal.fileBaseList.forEach(item => {
          if (item.fileType === 1) {
            this.fileBaseList.push(`${requestObj.baseUrl}/file/preview/${item.fileId}`) // 原图
            this.fileBaseList.push(
              `${requestObj.baseUrl}/file/preview/${item.fileId}`
            ) // 原图
          }

          this.fileBaseListCover.push({
            url: item.fileType === 1 ? `${requestObj.baseUrl}/file/preview/cover/${item.fileId}` : `${requestObj.baseUrl}/file/preview/${item.fileId}`,
            url:
              item.fileType === 1
                ? `${requestObj.baseUrl}/file/preview/cover/${item.fileId}`
                : `${requestObj.baseUrl}/file/preview/${item.fileId}`,
            fileType: item.fileType,
            id: item.fileId
          })
@@ -415,10 +392,15 @@
      if (newVal.fileChangeList && newVal.fileChangeList.length > 0) {
        newVal.fileChangeList.forEach(item => {
          if (item.fileType === 1) {
            this.fileChangeList.push(`${requestObj.baseUrl}/file/preview/${item.fileId}`) // 原图
            this.fileChangeList.push(
              `${requestObj.baseUrl}/file/preview/${item.fileId}`
            ) // 原图
          }
          this.fileChangeListCover.push({
            url: item.fileType === 1 ? `${requestObj.baseUrl}/file/preview/cover/${item.fileId}` : `${requestObj.baseUrl}/file/preview/${item.fileId}`,
            url:
              item.fileType === 1
                ? `${requestObj.baseUrl}/file/preview/cover/${item.fileId}`
                : `${requestObj.baseUrl}/file/preview/${item.fileId}`,
            fileType: item.fileType,
            id: item.fileId
          })
@@ -427,11 +409,18 @@
      if (newVal.fileApproveList && newVal.fileApproveList.length > 0) {
        newVal.fileApproveList.forEach(item => {
          if (item.fileType === 1) {
            this.fileApproveList.push(`${requestObj.baseUrl}/file/preview/${item.fileId}`) // 原图
            this.fileApproveList.push(
              `${requestObj.baseUrl}/file/preview/${item.fileId}`
            ) // 原图
          }
          this.fileApproveList.push(`${requestObj.baseUrl}/file/preview/${item.fileId}`) // 原图
          this.fileApproveList.push(
            `${requestObj.baseUrl}/file/preview/${item.fileId}`
          ) // 原图
          this.fileApproveListCover.push({
            url: item.fileType === 1 ? `${requestObj.baseUrl}/file/preview/cover/${item.fileId}` : `${requestObj.baseUrl}/file/preview/${item.fileId}`,
            url:
              item.fileType === 1
                ? `${requestObj.baseUrl}/file/preview/cover/${item.fileId}`
                : `${requestObj.baseUrl}/file/preview/${item.fileId}`,
            fileType: item.fileType,
            id: item.fileId
          })
@@ -440,11 +429,18 @@
      if (newVal.fileList && newVal.fileList.length > 0) {
        newVal.fileList.forEach(item => {
          if (item.fileType === 1) {
            this.fileDelayList.push(`${requestObj.baseUrl}/file/preview/${item.fileId}`) // 原图
            this.fileDelayList.push(
              `${requestObj.baseUrl}/file/preview/${item.fileId}`
            ) // 原图
          }
          this.fileDelayList.push(`${requestObj.baseUrl}/file/preview/${item.fileId}`) // 原图
          this.fileDelayList.push(
            `${requestObj.baseUrl}/file/preview/${item.fileId}`
          ) // 原图
          this.fileDelayListCover.push({
            url: item.fileType === 1 ? `${requestObj.baseUrl}/file/preview/cover/${item.fileId}` : `${requestObj.baseUrl}/file/preview/${item.fileId}`,
            url:
              item.fileType === 1
                ? `${requestObj.baseUrl}/file/preview/cover/${item.fileId}`
                : `${requestObj.baseUrl}/file/preview/${item.fileId}`,
            fileType: item.fileType,
            id: item.fileId
          })
@@ -459,7 +455,7 @@
      this.$request({
        url: '/allocation/unit',
        method: 'get'
      }).then((res) => {
      }).then(res => {
        this.unitList = res.data
      })
    },
@@ -471,7 +467,7 @@
          id: this.dialogData.parentFormData.id,
          state: state
        }
      }).then((res) => {
      }).then(res => {
        if (res.code === 0) {
          this.$emit('update:visible', false)
          this.$emit('handeleSumit')
@@ -488,32 +484,32 @@
      if (this.dialogData.pageType === 'work') {
        api = '/allocation/change'
        data = {
          'allocationId': this.dialogData.parentFormData.allocationId,
          allocationId: this.dialogData.parentFormData.allocationId,
          ...this.workForme,
          'fileChangeList': this.fileList,
          fileChangeList: this.fileList,
          state: 30
        }
      } else if (this.dialogData.pageType === 'approve') {
        api = '/allocation/check'
        data = {
          'allocationId': this.dialogData.parentFormData.allocationId,
          allocationId: this.dialogData.parentFormData.allocationId,
          ...this.approveForm,
          'fileApproveList': this.fileList,
          fileApproveList: this.fileList,
          state: state
        }
      } else if (this.dialogData.pageType === 'delay') {
        api = '/allocation/applyfor'
        data = {
          'allocationId': this.dialogData.parentFormData.allocationId,
          allocationId: this.dialogData.parentFormData.allocationId,
          ...this.delayForm,
          'fileList': this.fileList
          fileList: this.fileList
        }
      }
      this.$request({
        url: api,
        method: 'post',
        data: data
      }).then((res) => {
      }).then(res => {
        if (res.code === 0) {
          this.$emit('update:visible', false)
          this.$emit('handeleSumit')
@@ -526,7 +522,7 @@
      this.$request({
        url: '/allocation/contaminate',
        method: 'get'
      }).then((res) => {
      }).then(res => {
        this.polluteList = res.data
      })
    }
@@ -535,14 +531,14 @@
</script>

<style lang="scss" scoped>
.titBox{
.titBox {
  position: relative;
  font-size: 18px;
  div:first-child{
  div:first-child {
    position: absolute;
    left: 10px;
  }
  div{
  div {
    display: inline-block;
  }
}
@@ -550,26 +546,28 @@
  border-bottom: 1px dashed rgba(187, 187, 187, 1);
  padding-bottom: 10px;
}
.inforData{
.inforData {
  margin-top: 20px;
  border-bottom: 1px dashed rgba(187, 187, 187, 1);
  padding-bottom: 10px;
  font-size: 15px!important;
  color: rgba(16, 16, 16, 1)!important;
  font-size: 15px !important;
  color: rgba(16, 16, 16, 1) !important;
}
  /deep/.itemSpan{
    width: 70px;
    text-align: right;
    font-size: 15px;
    color: rgba(16, 16, 16, 1);
  }
  .rectification ,.examineAndApprove,.rectificationContent{
    margin-top: 20px;
    border-bottom: 1px dashed rgba(187, 187, 187, 1);
    margin-bottom: 10px;
  }
  .block {
    display: inline-block;
    margin-right: 10px;
/deep/.itemSpan {
  width: 70px;
  text-align: right;
  font-size: 15px;
  color: rgba(16, 16, 16, 1);
}
.rectification,
.examineAndApprove,
.rectificationContent {
  margin-top: 20px;
  border-bottom: 1px dashed rgba(187, 187, 187, 1);
  margin-bottom: 10px;
}
.block {
  display: inline-block;
  margin-right: 10px;
}
</style>

 src/views/toCarryOutLegislativeReforms/reform/index.vue

@@ -1,136 +1,76 @@
<template>
  <div class="main">
    <div>
      <searchBar v-if="searchType" :search-type="'reform'" @handleSearch="handleSearch" @handleAdd="handleOpenDialog(null,'add')" />
      <newWorkOrder
        v-if="centerDialogVisible"
        ref="newWorkOrder"
        :parent-form-data="parentFormData"
        :title="title"
        :page-state="pageState"
        :visible.sync="centerDialogVisible"
        @handleSubmit="newHandleSubmit"
      />
      <searchBar v-if="searchType" :search-type="'reform'" @handleSearch="handleSearchBut" @handleAdd="handleOpenDialog(null, 'add')" />
      <newWorkOrder v-if="centerDialogVisible" ref="newWorkOrder" :parent-form-data="parentFormData" :title="title" :page-state="pageState" :visible.sync="centerDialogVisible" @handleSubmit="newHandleSubmit" />
      <div class="tab">
        <el-table
          size="mini"
          :data="tableData"
          border
          max-height="680"
          style="width: 100%"
          :header-cell-style="{
            color: '#101111', fontSize: '16px'
          }"
        >
          <el-table-column
            type="index"
            label="序号"
            width="60px"
            align="center"
          />
          <el-table-column
            align="center"
          >
        <el-table size="mini" :data="tableData" border max-height="680" style="width: 100%" :header-cell-style="{
            color: '#101111',
            fontSize: '16px'
          }">
          <el-table-column type="index" label="序号" width="60px" align="center" />
          <el-table-column align="center">
            <template slot="header">
              <div>单号</div>
              <div>上报时间</div>
            </template>
            <template slot-scope="scope">
              <div> {{ scope.row.allocationNum }}</div>
              <div> {{ scope.row.escalationTime }}</div>

              <div>{{ scope.row.allocationNum }}</div>
              <div>{{ scope.row.escalationTime }}</div>
            </template>
          </el-table-column>
          <el-table-column
            align="center"
            prop="unitId"
            label="责任主体"
            :formatter="unitIdFormatter"
          />
          <el-table-column
            align="center"
            prop="polluteType"
            label="污染分类"
            width="120px"
            :formatter="polluteTypeFormatter"
          />
          <el-table-column
            align="center"
          >
          <el-table-column align="center" prop="unitId" label="责任主体" :formatter="unitIdFormatter" />
          <el-table-column align="center" prop="polluteType" label="污染分类" width="120px" :formatter="polluteTypeFormatter" />
          <el-table-column align="center">
            <template slot="header">
              <div>整改方式</div>
              <div>剩余天数</div>
            </template>
            <template slot-scope="scope">
              <div>  {{ dictObj.changeEnum[scope.row.changeType] }}</div>
              <div v-show="scope.row.changeType && scope.row.changeType===2" :class="[Number(scope.row.residueDay) < 0 ? errorClass : '']">
              <div>{{ dictObj.changeEnum[scope.row.changeType] }}</div>
              <div v-show="scope.row.changeType && scope.row.changeType === 2" :class="[Number(scope.row.residueDay) < 0 ? errorClass : '']">
                <span v-if="Number(scope.row.residueDay) < 0">
                  延期 {{ Math.abs(scope.row.residueDay) }}天
                </span>
                <span v-else>
                  {{ scope.row.residueDay }}天
                </span>

                <span v-else> {{ scope.row.residueDay }}天 </span>
              </div>
            </template>
          </el-table-column>
          <el-table-column
            align="center"
            prop="investigationType"
            label="排查方式"
            width="100px"
            :formatter="investigationTypeFormatter"
          />
          <el-table-column
            align="center"
            prop="state"
            width="100px"
            label="流程状态"
          >
          <el-table-column align="center" prop="investigationType" label="排查方式" width="100px" :formatter="investigationTypeFormatter" />
          <el-table-column align="center" prop="state" width="100px" label="流程状态">
            <template slot-scope="scope">
              <el-tag v-if="scope.row.state===40" type="success">
              <el-tag v-if="scope.row.state === 40" type="success">
                {{ stateFormatter(scope.row) }}
              </el-tag>
              <el-tag v-if="scope.row.state===50" type="danger">
              <el-tag v-if="scope.row.state === 50" type="danger">
                {{ stateFormatter(scope.row) }}
              </el-tag>
              <el-tag v-if="scope.row.state===9" type="info">
              <el-tag v-if="scope.row.state === 9" type="info">
                {{ stateFormatter(scope.row) }}
              </el-tag>
              <el-tag v-if="scope.row.state===20" type="warning">
              <el-tag v-if="scope.row.state === 20" type="warning">
                {{ stateFormatter(scope.row) }}
              </el-tag>
              <el-tag v-if="scope.row.state===10" type="warning">
              <el-tag v-if="scope.row.state === 10" type="warning">
                {{ stateFormatter(scope.row) }}
              </el-tag>
              <el-tag v-if="scope.row.state===30" type="warning">
              <el-tag v-if="scope.row.state === 30" type="warning">
                {{ stateFormatter(scope.row) }}
              </el-tag>
            </template>
          </el-table-column>
          <el-table-column
            align="center"
            prop="isInvalid"
            label="是否作废"
            width="60px"
            :formatter="isInvalidFormatter"
          />
          <el-table-column
            align="center"
          >
          <el-table-column align="center" prop="isInvalid" label="是否作废" width="60px" :formatter="isInvalidFormatter" />
          <el-table-column align="center">
            <template slot="header">
              <div>上报单位</div>
              <div>上报人</div>
            </template>
            <template slot-scope="scope">
              <div> {{ scope.row.escalationName }}</div>
              <div> {{ updatUnitIdFormatter(scope.row) }}</div>

              <div>{{ scope.row.escalationName }}</div>
              <div>{{ updatUnitIdFormatter(scope.row) }}</div>
            </template>
          </el-table-column>
          <el-table-column
            align="center"
          >
          <el-table-column align="center">
            <template slot="header">
              <div>操作人</div>
              <div>操作时间</div>
@@ -140,59 +80,105 @@
              <div>{{ scope.row.updateTime }}</div>
            </template>
          </el-table-column>
          <el-table-column
            align="center"
            prop="createTime"
            width="100px"
            label="操作"
          >
          <el-table-column align="center" prop="createTime" width="100px" label="操作">
            <template slot-scope="scope">
              <el-button type="text" size="medium" @click="openWorkOrdinDialog(scope.row,'detail')">详情</el-button>
              <el-button v-if="scope.row.state===9" type="text" size="medium" @click="handleOpenDialog(scope.row,'edit')">编辑</el-button>
              <el-button v-if="scope.row.state>30&&scope.row.isInvalid===0" type="text" size="medium" @click="handleCancel(scope.row)">作废</el-button>
              <el-button v-if="scope.row.state===20" type="text" size="medium" @click="openWorkOrdinDialog(scope.row,'work')">整改</el-button>
              <el-button v-if="scope.row.state===30&&scope.row.isApprove===1" type="text" size="medium" @click="openWorkOrdinDialog(scope.row,'approve')">审批</el-button>
              <el-button v-if="scope.row.state===20&&scope.row.changeType===2&&scope.row.applyState===0" type="text" size="medium" @click="openWorkOrdinDialog(scope.row,'delay')">延期申请</el-button>

              <el-button type="text" size="medium" @click="openWorkOrdinDialog(scope.row, 'detail')">
                详情
              </el-button>
              <el-button type="text" v-if="scope.row.isCode==='1'" size="medium" @click="openEditDialog(scope.row)">
                修改单位
              </el-button>
              <el-button v-if="scope.row.state === 9" type="text" size="medium" @click="handleOpenDialog(scope.row, 'edit')">
                编辑
              </el-button>
              <el-button v-if="scope.row.state > 30 && scope.row.isInvalid === 0" type="text" size="medium" @click="handleCancel(scope.row)">
                作废
              </el-button>
              <el-button v-if="scope.row.state === 20" type="text" size="medium" @click="openWorkOrdinDialog(scope.row, 'work')">
                整改
              </el-button>
              <el-button v-if="scope.row.state === 30 && scope.row.isApprove === 1" type="text" size="medium" @click="openWorkOrdinDialog(scope.row, 'approve')">
                审批
              </el-button>
              <el-button v-if="
                  scope.row.state === 20 &&
                  scope.row.changeType === 2 &&
                  scope.row.applyState === 0
                " type="text" size="medium" @click="openWorkOrdinDialog(scope.row, 'delay')">
                延期申请
              </el-button>
            </template>
          </el-table-column>
        </el-table>
      </div>
      <div class="pagina">
        <el-pagination
          background
          :current-page="pagination.currentPage"
          :page-sizes="pagination.pageSizes"
          :page-size="pagination.pageSize"
          :total="pagination.totalCount"
          layout="total, sizes, prev, pager, next, jumper"
          @size-change="handleSizeChange"
          @current-change="handleCurrentChange"
        />
        <el-pagination background :current-page="pagination.currentPage" :page-sizes="pagination.pageSizes" :page-size="pagination.pageSize" :total="pagination.totalCount" layout="total, sizes, prev, pager, next, jumper" @size-change="handleSizeChange" @current-change="handleCurrentChange" />
      </div>
    </div>
    <workOrderInformation v-if="workOrdinDialogVisible" :dialog-data="dialogData" :visible.sync="workOrdinDialogVisible" @handeleSumit="handeleSumit" />
    <el-dialog
      title="作废"
      :visible.sync="dialogVisible"
      width="600px"
      :before-close="handleClose"
      center
    >
    <el-dialog title="作废" :visible.sync="dialogVisible" width="600px" :before-close="handleClose" center>
      <div>
        <el-form label-width="100px">
          <el-form-item label="作废理由：" style="margin-right: 30px;">
            <el-input
              v-model="invalidReason"
              type="textarea"
              :autosize="{ minRows: 2, maxRows: 10}"
              placeholder="请输入内容"
            />
          <el-form-item label="作废理由：" style="margin-right: 30px">
            <el-input v-model="invalidReason" type="textarea" :autosize="{ minRows: 2, maxRows: 10 }" placeholder="请输入内容" />
          </el-form-item>
        </el-form>
      </div>
      <span slot="footer" class="dialog-footer">
        <el-button @click="handleClose">取 消</el-button>
        <el-button type="primary" @click="handleInvalid">确 定</el-button>
      </span>
    </el-dialog>
    <el-dialog title="修改" v-if="dialogEditVisible" :visible.sync="dialogEditVisible" width="800px" top='5vh' :before-close="handleClose" center>
      <el-descriptions title="基本信息">
        <template slot="extra">
          <div>
            {{ editEscalationUnitData.allocationNum}}
          </div>
        </template>
        <el-descriptions-item label="上报时间" label-class-name="itemSpan">{{ editEscalationUnitData.escalationTime }}</el-descriptions-item>
        <el-descriptions-item label="责任单位" label-class-name="itemSpan">{{ updataUnitIdFormatter }}</el-descriptions-item>
        <el-descriptions-item label="污染分类" label-class-name="itemSpan">{{ polluteTypeeDITFormatter }}</el-descriptions-item>
        <el-descriptions-item label="整改类型" label-class-name="itemSpan">{{ dictObj.changeEnum[editEscalationUnitData.changeType] }}</el-descriptions-item>
        <el-descriptions-item label="期限天数" label-class-name="itemSpan">{{ editEscalationUnitData.changeDay || 0}} 天</el-descriptions-item>
        <el-descriptions-item label="上报单位" label-class-name="itemSpan">{{ updataEscalationUnitIdFormatter }}</el-descriptions-item>
        <el-descriptions-item label="上报人" label-class-name="itemSpan">{{ editEscalationUnitData.escalationName }}</el-descriptions-item>
        <el-descriptions-item label="污染位置" label-class-name="itemSpan">{{ editEscalationUnitData.pollutePosition }}</el-descriptions-item>
      </el-descriptions>
      <el-divider></el-divider>
      <div>
        <p class="editTile">修改操作</p>
        <el-form :inline="true" class="demo-form-inline">
          <el-form-item label="责任单位:">
            <el-select v-model="formInEdit.unitId" size="small" clearable placeholder="请选择">
              <el-option v-for="item in unitList" :key="item.unitId" :label="item.unitName" :value="item.unitId" />
            </el-select>
          </el-form-item>
          <el-form-item label="污染分类:">
            <el-select v-model="formInEdit.polluteType" size="small" clearable placeholder="请选择">
              <el-option v-for="item in polluteList" :key="item.dataKey" :label="item.dataValue" :value="item.dataKey" />
            </el-select>
          </el-form-item>
        </el-form>
      </div>
      <el-collapse>
        <el-collapse-item title="修改记录" name="1">
          <div class="block">
            <el-timeline>
              <el-timeline-item v-for="(activity, index) in operatingLog" :key="index" :color="'#0bbd87'" :timestamp="activity.createTime">
                <div v-if="activity.content"> 操作人: {{activity.userName}}</div>
                <div v-if="activity.content"> 责任单位: {{activity.content}}</div>
                <div v-if="activity.polluteType"> 污染分类: {{activity.polluteType}}</div>
              </el-timeline-item>
            </el-timeline>
          </div>
        </el-collapse-item>
      </el-collapse>

      <span slot="footer" class="dialog-footer">
        <el-button @click="handleClose">取 消</el-button>
        <el-button type="primary" @click="handleEditChange">确 定</el-button>
      </span>
    </el-dialog>
  </div>
@@ -222,8 +208,7 @@
        pageSize: 10
      },
      formData: {},
      tableData: [
      ],
      tableData: [],
      dialogData: {
        title: '整改',
        parentFormData: {},
@@ -233,6 +218,7 @@
      workOrdinDialogVisible: false,
      centerDialogVisible: false,
      dialogVisible: false,
      dialogEditVisible: false,
      unitList: [],
      polluteList: [],
      Dic: JSON.parse(localStorage.getItem('dict')),
@@ -244,22 +230,106 @@
      title: '',
      searchData: {
        isInvalid: 0
      }
      },
      editEscalationUnitData: {},
      formInEdit: {
        polluteType: '',
        unitId: ''
      },
      operatingLog: []
    }
  },

  computed: {
    updataEscalationUnitIdFormatter: function () {
      const data = this.unitList.find(
        item =>
          item && item.unitId === this.editEscalationUnitData.escalationUnitId
      )
      return data ? data.unitName : ''
    },
    updataUnitIdFormatter: function () {
      const data = this.unitList.find(
        item => item && item.unitId === this.editEscalationUnitData.unitId
      )
      return data ? data.unitName : ''
    },
    polluteTypeeDITFormatter: function () {
      const data = this.polluteList.find(
        item =>
          item &&
          parseInt(item.dataKey) === this.editEscalationUnitData.polluteType
      )
      return data ? data.dataValue : ''
    }
  },
  created() {
    this.handleSearch()
    this.getUnitList()
    this.getContaminateList()
  },
  methods: {
    openEditDialog(row) {
      this.editEscalationUnitData = row
      this.dialogEditVisible = true
      this.$request({
        url: '/allocation/getLog',
        method: 'get',
        params: {
          allocationNum: this.editEscalationUnitData.allocationNum
        }
      })
        .then(res => {
          this.operatingLog = res.data
        })
        .catch(err => {
          this.$message.error(res.message)
          console.log('请求Region失败')
          console.log(err)
        })
    },
    handleCancel(row) {
      this.dialogVisible = true
      this.slectRow = row
    },
    handleClose() {
      this.dialogVisible = false
      this.dialogEditVisible = false
    },
    handleEditChange() {
      if (this.formInEdit.polluteType === '' && this.formInEdit.unitId === '') {
        this.$message({
          message: '请选择后再提交',
          type: 'error'
        })
        return
      }
      this.$request({
        url: '/allocation/updataUnit',
        method: 'get',
        params: {
          id: this.editEscalationUnitData.allocationId,
          ...this.formInEdit
        }
      })
        .then(res => {
          if (res.code === 0) {
            this.$message({
              message: '修改成功',
              type: 'success'
            })
            this.dialogEditVisible = false
            this.formInEdit = {
              polluteType: '',
              unitId: ''
            }
            this.handleSearch()
          }
        })
        .catch(err => {
          this.$message.error(res.message)
          console.log('请求Region失败')
          console.log(err)
        })
    },
    handleInvalid() {
      this.$request({
@@ -269,7 +339,7 @@
          id: this.slectRow.allocationId,
          invalidReason: this.invalidReason
        }
      }).then((res) => {
      }).then(res => {
        if (res.code === 0) {
          this.$message({
            message: '处理成功',
@@ -296,7 +366,7 @@
          params: {
            id: row.allocationId
          }
        }).then((res) => {
        }).then(res => {
          this.parentFormData = res.data
          console.log(this.parentFormData)
          this.centerDialogVisible = true
@@ -304,22 +374,27 @@
      }
    },
    updatUnitIdFormatter(val) {
      const data = this.unitList.find(item => item && item.unitId === val.escalationUnitId)
      const data = this.unitList.find(
        item => item && item.unitId === val.escalationUnitId
      )
      return data ? data.unitName : ''
    },
    unitIdFormatter(val) {
      const data = this.unitList.find(item => item && item.unitId === val.unitId)
      const data = this.unitList.find(
        item => item && item.unitId === val.unitId
      )
      return data ? data.unitName : ''
    },
    polluteTypeFormatter(val) {
      const data = this.polluteList.find(item => item && parseInt(item.dataKey) === val.polluteType)
      const data = this.polluteList.find(
        item => item && parseInt(item.dataKey) === val.polluteType
      )
      return data ? data.dataValue : ''
    },
    investigationTypeFormatter(val) {
      return this.dictObj.investigationEnum[val.investigationType]
    },
    stateFormatter(val) {
      console.log('valval', val)
      return this.dictObj.allocationApproveEnum[val.state]
    },
    isInvalidFormatter(val) {
@@ -330,7 +405,7 @@
      this.$request({
        url: '/allocation/unit',
        method: 'get'
      }).then((res) => {
      }).then(res => {
        if (res.code === 0) {
          this.unitList = res.data
        } else {
@@ -342,7 +417,7 @@
      this.$request({
        url: '/allocation/contaminate',
        method: 'get'
      }).then((res) => {
      }).then(res => {
        if (res.code === 0) {
          this.polluteList = res.data
        } else {
@@ -368,7 +443,7 @@
        data: {
          ...obj
        }
      }).then((res) => {
      }).then(res => {
        if (res.code === 0) {
          this.centerDialogVisible = false

@@ -377,6 +452,18 @@
          this.$message.error(res.message)
        }
      })
    },
    handleSearchBut(obj) {
      this.pagination = {
        currentPage: 1,
        // 总条数，根据接口获取数据长度(注意：这里不能为空)
        totalCount: 0,
        // 个数选择器（可修改）
        pageSizes: [10, 20, 30, 40],
        // 默认每页显示的条数（可修改）
        pageSize: 10
      }
      this.handleSearch(obj)
    },
    handleSearch(obj) {
      this.searchData.isInvalid = 0
@@ -388,9 +475,9 @@
        method: 'post',
        data: {
          ...this.searchData,
          'page': this.pagination
          page: this.pagination
        }
      }).then((res) => {
      }).then(res => {
        if (res.code === 0) {
          this.tableData = res.data.list
          this.pagination.totalCount = res.data.page.totalNum
@@ -403,6 +490,7 @@
    // 每页显示的条数
    handleSizeChange(val) {
      // 改变每页显示的条数
      console.log('345')
      this.pagination.pageSize = val
      // 注意：在改变每页显示的条数时，要将页码显示到第一页
      this.pagination.currentPage = 1
@@ -411,6 +499,7 @@
    // 显示第几页
    handleCurrentChange(val) {
      // 改变默认的页数
      console.log('123')
      this.pagination.currentPage = val
      this.handleSearch()
      // console.log(val)
@@ -422,7 +511,7 @@
        params: {
          id: row.allocationId
        }
      }).then((res) => {
      }).then(res => {
        this.parentFormData = res.data
        this.workOrdinDialogVisible = true
        if (type === 'work') {
@@ -463,17 +552,17 @@
</script>

<style scoped lang="scss">
.main{
    padding: 20px;
    padding-top: 0px;
    height: 100%;
    overflow: overlay;
.main {
  padding: 20px;
  padding-top: 0px;
  height: 100%;
  overflow: overlay;
}
.tab {
    margin-top: 0px;
   /deep/ .el-tag{
      font-size: 16px;
    }
  margin-top: 0px;
  /deep/ .el-tag {
    font-size: 16px;
  }
}
// /deep/ .el-table__body-wrapper {
//     overflow: scroll;
@@ -481,22 +570,31 @@
//     overflow-x: hidden;
//     max-height: 400px;
// }
.pagina{
    margin-top: 10px;
.pagina {
  margin-top: 10px;
}
/deep/ .el-table__row{
/deep/ .el-table__row {
  font-size: 18px;
}
.el-pagination {
  padding: 0;
  .el-select{
    /deep/.el-input{
      margin:0;
  .el-select {
    /deep/.el-input {
      margin: 0;
    }
  }

}
.errorClass{
.errorClass {
  color: red;
}
.editTile {
  color: #303133;
  font-size: 16px;
  font-weight: 700;
}
/deep/.el-collapse-item__header {
  color: #303133;
  font-size: 16px;
  font-weight: 700;
}
</style>