| | |
| | | |
| | | const getVoucherUrl = (item) => item?.response?.url?.data || item?.url || ''; |
| | | |
| | | const AddEditView = ( |
| | | { visible, onSave, onCancel, onUpdate, warehouseList = [], categoryList = [] }, |
| | | ref, |
| | | ) => { |
| | | const AddEditView = ({ visible, onSave, onCancel, onUpdate, warehouseList = [] }, ref) => { |
| | | const [form] = Form.useForm(); |
| | | const [fileList, setFileList] = useState([]); |
| | | const [typeList, setTypeList] = useState([]); |
| | |
| | | <DatePicker showTime style={{ width: '100%' }} placeholder="请选择" /> |
| | | </Form.Item> |
| | | <Form.Item name="goodsName" label="商品"> |
| | | <Select |
| | | allowClear |
| | | showSearch |
| | | options={categoryList.map((item) => ({ |
| | | label: item.categoryName, |
| | | value: item.categoryName, |
| | | }))} |
| | | filterOption={(input, option) => (option?.label || '').includes(input)} |
| | | placeholder="请选择商品" |
| | | /> |
| | | <Input placeholder="请输入商品" /> |
| | | </Form.Item> |
| | | <Form.Item name="counterparty" label="交易对方"> |
| | | <Input placeholder="请输入交易对方" /> |
| | |
| | | }; |
| | | const getVoucherUrl = (item) => item?.response?.url?.data || item?.url || ''; |
| | | |
| | | const AddEditView = ( |
| | | { visible, onSave, onUpdate, onCancel, warehouseList = [], categoryList = [] }, |
| | | ref, |
| | | ) => { |
| | | const AddEditView = ({ visible, onSave, onUpdate, onCancel, warehouseList = [] }, ref) => { |
| | | const [form] = Form.useForm(); |
| | | const [fileList, setFileList] = useState([]); |
| | | const [typeList, setTypeList] = useState([]); |
| | |
| | | <DatePicker showTime style={{ width: '100%' }} /> |
| | | </Form.Item> |
| | | <Form.Item name="goodsName" label="商品"> |
| | | <Select |
| | | allowClear |
| | | showSearch |
| | | options={categoryList.map((item) => ({ |
| | | label: item.categoryName, |
| | | value: item.categoryName, |
| | | }))} |
| | | filterOption={(input, option) => (option?.label || '').includes(input)} |
| | | placeholder="请选择商品" |
| | | /> |
| | | <Input placeholder="请输入商品" /> |
| | | </Form.Item> |
| | | <Form.Item name="counterparty" label="交易对方"> |
| | | <Input placeholder="请输入交易对方" /> |
| | |
| | | del, |
| | | downloadImportTemplate, |
| | | financialManagementImport, |
| | | getCategoryList, |
| | | getList, |
| | | getTypeList, |
| | | getWarehouseList, |
| | |
| | | const [modalVisible2, handleModalVisible2] = useState(false); |
| | | const [typeList, setTypeList] = useState([]); |
| | | const [warehouseList, setWarehouseList] = useState([]); |
| | | const [categoryList, setCategoryList] = useState([]); |
| | | useEffect(() => { |
| | | getTypeList().then((res) => { |
| | | setTypeList(res.data); |
| | | }); |
| | | getWarehouseList().then((res) => { |
| | | setWarehouseList(res.data); |
| | | }); |
| | | getCategoryList().then((res) => { |
| | | setCategoryList(res.data); |
| | | }); |
| | | }, []); |
| | | |
| | |
| | | <Expenses |
| | | ref={addViewRef} |
| | | warehouseList={warehouseList} |
| | | categoryList={categoryList} |
| | | visible={modalVisible} |
| | | onCancel={() => handleModalVisible(false)} |
| | | onSave={async (fileds) => { |
| | |
| | | <Income |
| | | ref={addViewRef1} |
| | | warehouseList={warehouseList} |
| | | categoryList={categoryList} |
| | | visible={modalVisible1} |
| | | onCancel={() => handleModalVisible1(false)} |
| | | onSave={async (fileds) => { |
| | |
| | | getWarehouseList().then((res) => { |
| | | setWarehouseList(res.data || []); |
| | | }); |
| | | // 初始请求一次数据(不传仓库,默认全部仓库本年) |
| | | fetchData(undefined, 'year', []); |
| | | // 支出饼图(南丁格尔玫瑰图) |
| | | if (expensePieRef.current) { |
| | | if (expensePieChart.current) expensePieChart.current.dispose(); |
| | |
| | | } |
| | | }, [incomeChartData]); |
| | | |
| | | // 仓库值更新后重新加载统计数据 |
| | | useEffect(() => { |
| | | fetchData(selectedWarehouseId, dateType, dateRange); |
| | | }, [selectedWarehouseId]); |
| | | |
| | | // 仓库选择 |
| | | const onWarehouseChange = (value) => { |
| | | setSelectedWarehouseId(value); |
| | | fetchData(value, dateType, dateRange); |
| | | }; |
| | | |
| | | // 时间类型切换 |
| | |
| | | import { buildProTableDataSource, sendRequest, showDelConfirm } from '@/utils/antdUtils'; |
| | | import { PageContainer, ProTable } from '@ant-design/pro-components'; |
| | | import { Button, DatePicker, message, Space } from 'antd'; |
| | | import { useRef } from 'react'; |
| | | import { Button, DatePicker, message, Modal, Space } from 'antd'; |
| | | import { useRef, useState } from 'react'; |
| | | import { getList, refreshLastMonth, refreshMonth } from './service'; |
| | | |
| | | const formatMonth = (value) => { |
| | | if (!value) { |
| | | return undefined; |
| | | } |
| | | if (typeof value === 'string') { |
| | | return value; |
| | | } |
| | | if (value.format) { |
| | | return value.format('YYYY-MM'); |
| | | } |
| | | if (typeof value === 'string') { |
| | | return value.slice(0, 7); |
| | | } |
| | | return value; |
| | | }; |
| | | |
| | | const WarehouseMonthSummary = () => { |
| | | const actionRef = useRef(); |
| | | const formRef = useRef(); |
| | | const [refreshMonthModalVisible, setRefreshMonthModalVisible] = useState(false); |
| | | const [refreshMonthValue, setRefreshMonthValue] = useState(); |
| | | const [messageApi, messageContextHolder] = message.useMessage(); |
| | | |
| | | const columns = [ |
| | | { |
| | |
| | | breadcrumb: {}, |
| | | }} |
| | | > |
| | | {messageContextHolder} |
| | | <ProTable |
| | | rowKey={(record) => record.id || `${record.warehouseId}-${record.summaryMonth}`} |
| | | actionRef={actionRef} |
| | | formRef={formRef} |
| | | columns={columns} |
| | | search={{ |
| | | labelWidth: 'auto', |
| | |
| | | <Button |
| | | type="primary" |
| | | onClick={() => { |
| | | const params = formRef.current.getFieldsValue(); |
| | | const summaryMonth = formatMonth(params.summaryMonth); |
| | | if (!summaryMonth) { |
| | | message.warning('请选择要刷新的月份'); |
| | | return; |
| | | } |
| | | showDelConfirm(async () => { |
| | | const success = await sendRequest(refreshMonth, { summaryMonth }); |
| | | if (success) { |
| | | actionRef.current.reload(); |
| | | } |
| | | }, `确认刷新${summaryMonth}仓库月汇总吗?`); |
| | | setRefreshMonthModalVisible(true); |
| | | }} |
| | | > |
| | | 刷新当前筛选月份 |
| | | 刷新指定月份 |
| | | </Button> |
| | | <Button |
| | | onClick={() => { |
| | |
| | | </Space>, |
| | | ]} |
| | | /> |
| | | <Modal |
| | | title="刷新仓库月汇总" |
| | | open={refreshMonthModalVisible} |
| | | onCancel={() => setRefreshMonthModalVisible(false)} |
| | | onOk={async () => { |
| | | const summaryMonth = formatMonth(refreshMonthValue); |
| | | if (!summaryMonth) { |
| | | messageApi.warning('请选择要刷新的月份'); |
| | | return; |
| | | } |
| | | const hide = messageApi.loading('正在请求中'); |
| | | try { |
| | | const response = await refreshMonth({ summaryMonth }); |
| | | if (response.code == 200) { |
| | | messageApi.success('操作成功'); |
| | | setRefreshMonthModalVisible(false); |
| | | actionRef.current.reload(); |
| | | } else { |
| | | messageApi.error(response.msg || '操作失败'); |
| | | } |
| | | } catch (error) { |
| | | messageApi.error('操作失败,请稍后重试'); |
| | | } finally { |
| | | hide(); |
| | | } |
| | | }} |
| | | > |
| | | <DatePicker |
| | | picker="month" |
| | | placeholder="请选择要刷新的月份" |
| | | style={{ width: '100%' }} |
| | | value={refreshMonthValue} |
| | | onChange={setRefreshMonthValue} |
| | | /> |
| | | </Modal> |
| | | </PageContainer> |
| | | ); |
| | | }; |
| | |
| | | export const refreshMonth = async (params) => { |
| | | return request(`/yc-warehouse-month-summary/refreshMonth`, { |
| | | method: 'POST', |
| | | // 后端以 @RequestParam 接收月份;data 用于项目 POST 请求拦截器的签名处理。 |
| | | params, |
| | | data: params, |
| | | }); |
| | | }; |
| | | |
| | |
| | | <div class="dashboard-editor-container"> |
| | | <div class="filter-container"> |
| | | |
| | | <el-button v-if="showadd" class="filter-item" style="margin-left: 10px;" type="primary" icon="el-icon-edit" |
| | | @click="handleCreate"> |
| | | <el-button |
| | | v-if="showadd" |
| | | class="filter-item" |
| | | style="margin-left: 10px;" |
| | | type="primary" |
| | | icon="el-icon-edit" |
| | | @click="handleCreate" |
| | | > |
| | | 添加品类 |
| | | </el-button> |
| | | |
| | | </div> |
| | | |
| | | <el-table :key="tableKey" v-loading="listLoading" :data="list" border fit highlight-current-row |
| | | style="width: 100%;"> |
| | | |
| | | |
| | | <el-table |
| | | :key="tableKey" |
| | | v-loading="listLoading" |
| | | :data="list" |
| | | border |
| | | fit |
| | | highlight-current-row |
| | | style="width: 100%;" |
| | | > |
| | | |
| | | <el-table-column label="品类" align="center"> |
| | | <template slot-scope="{row}"> |
| | |
| | | 修改 |
| | | </el-button> |
| | | |
| | | <el-button size="mini" type="danger" @click="handleDelete(row,$index)"> |
| | | <el-button size="mini" type="danger" @click="handleDelete(row,$index)"> |
| | | 删除 |
| | | </el-button> |
| | | </template> |
| | | </el-table-column> |
| | | |
| | | |
| | | </el-table> |
| | | |
| | | <pagination v-show="total>0" :total="total" :page.sync="listQuery.page" :limit.sync="listQuery.pageSize" |
| | | @pagination="getList" /> |
| | | <pagination |
| | | v-show="total>0" |
| | | :total="total" |
| | | :page.sync="listQuery.page" |
| | | :limit.sync="listQuery.pageSize" |
| | | @pagination="getList" |
| | | /> |
| | | |
| | | <el-dialog :title="textMap[dialogStatus]" :visible.sync="dialogFormVisible"> |
| | | <el-form ref="dataForm" :model="temp" label-position="left" label-width="70px" |
| | | style="width: 400px; margin-left:50px;"> |
| | | <el-form |
| | | ref="dataForm" |
| | | :model="temp" |
| | | label-position="left" |
| | | label-width="70px" |
| | | style="width: 400px; margin-left:50px;" |
| | | > |
| | | |
| | | <el-form-item label="品类"> |
| | | <el-form-item label="品类"> |
| | | <el-input v-model="temp.name" /> |
| | | </el-form-item> |
| | | <el-form-item label="编码"> |
| | | <el-input v-model="temp.code" maxlength="5" @input="(v)=>(temp.code = v.replace(/[^\a-\z\A-\Z0-9]/g, ''))"/> |
| | | <el-form-item label="编码"> |
| | | <el-input v-model="temp.code" maxlength="5" @input="(v)=>(temp.code = v.replace(/[^\a-\z\A-\Z0-9]/g, ''))" /> |
| | | </el-form-item> |
| | | <el-form-item label="单价"> |
| | | <el-form-item label="单价"> |
| | | <el-input v-model="temp.unitPrice" type="number" /> |
| | | </el-form-item> |
| | | <el-form-item label="运费"> |
| | | <el-form-item label="运费"> |
| | | <el-input v-model="temp.freight" type="number" /> |
| | | </el-form-item> |
| | | <el-form-item label="价值"> |
| | | <el-form-item label="价值"> |
| | | <el-input :value="computedValue" disabled /> |
| | | </el-form-item> |
| | | |
| | |
| | | </template> |
| | | |
| | | <script> |
| | | import { |
| | | getCategoryList, |
| | | addCategory, |
| | | deleteCategory, |
| | | updateCategory |
| | | } from '@/api/api' |
| | | import waves from '@/directive/waves' // waves directive |
| | | import { |
| | | parseTime |
| | | } from '@/utils' |
| | | import Pagination from '@/components/Pagination' // secondary package based on el-pagination |
| | | import { |
| | | getCategoryList, |
| | | addCategory, |
| | | deleteCategory, |
| | | updateCategory |
| | | } from '@/api/api' |
| | | import waves from '@/directive/waves' // waves directive |
| | | import { |
| | | parseTime |
| | | } from '@/utils' |
| | | import Pagination from '@/components/Pagination' // secondary package based on el-pagination |
| | | |
| | | |
| | | export default { |
| | | name: 'DashboardAdmin', |
| | | directives: { |
| | | waves |
| | | }, |
| | | data() { |
| | | return { |
| | | showadd: false, |
| | | tableKey: 0, |
| | | list: null, |
| | | total: 0, |
| | | role: 1, |
| | | listLoading: true, |
| | | listQuery: { |
| | | page: 1, |
| | | pageSize: 20 |
| | | }, |
| | | temp: { |
| | | id: undefined, |
| | | name: '', |
| | | code: '', |
| | | unitPrice: '', |
| | | freight: '', |
| | | value: '' |
| | | }, |
| | | dialogFormVisible: false, |
| | | dialogStatus: '', |
| | | textMap: { |
| | | update: 'Edit', |
| | | create: 'Create' |
| | | }, |
| | | downloadLoading: false |
| | | } |
| | | }, |
| | | computed: { |
| | | computedValue() { |
| | | return this.calcValue(this.temp.unitPrice, this.temp.freight) |
| | | } |
| | | }, |
| | | created() { |
| | | this.getList() |
| | | this.getUserInfo() |
| | | }, |
| | | methods: { |
| | | getUserInfo() { |
| | | this.$store.dispatch('user/getRole') |
| | | .then(response => { |
| | | this.showadd = response == 0 |
| | | }) |
| | | .catch(() => { |
| | | this.showadd = false |
| | | }) |
| | | |
| | | |
| | | |
| | | export default { |
| | | name: 'DashboardAdmin', |
| | | components: { |
| | | Pagination |
| | | }, |
| | | directives: { |
| | | waves |
| | | }, |
| | | data() { |
| | | return { |
| | | showadd: false, |
| | | tableKey: 0, |
| | | list: null, |
| | | total: 0, |
| | | role: 1, |
| | | listLoading: true, |
| | | listQuery: { |
| | | page: 1, |
| | | pageSize: 20 |
| | | }, |
| | | getList() { |
| | | this.listLoading = true |
| | | getCategoryList(this.listQuery).then(response => { |
| | | console.log(response) |
| | | this.list = response.data |
| | | this.total = response.count |
| | | |
| | | // Just to simulate the time of the request |
| | | setTimeout(() => { |
| | | this.listLoading = false |
| | | }, 1.5 * 1000) |
| | | temp: { |
| | | id: undefined, |
| | | name: '', |
| | | code: '', |
| | | unitPrice: '', |
| | | freight: '', |
| | | value: '' |
| | | }, |
| | | dialogFormVisible: false, |
| | | dialogStatus: '', |
| | | textMap: { |
| | | update: '修改', |
| | | create: '新增' |
| | | }, |
| | | downloadLoading: false |
| | | } |
| | | }, |
| | | computed: { |
| | | computedValue() { |
| | | return this.calcValue(this.temp.unitPrice, this.temp.freight) |
| | | } |
| | | }, |
| | | created() { |
| | | this.getList() |
| | | this.getUserInfo() |
| | | }, |
| | | methods: { |
| | | getUserInfo() { |
| | | this.$store.dispatch('user/getRole') |
| | | .then(response => { |
| | | this.showadd = response == 0 |
| | | }) |
| | | }, |
| | | .catch(() => { |
| | | this.showadd = false |
| | | }) |
| | | }, |
| | | getList() { |
| | | this.listLoading = true |
| | | getCategoryList(this.listQuery).then(response => { |
| | | console.log(response) |
| | | this.list = response.data |
| | | this.total = response.count |
| | | |
| | | // Just to simulate the time of the request |
| | | setTimeout(() => { |
| | | this.listLoading = false |
| | | }, 1.5 * 1000) |
| | | }) |
| | | }, |
| | | |
| | | resetTemp() { |
| | | this.temp = { |
| | | id: undefined, |
| | | name: '', |
| | | code: '', |
| | | unitPrice: '', |
| | | freight: '', |
| | | value: '' |
| | | resetTemp() { |
| | | this.temp = { |
| | | id: undefined, |
| | | name: '', |
| | | code: '', |
| | | unitPrice: '', |
| | | freight: '', |
| | | value: '' |
| | | } |
| | | }, |
| | | normalizeAmount(value) { |
| | | const amount = Number(value) |
| | | return Number.isFinite(amount) ? amount : 0 |
| | | }, |
| | | calcValue(unitPrice, freight) { |
| | | return this.normalizeAmount(unitPrice) - this.normalizeAmount(freight) |
| | | }, |
| | | getSubmitData() { |
| | | return Object.assign({}, this.temp, { |
| | | value: this.computedValue |
| | | }) |
| | | }, |
| | | handleCreate() { |
| | | this.resetTemp() |
| | | this.dialogStatus = 'create' |
| | | this.dialogFormVisible = true |
| | | this.$nextTick(() => { |
| | | this.$refs['dataForm'].clearValidate() |
| | | }) |
| | | }, |
| | | createData() { |
| | | this.$refs['dataForm'].validate((valid) => { |
| | | if (valid) { |
| | | addCategory(this.getSubmitData()).then(respone => { |
| | | // this.list.unshift(respone.data) |
| | | this.getList() |
| | | this.dialogFormVisible = false |
| | | this.$notify({ |
| | | title: '成功', |
| | | message: '新增成功', |
| | | type: 'success', |
| | | duration: 2000 |
| | | }) |
| | | }) |
| | | } |
| | | }, |
| | | normalizeAmount(value) { |
| | | const amount = Number(value) |
| | | return Number.isFinite(amount) ? amount : 0 |
| | | }, |
| | | calcValue(unitPrice, freight) { |
| | | return this.normalizeAmount(unitPrice) - this.normalizeAmount(freight) |
| | | }, |
| | | getSubmitData() { |
| | | return Object.assign({}, this.temp, { |
| | | value: this.computedValue |
| | | }) |
| | | }, |
| | | handleCreate() { |
| | | this.resetTemp() |
| | | this.dialogStatus = 'create' |
| | | this.dialogFormVisible = true |
| | | this.$nextTick(() => { |
| | | this.$refs['dataForm'].clearValidate() |
| | | }) |
| | | }, |
| | | createData() { |
| | | this.$refs['dataForm'].validate((valid) => { |
| | | if (valid) { |
| | | addCategory(this.getSubmitData()).then(respone => { |
| | | // this.list.unshift(respone.data) |
| | | this.getList() |
| | | this.dialogFormVisible = false |
| | | this.$notify({ |
| | | title: 'Success', |
| | | message: 'Created Successfully', |
| | | type: 'success', |
| | | duration: 2000 |
| | | }) |
| | | }) |
| | | }, |
| | | handleUpdate(row) { |
| | | this.temp = Object.assign({}, row) // copy obj |
| | | this.dialogStatus = 'update' |
| | | this.dialogFormVisible = true |
| | | this.$nextTick(() => { |
| | | this.$refs['dataForm'].clearValidate() |
| | | }) |
| | | }, |
| | | updateData() { |
| | | this.$refs['dataForm'].validate((valid) => { |
| | | if (valid) { |
| | | const tempData = this.getSubmitData() |
| | | // tempData.timestamp = +new Date(tempData |
| | | // .timestamp) // change Thu Nov 30 2017 16:41:05 GMT+0800 (CST) to 1512031311464 |
| | | updateCategory(tempData).then(() => { |
| | | const index = this.list.findIndex(v => v.id === this.temp.id) |
| | | this.list.splice(index, 1, tempData) |
| | | this.dialogFormVisible = false |
| | | this.$notify({ |
| | | title: '成功', |
| | | message: '修改成功', |
| | | type: 'success', |
| | | duration: 2000 |
| | | }) |
| | | } |
| | | }) |
| | | }, |
| | | handleUpdate(row) { |
| | | this.temp = Object.assign({}, row) // copy obj |
| | | this.dialogStatus = 'update' |
| | | this.dialogFormVisible = true |
| | | this.$nextTick(() => { |
| | | this.$refs['dataForm'].clearValidate() |
| | | }) |
| | | }, |
| | | updateData() { |
| | | |
| | | this.$refs['dataForm'].validate((valid) => { |
| | | if (valid) { |
| | | const tempData = this.getSubmitData() |
| | | // tempData.timestamp = +new Date(tempData |
| | | // .timestamp) // change Thu Nov 30 2017 16:41:05 GMT+0800 (CST) to 1512031311464 |
| | | updateCategory(tempData).then(() => { |
| | | const index = this.list.findIndex(v => v.id === this.temp.id) |
| | | this.list.splice(index, 1, tempData) |
| | | this.dialogFormVisible = false |
| | | this.$notify({ |
| | | title: 'Success', |
| | | message: 'Update Successfully', |
| | | type: 'success', |
| | | duration: 2000 |
| | | }) |
| | | }) |
| | | } |
| | | }) |
| | | }, |
| | | |
| | | handleDelete(row, index) { |
| | | deleteCategory(row.id).then(() => { |
| | | this.$notify({ |
| | | title: 'Success', |
| | | message: 'Delete Successfully', |
| | | type: 'success', |
| | | duration: 2000 |
| | | }) |
| | | this.list.splice(index, 1) |
| | | } |
| | | }) |
| | | }, |
| | | |
| | | handleDelete(row, index) { |
| | | deleteCategory(row.id).then(() => { |
| | | this.$notify({ |
| | | title: '成功', |
| | | message: '删除成功', |
| | | type: 'success', |
| | | duration: 2000 |
| | | }) |
| | | }, |
| | | formatJson(filterVal) { |
| | | return this.list.map(v => filterVal.map(j => { |
| | | if (j === 'timestamp') { |
| | | return parseTime(v[j]) |
| | | } else { |
| | | return v[j] |
| | | } |
| | | })) |
| | | }, |
| | | this.list.splice(index, 1) |
| | | }) |
| | | }, |
| | | formatJson(filterVal) { |
| | | return this.list.map(v => filterVal.map(j => { |
| | | if (j === 'timestamp') { |
| | | return parseTime(v[j]) |
| | | } else { |
| | | return v[j] |
| | | } |
| | | })) |
| | | } |
| | | } |
| | | } |
| | | </script> |
| | |
| | | <div class="dashboard-editor-container"> |
| | | <div class="filter-container"> |
| | | |
| | | <el-button v-if="showadd" class="filter-item" style="margin-left: 10px;" type="primary" icon="el-icon-edit" |
| | | @click="handleCreate"> |
| | | <el-button |
| | | v-if="showadd" |
| | | class="filter-item" |
| | | style="margin-left: 10px;" |
| | | type="primary" |
| | | icon="el-icon-edit" |
| | | @click="handleCreate" |
| | | > |
| | | 添加账号 |
| | | </el-button> |
| | | |
| | | </div> |
| | | |
| | | <el-table :key="tableKey" v-loading="listLoading" :data="list" border fit highlight-current-row |
| | | style="width: 100%;"> |
| | | |
| | | <el-table |
| | | :key="tableKey" |
| | | v-loading="listLoading" |
| | | :data="list" |
| | | border |
| | | fit |
| | | highlight-current-row |
| | | style="width: 100%;" |
| | | > |
| | | |
| | | <!-- <el-table-column label="ID" align="center"> |
| | | <template slot-scope="{row}"> |
| | |
| | | </template> |
| | | </el-table-column> |
| | | |
| | | |
| | | </el-table> |
| | | |
| | | <pagination v-show="total>0" :total="total" :page.sync="listQuery.page" :limit.sync="listQuery.pageSize" |
| | | @pagination="getList" /> |
| | | <pagination |
| | | v-show="total>0" |
| | | :total="total" |
| | | :page.sync="listQuery.page" |
| | | :limit.sync="listQuery.pageSize" |
| | | @pagination="getList" |
| | | /> |
| | | |
| | | <el-dialog :title="textMap[dialogStatus]" :visible.sync="dialogFormVisible"> |
| | | <el-form ref="dataForm" :rules="rules" :model="temp" label-position="left" label-width="70px" |
| | | style="width: 400px; margin-left:50px;"> |
| | | <el-form |
| | | ref="dataForm" |
| | | :rules="rules" |
| | | :model="temp" |
| | | label-position="left" |
| | | label-width="70px" |
| | | style="width: 400px; margin-left:50px;" |
| | | > |
| | | |
| | | <el-form-item v-if="dialogStatus==='create'" label="账号"> |
| | | <el-input v-model="temp.name" /> |
| | |
| | | </span> |
| | | </el-dialog> |
| | | |
| | | |
| | | </div> |
| | | </template> |
| | | |
| | | <script> |
| | | import GithubCorner from '@/components/GithubCorner' |
| | | import PanelGroup from './components/PanelGroup' |
| | | import LineChart from './components/LineChart' |
| | | import RaddarChart from './components/RaddarChart' |
| | | import PieChart from './components/PieChart' |
| | | import BarChart from './components/BarChart' |
| | | import TransactionTable from './components/TransactionTable' |
| | | import TodoList from './components/TodoList' |
| | | import BoxCard from './components/BoxCard' |
| | | import { |
| | | userList, |
| | | addUser, |
| | | delUser, |
| | | updateUserInfo |
| | | } from '@/api/api' |
| | | import waves from '@/directive/waves' // waves directive |
| | | import { |
| | | parseTime |
| | | } from '@/utils' |
| | | import Pagination from '@/components/Pagination' // secondary package based on el-pagination |
| | | import GithubCorner from '@/components/GithubCorner' |
| | | import PanelGroup from './components/PanelGroup' |
| | | import LineChart from './components/LineChart' |
| | | import RaddarChart from './components/RaddarChart' |
| | | import PieChart from './components/PieChart' |
| | | import BarChart from './components/BarChart' |
| | | import TransactionTable from './components/TransactionTable' |
| | | import TodoList from './components/TodoList' |
| | | import BoxCard from './components/BoxCard' |
| | | import { |
| | | userList, |
| | | addUser, |
| | | delUser, |
| | | updateUserInfo |
| | | } from '@/api/api' |
| | | import waves from '@/directive/waves' // waves directive |
| | | import { |
| | | parseTime |
| | | } from '@/utils' |
| | | import Pagination from '@/components/Pagination' // secondary package based on el-pagination |
| | | |
| | | |
| | | const lineChartData = { |
| | | newVisitis: { |
| | | expectedData: [100, 120, 161, 134, 105, 160, 165], |
| | | actualData: [120, 82, 91, 154, 162, 140, 145] |
| | | } |
| | | const lineChartData = { |
| | | newVisitis: { |
| | | expectedData: [100, 120, 161, 134, 105, 160, 165], |
| | | actualData: [120, 82, 91, 154, 162, 140, 145] |
| | | } |
| | | } |
| | | |
| | | export default { |
| | | name: 'DashboardAdmin', |
| | | components: { |
| | | GithubCorner, |
| | | PanelGroup, |
| | | LineChart, |
| | | RaddarChart, |
| | | PieChart, |
| | | BarChart, |
| | | TransactionTable, |
| | | TodoList, |
| | | BoxCard, |
| | | Pagination |
| | | }, |
| | | directives: { |
| | | waves |
| | | }, |
| | | filters: { |
| | | statusFilter(status) { |
| | | const statusMap = { |
| | | published: 'success', |
| | | draft: 'info', |
| | | deleted: 'danger' |
| | | } |
| | | return statusMap[status] |
| | | }, |
| | | typeFilter(type) { |
| | | return calendarTypeKeyValue[type] |
| | | export default { |
| | | name: 'DashboardAdmin', |
| | | components: { |
| | | GithubCorner, |
| | | PanelGroup, |
| | | LineChart, |
| | | RaddarChart, |
| | | PieChart, |
| | | BarChart, |
| | | TransactionTable, |
| | | TodoList, |
| | | BoxCard, |
| | | Pagination |
| | | }, |
| | | directives: { |
| | | waves |
| | | }, |
| | | filters: { |
| | | statusFilter(status) { |
| | | const statusMap = { |
| | | published: 'success', |
| | | draft: 'info', |
| | | deleted: 'danger' |
| | | } |
| | | return statusMap[status] |
| | | }, |
| | | data() { |
| | | return { |
| | | showadd: false, |
| | | lineChartData: lineChartData.newVisitis, |
| | | tableKey: 0, |
| | | list: null, |
| | | total: 0, |
| | | role: 1, |
| | | listLoading: true, |
| | | listQuery: { |
| | | page: 1, |
| | | pageSize: 20 |
| | | }, |
| | | importanceOptions: [1, 2, 3], |
| | | typeFilter(type) { |
| | | return calendarTypeKeyValue[type] |
| | | } |
| | | }, |
| | | data() { |
| | | return { |
| | | showadd: false, |
| | | lineChartData: lineChartData.newVisitis, |
| | | tableKey: 0, |
| | | list: null, |
| | | total: 0, |
| | | role: 1, |
| | | listLoading: true, |
| | | listQuery: { |
| | | page: 1, |
| | | pageSize: 20 |
| | | }, |
| | | importanceOptions: [1, 2, 3], |
| | | |
| | | sortOptions: [{ |
| | | label: 'ID Ascending', |
| | | key: '+id' |
| | | }, { |
| | | label: 'ID Descending', |
| | | key: '-id' |
| | | sortOptions: [{ |
| | | label: 'ID Ascending', |
| | | key: '+id' |
| | | }, { |
| | | label: 'ID Descending', |
| | | key: '-id' |
| | | }], |
| | | statusOptions: ['published', 'draft', 'deleted'], |
| | | showReviewer: false, |
| | | temp: { |
| | | id: undefined, |
| | | name: '', |
| | | pwd: '', |
| | | store: '', |
| | | role: 1 |
| | | }, |
| | | dialogFormVisible: false, |
| | | dialogStatus: '', |
| | | textMap: { |
| | | update: 'Edit', |
| | | create: 'Create' |
| | | }, |
| | | dialogPvVisible: false, |
| | | pvData: [], |
| | | rules: { |
| | | type: [{ |
| | | required: true, |
| | | message: 'type is required', |
| | | trigger: 'change' |
| | | }], |
| | | statusOptions: ['published', 'draft', 'deleted'], |
| | | showReviewer: false, |
| | | temp: { |
| | | id: undefined, |
| | | name: '', |
| | | pwd: '', |
| | | store: '', |
| | | role: 1 |
| | | }, |
| | | dialogFormVisible: false, |
| | | dialogStatus: '', |
| | | textMap: { |
| | | update: 'Edit', |
| | | create: 'Create' |
| | | }, |
| | | dialogPvVisible: false, |
| | | pvData: [], |
| | | rules: { |
| | | type: [{ |
| | | required: true, |
| | | message: 'type is required', |
| | | trigger: 'change' |
| | | }], |
| | | timestamp: [{ |
| | | type: 'date', |
| | | required: true, |
| | | message: 'timestamp is required', |
| | | trigger: 'change' |
| | | }], |
| | | title: [{ |
| | | required: true, |
| | | message: 'title is required', |
| | | trigger: 'blur' |
| | | }] |
| | | }, |
| | | downloadLoading: false |
| | | timestamp: [{ |
| | | type: 'date', |
| | | required: true, |
| | | message: 'timestamp is required', |
| | | trigger: 'change' |
| | | }], |
| | | title: [{ |
| | | required: true, |
| | | message: 'title is required', |
| | | trigger: 'blur' |
| | | }] |
| | | }, |
| | | downloadLoading: false |
| | | } |
| | | }, |
| | | created() { |
| | | this.getList() |
| | | this.getUserInfo() |
| | | }, |
| | | methods: { |
| | | getUserInfo() { |
| | | this.$store.dispatch('user/getRole') |
| | | .then(response => { |
| | | this.showadd = response == 0 |
| | | }) |
| | | .catch(() => { |
| | | this.showadd = false |
| | | }) |
| | | }, |
| | | handleSetLineChartData(type) { |
| | | this.lineChartData = lineChartData[type] |
| | | }, |
| | | getList() { |
| | | this.listLoading = true |
| | | userList(this.listQuery).then(response => { |
| | | console.log(response) |
| | | this.list = response.data |
| | | this.total = response.count |
| | | |
| | | // Just to simulate the time of the request |
| | | setTimeout(() => { |
| | | this.listLoading = false |
| | | }, 1.5 * 1000) |
| | | }) |
| | | }, |
| | | |
| | | resetTemp() { |
| | | this.temp = { |
| | | id: undefined, |
| | | name: '', |
| | | pwd: '', |
| | | store: '', |
| | | role: 1 |
| | | } |
| | | }, |
| | | created() { |
| | | this.getList() |
| | | this.getUserInfo() |
| | | handleCreate() { |
| | | this.resetTemp() |
| | | this.dialogStatus = 'create' |
| | | this.dialogFormVisible = true |
| | | this.$nextTick(() => { |
| | | this.$refs['dataForm'].clearValidate() |
| | | }) |
| | | }, |
| | | methods: { |
| | | getUserInfo() { |
| | | this.$store.dispatch('user/getRole') |
| | | .then(response => { |
| | | this.showadd = response == 0 |
| | | createData() { |
| | | this.$refs['dataForm'].validate((valid) => { |
| | | if (valid) { |
| | | addUser(this.temp).then(respone => { |
| | | // this.list.unshift(respone.data) |
| | | this.getList() |
| | | this.dialogFormVisible = false |
| | | this.$notify({ |
| | | title: '成功', |
| | | message: '新增成功', |
| | | type: 'success', |
| | | duration: 2000 |
| | | }) |
| | | }) |
| | | .catch(() => { |
| | | this.showadd = false |
| | | }) |
| | | |
| | | |
| | | |
| | | }, |
| | | handleSetLineChartData(type) { |
| | | this.lineChartData = lineChartData[type] |
| | | }, |
| | | getList() { |
| | | this.listLoading = true |
| | | userList(this.listQuery).then(response => { |
| | | console.log(response) |
| | | this.list = response.data |
| | | this.total = response.count |
| | | |
| | | // Just to simulate the time of the request |
| | | setTimeout(() => { |
| | | this.listLoading = false |
| | | }, 1.5 * 1000) |
| | | }) |
| | | }, |
| | | |
| | | |
| | | resetTemp() { |
| | | this.temp = { |
| | | id: undefined, |
| | | name: '', |
| | | pwd: '', |
| | | store:'', |
| | | role:1 |
| | | } |
| | | }, |
| | | handleCreate() { |
| | | this.resetTemp() |
| | | this.dialogStatus = 'create' |
| | | this.dialogFormVisible = true |
| | | this.$nextTick(() => { |
| | | this.$refs['dataForm'].clearValidate() |
| | | }) |
| | | }, |
| | | createData() { |
| | | this.$refs['dataForm'].validate((valid) => { |
| | | if (valid) { |
| | | addUser(this.temp).then(respone => { |
| | | // this.list.unshift(respone.data) |
| | | this.getList() |
| | | this.dialogFormVisible = false |
| | | this.$notify({ |
| | | title: 'Success', |
| | | message: 'Created Successfully', |
| | | type: 'success', |
| | | duration: 2000 |
| | | }) |
| | | }) |
| | | }, |
| | | handleUpdate(row) { |
| | | this.temp = Object.assign({}, row) // copy obj |
| | | this.temp.account = row.userName |
| | | this.dialogStatus = 'update' |
| | | this.dialogFormVisible = true |
| | | this.$nextTick(() => { |
| | | this.$refs['dataForm'].clearValidate() |
| | | }) |
| | | }, |
| | | updateData() { |
| | | this.$refs['dataForm'].validate((valid) => { |
| | | if (valid) { |
| | | const tempData = Object.assign({}, this.temp) |
| | | tempData.timestamp = +new Date(tempData |
| | | .timestamp) // change Thu Nov 30 2017 16:41:05 GMT+0800 (CST) to 1512031311464 |
| | | updateUserInfo(tempData).then(() => { |
| | | const index = this.list.findIndex(v => v.id === this.temp.id) |
| | | this.list.splice(index, 1, this.temp) |
| | | this.dialogFormVisible = false |
| | | this.$notify({ |
| | | title: '成功', |
| | | message: '修改成功', |
| | | type: 'success', |
| | | duration: 2000 |
| | | }) |
| | | } |
| | | }) |
| | | }, |
| | | handleUpdate(row) { |
| | | this.temp = Object.assign({}, row) // copy obj |
| | | this.temp.account = row.userName |
| | | this.dialogStatus = 'update' |
| | | this.dialogFormVisible = true |
| | | this.$nextTick(() => { |
| | | this.$refs['dataForm'].clearValidate() |
| | | }) |
| | | }, |
| | | updateData() { |
| | | |
| | | this.$refs['dataForm'].validate((valid) => { |
| | | if (valid) { |
| | | const tempData = Object.assign({}, this.temp) |
| | | tempData.timestamp = +new Date(tempData |
| | | .timestamp) // change Thu Nov 30 2017 16:41:05 GMT+0800 (CST) to 1512031311464 |
| | | updateUserInfo(tempData).then(() => { |
| | | const index = this.list.findIndex(v => v.id === this.temp.id) |
| | | this.list.splice(index, 1, this.temp) |
| | | this.dialogFormVisible = false |
| | | this.$notify({ |
| | | title: 'Success', |
| | | message: 'Update Successfully', |
| | | type: 'success', |
| | | duration: 2000 |
| | | }) |
| | | }) |
| | | } |
| | | }) |
| | | }, |
| | | |
| | | handleDelete(row, index) { |
| | | delUser(row.id).then(() => { |
| | | this.$notify({ |
| | | title: 'Success', |
| | | message: 'Delete Successfully', |
| | | type: 'success', |
| | | duration: 2000 |
| | | }) |
| | | this.list.splice(index, 1) |
| | | } |
| | | }) |
| | | }, |
| | | |
| | | handleDelete(row, index) { |
| | | delUser(row.id).then(() => { |
| | | this.$notify({ |
| | | title: '成功', |
| | | message: '删除成功', |
| | | type: 'success', |
| | | duration: 2000 |
| | | }) |
| | | }, |
| | | formatJson(filterVal) { |
| | | return this.list.map(v => filterVal.map(j => { |
| | | if (j === 'timestamp') { |
| | | return parseTime(v[j]) |
| | | } else { |
| | | return v[j] |
| | | } |
| | | })) |
| | | }, |
| | | getSortClass: function(key) { |
| | | const sort = this.listQuery.sort |
| | | return sort === `+${key}` ? 'ascending' : 'descending' |
| | | } |
| | | this.list.splice(index, 1) |
| | | }) |
| | | }, |
| | | formatJson(filterVal) { |
| | | return this.list.map(v => filterVal.map(j => { |
| | | if (j === 'timestamp') { |
| | | return parseTime(v[j]) |
| | | } else { |
| | | return v[j] |
| | | } |
| | | })) |
| | | }, |
| | | getSortClass: function(key) { |
| | | const sort = this.listQuery.sort |
| | | return sort === `+${key}` ? 'ascending' : 'descending' |
| | | } |
| | | } |
| | | } |
| | | </script> |
| | | |
| | | <style lang="scss" scoped> |
| | |
| | | .then(() => { |
| | | delCollect(row.id).then(() => { |
| | | this.$notify({ |
| | | title: 'Success', |
| | | message: 'Delete Successfully', |
| | | title: '成功', |
| | | message: '删除成功', |
| | | type: 'success', |
| | | duration: 2000 |
| | | }) |
| | |
| | | updateMx(row, index) { |
| | | updateMx(row.barcode).then(() => { |
| | | this.$notify({ |
| | | title: 'Success', |
| | | title: '成功', |
| | | message: '出库成功', |
| | | type: 'success', |
| | | duration: 2000 |
| | |
| | | .then(() => { |
| | | updateMxBat(this.selectedIds).then(() => { |
| | | this.$notify({ |
| | | title: 'Success', |
| | | title: '成功', |
| | | message: '批量出库成功', |
| | | type: 'success', |
| | | duration: 2000 |
| | |
| | | .then(() => { |
| | | updateMxBatRecover(this.selectedIds).then(() => { |
| | | this.$notify({ |
| | | title: 'Success', |
| | | title: '成功', |
| | | message: '批量恢复成功', |
| | | type: 'success', |
| | | duration: 2000 |
| | |
| | | const chartData = Object.entries(this.occupiedFundsData) |
| | | .map(([category, value]) => ({ |
| | | category, |
| | | value: this.toNumber(value) |
| | | occupiedFunds: this.toNumber(value && value.occupiedFunds), |
| | | inStore: this.toNumber(value && value.inStore) |
| | | })) |
| | | .sort((a, b) => b.value - a.value) |
| | | .sort((a, b) => b.occupiedFunds - a.occupiedFunds) |
| | | const yAxisData = chartData.map(item => item.category) |
| | | const fundsData = chartData.map(item => item.value) |
| | | const fundsData = chartData.map(item => ({ |
| | | value: item.occupiedFunds, |
| | | inStore: item.inStore |
| | | })) |
| | | |
| | | const option = { |
| | | tooltip: { |
| | |
| | | if (!item) { |
| | | return '' |
| | | } |
| | | return `${item.name}<br/>仓库占用资金:${this.formatAmount(item.value)}` |
| | | return `${item.name}<br/>仓库占用资金:${this.formatAmount(item.value)}<br/>库存数量:${item.data.inStore}` |
| | | } |
| | | }, |
| | | grid: { |