Browse Source

Merge branch 'zz-test' into master

LAPTOP-U5GOA5HA\zz 1 year ago
parent
commit
f0b000d7a9

+ 12 - 0
src/views/clw/car/index.vue

@@ -109,6 +109,7 @@
             :row-selection="{ selectedRowKeys: selectedRowKeys, onChange: onSelectChange }"
             :pagination="false"
             :bordered="tableBordered"
+            :customHeaderRow="customRow"
           >
             <span slot="operation" slot-scope="text, record">
               <a-divider type="vertical" v-hasPermi="['clw:car:edit']" />
@@ -376,6 +377,17 @@ export default {
           }
       })
     },
+    customRow(column) {
+      column.forEach((e, index) => { 
+      column[index].className = 'tableClass' // 给数组中的每一列加上一个类名
+      })
+    },
   },
 }
 </script>
+<style lang="less" scoped>
+/deep/.tableClass {
+  // background: #65aeeb !important;
+  // color: #fff;
+}
+</style>

+ 32 - 5
src/views/clw/car/modules/CreateForm.vue

@@ -45,6 +45,8 @@
               placeholder="请选择"
               :replaceFields="{ children: 'children', title: 'categoryName', key: 'categoryId', value: 'categoryId' }"
               tree-default-expand-all
+              show-search
+              tree-node-filter-prop="title"
             >
             </a-tree-select>
           </a-form-model-item>
@@ -242,15 +244,22 @@
             <file-upload v-model="form.document" type="file" @UpdateImg="UpdateDociment"></file-upload>
           </a-form-model-item>
         </a-col>
-        <a-col :span="10">
+        <!-- <a-col :span="10">
           <a-form-model-item label="车辆类型" prop="type">
-            <a-select placeholder="请选择车辆类型" v-model="form.type">
+            <a-select
+              placeholder="请选择车辆类型"
+              v-model="form.type"
+              show-search
+              :filter-option="searchBrand"
+              :autoClearSearchValue="false"
+              @change="handleChange"
+            >
               <a-select-option v-for="(d, index) in typeOptions" :key="index" :value="d.value">{{
                 d.label
               }}</a-select-option>
             </a-select>
           </a-form-model-item>
-        </a-col>
+        </a-col> -->
       </a-row>
       <a-row>
         <a-col :span="10">
@@ -291,14 +300,19 @@
             <a-input v-model="form.bidPrice" placeholder="请输入价格" />
           </a-form-model-item>
         </a-col>
-      </a-row>
-      <a-row>
         <a-col :span="10">
           <a-form-model-item label="离线时间" prop="offineTime">
             <a-input v-model="form.offineTime" placeholder="请输入离线时间" />
           </a-form-model-item>
         </a-col>
       </a-row>
+      <!-- <a-row>
+        <a-col :span="10">
+          <a-form-model-item label="离线时间" prop="offineTime">
+            <a-input v-model="form.offineTime" placeholder="请输入离线时间" />
+          </a-form-model-item>
+        </a-col>
+      </a-row> -->
       <a-form-model-item label="备注" prop="remark">
         <a-input v-model="form.remark" placeholder="请输入内容" type="textarea" allow-clear />
       </a-form-model-item>
@@ -664,6 +678,19 @@ export default {
     UpdateDociment(val) {
       this.form.document = val
     },
+    searchBrand(input, option) {
+      console.log('--------ss', input)
+      return option.componentOptions.children[0].text.toLowerCase().indexOf(input.toLowerCase()) >= 0
+    },
+    handleChange(value) {
+      console.log(`selected ${value}`)
+    },
+    handleBlur() {
+      console.log('blur')
+    },
+    handleFocus() {
+      console.log('focus')
+    },
   },
 }
 </script>

+ 124 - 4
src/views/clw/car/modules/Trees.vue

@@ -1,6 +1,7 @@
 <template>
-  <div>
+  <div style="background: #f0efef; height: 100%">
     <a-input-search style="margin-bottom: 8px" placeholder="请输入消防队单位关键字" @change="filterNode" />
+    <a-button @click="newlyAdded">新增</a-button>
     <a-tree
       :expanded-keys="expandedKeys"
       :auto-expand-parent="autoExpandParent"
@@ -9,10 +10,30 @@
       @select="handleNodeClick"
       @expand="onExpand"
     >
+      <template slot="custom" slot-scope="item">
+        <div>
+          <span class="node-title">{{ item.title }} </span>
+          <span style="margin-left: 20px">
+            <span style="margin-right: 10px">
+              <a-icon type="plus-circle" @click="subordinateItem(item)" />
+            </span>
+            <span style="margin-right: 10px">
+              <a-icon type="edit" @click="modifyItem(item)" />
+            </span>
+            <span style="margin-right: 10px">
+              <a-popconfirm title="是否要删除此行?" @confirm="deleteItem(item)">
+                <a-icon type="delete" />
+              </a-popconfirm>
+            </span>
+          </span>
+        </div>
+      </template>
     </a-tree>
+    <tree-lower-modules ref="treeLowerModules" @ok="onOk" />
   </div>
 </template>
 <script>
+import treeLowerModules from './treeLowerModules.vue'
 const getParentKey = (id, tree) => {
   let parentKey
   for (let i = 0; i < tree.length; i++) {
@@ -28,20 +49,21 @@ const getParentKey = (id, tree) => {
   return parentKey
 }
 export default {
-  name: 'DeptTree',
+  name: 'Trees',
   props: {
     carTypeList: {
       type: Array,
       required: true,
     },
   },
-  components: {},
+  components: { treeLowerModules },
   data() {
     return {
       replaceFields: { children: 'children', title: 'categoryName', key: 'categoryId', value: 'categoryId' },
       deptNodes: [],
       expandedKeys: [],
       searchValue: '',
+      searchStr: '',
       autoExpandParent: true,
     }
   },
@@ -62,6 +84,7 @@ export default {
     },
     // 筛选节点
     filterNode(e) {
+      //   this.searchStr = e.target.value
       this.getAllDeptNode(this.carTypeList)
       const value = e.target.value
       const gData = this.carTypeList
@@ -82,12 +105,109 @@ export default {
     },
     // 节点单击事件
     handleNodeClick(keys, event) {
-      this.$emit('select', keys[0])
+      console.log('----', keys)
+      this.$emit('select', keys)
     },
     onExpand(expandedKeys) {
       this.expandedKeys = expandedKeys
       this.autoExpandParent = false
     },
+    // 新增
+    newlyAdded() {
+      const item = { key: this.carTypeList[0].key, operation: 1 }
+      this.$refs.treeLowerModules.add(item)
+    },
+    // 添加下级
+    subordinateItem(item) {
+      item.operation = 2
+      this.$refs.treeLowerModules.add(item)
+    },
+    // 修改
+    modifyItem(item) {
+      this.$refs.treeLowerModules.edit(item)
+    },
+    // 删除
+    deleteItem(item) {
+      this.selectKeys = [item.categoryId]
+      this.dataDriveDelete()
+    },
+    onOk(val) {
+      if (val.operation === 1) {
+        this.selectKeys = [val.categoryId]
+        this.dataDriveAddSame(val.categoryName)
+      } else if (val.operation === 2) {
+        this.selectKeys = [val.categoryId]
+        this.dataDriveAddSub(val.categoryName)
+      } else if (val.operation === 3) {
+        this.selectKeys = [val.categoryId]
+        this.dataDriveModify(val.categoryName)
+      }
+    },
+    getTreeDataByKey(childs = [], findKey) {
+      let finditem = null
+      for (let i = 0, len = childs.length; i < len; i++) {
+        let item = childs[i]
+        if (item.categoryId !== findKey && item.children && item.children.length > 0) {
+          finditem = this.getTreeDataByKey(item.children, findKey)
+        }
+        if (item.categoryId == findKey) {
+          finditem = item
+        }
+        if (finditem != null) {
+          break
+        }
+      }
+      return finditem
+    },
+    getTreeParentChilds(childs = [], findKey) {
+      let parentChilds = []
+      for (let i = 0, len = childs.length; i < len; i++) {
+        let item = childs[i]
+        if (item.categoryId !== findKey && item.children && item.children.length > 0) {
+          parentChilds = this.getTreeParentChilds(item.children, findKey)
+        }
+        if (item.categoryId == findKey) {
+          parentChilds = childs
+        }
+        if (parentChilds.length > 0) {
+          break
+        }
+      }
+      return parentChilds
+    },
+    // 添加同级
+    dataDriveAddSame(title) {
+      let parentChilds = this.getTreeParentChilds(this.carTypeList, this.selectKeys[0])
+      parentChilds.push({
+        title: title,
+        key: new Date().getTime(),
+        scopedSlots: { title: 'custom' },
+      })
+    },
+    // 添加下级
+    dataDriveAddSub(title) {
+      let selectItem = this.getTreeDataByKey(this.carTypeList, this.selectKeys[0])
+      if (!selectItem.children) {
+        this.$set(selectItem, 'children', [])
+      }
+      selectItem.children.push({
+        title: title,
+        key: new Date().getTime(),
+        scopedSlots: { title: 'custom' },
+      })
+      this.$forceUpdate()
+    },
+    // 修改
+    dataDriveModify(title) {
+      let selectItem = this.getTreeDataByKey(this.carTypeList, this.selectKeys[0])
+      selectItem.title = title
+    },
+    // 删除
+    dataDriveDelete() {
+      let parentChilds = this.getTreeParentChilds(this.carTypeList, this.selectKeys[0])
+      let delIndex = parentChilds.findIndex((item) => item.categoryId == this.selectKeys[0])
+      parentChilds.splice(delIndex, 1)
+    },
   },
 }
 </script>

+ 90 - 0
src/views/clw/car/modules/treeLowerModules.vue

@@ -0,0 +1,90 @@
+<template>
+  <a-modal :title="title" v-model="visible" :confirmLoading="confirmLoading" @ok="handleSubmit">
+    <a-form :form="form">
+      <a-form-item :labelCol="labelCol" :wrapperCol="wrapperCol" label="名称">
+        <a-input
+          :disabled="disabled"
+          placeholder="请输入名称"
+          v-decorator="['title', { rules: [{ required: true, message: '请输入名称' }] }]"
+        />
+      </a-form-item>
+    </a-form>
+  </a-modal>
+</template>
+
+<script>
+import pick from 'lodash.pick'
+
+export default {
+  address: 'TreeModules',
+  props: {},
+  components: {},
+  data() {
+    return {
+      visible: false,
+      confirmLoading: false,
+      form: this.$form.createForm(this),
+      labelCol: {
+        xs: { span: 24 },
+        sm: { span: 5 },
+      },
+      wrapperCol: {
+        xs: { span: 24 },
+        sm: { span: 16 },
+      },
+      title: '',
+      mdl: {},
+      disabled: false,
+
+      operation: 1,
+      record: {},
+    }
+  },
+  beforeCreate() {},
+  created() {},
+  computed: {},
+  methods: {
+    add(record) {
+      this.operation = record.operation
+      if (record.operation === 1) {
+        this.title = '新增'
+      } else {
+        this.title = '添加下级'
+      }
+      this.form.resetFields()
+      this.visible = true
+      this.disabled = false
+      this.record = record
+    },
+    edit(record) {
+      this.record = record
+      this.operation = 3
+      this.disabled = false
+      this.title = '编辑名称'
+      this.mdl = Object.assign({}, record)
+      this.visible = true
+      this.$nextTick(() => {
+        this.form.setFieldsValue(pick(this.mdl, 'title'))
+      })
+    },
+    // 保存
+    handleSubmit(e) {
+      e.preventDefault()
+      this.form.validateFields((err, values) => {
+        if (!err) {
+          values.operation = this.operation
+          values.key = this.record.key
+          this.confirmLoading = true
+          this.$emit('ok', values)
+          this.form.resetFields()
+          this.$message.success('保存成功')
+          this.visible = false
+          this.confirmLoading = false
+        }
+      })
+    },
+  },
+}
+</script>
+
+<style scoped lang="less"></style>

+ 1 - 1
vue.config.js

@@ -111,7 +111,7 @@ const vueConfig = {
       [process.env.VUE_APP_BASE_API]: {
         // target: `https://ruoyi.setworld.net`,
         // target: `http://113.249.153.164:7618/api`,
-        target:`http://127.0.0.1:8080`,
+        target:`http://192.168.31.129:8081`,
         changeOrigin: true,
         pathRewrite: {
           ['^' + process.env.VUE_APP_BASE_API]: ''